Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Need a little help to finalize the integration with RTK-Query #402

Closed
phryneas opened this issue Jul 26, 2021 · 3 comments
Closed

Need a little help to finalize the integration with RTK-Query #402

phryneas opened this issue Jul 26, 2021 · 3 comments

Comments

@phryneas
Copy link

phryneas commented Jul 26, 2021

Hi,
I'm a Redux maintainer and the author of RTK-Query.

We've had multiple requests to make RTK-Query work with Next SSR, so I've worked something out on how such an integration could be looking (and potentially open up the way for other SSR mechanisms & suspense).

For client-side hydration/integration of the server-side store with the client-side api slice, I've come up with an API where you just register a extractRehydrationInfo callback in the createApi options and either return undefined or in the case of a hydration action the substate that should be rehydrated. I was hoping to be independent of framework implementations that way.
That would then lead to the internal middleware dispatching a RTK-Query-internal "hydrate" action that would then be picked up by the api slice reducer.

Unfortunately, it seems that that in my experiments with next-redux-wrapper, that internal rehydrate action never makes it to the devtools and all of that happens... on the server, not on the client? At least, it happens in the server console, not on the browser console, but I might be reading that wrong.

I'm a bit out of my comfort zone with SSR and have not a lot experience with that stuff, so I might be making some weird rookie mistake here.
Could you maybe take a look at it and give me some feedback?
I would also be very open to any kind of general feedback you can give me.

I have a demo repository on how I would imagine that this would be used with Next and next-redux-wrapper over here: https://github.com/phryneas/ssr-experiments/blob/126262fcce7f8b788df3670dbc061362c65b6b9e/nextjs-blog/lib/pokemonApi.ts

And I'd also be happy for any kind of feedback on the PR where I'm implementing the SSR-specific stuff:
reduxjs/redux-toolkit#1277

I would be very grateful for any kind of help & advice you could offer :)

@kirill-konshin
Copy link
Owner

Hydrate action is the only way how client can receive server state, so definitely it happens on the client.

I'd appreciate if you try to use the following example https://github.com/kirill-konshin/next-redux-wrapper/tree/master/packages/demo-redux-toolkit or following code sandbox https://codesandbox.io/s/next-redux-wrapper-demo-7n2t5 to make sure we eliminate possible issues.

@phryneas
Copy link
Author

phryneas commented Aug 1, 2021

Okay, it's working with that :)

Now I just have to work out what I was doing wrong - thank you very much for the nudge!

@phryneas phryneas closed this as completed Aug 1, 2021
@phryneas
Copy link
Author

phryneas commented Aug 1, 2021

Yeah.... Nextjs noob here, apparently. I just had to delete the .next folder - probably a stale cache.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants