diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml new file mode 100644 index 0000000..c98caf7 --- /dev/null +++ b/.github/workflows/deploy.yml @@ -0,0 +1,49 @@ +# Simple workflow for deploying static content to GitHub Pages +name: Deploy static content to Pages + +on: + # Runs on pushes targeting the default branch + push: + branches: ["main"] + + # Allows you to run this workflow manually from the Actions tab + workflow_dispatch: + +# Sets the GITHUB_TOKEN permissions to allow deployment to GitHub Pages +permissions: + contents: read + pages: write + id-token: write + +# Allow one concurrent deployment +concurrency: + group: "pages" + cancel-in-progress: true + +jobs: + # Single deploy job since we're just deploying + deploy: + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + - name: Set up Bun + uses: oven-sh/setup-bun@v2 + + - name: Install dependencies + run: bun install + - name: Build + run: bun run build + - name: Setup Pages + uses: actions/configure-pages@v4 + - name: Upload artifact + uses: actions/upload-pages-artifact@v3 + with: + # Upload dist folder + path: "./dist" + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v4 diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/bun.lockb b/bun.lockb new file mode 100755 index 0000000..11a88b1 Binary files /dev/null and b/bun.lockb differ diff --git a/components.json b/components.json new file mode 100644 index 0000000..4f859ee --- /dev/null +++ b/components.json @@ -0,0 +1,17 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "default", + "rsc": false, + "tsx": true, + "tailwind": { + "config": "tailwind.config.js", + "css": "src/globals.css", + "baseColor": "slate", + "cssVariables": true, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils" + } +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..d1bc171 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + JSON:API to jsona | Jsonafy + + +
+ + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..7f174bd --- /dev/null +++ b/package.json @@ -0,0 +1,36 @@ +{ + "name": "jsonafy", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc && vite build", + "preview": "vite preview" + }, + "dependencies": { + "@radix-ui/react-slot": "^1.1.0", + "class-variance-authority": "^0.7.0", + "clsx": "^2.1.1", + "jsona": "^1.12.1", + "lucide-react": "^0.427.0", + "next-themes": "^0.3.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react18-json-view": "^0.2.8", + "sonner": "^1.5.0", + "tailwind-merge": "^2.4.0", + "tailwindcss-animate": "^1.0.7" + }, + "devDependencies": { + "@types/node": "^22.2.0", + "@types/react": "^18.0.27", + "@types/react-dom": "^18.0.10", + "@vitejs/plugin-react-swc": "^3.0.0", + "autoprefixer": "^10.4.20", + "postcss": "^8.4.41", + "tailwindcss": "^3.4.9", + "typescript": "^4.9.3", + "vite": "^4.1.0" + } +} \ No newline at end of file diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..2e7af2b --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,6 @@ +export default { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +} diff --git a/public/vite.svg b/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..3ce3547 --- /dev/null +++ b/src/App.tsx @@ -0,0 +1,77 @@ +import { ChangeEvent, useState } from "react"; +import { Jsona } from "jsona"; +import JsonView from "react18-json-view"; +import "react18-json-view/src/style.css"; +import { Button } from "@/components/ui/button"; +import { Textarea } from "@/components/ui/textarea"; +import Code from "@/components/code"; +import { toast } from "sonner"; + +function App() { + const [rawJson, setRawJson] = useState({}); + const [jsona, setJsona] = useState(null); + const [errors, setErrors] = useState([]); + const formatter = new Jsona(); + const jsonaString = JSON.stringify(jsona); + const base64EncodedString = btoa(jsonaString); + + const handleOnChange = (e: ChangeEvent) => { + try { + toast.dismiss(); + setRawJson(JSON.parse(e.target.value)); + setJsona(formatter.deserialize(e.target.value)); + setErrors([]); + } catch (error) { + console.error(error); + if (error instanceof Error) { + setErrors([...errors, error.message]); + toast.error(error.message, { + className: "bg-red-500", + duration: Infinity, + dismissible: true, + }); + } + } + }; + + return ( +
+
+

+ JSON:API + → + jsona +

+
+
+
+

Insert JSON:API here

+