redwoodjs / redwood

The App Framework for Startups
https://redwoodjs.com
MIT License
17.15k stars 980 forks source link

Support graphql-config to extend codegen config #4207

Open Einlar opened 2 years ago

Einlar commented 2 years ago

EDIT by Aditya: graphql-code-generator supports graphql.config.js (graphql-config) if used via their CLI, we should consider supporting this in Redwood too. One less config file to maintain. :)


OP: Following the Apollo docs on local-only fields I am adding a field tracking the status of a mutation in the UI.

I query it in a Cell with:

export const QUERY = gql`
query SearchSomething($vars...) {
  myQuery(vars...) {
    ...other fields
    localVar @client
  }
}
`

Then, in App.js, I define the local field in the cacheConfig object passed inside of graphQLClientConfig to RedwoodApolloProvider:

<RedwoodApolloProvider
  graphQLClientConfig={{
    cacheConfig: {
      typePolicies: {
        Type: { //type returned by myQuery
          fields: {
            localVar: {
              read(localVar = 'default') {
                return localVar 
              }
            },
          },
        },
      },
    },
  }}
>

Everything works as expected, and the query returns initially the 'default' value, which can be updated by using update in a mutation.

However, when starting the app with yarn rw dev, I get the following annoying error:

gen | Error 0: GraphQLDocumentError: Cannot query field "localVar" on type "Type"

I think it may be related to graphql-code-generator, so I tried following this, and edited in graphql.config.js:

module.exports = {
  schema: [getPaths().generated.schema, 'client-schema.graphql'],
}

Then I created a client-schema.graphql in the same folder as graphql.config.js with:

extend type Opportunity {
    isLoading: Boolean!
  }

But this made no difference. How should I proceed?

callingmedic911 commented 2 years ago

To extend codegen config, I think you've to create codegen.yml at the root of the project (instead of graphql.config.js) with something like this:

schema:
  - .redwood/schema.graphql
  - client-schema.graphql

Can you please try if this works for you?

In any case, there's room for improvement:

Einlar commented 2 years ago

I confirm it works! Thank you very much

callingmedic911 commented 2 years ago

Great! I have created a separate issue for documentation. I'll keep this issue open (and edit the OP) to discuss graphql-config support.

dennemark commented 7 months ago

Hi, is this approach still working? I am not able to include local fields in codegen. Same issue as described above. I have created a codegen.ts

import { CodegenConfig } from '@graphql-codegen/cli'

const config: CodegenConfig = {
  schema: ['.redwood/schema.graphql', 'client-schema.graphql'],
}
export default config

that is definitely being called when i place a console.log inside.

And here is the client-schema.graphql:

extend type MyType {
   myField: [String!]
}

It leads to the error:


... done with errors.

Error: Could not generate GraphQL type definitions (web)

Error: GraphQL Document Validation failed with 1 errors;
  Error 0: Cannot query field "myField" on type "MyType".

Apollo local state within grapqhl codegen: https://the-guild.dev/graphql/codegen/docs/integrations/apollo-local-state