@graphql-codegen/typescript-react-query 3.2.1-alpha-ac95f9557.0 → 3.2.3-alpha-23d229715.0

package/config.d.ts

@@ -1,7 +1,7 @@
 import { RawClientSideBasePluginConfig } from '@graphql-codegen/visitor-plugin-common';
 export declare type HardcodedFetch = {
     endpoint: string;
-    fetchParams?: string;
+    fetchParams?: string | Record<string, any>;
 };
 export declare type CustomFetch = {
     func: string;
@@ -14,9 +14,10 @@ export declare type CustomFetch = {
  */
 export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports'> {
     /**
-     * @description Customize the fetcher you wish to use in the generated file. React-Query is agnostic to the data-fetcing layer, so you should provide it, or use a custom one.
+     * @description Customize the fetcher you wish to use in the generated file. React-Query is agnostic to the data-fetching layer, so you should provide it, or use a custom one.
      *
      * The following options are available to use:
+     *
      * - 'fetch' - requires you to specify endpoint and headers on each call, and uses `fetch` to do the actual http call.
      * - `{ endpoint: string, fetchParams: RequestInit }`: hardcode your endpoint and fetch options into the generated output, using the environment `fetch` method. You can also use `process.env.MY_VAR` as endpoint or header value.
      * - `file#identifier` - You can use custom fetcher method that should implement the exported `ReactQueryFetcher` interface. Example: `./my-fetcher#myCustomFetcher`.
@@ -28,11 +29,12 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      * @description For each generate query hook adds `document` field with a
      * corresponding GraphQL query. Useful for `queryClient.fetchQuery`.
      * @exampleMarkdown
+     * <!-- prettier-ignore -->
      * ```ts
-     *  queryClient.fetchQuery(
-     *    useUserDetailsQuery.getKey(variables),
-     *    () => gqlRequest(useUserDetailsQuery.document, variables),
-     *  )
+     * queryClient.fetchQuery(
+     *   useUserDetailsQuery.getKey(variables),
+     *   () => gqlRequest(useUserDetailsQuery.document, variables)
+     * )
      * ```
      */
     exposeDocument?: boolean;
@@ -41,9 +43,9 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      * @description For each generate query hook adds getKey(variables: QueryVariables) function. Useful for cache updates.
      * @exampleMarkdown
      * ```ts
-     *  const query = useUserDetailsQuery(...);
-     *  const key = useUserDetailsQuery.getKey({id: theUsersId});
-     *  // use key in a cache update after a mutation
+     * const query = useUserDetailsQuery(...)
+     * const key = useUserDetailsQuery.getKey({ id: theUsersId })
+     * // use key in a cache update after a mutation
      * ```
      */
     exposeQueryKeys?: boolean;
@@ -52,8 +54,8 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      * @description For each generate mutation hook adds getKey() function. Useful for call outside of functional component.
      * @exampleMarkdown
      * ```ts
-     *  const mutation = useUserDetailsMutation(...);
-     *  const key = useUserDetailsMutation.getKey();
+     * const mutation = useUserDetailsMutation(...)
+     * const key = useUserDetailsMutation.getKey()
      * ```
      */
     exposeMutationKeys?: boolean;
@@ -63,7 +65,7 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      * It is useful for `queryClient.fetchQuery` and `queryClient.prefetchQuery`.
      * @exampleMarkdown
      * ```ts
-     *  await queryClient.prefetchQuery(userQuery.getKey(), () => userQuery.fetcher())
+     * await queryClient.prefetchQuery(userQuery.getKey(), () => userQuery.fetcher())
      * ```
      */
     exposeFetcher?: boolean;

package/index.js

@@ -32,7 +32,7 @@ function generateMutationKey(node) {
     return `'${node.name.value}'`;
 }
 function generateMutationKeyMaker(node, operationName) {
-    return `\nuse${operationName}.getKey = () => ${generateMutationKey(node)}};\n`;
+    return `\nuse${operationName}.getKey = () => ${generateMutationKey(node)};\n`;
 }
 
 class CustomMapperFetcher {
@@ -331,7 +331,8 @@ class HardcodedFetchFetcher {
     getFetchParams() {
         let fetchParamsPartial = '';
         if (this.config.fetchParams) {
-            fetchParamsPartial = `\n    ...(${this.config.fetchParams}),`;
+            const fetchParamsString = typeof this.config.fetchParams === 'string' ? this.config.fetchParams : JSON.stringify(this.config.fetchParams);
+            fetchParamsPartial = `\n    ...(${fetchParamsString}),`;
         }
         return `    method: "POST",${fetchParamsPartial}`;
     }

package/index.mjs

@@ -26,7 +26,7 @@ function generateMutationKey(node) {
     return `'${node.name.value}'`;
 }
 function generateMutationKeyMaker(node, operationName) {
-    return `\nuse${operationName}.getKey = () => ${generateMutationKey(node)}};\n`;
+    return `\nuse${operationName}.getKey = () => ${generateMutationKey(node)};\n`;
 }
 
 class CustomMapperFetcher {
@@ -325,7 +325,8 @@ class HardcodedFetchFetcher {
     getFetchParams() {
         let fetchParamsPartial = '';
         if (this.config.fetchParams) {
-            fetchParamsPartial = `\n    ...(${this.config.fetchParams}),`;
+            const fetchParamsString = typeof this.config.fetchParams === 'string' ? this.config.fetchParams : JSON.stringify(this.config.fetchParams);
+            fetchParamsPartial = `\n    ...(${fetchParamsString}),`;
         }
         return `    method: "POST",${fetchParamsPartial}`;
     }

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@graphql-codegen/typescript-react-query",
-  "version": "3.2.1-alpha-ac95f9557.0",
+  "version": "3.2.3-alpha-23d229715.0",
   "description": "GraphQL Code Generator plugin for generating a ready-to-use React-Query Hooks based on GraphQL operations",
   "peerDependencies": {
     "graphql": "^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0",
     "graphql-tag": "^2.0.0"
   },
   "dependencies": {
-    "@graphql-codegen/plugin-helpers": "^2.3.0",
-    "@graphql-codegen/visitor-plugin-common": "2.5.1-alpha-ac95f9557.0",
+    "@graphql-codegen/plugin-helpers": "2.4.0-alpha-23d229715.0",
+    "@graphql-codegen/visitor-plugin-common": "2.5.2-alpha-23d229715.0",
     "auto-bind": "~4.0.0",
     "change-case-all": "1.0.14",
     "tslib": "~2.3.0"
@@ -26,6 +26,7 @@
     "definition": "index.d.ts"
   },
   "exports": {
+    "./package.json": "./package.json",
     ".": {
       "require": "./index.js",
       "import": "./index.mjs"