Use ofetch with openapi-typscript rather than openapi-fetch

package.json

@@ -16,53 +16,54 @@
     "test:e2e": "start-server-and-test preview http://localhost:4173 'cypress run --e2e'",
     "test:e2e:dev": "start-server-and-test 'vite dev --port 4173' http://localhost:4173 'cypress open --e2e'",
     "postinstall": "run-p build:icons",
-    "generate:api": "openapi-typescript http://localhost:8000/api/docs-yaml -o src/generated/api-schema.d.ts"
+      "generate:api": "openapi-typescript src/openapi/api-schema.yaml -o src/generated/api-schema.d.ts"
   },
   "dependencies": {
-    "@unocss/reset": "^0.58.4",
-    "@vueuse/core": "^10.7.2",
-    "@vueuse/integrations": "^10.8.0",
-    "openapi-fetch": "^0.9.2",
-    "openapi-typescript-helpers": "^0.0.7",
-    "pinia": "^2.1.7",
-    "ufo": "^1.5.3",
-    "universal-cookie": "^7.1.0",
+    "@unocss/reset": "^0.58.9",
+    "@vueuse/core": "^10.11.0",
+    "@vueuse/integrations": "^10.11.0",
+    "ofetch": "^1.3.4",
+    "openapi-typescript": "^7.3.0",
+    "openapi-typescript-helpers": "^0.0.11",
+    "pinia": "^2.2.0",
+    "ufo": "^1.5.4",
+    "universal-cookie": "^7.2.0",
     "valibot": "^0.26.0",
-    "vue": "^3.4.15",
-    "vue-router": "^4.2.5"
+    "vue": "^3.4.35",
+    "vue-router": "^4.4.2"
   },
   "devDependencies": {
-    "@iconify/tools": "^4.0.0",
+    "@iconify/tools": "^4.0.4",
     "@iconify/types": "^2.0.0",
-    "@iconify/utils": "^2.1.16",
-    "@iconify/vue": "^4.1.1",
-    "@sxzz/eslint-config": "^3.7.6",
-    "@sxzz/prettier-config": "^2.0.0",
-    "@types/node": "^20.11.5",
-    "@vitejs/plugin-vue": "^5.0.3",
-    "@vue/compiler-sfc": "^3.4.15",
-    "@vue/test-utils": "^2.4.3",
-    "cypress": "^13.6.3",
-    "eslint": "^8.56.0",
-    "jsdom": "^24.0.0",
+    "@iconify/utils": "^2.1.29",
+    "@iconify/vue": "^4.1.2",
+    "@sxzz/eslint-config": "^3.16.1",
+    "@sxzz/prettier-config": "^2.0.2",
+    "@types/node": "^20.14.14",
+    "@vitejs/plugin-vue": "^5.1.2",
+    "@vue/compiler-sfc": "^3.4.35",
+    "@vue/test-utils": "^2.4.6",
+    "cypress": "^13.13.2",
+    "eslint": "^8.57.0",
+    "jsdom": "^24.1.1",
     "npm-run-all": "^4.1.5",
-    "openapi-typescript": "^6.7.4",
-    "picocolors": "^1.0.0",
-    "prettier": "^3.2.4",
-    "start-server-and-test": "^2.0.3",
+    "picocolors": "^1.0.1",
+    "prettier": "^3.3.3",
+    "start-server-and-test": "^2.0.5",
     "ts-reset": "^0.0.1",
-    "tsx": "^4.7.1",
-    "typescript": "^5.3.3",
-    "unocss": "^0.58.4",
-    "unplugin-auto-import": "^0.17.3",
+    "tsx": "^4.16.5",
+    "type-fest": "^4.23.0",
+    "typescript": "^5.5.4",
+    "unocss": "^0.58.9",
+    "unplugin-auto-import": "^0.17.8",
     "unplugin-vue-components": "^0.26.0",
     "unplugin-vue-router": "^0.7.0",
-    "vite": "^5.0.12",
-    "vite-plugin-pages": "^0.32.0",
-    "vite-plugin-vue-devtools": "^7.0.11",
+    "vite": "^5.3.5",
+    "vite-plugin-pages": "^0.32.3",
+    "vite-plugin-vue-devtools": "^7.3.7",
     "vite-plugin-vue-layouts": "^0.11.0",
-    "vite-plugin-webfont-dl": "^3.9.1",
-    "vitest": "^1.2.1",
+    "vite-plugin-webfont-dl": "^3.9.4",
+    "vitest": "^1.6.0",
     "vue-tsc": "^1.8.27"
   },
   "simple-git-hooks": {

src/composables/use-open-fetch.ts

@@ -0,0 +1,71 @@
+import {
+  type CreateFetchOptions,
+  type UseFetchOptions,
+  type UseFetchReturn,
+  createFetch,
+} from '@vueuse/core'
+import { type MaybeRefOrGetter, toValue } from 'vue'
+import {
+  type FetchResponseData,
+  type FilterMethods,
+  type ParamsOption,
+  type RequestBodyOption,
+  createOpenFetch,
+} from '#/utils/fetch'
+
+type MethodOption<M, P> = 'get' extends keyof P ? { method?: M } : { method: M }
+
+type UseOpenFetchOptions<
+  Method,
+  LowercasedMethod,
+  Params,
+  Operation = 'get' extends LowercasedMethod
+    ? 'get' extends keyof Params
+      ? Params['get']
+      : never
+    : LowercasedMethod extends keyof Params
+      ? Params[LowercasedMethod]
+      : never,
+> = MethodOption<Method, Params> &
+  ParamsOption<Operation> &
+  RequestBodyOption<Operation>
+
+export type UseOpenFetchClient<Paths> = <
+  Path extends Extract<keyof Paths, string>,
+  Methods extends FilterMethods<Paths[Path]>,
+  Method extends
+    | Extract<keyof Methods, string>
+    | Uppercase<Extract<keyof Methods, string>>,
+  LowercasedMethod extends Lowercase<Method> extends keyof Methods
+    ? Lowercase<Method>
+    : never,
+  DefaultMethod extends 'get' extends LowercasedMethod
+    ? 'get'
+    : LowercasedMethod,
+  ResT = FetchResponseData<Methods[DefaultMethod]>,
+>(
+  path: Path | (() => Path),
+  options: UseOpenFetchOptions<Method, LowercasedMethod, Methods>,
+  useFetchOptions?: UseFetchOptions,
+) => UseFetchReturn<ResT> & PromiseLike<UseFetchReturn<ResT>>
+
+export function createUseOpenFetch<Paths>(
+  config: CreateFetchOptions,
+): UseOpenFetchClient<Paths> {
+  const useFetch = createFetch({
+    ...config,
+    options: {
+      fetch: createOpenFetch({
+        baseURL: toValue(config.baseUrl),
+      }),
+    },
+  })
+
+  return (
+    url: MaybeRefOrGetter<string>,
+    requests: any, //TODO: find a way to type this
+    useFetchOptions?: UseFetchOptions,
+  ) => {
+    return useFetch(toValue(url), requests, useFetchOptions)
+  }
+}