Add refresh URL to reused default segments

When segment is reused in the "default" parallel route slot, it is
not part of the new page. So if the page is refreshed, we must fetch
its data from the previous URL, not the new URL. To track this we add
the previous URL to a special field in the FlightRouterState.

Currently this field is added by addRefreshMarkerToActiveParallelSegments;
this updates the "ppr-navigations" module to add it during the main
traversal used by navigations, so we can eventually get rid
addRefreshMarkerToActiveParallelSegments.

Note that we don't need to add the marker to _all_ page segments, just
the ones that are not part of the new page.

Author: acdlite

packages/next/src/client/components/router-reducer/ppr-navigations.ts

@@ -91,6 +91,7 @@ export type Task = SPANavigationTask | MPANavigationTask
 // can be reused without initiating a server request.
 export function startPPRNavigation(
   navigatedAt: number,
+  oldUrl: URL,
   oldCacheNode: CacheNode,
   oldRouterState: FlightRouterState,
   newRouterState: FlightRouterState,
@@ -103,6 +104,7 @@ export function startPPRNavigation(
   const segmentPath: Array<FlightSegmentPath> = []
   return updateCacheNodeOnNavigation(
     navigatedAt,
+    oldUrl,
     oldCacheNode,
     oldRouterState,
     newRouterState,
@@ -118,6 +120,7 @@ export function startPPRNavigation(
 
 function updateCacheNodeOnNavigation(
   navigatedAt: number,
+  oldUrl: URL,
   oldCacheNode: CacheNode,
   oldRouterState: FlightRouterState,
   newRouterState: FlightRouterState,
@@ -230,7 +233,7 @@ function updateCacheNodeOnNavigation(
         // Reuse the existing Router State for this segment. We spawn a "task"
         // just to keep track of the updated router state; unlike most, it's
         // already fulfilled and won't be affected by the dynamic response.
-        taskChild = spawnReusedTask(oldRouterStateChild)
+        taskChild = reuseActiveSegmentInDefaultSlot(oldUrl, oldRouterStateChild)
       } else {
         // There's no currently active segment. Switch to the "create" path.
         taskChild = beginRenderingNewRouteTree(
@@ -299,6 +302,7 @@ function updateCacheNodeOnNavigation(
         // the children.
         taskChild = updateCacheNodeOnNavigation(
           navigatedAt,
+          oldUrl,
           oldCacheNodeChild,
           oldRouterStateChild,
           newRouterStateChild,
@@ -726,9 +730,37 @@ function spawnPendingTask(
   return newTask
 }
 
-function spawnReusedTask(reusedRouterState: FlightRouterState): Task {
-  // Create a task that reuses an existing segment, e.g. when reusing
-  // the current active segment in place of a default route.
+function reuseActiveSegmentInDefaultSlot(
+  oldUrl: URL,
+  oldRouterState: FlightRouterState
+): Task {
+  // This is a "default" segment. These are never sent by the server during a
+  // soft navigation; instead, the client reuses whatever segment was already
+  // active in that slot on the previous route. This means if we later need to
+  // refresh the segment, it will have to be refetched from the previous route's
+  // URL. We store it in the Flight Router State.
+  //
+  // TODO: We also mark the segment with a "refresh" marker but I think we can
+  // get rid of that eventually by making sure we only add URLs to page segments
+  // that are reused. Then the presence of the URL alone is enough.
+  let reusedRouterState
+
+  const oldRefreshMarker = oldRouterState[3]
+  if (oldRefreshMarker === 'refresh') {
+    // This segment was already reused from an even older route. Keep its
+    // existing URL and refresh marker.
+    reusedRouterState = oldRouterState
+  } else {
+    // This segment was not previously reused, and it's not on the new route.
+    // So it must have been delivered in the old route.
+    reusedRouterState = patchRouterStateWithNewChildren(
+      oldRouterState,
+      oldRouterState[1]
+    )
+    reusedRouterState[2] = oldUrl.href
+    reusedRouterState[3] = 'refresh'
+  }
+
   return {
     route: reusedRouterState,
     node: null,

packages/next/src/client/components/router-reducer/reducers/navigate-reducer.ts

@@ -267,13 +267,14 @@ export function navigateReducer(
         return handleExternalUrl(state, mutable, flightData, pendingPush)
       }
 
+      const oldCanonicalUrl = state.canonicalUrl
       const updatedCanonicalUrl = canonicalUrlOverride
         ? createHrefFromUrl(canonicalUrlOverride)
         : href
 
       const onlyHashChange =
         !!hash &&
-        state.canonicalUrl.split('#', 1)[0] ===
+        oldCanonicalUrl.split('#', 1)[0] ===
           updatedCanonicalUrl.split('#', 1)[0]
 
       // If only the hash has changed, the server hasn't sent us any new data. We can just update
@@ -339,6 +340,7 @@ export function navigateReducer(
           ) {
             const task = startPPRNavigation(
               navigatedAt,
+              new URL(oldCanonicalUrl, url.origin),
               currentCache,
               currentTree,
               treePatch,