Typescript for useQuery if props returns {} or undefined

[melounek]

There are some TS clashes, when useQuery returns empty results.

props will return

• {} when the new option skip is set true
• undefined when fetchPolicy is set for example to store-only and store doesn't contain the result
• null during the query is loading

I feel like these two options should be unified into undefined/null (null when is loading and undefined for skip or not found in store)

And in any case, the empty result should be handled by Typescript. So instead of

export interface RenderProps<T extends OperationType> {
    props: T['response'];

there should be

export interface RenderProps<T extends OperationType> {
    props: T['response'] | null | undefined;

[morrys]

hi @melounek, it seems to me correct to foresee the same result for skip and for the fetchPolicy "store-only". the fix is ​​quite simple https://github.com/relay-tools/relay-hooks/blob/master/src/QueryFetcher.ts#L108

As for typing, I wonder if this change is also necessary for official useLazyLoadQuery: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react-relay/lib/relay-experimental/useLazyLoadQuery.d.ts#L13

@renanmav, what do you think about it?

[morrys]

typing the QueryRenderer https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react-relay/index.d.ts#L117 also provides null.

so, the behavior that @melounek suggests:

null when is loading and undefined for skip or not found in store

I find it correct :)

[renanmav]

Hmm, I don’t think this should be done by us.

If your query returns empty results, relay-compiler-language-typescript will detect that (based on your schema) and this would be reflected by T['response'].

I don’t know If I was clear...

[melounek]

@renanmav that's something else. If the schema returns null the props will contain something like

{ queryName: null }

and this null is provided by the T['response'], but during the loading time when we are waiting for the result, the props contains just null and this should be explicitly defined in the QueryFetcher.ts

[renanmav]

Got it

[morrys]

I have just released version 3.3.0 https://github.com/relay-tools/relay-hooks/releases/tag/v3.3.0

Feel free to open new issues if you find problems :)