dotansimha / dotansimha/graphql-code-generator

Automatically import fragment used by the children components in the root query

Open
#9,843 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
11.3k
Forks
1.4k
Avg merge
1d 1h
Merged PRs (30d)
23

Description

### Is your feature request related to a problem? Please describe.

Hello,

I'm using the preset `client` to generate types and using `fragment` do declare data dependency of some components.

However, I still find there's room for improvements for the DX. Here's the problem I have:

I have a `Page` that uses a component `ProfileCards`. This component declares its dependency with a `fragment`.
This is great, it allows to generate types for the component.

What I find annoying is: I need to include the fragment name in `Page` query.

For a simple page it's ok to do this, but when the page gets more complex with many components having their own components declaring their own data dependency with `fragment`, it becomes rapidly a mess.
For instance, if I remove a component from my page, I need also to remove it's fragment from the page's query.

### Describe the solution you'd like

What I'd love is :

- to still declare the data dependency of a component right in the component
- stop giving a unique name to the fragment
- automatically include or remove the fragment in the page query when data dependency of my component tree changes

### Describe alternatives you've considered

I've looked at `useFragment` from relay but they've got the same limitations (see: https://relay.dev/docs/guided-tour/rendering/fragments/)

I know there's many obstacles to be able to do it, for instances:
- If my fragment can be used on multiple fields of my query, how to know on which one to add it ?
- If I have multiple query on my `Page`, on which query should the fragments be added ?
- I must forget lot of edge-cases ...

I'm wondering if y'all are having the same problem, and what's your way to fix it (or avoid it) ?

Also, thanks a lot for the amazing work you're doing, using `fragment` made my life easier 🙇‍♂️🥰

[EDIT]
To help me detect unused-fragments, I will try to use those eslint rules https://the-guild.dev/graphql/eslint/rules , especially `no-unused-fragments`

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.