Camel case query function operation IDs (#245)

Operation IDs in query functions currently don't line up with keys in the `QueryOperation` object.
fabien0102 · Apr 11, 2024 · f6e2977 · f6e2977
1 parent d693f63
commit f6e2977
Show file tree

Hide file tree

Showing 3 changed files with 99 additions and 6 deletions.
diff --git a/plugins/typescript/src/core/createOperationQueryFnNodes.ts b/plugins/typescript/src/core/createOperationQueryFnNodes.ts
@@ -19,6 +19,7 @@ export const createOperationQueryFnNodes = ({
   variablesType,
   fetcherFn,
   operation,
+  operationId,
   url,
   verb,
   name,
@@ -32,6 +33,7 @@ export const createOperationQueryFnNodes = ({
   queryParamsType: ts.TypeNode;
   variablesType: ts.TypeNode;
   operation: OperationObject;
+  operationId: string;
   fetcherFn: string;
   url: string;
   verb: string;
@@ -161,9 +163,7 @@ export const createOperationQueryFnNodes = ({
                           ),
                           f.createPropertyAssignment(
                             f.createIdentifier("operationId"),
-                            f.createStringLiteral(
-                              operation.operationId as string
-                            )
+                            f.createStringLiteral(operationId)
                           ),
                           f.createShorthandPropertyAssignment(
                             f.createIdentifier("variables"),

diff --git a/plugins/typescript/src/generators/generateReactQueryFunctions.test.ts b/plugins/typescript/src/generators/generateReactQueryFunctions.test.ts
@@ -1235,4 +1235,99 @@ describe("generateReactQueryFunctions", () => {
      "
     `);
   });
+
+  it("should camel case operation IDs and remove special characters", async () => {
+    const writeFile = jest.fn();
+    const openAPIDocument: OpenAPIObject = {
+      openapi: "3.0.0",
+      info: {
+        title: "petshop",
+        version: "1.0.0",
+      },
+      paths: {
+        "/pets": {
+          get: {
+            operationId: "list_pets",
+            description: "Get all the pets",
+            responses: {
+              "200": {
+                description: "pet response",
+                content: {
+                  "application/json": {
+                    schema: {
+                      type: "array",
+                      items: {
+                        $ref: "#/components/schemas/Pet",
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
+    };
+
+    await generateReactQueryFunctions(
+      {
+        openAPIDocument,
+        writeFile,
+        existsFile: () => true,
+        readFile: async () => "",
+      },
+      config,
+    );
+
+    expect(writeFile.mock.calls[0][0]).toBe("petstoreFunctions.ts");
+    expect(writeFile.mock.calls[0][1]).toMatchInlineSnapshot(`
+     "/**
+      * Generated by @openapi-codegen
+      * 
+      * @version 1.0.0
+      */
+     import * as reactQuery from "@tanstack/react-query";
+     import { PetstoreContext, queryKeyFn } from "./petstoreContext";
+     import type * as Fetcher from "./petstoreFetcher";
+     import { petstoreFetch } from "./petstoreFetcher";
+     import type * as Schemas from "./petstoreSchemas";
+
+     export type ListPetsError = Fetcher.ErrorWrapper<undefined>;
+
+     export type ListPetsResponse = Schemas.Pet[];
+
+     export type ListPetsVariables = PetstoreContext["fetcherOptions"];
+
+     /**
+      * Get all the pets
+      */
+     export const fetchListPets = (variables: ListPetsVariables, signal?: AbortSignal) => petstoreFetch<ListPetsResponse, ListPetsError, undefined, {}, {}, {}>({ url: "/pets", method: "get", ...variables, signal });
+
+     /**
+      * Get all the pets
+      */
+     export const listPetsQuery = (variables: ListPetsVariables): [
+         reactQuery.QueryKey,
+         ({ signal }: {
+             signal?: AbortSignal;
+         }) => Promise<ListPetsResponse>
+     ] => [
+         queryKeyFn({
+             path: "/pets",
+             operationId: "listPets",
+             variables
+         }),
+         async ({ signal }: {
+             signal?: AbortSignal;
+         }) => fetchListPets({ ...variables }, signal)
+     ];
+
+     export type QueryOperation = {
+         path: "/pets";
+         operationId: "listPets";
+         variables: ListPetsVariables;
+     };
+     "
+    `);
+  });
 });
diff --git a/plugins/typescript/src/generators/generateReactQueryFunctions.ts b/plugins/typescript/src/generators/generateReactQueryFunctions.ts
@@ -143,8 +143,6 @@ export const generateReactQueryFunctions = async (
           ),
         });
 
-
-
         const operationFetcherFnName = `fetch${c.pascal(operationId)}`;
         const operationQueryFnName = `${c.pascal(operationId)}Query`;
         const component: "useQuery" | "useMutate" =
@@ -157,7 +155,6 @@ export const generateReactQueryFunctions = async (
         }
 
         if (component === "useQuery") {
-
           nodes.push(...declarationNodes);
 
           keyManagerItems.push(
@@ -210,6 +207,7 @@ export const generateReactQueryFunctions = async (
               queryParamsType,
               headersType,
               operation,
+              operationId,
               fetcherFn,
               url: route,
               verb,