Enhanced support for page queries/components

[cometkim]

• Codegen for page context (that provided in createPage)
• Design DX for auto-fixing page queries.
• more use cases in page component

[sanjaypojo]

Hi @cometkim, thanks for a great library 😄

I was curious if there's any way to type the data prop from a page query automatically at the moment? And whether there's some workaround for this until the actual you ship this feature?

EDIT: I realized I can just type the components as React.FC<{data: GatsbyTypes.PageQuery}>. Might be cool to include this in the docs. Happy to write it up if you think that makes sense!

[cometkim]

Hi @sanjaypojo, thanks for your interest in this issue :)

The data fields can easily be typed with the query type already generated, as you mentioned.

Actually, pageContext also has a generated type, but the problem is that all page contexts are merged into one single type; SitePageContext.

So it needs some static analysis of the createPage call to extract the subtypes it needs.

[cometkim]

And, I found it inconvenient to include a lot of nullability in the generated type because the Gatsby schema is inferred fields as Nullable if not explicitly declared as non-null.

For now, the best way to solve this is to write a type guard user self, but it is too cumbersome.

And it is not an option to manipulate the schema arbitrarily or to cheat the type.

To do this, I first aim to create a type guard function that can be used in general. And then provide a basic practice for typing page queries through it.

[cometkim]

Oh, I just realized gatsby already provides some utility types for page props

https://github.com/gatsbyjs/gatsby/blob/a72caa67f8/packages/gatsby/index.d.ts#L33-L120