TypeScript 4.8 Support

[NickHeiner]

When I update my project to TS 4.8, I get this error:

node_modules/relay-hooks/lib/RelayHooksTypes.d.ts:56:78 - error TS2536: Type '0' cannot be used to index type 'NonNullable<NonNullable<T[0]>[" $data"]>'.

56 export declare type ArrayKeyReturnType<T extends ArrayKeyType> = (arg: T) => NonNullable<NonNullable<T[0]>[' $data']>[0];

This is potentially related to this part of the release notes: https://devblogs.microsoft.com/typescript/announcing-typescript-4-8/#improved-intersection-reduction-union-compatibility-and-narrowing.

[morrys]

hi @NickHeiner, thanks for reporting 👍

Could you create a minimal project with the error? It will be useful to verify the resolution of the issue :)

[NickHeiner]

I think the minimal repro is literally just "update this repo to TS 4.8 and see if it builds".

I tried to do that myself, but I got this error on npm install:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: @restart/[email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   dev react@"^18.0.0" from the root project
npm ERR!   peer react@"^16.0.0 || ^17.0.0 || ^18.0.0" from [email protected]
npm ERR!   node_modules/react-shallow-renderer
npm ERR!     react-shallow-renderer@"^16.15.0" from [email protected]
npm ERR!     node_modules/react-test-renderer
npm ERR!       dev react-test-renderer@"^18.0.0" from the root project
npm ERR!   1 more (react-test-renderer)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.0-0" from @restart/[email protected]
npm ERR! node_modules/@restart/hooks
npm ERR!   @restart/hooks@"^0.3.1" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/react
npm ERR!   peer react@"^16.8.0-0" from @restart/[email protected]
npm ERR!   node_modules/@restart/hooks
npm ERR!     @restart/hooks@"^0.3.1" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

[morrys]

I have tried and it builds. If you want to try too , you need to execute npm install --force

[NickHeiner]

I tried and it doesn't build. Here's the branch demonstrating it: https://github.com/relay-tools/relay-hooks/compare/master...NickHeiner:relay-hooks:nth/ts-4.8?expand=1.

src/useRelayEnvironment.ts:8:13 - error TS2339: Property 'environment' does not exist on type '{}'.

8     const { environment } = React.useContext(ReactRelayContext);
              ~~~~~~~~~~~


Found 1 error in src/useRelayEnvironment.ts:8

[morrys]

you're right :D I had also fixed it but I answered you on the phone and I forgot about it :)

Now I have created a PR in draft where there are changes to the relay context and typescript dependency

https://github.com/relay-tools/relay-hooks/pull/225

[morrys]

Today I was able to spend more time on this issue and I noticed that with typescript versions after 4.8.2 the problem is not present.

if you download the repo and do yarn & yarn build of the example project you will see that there is no problem.

If you change the version of typescript to 4.8.2 the problem occurs.

In the meantime, I'm closing the issue but I'd like to have your feedback