feat(web): sidebar layout setting and fixes for threads waiting on you

apps/web/src/appInit.tsx

@@ -20,6 +20,7 @@ import { startMainAppLocationTracking } from "./components/sidebar/mainAppLocati
 import { startDesktopUpdateLaunchNotice } from "./components/sidebar/updateEverythingRun";
 import { startSlowRpcRequestToasts } from "./components/SlowRpcRequestToastCoordinator";
 import { startThreadNotifications } from "./components/ThreadNotificationCoordinator";
+import { waitingOnYouCountAtom } from "./components/sidebar/variants/sidebarVariant.logic";
 import { startGuideRunNotifications } from "./components/pullRequest/guide/PullRequestGuideRunCoordinator";
 import { APP_BASE_NAME, APP_DISPLAY_NAME, APP_STAGE_LABEL } from "./branding";
 import { resolveServerBackedAppDisplayName } from "./branding.logic";
@@ -117,19 +118,48 @@ function startClientAppearance(): void {
   apply();
 }
 
+const waitingThreadCountAtom = waitingOnYouCountAtom(environmentThreadShells);
+
 function startDocumentTitle(): void {
+  let name = document.title;
+  let waiting = 0;
+  let stopCounting: (() => void) | null = null;
+  const apply = () => {
+    document.title = waiting > 0 ? `(${waiting}) ${name}` : name;
+  };
+  const applySetting = () => {
+    const enabled = getClientSettings().windowTitleWaitingCount;
+    if (enabled && stopCounting === null) {
+      stopCounting = appAtomRegistry.subscribe(
+        waitingThreadCountAtom,
+        (count) => {
+          waiting = count;
+          apply();
+        },
+        { immediate: true },
+      );
+    } else if (!enabled && stopCounting !== null) {
+      stopCounting();
+      stopCounting = null;
+      waiting = 0;
+      apply();
+    }
+  };
+  subscribeClientSettings(applySetting);
   appAtomRegistry.subscribe(
     primaryServerConfigAtom,
     (config) => {
-      document.title = resolveServerBackedAppDisplayName({
+      name = resolveServerBackedAppDisplayName({
         baseName: APP_BASE_NAME,
         fallbackDisplayName: APP_DISPLAY_NAME,
         fallbackStageLabel: APP_STAGE_LABEL,
         primaryServerVersion: config?.environment.serverVersion ?? null,
       });
+      apply();
     },
     { immediate: true },
   );
+  applySetting();
 }
 
 /**

apps/web/src/components/ChatView.tsx

@@ -308,6 +308,7 @@ import {
   getThreadErrorBannerKey,
   isThreadErrorBannerDismissedForSession,
   shouldShowThreadErrorBanner,
+  threadFailureIsShownElsewhere,
 } from "./chat/ThreadErrorBanner";
 import { QueuedRunsControl, type QueuedRunsControlHandle } from "./chat/QueuedRunsControl";
 import { useThreadLinkedPullRequest } from "./pullRequest/useThreadLinkedPullRequest";
@@ -997,7 +998,10 @@ export default function ChatView(props: ChatViewProps) {
     snoozedUntil: activeThreadShell?.snoozedUntil,
   });
   const timelineThreadError =
-    limitRecoveryRun !== null && visibleThreadError === serverRuntime?.lastError
+    serverRuntime?.status === "failed" &&
+    threadFailureIsShownElsewhere(serverRuntime.lastErrorClass, serverRuntime.lastErrorCode) &&
+    activeThreadShell?.latestRun &&
+    visibleThreadError === serverRuntime.lastError
       ? null
       : visibleThreadError;
 
@@ -1799,6 +1803,15 @@ export default function ChatView(props: ChatViewProps) {
     composerRef.current?.focusAtEnd();
   };
   const focusComposerStable = useStableCallback(focusComposer);
+  // why: the number keys pick a question's option only while focus is outside the answer box.
+  const focusComposerUnlessQuestionWaits = useStableCallback(() => {
+    if (
+      !activePendingProgress?.activeQuestion ||
+      activePendingUserInput?.responseCapability === "not_resumable"
+    ) {
+      focusComposer();
+    }
+  });
   const canInterruptRunningThread =
     canOperateThread && deriveCanInterruptRunningThread(activeThread !== undefined, activeRuntime);
   const onInterrupt = async () => {
@@ -2117,12 +2130,12 @@ export default function ChatView(props: ChatViewProps) {
   useEffect(() => {
     if (embedded || !activeThread?.id || terminalUiState.terminalOpen) return;
     const frame = window.requestAnimationFrame(() => {
-      focusComposerStable();
+      focusComposerUnlessQuestionWaits();
     });
     return () => {
       window.cancelAnimationFrame(frame);
     };
-  }, [activeThread?.id, embedded, focusComposerStable, terminalUiState.terminalOpen]);
+  }, [activeThread?.id, embedded, focusComposerUnlessQuestionWaits, terminalUiState.terminalOpen]);
 
   // oxlint-disable-next-line t3code/no-unreasoned-state-sync -- window focus listener that refocuses the composer after the window regains focus
   useEffect(() => {
@@ -2139,7 +2152,7 @@ export default function ChatView(props: ChatViewProps) {
             !isInSideChatPane(document.activeElement) &&
             shouldRefocusComposerOnWindowFocus(document.activeElement)
           ) {
-            focusComposerStable();
+            focusComposerUnlessQuestionWaits();
           }
         });
       });
@@ -2152,7 +2165,7 @@ export default function ChatView(props: ChatViewProps) {
   }, [
     activeThread?.id,
     embedded,
-    focusComposerStable,
+    focusComposerUnlessQuestionWaits,
     isMobileViewport,
     terminalUiState.terminalOpen,
   ]);

apps/web/src/components/CommandPaletteResults.tsx

@@ -186,9 +186,7 @@ function ThreadRowContext({
     .filter((part) => part && part !== item.matchHint?.text)
     .join(" · ");
   return context ? (
-    <span className="max-w-[45%] shrink-0 truncate text-muted-foreground/70 text-xs">
-      {context}
-    </span>
+    <span className="max-w-[45%] shrink-0 truncate text-muted-foreground text-xs">{context}</span>
   ) : null;
 }
 
@@ -210,9 +208,7 @@ function DisabledCommandPaletteResultRow(props: {
           ) : props.item.matchHint ? (
             <SearchMatchHintLine hint={props.item.matchHint} />
           ) : props.item.description ? (
-            <span className="min-w-0 text-muted-foreground/70 text-xs">
-              {props.item.description}
-            </span>
+            <span className="min-w-0 text-muted-foreground text-xs">{props.item.description}</span>
           ) : null}
         </span>
       ) : (
@@ -272,9 +268,7 @@ function CommandPaletteResultRow(props: {
           ) : props.item.matchHint ? (
             <SearchMatchHintLine hint={props.item.matchHint} />
           ) : props.item.description ? (
-            <span className="min-w-0 text-muted-foreground/70 text-xs">
-              {props.item.description}
-            </span>
+            <span className="min-w-0 text-muted-foreground text-xs">{props.item.description}</span>
           ) : null}
         </span>
       ) : (
@@ -293,13 +287,13 @@ function CommandPaletteResultRow(props: {
         />
       ) : null}
       {props.item.timestamp ? (
-        <span className="min-w-12 shrink-0 text-right text-xs tabular-nums text-muted-foreground/70">
+        <span className="min-w-12 shrink-0 text-right text-xs tabular-nums text-muted-foreground">
           {props.item.timestamp}
         </span>
       ) : null}
       {shortcutLabel ? <CommandShortcut>{shortcutLabel}</CommandShortcut> : null}
       {props.item.kind === "submenu" ? (
-        <ChevronRightIcon className="-me-0.5 ms-auto size-4 shrink-0 text-muted-foreground/70" />
+        <ChevronRightIcon className="-me-0.5 ms-auto size-4 shrink-0 text-muted-foreground" />
       ) : null}
     </CommandItem>
   );

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

@@ -284,6 +284,18 @@ describe("resolveSidebarThreadStatus", () => {
     ).toBe(false);
   });
 
+  it("never recedes a thread waiting on approval, even once read", () => {
+    expect(
+      shouldRecedeSidebarThread({
+        status: "approval",
+        isUnread: false,
+        isWoke: false,
+        isActive: false,
+        isSelected: false,
+      }),
+    ).toBe(false);
+  });
+
   it("reports worktree setup as preparing, and failed only while the latest run failed", () => {
     expect(
       resolveSidebarThreadStatus({

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

@@ -834,6 +834,7 @@ export function shouldRecedeSidebarThread(input: {
   if (
     input.isActive ||
     input.isSelected ||
+    input.status === "approval" ||
     input.status === "input" ||
     input.status === "request"
   ) {
@@ -842,7 +843,7 @@ export function shouldRecedeSidebarThread(input: {
   if (input.status === "preparing" || input.status === "working" || input.status === "waiting") {
     return true;
   }
-  if (input.status === "ready" || input.status === "approval") {
+  if (input.status === "ready") {
     return !input.isUnread && !input.isWoke;
   }
   return false;