Fix stale thread route recovery (#170)

* fix(web): recover stale thread routes

* fix(web): keep stale routes out of sidebar state

* fix(web): keep bootstrap from racing route recovery

* test(web): serialize shared event router fixtures

* test(web): disable concurrent stable browser cases

* fix(web): recover deleted routes from shell events

* test(web): serialize stable browser state

* test(web): run stateful event case before fixture mutations

Author: redxzeta

apps/web/src/components/EventRouter.browser.tsx

@@ -351,13 +351,16 @@ const worker = setupWorker(
 );
 
 async function mountApp(options?: {
+  initialEntry?: string;
   routeThreadId?: ThreadId;
   waitForThreadId?: ThreadId | null;
-}): Promise<{ cleanup: () => Promise<void> }> {
+}): Promise<{ cleanup: () => Promise<void>; router: ReturnType<typeof getRouter> }> {
   const host = createFullscreenTestHost();
 
   const routeThreadId = options?.routeThreadId ?? THREAD_ID;
-  const router = getRouter(createMemoryHistory({ initialEntries: [`/${routeThreadId}`] }));
+  const router = getRouter(
+    createMemoryHistory({ initialEntries: [options?.initialEntry ?? `/${routeThreadId}`] }),
+  );
   const screen = await render(<RouterProvider router={router} />, { container: host });
 
   try {
@@ -391,6 +394,7 @@ async function mountApp(options?: {
   let cleanedUp = false;
 
   return {
+    router,
     cleanup: async () => {
       if (cleanedUp) return;
       cleanedUp = true;
@@ -444,7 +448,10 @@ function sendShellEventPush(event: OrchestrationShellStreamItem) {
   sendEffectRpcChunk(shellStreamClient, shellStreamRequestId, event);
 }
 
-describe("EventRouter scoped orchestration sync", () => {
+// This file drives one browser app, WebSocket mock, and projection fixture. Keep
+// the cases serialized: several intentionally advance the fixture while their
+// route/stream assertions are pending, which is not safe to overlap.
+describe.sequential("EventRouter scoped orchestration sync", () => {
   beforeAll(async () => {
     fixture = buildFixture();
     await worker.start({
@@ -522,6 +529,133 @@ describe("EventRouter scoped orchestration sync", () => {
     }
   });
 
+  it("keeps a live assistant intro when a lagging thread snapshot arrives right after it", async () => {
+    await assertLiveAssistantIntroSurvivesLaggingSnapshot();
+  });
+
+  it("recovers a stale remembered route without opening a missing detail subscription", async () => {
+    const staleThreadId = ThreadId.makeUnsafe("thread-stale-route");
+    localStorage.setItem(
+      "synara:sidebar-ui:v1",
+      JSON.stringify({
+        chatSectionExpanded: true,
+        chatThreadListExtraPages: 2,
+        projectThreadListExtraPagesByCwd: { "/repo/project": 1 },
+        dismissedThreadStatusKeyByThreadId: {},
+        lastThreadRoute: { threadId: staleThreadId },
+        activityViewEnabled: false,
+      }),
+    );
+    const consoleError = vi.spyOn(console, "error").mockImplementation(() => {});
+    const mounted = await mountApp({ routeThreadId: staleThreadId, waitForThreadId: null });
+
+    try {
+      await vi.waitFor(
+        () => {
+          expect(mounted.router.state.location.pathname).not.toBe(`/${staleThreadId}`);
+          expect(
+            JSON.parse(localStorage.getItem("synara:sidebar-ui:v1") ?? "null")?.lastThreadRoute,
+          ).toBeNull();
+        },
+        { timeout: 4_000, interval: 16 },
+      );
+      await new Promise((resolve) => window.setTimeout(resolve, 120));
+      expect(subscribeThreadRequestCountById.get(staleThreadId)).toBeUndefined();
+      expect(consoleError).not.toHaveBeenCalled();
+    } finally {
+      consoleError.mockRestore();
+      await mounted.cleanup();
+    }
+  });
+
+  it("restores a valid remembered thread from the root route", async () => {
+    localStorage.setItem(
+      "synara:sidebar-ui:v1",
+      JSON.stringify({
+        lastThreadRoute: { threadId: THREAD_ID },
+      }),
+    );
+    const mounted = await mountApp({ initialEntry: "/" });
+
+    try {
+      await vi.waitFor(
+        () => {
+          expect(mounted.router.state.location.pathname).toBe(`/${THREAD_ID}`);
+          expect(subscribeThreadRequestCountById.get(THREAD_ID)).toBeGreaterThanOrEqual(1);
+        },
+        { timeout: 4_000, interval: 16 },
+      );
+    } finally {
+      await mounted.cleanup();
+    }
+  });
+
+  it("clears a missing remembered thread while resolving the root route", async () => {
+    const staleThreadId = ThreadId.makeUnsafe("thread-stale-root-restore");
+    localStorage.setItem(
+      "synara:sidebar-ui:v1",
+      JSON.stringify({
+        chatSectionExpanded: true,
+        lastThreadRoute: { threadId: staleThreadId },
+      }),
+    );
+    const mounted = await mountApp({ initialEntry: "/", waitForThreadId: null });
+
+    try {
+      await vi.waitFor(
+        () => {
+          expect(
+            JSON.parse(localStorage.getItem("synara:sidebar-ui:v1") ?? "null")?.lastThreadRoute,
+          ).toBeNull();
+          expect(mounted.router.state.location.pathname).not.toBe(`/${staleThreadId}`);
+        },
+        { timeout: 4_000, interval: 16 },
+      );
+      expect(subscribeThreadRequestCountById.get(staleThreadId)).toBeUndefined();
+    } finally {
+      await mounted.cleanup();
+    }
+  });
+
+  it("stops leasing a deleted route and clears its remembered location after recovery", async () => {
+    localStorage.setItem(
+      "synara:sidebar-ui:v1",
+      JSON.stringify({
+        lastThreadRoute: { threadId: THREAD_ID },
+      }),
+    );
+    const mounted = await mountApp();
+
+    try {
+      const subscribeCountBeforeDelete = subscribeThreadRequestCountById.get(THREAD_ID) ?? 0;
+      fixture.snapshot = {
+        ...fixture.snapshot,
+        snapshotSequence: 2,
+        threads: [],
+      };
+      sendShellEventPush({
+        kind: "thread-removed",
+        sequence: 2,
+        threadId: THREAD_ID,
+      });
+
+      await vi.waitFor(
+        () => {
+          expect(mounted.router.state.location.pathname).not.toBe(`/${THREAD_ID}`);
+          expect(
+            JSON.parse(localStorage.getItem("synara:sidebar-ui:v1") ?? "null")?.lastThreadRoute,
+          ).toBeNull();
+        },
+        { timeout: 5_000, interval: 16 },
+      );
+      await new Promise((resolve) => window.setTimeout(resolve, 120));
+      expect(subscribeThreadRequestCountById.get(THREAD_ID)).toBe(subscribeCountBeforeDelete);
+    } finally {
+      fixture = buildFixture();
+      await mounted.cleanup();
+    }
+  });
+
   it("drops duplicate thread events after the thread snapshot sequence advances", async () => {
     const mounted = await mountApp();
 
@@ -1919,7 +2053,7 @@ describe("EventRouter scoped orchestration sync", () => {
     }
   });
 
-  it("keeps a live assistant intro when a lagging thread snapshot arrives right after it", async () => {
+  async function assertLiveAssistantIntroSurvivesLaggingSnapshot() {
     const mounted = await mountApp();
 
     try {
@@ -1997,5 +2131,5 @@ describe("EventRouter scoped orchestration sync", () => {
       fixture = buildFixture();
       await mounted.cleanup();
     }
-  });
+  }
 });

apps/web/src/components/RestoreOrCreateChatRoute.tsx

@@ -40,12 +40,15 @@ export type RestoreRouteResolver = (input: RestoreRouteResolverInput) => LastThr
 export function RestoreOrCreateChatRoute({
   resolveRestoreRoute,
   createFreshChat,
+  onUnrestorableRememberedRoute,
 }: {
   // Surface-specific policy for picking the thread route to restore (e.g. the last-visited route
   // for home chats, the latest Studio thread or draft for Studio). The remembered-route recovery
   // below still keys off the total thread count, which is shared across surfaces.
   readonly resolveRestoreRoute: RestoreRouteResolver;
   readonly createFreshChat: () => Promise<StartContainerChatResult>;
+  /** Called only after hydration/recovery has made fallback authoritative. */
+  readonly onUnrestorableRememberedRoute?: (route: LastThreadRoute) => void;
 }) {
   const navigate = useNavigate();
   const threadsHydrated = useStore((store) => store.threadsHydrated);
@@ -150,6 +153,9 @@ export function RestoreOrCreateChatRoute({
       if (cancelled || createFreshChatInFlightRef.current) {
         return;
       }
+      if (lastThreadRoute) {
+        onUnrestorableRememberedRoute?.(lastThreadRoute);
+      }
       createFreshChatInFlightRef.current = true;
       // .finally instead of try/finally: React Compiler does not yet support
       // try/finally and would skip optimizing this whole component.
@@ -170,6 +176,7 @@ export function RestoreOrCreateChatRoute({
     createFreshChat,
     emptyRestoreRecoveryState,
     navigate,
+    onUnrestorableRememberedRoute,
     resolveRestoreRoute,
     splitViewIds,
     splitViewsHydrated,

apps/web/src/components/Sidebar.tsx

@@ -1342,6 +1342,7 @@ export default function Sidebar(props: {
   );
   const activeSpaceId = resolveActiveSpaceId(storedActiveSpaceId, spaces, pendingActiveSpaceId);
   const threadsHydrated = useStore((store) => store.threadsHydrated);
+  const serverThreadIds = useStore((store) => store.threadIds);
   const sidebarThreadSummaryById = useStore((store) => store.sidebarThreadSummaryById);
   const syncServerShellSnapshot = useStore((store) => store.syncServerShellSnapshot);
   const markThreadVisited = useStore((store) => store.markThreadVisited);
@@ -1656,6 +1657,15 @@ export default function Sidebar(props: {
   const routeActiveSidebarThreadId = routeThreadId;
   const activeSidebarThreadId = optimisticActiveThreadId ?? routeActiveSidebarThreadId;
   const visualActiveSidebarThreadId = optimisticActiveThreadId ?? routeThreadId;
+  // The router exposes params before shell hydration has proven that they refer
+  // to a thread. Persisting every param lets a stale URL win the recovery race:
+  // the route clears its remembered target, then the sidebar writes that same
+  // invalid target back on its deferred route-sync pass. Local drafts are valid
+  // before their first shell row, so they remain eligible restore targets.
+  const routeThreadIsKnown =
+    routeThreadId !== null &&
+    (serverThreadIds?.includes(routeThreadId) === true ||
+      draftThreadsByThreadId[routeThreadId] !== undefined);
   const selectSidebarThreads = useMemo(() => createSidebarThreadSummariesSelector(), []);
   const hideAutomationRunThreads = !appSettings.showAutomationRunThreads;
   const selectSidebarTreeThreads = useMemo(
@@ -4025,7 +4035,7 @@ export default function Sidebar(props: {
   ]);
 
   useEffect(() => {
-    if (isOnSettings || routeThreadId === null) {
+    if (isOnSettings || routeThreadId === null || !routeThreadIsKnown) {
       return;
     }
 
@@ -4045,7 +4055,7 @@ export default function Sidebar(props: {
       });
     }, 0);
     return () => window.clearTimeout(settle);
-  }, [isOnSettings, routeSearch.splitViewId, routeThreadId]);
+  }, [isOnSettings, routeSearch.splitViewId, routeThreadId, routeThreadIsKnown]);
 
   const handleThreadClick = useCallback(
     (event: MouseEvent, threadId: ThreadId, orderedProjectThreadIds: readonly ThreadId[]) => {

apps/web/src/components/Sidebar.uiState.test.ts

@@ -1,9 +1,11 @@
 import { afterEach, beforeEach, describe, expect, it } from "vitest";
 
 import {
+  clearLastThreadRouteIfMatches,
   normalizeSidebarProjectThreadListCwd,
   persistSidebarUiState,
   readSidebarUiState,
+  subscribeSidebarUiState,
 } from "./Sidebar.uiState";
 
 describe("Sidebar.uiState", () => {
@@ -14,6 +16,8 @@ describe("Sidebar.uiState", () => {
     Object.defineProperty(globalThis, "window", {
       configurable: true,
       value: {
+        addEventListener: () => {},
+        removeEventListener: () => {},
         localStorage: {
           clear: () => {
             storage.clear();
@@ -163,4 +167,48 @@ describe("Sidebar.uiState", () => {
       activityViewEnabled: false,
     });
   });
+
+  it("atomically clears only a matching remembered route and preserves unrelated state", () => {
+    persistSidebarUiState({
+      chatSectionExpanded: true,
+      chatThreadListExtraPages: 3,
+      projectThreadListExtraPagesByCwd: { "/repo": 2 },
+      dismissedThreadStatusKeyByThreadId: { "thread-other": "ready:turn-1" },
+      lastThreadRoute: { threadId: "thread-stale", splitViewId: "split-stale" },
+      activityViewEnabled: true,
+    });
+
+    expect(clearLastThreadRouteIfMatches("thread-other")).toBe(false);
+    expect(readSidebarUiState().lastThreadRoute?.threadId).toBe("thread-stale");
+    expect(clearLastThreadRouteIfMatches("thread-stale")).toBe(true);
+    expect(readSidebarUiState()).toEqual({
+      chatSectionExpanded: true,
+      chatThreadListExtraPages: 3,
+      projectThreadListExtraPagesByCwd: {
+        [normalizeSidebarProjectThreadListCwd("/repo")]: 2,
+      },
+      dismissedThreadStatusKeyByThreadId: { "thread-other": "ready:turn-1" },
+      lastThreadRoute: null,
+      activityViewEnabled: true,
+    });
+  });
+
+  it("notifies same-window sidebar consumers after a matching clear", () => {
+    persistSidebarUiState({
+      chatSectionExpanded: false,
+      chatThreadListExtraPages: 0,
+      projectThreadListExtraPagesByCwd: {},
+      dismissedThreadStatusKeyByThreadId: {},
+      lastThreadRoute: { threadId: "thread-stale" },
+      activityViewEnabled: false,
+    });
+    const observed: Array<ReturnType<typeof readSidebarUiState>> = [];
+    const unsubscribe = subscribeSidebarUiState((state) => observed.push(state));
+
+    expect(clearLastThreadRouteIfMatches("thread-stale")).toBe(true);
+    expect(observed).toHaveLength(1);
+    expect(observed[0]?.lastThreadRoute).toBeNull();
+
+    unsubscribe();
+  });
 });

apps/web/src/components/Sidebar.uiState.ts

@@ -18,6 +18,8 @@ export type SidebarUiState = {
   activityViewEnabled: boolean;
 };
 
+const sameWindowListeners = new Set<(state: SidebarUiState) => void>();
+
 const DEFAULT_SIDEBAR_UI_STATE: SidebarUiState = {
   chatSectionExpanded: false,
   chatThreadListExtraPages: 0,
@@ -153,13 +155,17 @@ export function subscribeSidebarUiState(listener: (state: SidebarUiState) => voi
     if (event.key !== SIDEBAR_UI_STATE_STORAGE_KEY) return;
     listener(readSidebarUiState());
   };
+  sameWindowListeners.add(listener);
   window.addEventListener("storage", handleStorage);
-  return () => window.removeEventListener("storage", handleStorage);
+  return () => {
+    sameWindowListeners.delete(listener);
+    window.removeEventListener("storage", handleStorage);
+  };
 }
 
-export function persistSidebarUiState(input: SidebarUiState): void {
+function writeSidebarUiState(input: SidebarUiState): boolean {
   if (typeof window === "undefined") {
-    return;
+    return false;
   }
 
   try {
@@ -187,7 +193,34 @@ export function persistSidebarUiState(input: SidebarUiState): void {
         activityViewEnabled: input.activityViewEnabled,
       }),
     );
+    return true;
   } catch {
     // Ignore storage errors so sidebar rendering keeps working when persistence is unavailable.
+    return false;
+  }
+}
+
+export function persistSidebarUiState(input: SidebarUiState): void {
+  writeSidebarUiState(input);
+}
+
+/**
+ * Atomically clears a stale remembered route without overwriting unrelated sidebar state.
+ * Storage events do not fire in the window that performed the write, so same-window consumers
+ * receive an explicit notification after the persisted compare-and-clear succeeds.
+ */
+export function clearLastThreadRouteIfMatches(threadId: string): boolean {
+  const current = readSidebarUiState();
+  if (current.lastThreadRoute?.threadId !== threadId) {
+    return false;
+  }
+
+  const next: SidebarUiState = { ...current, lastThreadRoute: null };
+  if (!writeSidebarUiState(next)) {
+    return false;
+  }
+  for (const listener of sameWindowListeners) {
+    listener(next);
   }
+  return true;
 }