graphql-code-generator-community icon indicating copy to clipboard operation
graphql-code-generator-community copied to clipboard

[typescript-react-query] `_externalImportPrefix` is not applied when using the `import-types` preset

Open knoefel opened this issue 2 years ago • 2 comments

Which packages are impacted by your issue?

@graphql-codegen/typescript-react-query

Describe the bug

Since updating to [email protected] the prefix is missing for all types generated by this plugin. The problem are these lines: https://github.com/dotansimha/graphql-code-generator-community/blob/935b51f0777047102cc1c33a1a18a4527902e0f9/packages/plugins/typescript/react-query/src/visitor.ts#L148-L149

These variables are not used after this modification, only the generateConfig variable defined prior to these lines ( are passed to the functions on the next lines.

https://github.com/dotansimha/graphql-code-generator-community/blob/935b51f0777047102cc1c33a1a18a4527902e0f9/packages/plugins/typescript/react-query/src/visitor.ts#L139-L146

I fixed it by setting it while defining this variable:

const generateConfig = {
  node,
  documentVariableName,
  operationResultType: this._externalImportPrefix + operationResultType,
  operationVariablesTypes: this._externalImportPrefix + operationVariablesTypes,
  hasRequiredVariables,
  operationName,
};

Your Example Website or App

Steps to Reproduce the Bug or Issue

Run a codegen with the typescript-react-query plugin and the preset import-types. Config:

'./libs/shared/api/src/lib/src/generated.client.ts': {
      documents: [
        './libs/shared/api/src/lib/graphql/client/**/*.graphql',
        './libs/shared/api/src/lib/graphql/shared/**/*.graphql',
      ],
      plugins: ['typescript-react-query'],
      preset: 'import-types',
      presetConfig: {
        typesPath: './generated.types',
      },
      config: {
        namingConvention: {
          enumValues: 'keep',
        },
        importOperationTypesFrom: 'Types',
        reactQueryVersion: 5,
        fetcher: './fetcher#fetcher',
        exposeQueryKeys: true,
        exposeMutationKeys: true,
      },
    },

Expected behavior

It is possible to use the import-types preset.

Screenshots or Videos

No response

Platform

  • OS: [e.g. macOS]
  • NodeJS: [e.g. 20.8.0]
  • "graphql": "^16.8.1"
  • "@graphql-codegen/typescript-react-query": "6.0.0"
  • "@graphql-codegen/import-types-preset": "^3.0.0"

Codegen Config File

No response

Additional context

No response

knoefel avatar Nov 13 '23 12:11 knoefel

I can open a PR, if someone has checked that this indeed is the problem.

knoefel avatar Nov 13 '23 12:11 knoefel

I can confirm I'm having the same problem. It's importing

import * as OperationTypes from './operations.generated';

however, the types don't include the OperationTypes. prefix.

So, one solution I see is including the OperationTypes. and the other is updating the import to include the correct specific types

Dgiulian avatar Nov 21 '23 16:11 Dgiulian