Update openapi-react-query library naming, tags and dependencies

Author: kerwanp

packages/openapi-tanstack-query/.npmignore renamed to packages/openapi-react-query/.npmignore

@@ -1,10 +1,10 @@
 {
-  "name": "openapi-tanstack-query",
-  "description": "Fast, type-safe fetch client for your OpenAPI schema. Only 5 kb (min). Works with React, Vue, Svelte, or vanilla JS.",
+  "name": "openapi-react-query",
+  "description": "Fast, type-safe @tanstack/react-query client to work with your OpenAPI schema.",
   "version": "0.0.1",
   "author": {
-    "name": "Drew Powers",
-    "email": "[email protected]"
+    "name": "Martin Paucot",
+    "email": "[email protected]"
   },
   "license": "MIT",
   "type": "module",
@@ -28,7 +28,7 @@
   "repository": {
     "type": "git",
     "url": "https://github.com/openapi-ts/openapi-typescript",
-    "directory": "packages/openapi-fetch"
+    "directory": "packages/openapi-react-query"
   },
   "bugs": {
     "url": "https://github.com/openapi-ts/openapi-typescript/issues"
@@ -43,8 +43,8 @@
     "typescript",
     "fetch",
     "react",
-    "vue",
-    "svelte"
+    "react-query",
+    "tanstack"
   ],
   "scripts": {
     "build": "pnpm run build:clean && pnpm run build:js && pnpm run build:js-min && pnpm run build:cjs",
@@ -62,16 +62,12 @@
     "version": "pnpm run prepare && pnpm run build"
   },
   "dependencies": {
-    "@tanstack/react-query": "^5.45.1",
-    "nanoid": "^5.0.7",
-    "openapi-fetch": "workspace:^",
     "openapi-typescript-helpers": "workspace:^"
   },
   "devDependencies": {
     "@testing-library/react": "^16.0.0",
     "@types/react": "18.3.1",
     "@vitejs/plugin-react": "^4.3.1",
-    "axios": "^1.7.2",
     "del-cli": "^5.1.0",
     "esbuild": "^0.20.2",
     "execa": "^8.0.1",
@@ -80,8 +76,11 @@
     "openapi-typescript-codegen": "^0.25.0",
     "openapi-typescript-fetch": "^2.0.0",
     "react": "^18.3.1",
-    "superagent": "^9.0.2",
     "typescript": "^5.4.5",
     "vitest": "^1.6.0"
+  },
+  "peerDependencies": {
+    "@tanstack/react-query": "^5.45.1",
+    "openapi-fetch": "workspace:^"
   }
 }

packages/openapi-tanstack-query/biome.json renamed to packages/openapi-react-query/biome.json

@@ -0,0 +1,83 @@
+import type {
+  UseMutationResult,
+  UseQueryOptions,
+  UseQueryResult,
+} from "@tanstack/react-query";
+import type { MaybeOptionalInit, Client, FetchResponse } from "openapi-fetch";
+import type {
+  ErrorResponse,
+  FilterKeys,
+  HasRequiredKeys,
+  HttpMethod,
+  MediaType,
+  OperationRequestBodyContent,
+  PathsWithMethod,
+  ResponseObjectMap,
+  SuccessResponse,
+} from "openapi-typescript-helpers";
+
+type Prettify<T> = {
+  [K in keyof T]: T[K];
+} & {};
+
+export type UseQueryMethod<
+  Paths extends Record<string, Record<HttpMethod, {}>>,
+  Media extends MediaType,
+> = <
+  Method extends HttpMethod,
+  Path extends PathsWithMethod<Paths, Method>,
+  Init extends MaybeOptionalInit<Paths[Path], Method>,
+  Response extends FetchResponse<Paths[Path][Method], Init, Media>,
+  Options extends Omit<
+    UseQueryOptions<
+      NonNullable<Response["data"]>,
+      NonNullable<Response["error"]>
+    >,
+    "queryKey" | "queryFn"
+  >,
+>(
+  method: Method,
+  url: Path,
+  ...init: HasRequiredKeys<Init> extends never
+    ? ?[(Init & { [key: string]: unknown })?, Options?] // note: the arbitrary [key: string]: addition MUST happen here after all the inference happens (otherwise TS can’t infer if it’s required or not)
+    : [Init & { [key: string]: unknown }, Options?]
+) => UseQueryResult<
+  NonNullable<Response["data"]>,
+  NonNullable<Response["error"]>
+>;
+
+export type UseMutationMethod<
+  Paths extends Record<string, Record<HttpMethod, {}>>,
+  Media extends MediaType,
+> = <
+  Method extends HttpMethod,
+  Path extends PathsWithMethod<Paths, Method>,
+  Init extends MaybeOptionalInit<Paths[Path], Method>,
+  Response extends FetchResponse<Paths[Path][Method], Init, Media>,
+>(
+  method: Method,
+  url: Path,
+  test: void,
+) => UseMutationResult<
+  NonNullable<Response["data"]>,
+  NonNullable<Response["error"]>,
+  Init & { [key: string]: unknown }
+>;
+
+export interface OpenapiQueryClient<
+  Paths extends {},
+  Media extends MediaType = MediaType,
+> {
+  useQuery: UseQueryMethod<Paths, Media>;
+  useMutation: UseMutationMethod<Paths, Media>;
+}
+
+export default function createClient<
+  Paths extends {},
+  Media extends MediaType = MediaType,
+>(
+  client: Client<Paths, Media>,
+): {
+  useQuery: UseQueryMethod<Paths, Media>;
+  useMutation: UseMutationMethod<Paths, Media>;
+};

