refactor: fetch-graphql-request mutation

dotansimha · Oct 13, 2023 · 40f8787 · 40f8787
1 parent b47f600
commit 40f8787
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 45 deletions.
diff --git a/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts b/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts
@@ -127,57 +127,30 @@ function fetcher<TData, TVariables extends { [key: string]: any }>(client: Graph
   }
 
   generateMutationHook(config: BuildOperationConfig): string {
-    const {
-      node,
-      documentVariableName,
-      operationResultType,
-      operationVariablesTypes,
-      operationName,
-    } = config;
-
-    const variables = `variables?: ${operationVariablesTypes}`;
     const typeImport = this.visitor.config.useTypeImports ? 'import type' : 'import';
     if (this.clientPath) this.visitor.imports.add(this.clientPath);
     this.visitor.imports.add(`${typeImport} { GraphQLClient } from 'graphql-request';`);
 
-    const hookConfig = this.visitor.queryMethodMap;
-    this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.mutation.hook);
-    this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.mutation.options);
+    const { generateBaseMutationHook, variables, options } = this.generateMutationHelper(config);
 
-    const options = `options?: ${hookConfig.mutation.options}<${operationResultType}, TError, ${operationVariablesTypes}, TContext>`;
+    const { documentVariableName, operationResultType, operationVariablesTypes } = config;
 
     return this.clientPath
-      ? `export const use${operationName} = <
-      TError = ${this.visitor.config.errorType},
-      TContext = unknown
-    >(
+      ? generateBaseMutationHook({
+          implArguments: `
       ${options},
       headers?: RequestInit['headers']
-    ) =>
-    ${
-      hookConfig.mutation.hook
-    }<${operationResultType}, TError, ${operationVariablesTypes}, TContext>(
-      ${this.generateMutationFormattedParameters(
-        this.generateMutationKey(node),
-        `(${variables}) => fetcher<${operationResultType}, ${operationVariablesTypes}>(${documentVariableName}, variables, headers)()`,
-      )}
-    );`
-      : `export const use${operationName} = <
-      TError = ${this.visitor.config.errorType},
-      TContext = unknown
-    >(
+    `,
+          implFetcher: `(${variables}) => fetcher<${operationResultType}, ${operationVariablesTypes}>(${documentVariableName}, variables, headers)()`,
+        })
+      : generateBaseMutationHook({
+          implArguments: `
       client: GraphQLClient,
       ${options},
       headers?: RequestInit['headers']
-    ) =>
-    ${
-      hookConfig.mutation.hook
-    }<${operationResultType}, TError, ${operationVariablesTypes}, TContext>(
-      ${this.generateMutationFormattedParameters(
-        this.generateMutationKey(node),
-        `(${variables}) => fetcher<${operationResultType}, ${operationVariablesTypes}>(client, ${documentVariableName}, variables, headers)()`,
-      )}
-    );`;
+    `,
+          implFetcher: `(${variables}) => fetcher<${operationResultType}, ${operationVariablesTypes}>(client, ${documentVariableName}, variables, headers)()`,
+        });
   }
 
   generateFetcherFetch(

diff --git a/packages/plugins/typescript/react-query/tests/__snapshots__/react-query.spec.ts.snap b/packages/plugins/typescript/react-query/tests/__snapshots__/react-query.spec.ts.snap
@@ -579,12 +579,13 @@ export const useTestMutation = <
       client: GraphQLClient,
       options?: UseMutationOptions<TTestMutation, TError, TTestMutationVariables, TContext>,
       headers?: RequestInit['headers']
-    ) =>
-    useMutation<TTestMutation, TError, TTestMutationVariables, TContext>(
+    ) => {
+    
+    return useMutation<TTestMutation, TError, TTestMutationVariables, TContext>(
       ['test'],
       (variables?: TTestMutationVariables) => fetcher<TTestMutation, TTestMutationVariables>(client, TestDocument, variables, headers)(),
       options
-    );"
+    )};"
 `;
 
 exports[`React-Query fetcher: graphql-request Should generate query correctly with client: prepend 1`] = `
@@ -647,12 +648,13 @@ export const useTestMutation = <
     >(
       options?: UseMutationOptions<TTestMutation, TError, TTestMutationVariables, TContext>,
       headers?: RequestInit['headers']
-    ) =>
-    useMutation<TTestMutation, TError, TTestMutationVariables, TContext>(
+    ) => {
+    
+    return useMutation<TTestMutation, TError, TTestMutationVariables, TContext>(
       ['test'],
       (variables?: TTestMutationVariables) => fetcher<TTestMutation, TTestMutationVariables>(TestDocument, variables, headers)(),
       options
-    );"
+    )};"
 `;
 
 exports[`React-Query fetcher: graphql-request with clientImportPath Should generate query correctly with client: prepend 1`] = `