Fog of war loading state on initial render

contributors.yml

@@ -298,6 +298,7 @@
 - nichtsam
 - nikeee
 - nilubisan
+- Nirva-Software
 - Nismit
 - nnhjs
 - noisypigeon

packages/react-router/__tests__/router/lazy-discovery-test.ts

@@ -999,9 +999,18 @@ describe("Lazy Route Discovery (Fog of War)", () => {
     expect(router.state.initialized).toBe(false);
     expect(router.state.matches.map((m) => m.route.id)).toEqual(["parent"]);
 
+    expect(router.state.navigation).toMatchObject({
+      state: "loading",
+      location: { pathname: "/parent/child" },
+    });
+
     loaderDfd.resolve("PARENT");
     expect(router.state.initialized).toBe(false);
     expect(router.state.matches.map((m) => m.route.id)).toEqual(["parent"]);
+    expect(router.state.navigation).toMatchObject({
+      state: "loading",
+      location: { pathname: "/parent/child" },
+    });
 
     childrenDfd.resolve([
       {
@@ -1012,8 +1021,17 @@ describe("Lazy Route Discovery (Fog of War)", () => {
     ]);
     expect(router.state.initialized).toBe(false);
     expect(router.state.matches.map((m) => m.route.id)).toEqual(["parent"]);
+    expect(router.state.navigation).toMatchObject({
+      state: "loading",
+      location: { pathname: "/parent/child" },
+    });
 
     childLoaderDfd.resolve("CHILD");
+
+    expect(router.state.navigation).toMatchObject({
+      state: "loading",
+      location: { pathname: "/parent/child" },
+    });
     await tick();
     expect(router.state.initialized).toBe(true);
     expect(router.state.location.pathname).toBe("/parent/child");
@@ -1025,6 +1043,7 @@ describe("Lazy Route Discovery (Fog of War)", () => {
       "parent",
       "child",
     ]);
+    expect(router.state.navigation).toMatchObject(IDLE_NAVIGATION);
   });
 
   it("discovers routes during initial SPA renders when a splat route matches", async () => {

packages/react-router/lib/router/router.ts

@@ -2087,6 +2087,8 @@ export function createRouter(init: RouterInit): Router {
             flushSync,
           },
         );
+      } else if (initialMatchesIsFOW) {
+        updateState({ navigation: loadingNavigation }, { flushSync });
       }
 
       let discoverResult = await discoverRoutes(