backport dotansimha/graphql-code-generator#8567

dotansimha · Nov 7, 2022 · aee5a7a · aee5a7a
1 parent 906e98b
commit aee5a7a
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 11 deletions.
diff --git a/packages/plugins/typescript/react-query/CHANGELOG.md b/packages/plugins/typescript/react-query/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @graphql-codegen/typescript-react-query
 
+## 4.0.5
+
+### Patch Changes
+
+- [#8567](https://github.com/dotansimha/graphql-code-generator/pull/8567) [`af40efbd2`](https://github.com/dotansimha/graphql-code-generator/commit/af40efbd23850c6bdb5f5b3d8713bac24e72fe44) Thanks [@EandrewJones](https://github.com/EandrewJones)! - fixes issue #7549
+
 ## 4.0.4
 
 ### Patch Changes

diff --git a/packages/plugins/typescript/react-query/package.json b/packages/plugins/typescript/react-query/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@graphql-codegen/typescript-react-query",
-  "version": "4.0.4",
+  "version": "4.0.5",
   "description": "GraphQL Code Generator plugin for generating a ready-to-use React-Query Hooks based on GraphQL operations",
   "repository": {
     "type": "git",

diff --git a/packages/plugins/typescript/react-query/src/fetcher-custom-mapper.ts b/packages/plugins/typescript/react-query/src/fetcher-custom-mapper.ts
@@ -59,8 +59,8 @@ export class CustomMapperFetcher implements FetcherRenderer {
     const typedFetcher = this.getFetcherFnName(operationResultType, operationVariablesTypes);
     const implHookOuter = this._isReactHook ? `const query = ${typedFetcher}(${documentVariableName})` : '';
     const impl = this._isReactHook
-      ? `(metaData) => query({...variables, [pageParamKey]: metaData.pageParam })`
-      : `(metaData) => ${typedFetcher}(${documentVariableName}, {...variables, [pageParamKey]: metaData.pageParam })()`;
+      ? `(metaData) => query({...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})`
+      : `(metaData) => ${typedFetcher}(${documentVariableName}, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})()`;
 
     return `export const useInfinite${operationName} = <
       TData = ${operationResultType},

diff --git a/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts b/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts
@@ -83,7 +83,7 @@ ${this.getFetchParams()}
     ) =>
     ${hookConfig.infiniteQuery.hook}<${operationResultType}, TError, TData>(
       ${generateInfiniteQueryKey(node, hasRequiredVariables)},
-      (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(${documentVariableName}, {...variables, [pageParamKey]: metaData.pageParam })(),
+      (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(${documentVariableName}, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})(),
       options
     );`;
   }

diff --git a/packages/plugins/typescript/react-query/src/fetcher-fetch.ts b/packages/plugins/typescript/react-query/src/fetcher-fetch.ts
@@ -61,7 +61,7 @@ function fetcher<TData, TVariables>(endpoint: string, requestInit: RequestInit,
     ) =>
     ${hookConfig.infiniteQuery.hook}<${operationResultType}, TError, TData>(
       ${generateInfiniteQueryKey(node, hasRequiredVariables)},
-      (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, {...variables, [pageParamKey]: metaData.pageParam })(),
+      (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})(),
       options
     );`;
   }

diff --git a/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts b/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts
@@ -50,7 +50,7 @@ function fetcher<TData, TVariables>(client: GraphQLClient, query: string, variab
     ) =>
     ${hookConfig.infiniteQuery.hook}<${operationResultType}, TError, TData>(
       ${generateInfiniteQueryKey(node, hasRequiredVariables)},
-      (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(client, ${documentVariableName}, {...variables, [pageParamKey]: metaData.pageParam }, headers)(),
+      (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(client, ${documentVariableName}, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})}, headers)(),
       options
     );`;
   }

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
@@ -40,7 +40,7 @@ export const useInfiniteTestQuery = <
     const query = useCustomFetcher<TTestQuery, TTestQueryVariables>(TestDocument)
     return useInfiniteQuery<TTestQuery, TError, TData>(
       variables === undefined ? ['test.infinite'] : ['test.infinite', variables],
-      (metaData) => query({...variables, [pageParamKey]: metaData.pageParam }),
+      (metaData) => query({...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})}),
       options
     )};
 
@@ -102,7 +102,7 @@ export const useInfiniteTestQuery = <
     
     return useInfiniteQuery<TTestQuery, TError, TData>(
       variables === undefined ? ['test.infinite'] : ['test.infinite', variables],
-      (metaData) => myCustomFetcher<TTestQuery, TTestQueryVariables>(TestDocument, {...variables, [pageParamKey]: metaData.pageParam })(),
+      (metaData) => myCustomFetcher<TTestQuery, TTestQueryVariables>(TestDocument, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})(),
       options
     )};
 

diff --git a/packages/plugins/typescript/react-query/tests/react-query.spec.ts b/packages/plugins/typescript/react-query/tests/react-query.spec.ts
@@ -93,7 +93,7 @@ export const useInfiniteTestQuery = <
     ) =>
     useInfiniteQuery<TestQuery, TError, TData>(
       variables === undefined ? ['test.infinite'] : ['test.infinite', variables],
-      (metaData) => fetcher<TestQuery, TestQueryVariables>(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, {...variables, [pageParamKey]: metaData.pageParam })(),
+      (metaData) => fetcher<TestQuery, TestQueryVariables>(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})(),
       options
     );
 
@@ -269,7 +269,7 @@ export const useTestMutation = <
     ) =>{
     return useInfiniteQuery<TTestQuery, TError, TData>(
       variables === undefined ? ['test.infinite'] : ['test.infinite', variables],
-      (metaData) => myCustomFetcher<TTestQuery, TTestQueryVariables>(TestDocument, {...variables, [pageParamKey]: metaData.pageParam })(),
+      (metaData) => myCustomFetcher<TTestQuery, TTestQueryVariables>(TestDocument, {...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})})(),
       options
     )};`);
       expect(out.content).toBeSimilarStringTo(`export const useTestMutation = <
@@ -366,7 +366,7 @@ export const useTestMutation = <
       const query = useCustomFetcher<TTestQuery, TTestQueryVariables>(TestDocument)
       return useInfiniteQuery<TTestQuery, TError, TData>(
       variables === undefined ? ['test.infinite'] : ['test.infinite', variables],
-      (metaData) => query({...variables, [pageParamKey]: metaData.pageParam }),
+      (metaData) => query({...variables, ...(metaData.pageParam ? {[pageParamKey]: metaData.pageParam} : {})}),
       options
     )};`);
       expect(out.content).toBeSimilarStringTo(`export const useTestMutation = <