Graphql-code-generator: Wrong operation option types generated by typescript-react-apollo template

Created on 22 Aug 2018  路  2Comments  路  Source: dotansimha/graphql-code-generator

Hi,
Thanks for this nice project and the typescript-react-apollo template :)

I found an issue in the HOC template of the typescript-react-apollo template since I upgraded it to 0.11.0.

Versions

  • graphql-code-generator: 0.10.7 or 0.11.0
  • graphql-codegen-typescript-react-apollo-template: 0.11.0

Current behavior

A gql-gen configuration:

{
  "generatorConfig": {
    "noNamespaces": true,
    "resolvers": false
  }
}

A query:

query getViewer {
  viewer {
    __typename
    id
    uid
  }
}

Run the gql-gen command:

yarn run gql-gen --schema ../docs/graphql/schema.json --template graphql-codegen-typescript-react-apollo-template --out ./queries/index.tsx --config ./.gqlgen.json 'queries/**/*.graphql'

Then, gql-gen generates a typescript file:

export function GetViewerHOC<TProps = {}>(
  operationOptions: ReactApollo.OperationOption<TProps, Query, Variables>,
) {
  return ReactApollo.graphql<TProps, GetViewerQuery, GetViewerVariables>(
    gql`
      query getViewer {
        viewer {
          __typename
          id
          uid
        }
      }
    `,
    operationOptions,
  )
}

But, tsc raises an error:

$ tsc -p . --noEmit
queries/index.tsx:70:64 - error TS2304: Cannot find name 'Variables'.

70   operationOptions: ReactApollo.OperationOption<TProps, Query, Variables>,
                                                                  ~~~~~~~~~

Expected behavior

operationOptions should be the extended types GetViewerQuery and GetViewerVariables, not Query and Variables:

export function GetViewerHOC<TProps = {}>(
  operationOptions: ReactApollo.OperationOption<TProps, GetViewerQuery, GetViewerVariables>,
) {
  return ReactApollo.graphql<TProps, GetViewerQuery, GetViewerVariables>(
    gql`
      query getViewer {
        viewer {
          __typename
          id
          uid
        }
      }
    `,
    operationOptions,
  )
}
bug waiting-for-release

Most helpful comment

For now, we released an alpha version with a fix for this:

Successfully published:
 - [email protected]
 - [email protected]
 - [email protected]
 - [email protected]
 - [email protected]
 - [email protected]
 - graphql-codegen-typescript-mongodb-template@0.12.0-alpha.821f12df
 - graphql-codegen-typescript-react-apollo-template@0.12.0-alpha.821f12df
 - [email protected]

All 2 comments

For now, we released an alpha version with a fix for this:

Successfully published:
 - [email protected]
 - [email protected]
 - [email protected]
 - [email protected]
 - [email protected]
 - [email protected]
 - graphql-codegen-typescript-mongodb-template@0.12.0-alpha.821f12df
 - graphql-codegen-typescript-react-apollo-template@0.12.0-alpha.821f12df
 - [email protected]

Fixed in 0.12.0

Was this page helpful?
0 / 5 - 0 ratings