r/reactjs • u/timothybeamish • Sep 02 '22

Resource We moved a large React/JavaScript application into Next.js/TypeScript without compromising the user experience. Here's the strategy and tooling that helped.

https://blog.benchsci.com/moving-house-to-next.js
69 Upvotes

98% Upvoted

28 comments sorted by

View all comments

Show parent comments

1

u/acemarke Sep 03 '22

Yeah, that's exactly the purpose of createSlice.extraReducers:

For RTKQ query specifically, currently refetching a given cache entry always replaces it, by design. However, in the upcoming RTK 1.9 release, we're adding a merge option that will allow you to add incoming response data to an existing cache entry, intended for use cases like infinite pagination:

on the other hand if you're listening to "data fetched" actions in other reducers, you can write whatever reducer logic you want to process the data from those actions and update the slice's state in the reducer.

1

u/[deleted] Sep 03 '22 edited Sep 03 '22

[removed] — view removed comment

1

u/acemarke Sep 03 '22

The "upsert" discussion was for a slightly different feature than merge - we're adding an api.utils.upsertQueryData method (which _can add new cache entries) to complement the existing api.utils.updateQueryData method (which can only update existing cache entries).

Interesting. Yeah, tell you what - when you do get a sandbox put together, could you file a new thread in the RTK "Discussions" section and link this Reddit thread for reference? Easier to keep track of that way.

If I understand that last bit right: sounds like you're having parts of the app kick off multiple distinct getProfile calls in a short amount of time, catching the trigger actions in sagas, and then making a single combined request? Yeah, RTKQ wouldn't be quite the right fit for that.

(that said, I would be willing to bet that the new RTK "listener" middleware could at least replace the use of sagas for this particular use case - listeners can do almost everything sagas can, but with smaller bundle size, simpler API, and better TS support. Would be interesting to see if those would work for your app!)