@graphql-codegen/typescript-react-query 3.6.2 → 4.0.0-alpha-b151324cf.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -56,7 +56,9 @@ class CustomMapperFetcher {
56
56
  const hookConfig = this.visitor.queryMethodMap;
57
57
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook);
58
58
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options);
59
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
59
+ const options = this.visitor.config.legacyMode
60
+ ? `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`
61
+ : `options?: Omit<${hookConfig.query.options}<${operationResultType}, TError, TData>, 'queryKey' | 'queryFn' | 'initialData'>`;
60
62
  const typedFetcher = this.getFetcherFnName(operationResultType, operationVariablesTypes);
61
63
  const impl = this._isReactHook
62
64
  ? `${typedFetcher}(${documentVariableName}).bind(null, variables)`
@@ -55,7 +55,7 @@ ${this.getFetchParams()}
55
55
  TData = ${operationResultType},
56
56
  TError = ${this.visitor.config.errorType}
57
57
  >(
58
- pageParamKey: keyof ${operationVariablesTypes},
58
+ _pageParamKey: keyof ${operationVariablesTypes},
59
59
  ${variables},
60
60
  ${options}
61
61
  ) =>
@@ -33,13 +33,13 @@ function fetcher<TData, TVariables>(endpoint: string, requestInit: RequestInit,
33
33
  const hookConfig = this.visitor.queryMethodMap;
34
34
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.infiniteQuery.hook);
35
35
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.infiniteQuery.options);
36
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
36
+ const options = `options?: ${hookConfig.infiniteQuery.options}<${operationResultType}, TError, TData>`;
37
37
  return `export const useInfinite${operationName} = <
38
38
  TData = ${operationResultType},
39
39
  TError = ${this.visitor.config.errorType}
40
40
  >(
41
41
  dataSource: { endpoint: string, fetchParams?: RequestInit },
42
- pageParamKey: keyof ${operationVariablesTypes},
42
+ _pageParamKey: keyof ${operationVariablesTypes},
43
43
  ${variables},
44
44
  ${options}
45
45
  ) =>
@@ -54,7 +54,9 @@ function fetcher<TData, TVariables>(endpoint: string, requestInit: RequestInit,
54
54
  const hookConfig = this.visitor.queryMethodMap;
55
55
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook);
56
56
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options);
57
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
57
+ const options = this.visitor.config.legacyMode
58
+ ? `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`
59
+ : `options?: Omit<${hookConfig.query.options}<${operationResultType}, TError, TData>, 'queryKey' | 'queryFn' | 'initialData'>`;
58
60
  return `export const use${operationName} = <
59
61
  TData = ${operationResultType},
60
62
  TError = ${this.visitor.config.errorType}
@@ -24,7 +24,7 @@ function fetcher<TData, TVariables>(client: GraphQLClient, query: string, variab
24
24
  TData = ${operationResultType},
25
25
  TError = ${this.visitor.config.errorType}
26
26
  >(
27
- pageParamKey: keyof ${operationVariablesTypes},
27
+ _pageParamKey: keyof ${operationVariablesTypes},
28
28
  client: GraphQLClient,
29
29
  ${variables},
30
30
  ${options},
@@ -44,7 +44,9 @@ function fetcher<TData, TVariables>(client: GraphQLClient, query: string, variab
44
44
  const hookConfig = this.visitor.queryMethodMap;
45
45
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook);
46
46
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options);
47
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
47
+ const options = this.visitor.config.legacyMode
48
+ ? `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`
49
+ : `options?: Omit<${hookConfig.query.options}<${operationResultType}, TError, TData>, 'queryKey' | 'queryFn' | 'initialData'>`;
48
50
  return `export const use${operationName} = <
49
51
  TData = ${operationResultType},
50
52
  TError = ${this.visitor.config.errorType}
package/cjs/visitor.js CHANGED
@@ -20,6 +20,7 @@ class ReactQueryVisitor extends visitor_plugin_common_1.ClientSideBaseVisitor {
20
20
  exposeMutationKeys: (0, visitor_plugin_common_1.getConfigValue)(rawConfig.exposeMutationKeys, false),
21
21
  exposeFetcher: (0, visitor_plugin_common_1.getConfigValue)(rawConfig.exposeFetcher, false),
22
22
  addInfiniteQuery: (0, visitor_plugin_common_1.getConfigValue)(rawConfig.addInfiniteQuery, false),
23
+ legacyMode: (0, visitor_plugin_common_1.getConfigValue)(rawConfig.legacyMode, false),
23
24
  });
24
25
  this.rawConfig = rawConfig;
25
26
  this.reactQueryHookIdentifiersInUse = new Set();
@@ -66,14 +67,12 @@ class ReactQueryVisitor extends visitor_plugin_common_1.ClientSideBaseVisitor {
66
67
  if (!this.hasOperations) {
67
68
  return baseImports;
68
69
  }
69
- if (this.config.addInfiniteQuery) {
70
- this.reactQueryOptionsIdentifiersInUse.add('QueryFunctionContext');
71
- }
72
70
  const hookAndTypeImports = [
73
71
  ...Array.from(this.reactQueryHookIdentifiersInUse),
74
72
  ...Array.from(this.reactQueryOptionsIdentifiersInUse).map(identifier => `${this.config.useTypeImports ? 'type ' : ''}${identifier}`),
75
73
  ];
76
- return [...baseImports, `import { ${hookAndTypeImports.join(', ')} } from 'react-query';`];
74
+ const moduleName = this.config.legacyMode ? 'react-query' : '@tanstack/react-query';
75
+ return [...baseImports, `import { ${hookAndTypeImports.join(', ')} } from '${moduleName}';`];
77
76
  }
78
77
  getFetcherImplementation() {
79
78
  return this.fetcher.generateFetcherImplementaion();
@@ -53,7 +53,9 @@ export class CustomMapperFetcher {
53
53
  const hookConfig = this.visitor.queryMethodMap;
54
54
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook);
55
55
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options);
56
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
56
+ const options = this.visitor.config.legacyMode
57
+ ? `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`
58
+ : `options?: Omit<${hookConfig.query.options}<${operationResultType}, TError, TData>, 'queryKey' | 'queryFn' | 'initialData'>`;
57
59
  const typedFetcher = this.getFetcherFnName(operationResultType, operationVariablesTypes);
58
60
  const impl = this._isReactHook
59
61
  ? `${typedFetcher}(${documentVariableName}).bind(null, variables)`
@@ -52,7 +52,7 @@ ${this.getFetchParams()}
52
52
  TData = ${operationResultType},
53
53
  TError = ${this.visitor.config.errorType}
54
54
  >(
55
- pageParamKey: keyof ${operationVariablesTypes},
55
+ _pageParamKey: keyof ${operationVariablesTypes},
56
56
  ${variables},
57
57
  ${options}
58
58
  ) =>
@@ -30,13 +30,13 @@ function fetcher<TData, TVariables>(endpoint: string, requestInit: RequestInit,
30
30
  const hookConfig = this.visitor.queryMethodMap;
31
31
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.infiniteQuery.hook);
32
32
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.infiniteQuery.options);
33
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
33
+ const options = `options?: ${hookConfig.infiniteQuery.options}<${operationResultType}, TError, TData>`;
34
34
  return `export const useInfinite${operationName} = <
35
35
  TData = ${operationResultType},
36
36
  TError = ${this.visitor.config.errorType}
37
37
  >(
38
38
  dataSource: { endpoint: string, fetchParams?: RequestInit },
39
- pageParamKey: keyof ${operationVariablesTypes},
39
+ _pageParamKey: keyof ${operationVariablesTypes},
40
40
  ${variables},
41
41
  ${options}
42
42
  ) =>
@@ -51,7 +51,9 @@ function fetcher<TData, TVariables>(endpoint: string, requestInit: RequestInit,
51
51
  const hookConfig = this.visitor.queryMethodMap;
52
52
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook);
53
53
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options);
54
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
54
+ const options = this.visitor.config.legacyMode
55
+ ? `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`
56
+ : `options?: Omit<${hookConfig.query.options}<${operationResultType}, TError, TData>, 'queryKey' | 'queryFn' | 'initialData'>`;
55
57
  return `export const use${operationName} = <
56
58
  TData = ${operationResultType},
57
59
  TError = ${this.visitor.config.errorType}
@@ -21,7 +21,7 @@ function fetcher<TData, TVariables>(client: GraphQLClient, query: string, variab
21
21
  TData = ${operationResultType},
22
22
  TError = ${this.visitor.config.errorType}
23
23
  >(
24
- pageParamKey: keyof ${operationVariablesTypes},
24
+ _pageParamKey: keyof ${operationVariablesTypes},
25
25
  client: GraphQLClient,
26
26
  ${variables},
27
27
  ${options},
@@ -41,7 +41,9 @@ function fetcher<TData, TVariables>(client: GraphQLClient, query: string, variab
41
41
  const hookConfig = this.visitor.queryMethodMap;
42
42
  this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook);
43
43
  this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options);
44
- const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`;
44
+ const options = this.visitor.config.legacyMode
45
+ ? `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`
46
+ : `options?: Omit<${hookConfig.query.options}<${operationResultType}, TError, TData>, 'queryKey' | 'queryFn' | 'initialData'>`;
45
47
  return `export const use${operationName} = <
46
48
  TData = ${operationResultType},
47
49
  TError = ${this.visitor.config.errorType}
package/esm/visitor.js CHANGED
@@ -16,6 +16,7 @@ export class ReactQueryVisitor extends ClientSideBaseVisitor {
16
16
  exposeMutationKeys: getConfigValue(rawConfig.exposeMutationKeys, false),
17
17
  exposeFetcher: getConfigValue(rawConfig.exposeFetcher, false),
18
18
  addInfiniteQuery: getConfigValue(rawConfig.addInfiniteQuery, false),
19
+ legacyMode: getConfigValue(rawConfig.legacyMode, false),
19
20
  });
20
21
  this.rawConfig = rawConfig;
21
22
  this.reactQueryHookIdentifiersInUse = new Set();
@@ -62,14 +63,12 @@ export class ReactQueryVisitor extends ClientSideBaseVisitor {
62
63
  if (!this.hasOperations) {
63
64
  return baseImports;
64
65
  }
65
- if (this.config.addInfiniteQuery) {
66
- this.reactQueryOptionsIdentifiersInUse.add('QueryFunctionContext');
67
- }
68
66
  const hookAndTypeImports = [
69
67
  ...Array.from(this.reactQueryHookIdentifiersInUse),
70
68
  ...Array.from(this.reactQueryOptionsIdentifiersInUse).map(identifier => `${this.config.useTypeImports ? 'type ' : ''}${identifier}`),
71
69
  ];
72
- return [...baseImports, `import { ${hookAndTypeImports.join(', ')} } from 'react-query';`];
70
+ const moduleName = this.config.legacyMode ? 'react-query' : '@tanstack/react-query';
71
+ return [...baseImports, `import { ${hookAndTypeImports.join(', ')} } from '${moduleName}';`];
73
72
  }
74
73
  getFetcherImplementation() {
75
74
  return this.fetcher.generateFetcherImplementaion();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@graphql-codegen/typescript-react-query",
3
- "version": "3.6.2",
3
+ "version": "4.0.0-alpha-b151324cf.0",
4
4
  "description": "GraphQL Code Generator plugin for generating a ready-to-use React-Query Hooks based on GraphQL operations",
5
5
  "peerDependencies": {
6
6
  "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"
@@ -12,7 +12,7 @@ export declare type CustomFetch = {
12
12
  *
13
13
  * It extends the basic TypeScript plugins: `@graphql-codegen/typescript`, `@graphql-codegen/typescript-operations` - and thus shares a similar configuration.
14
14
  */
15
- export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports'> {
15
+ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports' | 'legacyMode'> {
16
16
  /**
17
17
  * @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.
18
18
  *
@@ -78,4 +78,9 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
78
78
  * @description Adds an Infinite Query along side the standard one
79
79
  */
80
80
  addInfiniteQuery?: boolean;
81
+ /**
82
+ * @default true
83
+ * @description If false, it will work with `@tanstack/react-query`, default value is true.
84
+ */
85
+ legacyMode?: boolean;
81
86
  }
@@ -10,6 +10,7 @@ export interface ReactQueryPluginConfig extends ClientSideBasePluginConfig {
10
10
  exposeMutationKeys: boolean;
11
11
  exposeFetcher: boolean;
12
12
  addInfiniteQuery: boolean;
13
+ legacyMode: boolean;
13
14
  }
14
15
  export interface ReactQueryMethodMap {
15
16
  infiniteQuery: {