Generate typescript client from fastapi openapi.json

- add export.py script to backend to generate openapi.json
- add generated openapi.json file
- add autogenerated typescript fetch api client in src/lib/client using hey-api/openapi-ts
- add hey-api/openapi-ts and hey-api/client-fetch to frontend deps
- add openapi-ts to package.json scripts
- add openapi-ts config file
- run pnpm openapi-ts
- automatically export openapi.json and generate openapi-ts client code in CI

.github/workflows/format.yml → .github/workflows/codegen.yml

@@ -1,11 +1,11 @@
-name: format code
+name: codegen and format
 on:
   pull_request:
     branches:
       - main
 
 jobs:
-  format-frontend:
+  codegen-and-format:
     runs-on: ubuntu-latest
     defaults:
       run:
@@ -22,6 +22,9 @@ jobs:
         with:
           repository: ${{ github.event.pull_request.head.repo.full_name }}
           ref: ${{ github.event.pull_request.head.ref }}
+      - uses: actions/setup-python@v5
+        with:
+          python-version: "3.12"
       - uses: pnpm/action-setup@v4
         with:
           version: 9
@@ -30,11 +33,18 @@ jobs:
           node-version: 22
           cache: 'pnpm'
           cache-dependency-path: frontend/pnpm-lock.yaml
+      - name: "Export openapi.json from fastapi app"
+        run: |
+            cd ../mondey_backend
+            pip install .
+            mondey-export-openapi-json
       - run: pnpm install
+      - name: "Generate frontend fetch API client code"
+        run: pnpm openapi-ts
       - run: pnpm format
       - uses: EndBug/add-and-commit@v9
         with:
           add: "*"
           author_name: "github-actions[bot]"
           author_email: "github-actions[bot]@users.noreply.github.com"
-          message: "pnpm format"
+          message: "update openapi.json & openapi-ts client, run pnpm format"

.pre-commit-config.yaml

@@ -9,7 +9,7 @@ repos:
       - id: check-toml
 
   - repo: https://github.com/astral-sh/ruff-pre-commit
-    rev: v0.5.5
+    rev: v0.6.8
     hooks:
       - id: ruff
         types_or: [python, pyi, jupyter]
@@ -18,7 +18,7 @@ repos:
         types_or: [python, pyi, jupyter]
 
   - repo: https://github.com/pre-commit/mirrors-mypy
-    rev: v1.11.1
+    rev: v1.11.2
     hooks:
       - id: mypy
         additional_dependencies: ["sqlmodel"]
@@ -30,6 +30,8 @@ repos:
           ]
 
   - repo: https://github.com/rhysd/actionlint
-    rev: "v1.7.1"
+    rev: "v1.7.2"
     hooks:
       - id: actionlint
+
+exclude: "mondey_backend/openapi.json"

frontend/openapi-ts.config.ts

@@ -0,0 +1,10 @@
+import { defineConfig } from '@hey-api/openapi-ts';
+
+export default defineConfig({
+	client: '@hey-api/client-fetch',
+	input: '../mondey_backend/openapi.json',
+	output: {
+		path: 'src/lib/client',
+		format: 'prettier'
+	}
+});

frontend/package.json

@@ -10,9 +10,11 @@
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"test": "vitest --coverage",
 		"lint": "prettier --check . && eslint .",
-		"format": "prettier --write ."
+		"format": "prettier --write .",
+		"openapi-ts": "openapi-ts"
 	},
 	"devDependencies": {
+		"@hey-api/openapi-ts": "0.53.5",
 		"@sveltejs/adapter-auto": "^3.2.5",
 		"@sveltejs/adapter-static": "^3.0.5",
 		"@sveltejs/kit": "^2.5.28",
@@ -43,6 +45,7 @@
 	},
 	"type": "module",
 	"dependencies": {
+		"@hey-api/client-fetch": "0.4.0",
 		"iso-639-1": "3.1.3",
 		"svelte-i18n": "^4.0.0"
 	}