dotansimha / dotansimha/graphql-code-generator-community

Incorrect imports when using union fragment with `dedupeOperationSuffix: true` and `inlineFragmentTypes: 'combine'`

Open
#812 0 comments 1 reaction 0 assignees View on GitHub
Dominant language
TypeScript
Stars
137
Forks
195
Avg merge
6h 20m
Merged PRs (30d)
16

Description

### Which packages are impacted by your issue?

@graphql-codegen/near-operation-file-preset

### Describe the bug

Using `dedupeOperationSuffix: true`, `inlineFragmentTypes: 'combine'`, and using union type together causes incorrect import names.

You'd expect that given the following fragment,

```graphql
fragment UINodeFragment on UINode {
... on TextUINode {
id
content
}
... on ImageUINode {
id
url
}
}
```

which generates

```ts
export type UiNodeFragment_ImageUiNode = { __typename?: 'ImageUINode', id: string, url?: string | null };

export type UiNodeFragment_TextUiNode = { __typename?: 'TextUINode', id: string, content?: string | null };

export type UiNodeFragment = UiNodeFragment_ImageUiNode | UiNodeFragment_TextUiNode;
```
importing and using `UINodeFragment` in another operation will generate code that imports `UiNodeFragment_ImageUiNode` or `UiNodeFragment_TextUiNode` or `UiNodeFragment`.

Instead, generated code imports `UiNodeFragment_ImageUiNode_` and `UiNodeFragment_TextUiNode_`, with additional undercores at the end.

### Your Example Website or App

https://github.com/YoonjiJang/graphql-codegen-union-fragment

### Steps to Reproduce the Bug or Issue

1. Check out main branch from [reproduction repository](https://github.com/YoonjiJang/graphql-codegen-union-fragment)
2. Run `npm install`
3. Run `npm run graphql-codegen`

### Expected behavior

The imports should be `UiNodeFragment_ImageUiNode` and `UiNodeFragment_TextUiNode`.

### Screenshots or Videos

Screenshot 2024-08-06 at 10 39 47 PM

### Platform

- OS: macOS
- NodeJS: v20.16.0
- `graphql` version: 16.9.0
- `@graphql-codegen/cli`: 5.0.2
- `@graphql-codegen/near-operation-file-preset`: 3.0.0
- `@graphql-codegen/typescript`: 4.0.9
- `@graphql-codegen/typescript-operations`: 4.2.3

### Codegen Config File

```ts
import { CodegenConfig } from "@graphql-codegen/cli";
import path from "path";

const config = {
schema: [path.resolve(__dirname, "schema.graphql")],
overwrite: true,
generates: {
"src/graphql/types.ts": {
plugins: ["typescript"],
},
src: {
preset: "near-operation-file",
presetConfig: {
extension: ".ts",
baseTypesPath: "./graphql/types.ts",
},
plugins: ["typescript-operations"],
config: {
dedupeOperationSuffix: true,
inlineFragmentTypes: "combine",
},
documents: [path.resolve(__dirname, "src/**/*.graphql")],
},
},
} satisfies CodegenConfig;

export default config;
```

### Additional context

_No response_

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.