`renderArgs.elements` is empty when navigating to the same route

In my app I sometimes have links from a route to the same route, but with different pathname. Those are forum Thread pages: one thread could link to another thread. In some previous versions renderArgs.elements seemed to be always present, so my workaround of doing:

renderArgs.elements[renderArgs.elements.length - 1] = 
  React.cloneElement(renderArgs.elements[renderArgs.elements.length - 1], {
    key: renderArgs.location.pathname
  })

seemed to work. It doesn’t seem to work anymore, because when navigating from a thread to another thread renderArgs.elements seems to be undefined. Could it be the case? If yes, perhaps could you propose any potential workaround for this case? My current workaround is creating a wrapper over Thread page component that would set a key on the wrapped Thread page — seems to work.

export default function ThreadPageWrapper() {
  const board = useSelector(({ chan }) => chan.board)
  const thread = useSelector(({ chan }) => chan.thread)
  return <ThreadPage key={`${board.id}/${thread.id}`}/>
}

ThreadPageWrapper.meta = ThreadPage.meta
ThreadPageWrapper.load = ThreadPage.load

[taion]

yeah, makes sense. i think something like the static container approach we have right now is the best possible without suspense, but it doesn’t fully work with redux.

suspense makes all of this much easier. some day…

[taion]

Ah, okay – in that place, elements is not necessarily defined. Reference https://github.com/4Catalyzer/found/blob/2b439b6f509c932f3a100f1deffed667b6dd55a6/src/createRender.js#L13-L34 – we could be in the “pending” or “error” branch. I’d just wrap your logic above in an if block.

If you were using createRender more-or-less directly to generate the render function to pass into one of the routers, then you could also just put the logic in renderFetched there, but it looks like you have enough custom logic that it’d probably be easier just to use the if (renderArgs.elements) in here.