Looking for some clarification about hydration when upgrading

[thepuzzlemaster]

I've been working through upgrading from Next 12 to 13 and React 17 to 18. I also updated my relevant redux libs (next-redux-wrapper, redux-toolkit, react-redux).

I'm seeing some strange behavior on one page that only happens on page navigation, and I'm not entirely sure why it's happening.

I have some TSX which accesses some data in my redux store to render. This is inside a component that is on PageA
When I navigate to PageB, I'm seeing the hydrate method be called for this redux slice.
It just returns

{
   ...state,
   ...action.payload.sliceName
}

This code hasn't changed.

In my main branch (with the older versions of React/Next) everything works just fine

However in my upgrade branch, I get a TypeError because hydrate runs and clears out the existing state with my slice's initialState. Then there are some renders before the new page has rendered while the old page is still rendering, but my store no longer contains my state data for the necessary fields.

I'm not sure what has changed to cause this. In both my main branch and my upgrade branch, after hydration for the PageB navigation, the data is not present in the store (which makes sense to me, since that data isn't necessary for PageB). But in my upgrade branch, it still renders PageA again, where it seems in my main branch that doesn't seem to happen.

I could do some comparison logic in my hydration handler to check if the existing data had been previously set, and if so and the new action.payload data is the same as my initialState data, but I'm confused about what change would have caused this to be necessary. And that seems like a lot of opportunity for bugs if I have to add that logic to every slice?

Seems very similar (maybe dupe) of #492?
Although reverting to 7.0.5 does not fix the issue for me. It seems to be tied to one of the other upgrades. Is this just some fundamental misunderstanding I have around the order of operations?

It seems like things are going out of order here? Why, when after the data has loaded for PageB (both pages use getServerSideProps), does it still render PageA - which ultimately triggers this error. Ultimately, in this particular instance this has no real affect on my prod build other than triggering an error in the console, but I'd like to understand why it's happening.

Does anyone have any insight into what's causing this? Or what has changed to cause it to start happening?