Update: Migrate to Tanstack React Query 4 and dts

[PointSingularity]

This PR updates many of the packages as well as migrates from react-query to the new tanstack/react-query. It also migrates from tsdx to dts, because tsdx is no longer maintained and dts is an active fork, which minimizes the amount of workflow changes.

• Migrate from react-query to Tanstack React Query 4 (Query Keys need to be an Array)
• Replace tsdx with dts-cli
• Update to TS 4.8
• Update to Storybook 6 with webpack 5 (starting SB shows a lot of warnings, but that is due the TS 4.8)
• Fix some new typing issues in the sample app (there were a lot of null/undefined errors, needs a review)
• Changed the version to 2.0.0, because it would be a breaking change

PS: Stackblitz example wasn't changed.

[LinnJS]

Its so cool to see how popular TanStack Query has gotten these past couple of years. Love using it myself.

[AO19]

@alan2207 any chance accepting this PR?

[morrisonbrett]

So happy someone did this. THANK YOU.

[samducker]

I get the following issue when running this forked branch,

Error: No QueryClient set, use QueryClientProvider to set one

even though I have my client set on the component above, as soon as I remove the AuthProvider I no longer get the error. My setup is the same as the updated sample app.

[PointSingularity]

I get the following issue when running this forked branch,

Error: No QueryClient set, use QueryClientProvider to set one

even though I have my client set on the component above, as soon as I remove the AuthProvider I no longer get the error. My setup is the same as the updated sample app.

@samducker I just checked the sample app (storybook) and it works for me.

But I did try out this code

    <AuthProvider>
      <ReactQueryProvider>
        <App />
      </ReactQueryProvider>
    </AuthProvider>

Which produces the same error as yours:

But you should try swapping the order of the two providers like this:

    <ReactQueryProvider>
      <AuthProvider>
        <App />
      </AuthProvider>
    </ReactQueryProvider>

That solved the error for me.

Hope this helps you!

[alan2207]

Hey @PointSingularity , thanks a lot for the PR, unfortunately, I already started migrating it myself but then didn't have time to finish until recently. It differs because it has a completely different API to fit more use cases.

I will close this PR in favor of #18

[PointSingularity]

Hey @PointSingularity , thanks a lot for the PR, unfortunately, I already started migrating it myself but then didn't have time to finish until recently. It differs because it has a completely different API to fit more use cases.

I will close this PR in favor of #18

Hey, no problem 👍 #18 looks great!