packages/openapi-tanstack-query/package.json renamed to packages/openapi-react-query/package.json

@@ -18,10 +18,10 @@ export default function createClient(client) {
         },
         ...options,
       }),
-    useMutation: (method, url, init, options) =>
+    useMutation: (method, url, options) =>
       useMutation({
-        mutationKey: [method, url, init],
-        mutationFn: async () => {
+        mutationKey: [method, url],
+        mutationFn: async (init) => {
           const { data, error } = await client[method.toUpperCase()](url, init);
           if (error) {
             throw error;

packages/openapi-react-query/src/index.d.ts

@@ -1,5 +1,9 @@
 import { afterAll, beforeAll, describe, expect, it } from "vitest";
-import { server, baseUrl, useMockRequestHandler } from "./fixtures/mock-server.js";
+import {
+  server,
+  baseUrl,
+  useMockRequestHandler,
+} from "./fixtures/mock-server.js";
 import type { paths } from "./fixtures/api.js";
 import createClient from "../src/index.js";
 import createFetchClient from "openapi-fetch";
@@ -10,7 +14,9 @@ import React, { type ReactNode } from "react";
 beforeAll(() => {
   server.listen({
     onUnhandledRequest: (request) => {
-      throw new Error(`No request handler found for ${request.method} ${request.url}`);
+      throw new Error(
+        `No request handler found for ${request.method} ${request.url}`,
+      );
     },
   });
 });
@@ -46,7 +52,7 @@ describe("client", () => {
         body: { message: "OK" },
       });
 
-      const { result } = renderHook(() => client.useQuery("get", "/self"), {
+      const { result } = renderHook(() => client.useQuery("get", "/self", {}), {
         wrapper,
       });
 
@@ -64,17 +70,26 @@ describe("client", () => {
       useMockRequestHandler({
         baseUrl,
         method: "get",
-        path: "/self",
+        path: "/tag/*",
         status: 200,
         body: { message: "OK" },
       });
 
-      const { result } = renderHook(() => client.useMutation("get", "/self"), {
-        wrapper,
+      const { result } = renderHook(
+        () => client.useMutation("get", "/tag/{name}"),
+        {
+          wrapper,
+        },
+      );
+
+      result.current.mutate({
+        params: {
+          path: {
+            name: "test",
+          },
+        },
       });
 
-      result.current.mutate({});
-
       await waitFor(() => expect(result.current.isSuccess).toBe(true));
 
       expect(result.current.data).toEqual({ message: "OK" });

packages/openapi-tanstack-query/src/index.js renamed to packages/openapi-react-query/src/index.js

@@ -0,0 +1,4 @@
+{
+  "extends": "./tsconfig.json",
+  "include": ["src"]
+}

packages/openapi-tanstack-query/test/fixtures/api.d.ts renamed to packages/openapi-react-query/test/fixtures/api.d.ts

@@ -2,11 +2,13 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
+    "module": "ES2022",
+    "moduleResolution": "Node",
+    "outDir": "dist",
     "skipLibCheck": true,
     "sourceRoot": ".",
-    "outDir": "dist",
-    "types": ["vitest/globals"],
-    "jsx": "react"
+    "jsx": "react",
+    "types": ["vitest/globals"]
   },
   "include": ["scripts", "src", "test", "*.ts"],
   "exclude": ["node_modules"]