@cueloop/client 0.1.0-alpha.72 → 0.1.0-alpha.74

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cueloop/client",
-  "version": "0.1.0-alpha.72",
+  "version": "0.1.0-alpha.74",
   "description": "The cueloop review UI: projection renderer, keyboard grammar, review rail",
   "homepage": "https://github.com/mmurakaru/cueloop#readme",
   "bugs": {
@@ -27,10 +27,10 @@
     "access": "public"
   },
   "dependencies": {
-    "@cueloop/daemon": "0.1.0-alpha.72",
-    "@cueloop/extension-api": "0.1.0-alpha.72",
-    "@cueloop/integration-obsidian": "0.1.0-alpha.72",
-    "@cueloop/schema": "0.1.0-alpha.72",
+    "@cueloop/daemon": "0.1.0-alpha.74",
+    "@cueloop/extension-api": "0.1.0-alpha.74",
+    "@cueloop/integration-obsidian": "0.1.0-alpha.74",
+    "@cueloop/schema": "0.1.0-alpha.74",
     "@opentui/core": "^0.5.8",
     "@opentui/keymap": "0.5.8",
     "@opentui/react": "^0.5.8",

package/src/App.tsx

@@ -9,7 +9,6 @@ import React, {
 import { useKeyboard, useRenderer, useTerminalDimensions } from "@opentui/react";
 import type { Clock } from "@opentui/core";
 import { marksByDisplay, type Mark } from "./view-plan";
-import { dimmedTheme } from "./theme";
 import {
   DEFAULT_KEYS,
   DEFAULT_QUICK_ACTIONS,
@@ -44,11 +43,12 @@ import { groupInbox, projectName, threadTitle } from "./components/session-tree"
 import { ThreadTree } from "./components/ThreadTree";
 import { ChangesFileTree } from "./components/ChangesColumn";
 import { ProjectTreeView } from "./components/ProjectTreeView";
-import { AnnotatableFileView } from "./components/AnnotatableFileView";
 import { AppShell, type ProjectPanelMode } from "./components/AppShell";
 import { EditorGrid } from "./components/EditorGrid";
-import type { EditorTab } from "./components/editor-grid";
+import { GridTabContent } from "./components/GridTabContent";
 import { useChangesWorkbench } from "./use-changes-workbench";
+import { useRememberLayout } from "./use-remember-layout";
+import type { LaunchLayout } from "./launch-layout";
 import { ThreadFooter } from "./components/ThreadFooter";
 import { ConfirmCard } from "./components/ConfirmCard";
 import { THREAD_VIEW_CHEATSHEET, ThreadView } from "./components/ThreadView";
@@ -59,14 +59,10 @@ import {
   THREAD_CHORD_ENTRIES,
   TREE_CHORD_ENTRIES,
 } from "./thread-chords";
-import {
-  DiffContentView,
-  type DiffFoldControls,
-  type DiffContentViewProps,
-} from "./components/DiffContentView";
-import { commentCountsByFile, fileTargetMarks, marksByRows, type DiffRow } from "./view-diff";
-import { annotationTarget, type Anchor } from "@cueloop/schema";
-import type { DiffFileContents, Thread } from "@cueloop/schema";
+import { type DiffFoldControls } from "./components/DiffContentView";
+import { commentCountsByFile } from "./view-diff";
+import { annotationTarget } from "@cueloop/schema";
+import type { Artifact, DiffFileContents, Thread } from "@cueloop/schema";
 import { PrototypePixels } from "./prototype-pixels";
 import type { PrototypeElement } from "./prototype-browser";
 import {
@@ -127,6 +123,10 @@ export interface AppProps {
    * light-on-light. Defaults to dark - the historical assumption.
    */
   appearance?: Appearance;
+  /** The pane composition to open in; a create-command sets it, a bare launch restores the remembered one. */
+  layout?: LaunchLayout;
+  /** Serve mode: the frozen working-tree diff an observer reads for the served workbench thread. */
+  servedArtifact?: Artifact;
 }
 
 /** True while the drop-up or one of its dialogs is open and owns the keyboard. */
@@ -144,163 +144,6 @@ function canSubmitReview(isOwner: boolean, resolved: boolean, observer: boolean)
   return isOwner && !resolved && !observer;
 }
 
-/** The inline-commenting props the diff sheet shares with the thread view, wired once by the app. */
-type DiffSurfaceProps = Pick<
-  DiffContentViewProps,
-  | "session"
-  | "quickActions"
-  | "observer"
-  | "commentsEnabled"
-  | "resolved"
-  | "suspended"
-  | "onComposingChange"
-  | "onObserverBlocked"
-  | "onCursorChange"
-  | "focusedAnnotationId"
-  | "onFocusAnnotation"
-  | "onAnnotate"
-  | "onReply"
-  | "onUpdateAnnotation"
-  | "onExit"
->;
-
-/** The Changes tab body: the whole diff in one scroll container, or a bare hint when nothing changed. */
-function ChangesTabBody(props: {
-  rows: DiffRow[];
-  surface: DiffSurfaceProps;
-  rejectedRows: Set<number>;
-  fold?: DiffFoldControls;
-  fileStats?: ReadonlyMap<string, { additions: number; deletions: number }>;
-  split?: boolean;
-  dimmed: boolean;
-  theme: Theme;
-}): React.ReactNode {
-  const annotations = props.surface.session.annotations;
-  // a diff thread's Changes view is the artifact itself; any other thread's is the working-tree diff,
-  // whose notes carry a file target and resolve per file - each surface paints only its own notes
-  const forArtifact = props.surface.session.artifact.type === "diff";
-  const marks = useMemo(
-    () =>
-      forArtifact
-        ? marksByRows(
-            annotations.filter((annotation) => annotationTarget(annotation).kind === "artifact"),
-            props.rows,
-            props.surface.focusedAnnotationId,
-          )
-        : fileTargetMarks(annotations, props.rows, props.surface.focusedAnnotationId),
-    [annotations, forArtifact, props.rows, props.surface.focusedAnnotationId],
-  );
-
-  if (props.rows.length === 0) {
-    return (
-      <box style={{ flexGrow: 1, paddingLeft: 1, paddingTop: 1 }}>
-        <text fg={props.theme.textDim}>No changes</text>
-      </box>
-    );
-  }
-
-  return (
-    <DiffContentView
-      rows={props.rows}
-      marks={marks}
-      {...props.surface}
-      rejectedRows={props.rejectedRows}
-      fold={props.fold}
-      fileStats={props.fileStats}
-      split={props.split}
-      theme={props.dimmed ? dimmedTheme(props.theme) : undefined}
-    />
-  );
-}
-
-/** An editor tab's body: the whole diff for the Changes tab, a file's diff or contents for a file tab. */
-function GridTabContent(props: {
-  tab: EditorTab;
-  rows: DiffRow[];
-  surface: DiffSurfaceProps;
-  rejectedRows: Set<number>;
-  fold?: DiffFoldControls;
-  fileStats?: ReadonlyMap<string, { additions: number; deletions: number }>;
-  split?: boolean;
-  dimmed: boolean;
-  readFile: (path: string) => Promise<string | null>;
-  /** Persist a comment on a project file; the file view built the anchor against its own lines. */
-  onAddFileComment: (path: string, anchor: Anchor, body: string) => void;
-  theme: Theme;
-}): React.ReactNode {
-  const { tab } = props;
-  if (tab.kind === "file" && tab.fileView === "contents" && tab.path !== undefined) {
-    const filePath = tab.path;
-
-    return (
-      <AnnotatableFileView
-        path={filePath}
-        loadContents={props.readFile}
-        session={props.surface.session}
-        quickActions={props.surface.quickActions}
-        observer={props.surface.observer}
-        resolved={props.surface.resolved}
-        suspended={props.surface.suspended}
-        focusedAnnotationId={props.surface.focusedAnnotationId}
-        onFocusAnnotation={props.surface.onFocusAnnotation}
-        onComposingChange={props.surface.onComposingChange}
-        onCursorChange={props.surface.onCursorChange}
-        onObserverBlocked={props.surface.onObserverBlocked}
-        onAddComment={(anchor, body) => props.onAddFileComment(filePath, anchor, body)}
-        onReply={props.surface.onReply}
-        onUpdateAnnotation={props.surface.onUpdateAnnotation}
-        onExit={props.surface.onExit}
-        theme={props.theme}
-      />
-    );
-  }
-  if (tab.kind !== "file") {
-    return (
-      <ChangesTabBody
-        rows={props.rows}
-        surface={props.surface}
-        rejectedRows={props.rejectedRows}
-        fold={props.fold}
-        fileStats={props.fileStats}
-        split={props.split}
-        dimmed={props.dimmed}
-        theme={props.theme}
-      />
-    );
-  }
-  // a single-file tab shows that file's rows alone, so its row indices are its own: comments and
-  // the caret report back in whole-diff indices, and the fold controls (a band to fold) do not apply
-  const fileRowIndices = props.rows.flatMap((row, index) => (row.file === tab.path ? [index] : []));
-  const rows = fileRowIndices.map((index) => props.rows[index]!);
-  const wholeIndex = (rowIndex: number): number => fileRowIndices[rowIndex] ?? rowIndex;
-  const rejectedRows = new Set(
-    fileRowIndices.flatMap((index, rowIndex) => (props.rejectedRows.has(index) ? [rowIndex] : [])),
-  );
-
-  return (
-    <ChangesTabBody
-      rows={rows}
-      surface={{
-        ...props.surface,
-        onCursorChange: (rowIndex) => props.surface.onCursorChange?.(wholeIndex(rowIndex)),
-        onAnnotate: (span, body) =>
-          props.surface.onAnnotate(
-            {
-              start: { blockIndex: wholeIndex(span.start.blockIndex), char: span.start.char },
-              end: { blockIndex: wholeIndex(span.end.blockIndex), char: span.end.char },
-            },
-            body,
-          ),
-      }}
-      rejectedRows={rejectedRows}
-      fileStats={props.fileStats}
-      split={props.split}
-      dimmed={props.dimmed}
-      theme={props.theme}
-    />
-  );
-}
-
 /** The Project pane body: the resolved repo's changed files in changes mode, its full tree otherwise. */
 function ProjectPanelBody(props: {
   mode: ProjectPanelMode;
@@ -381,6 +224,14 @@ function cheatsheetFor(keyBindings: KeyBindings, threadViewActive: boolean): Che
   ];
 }
 
+/** The Threads sidebar opens from the launch layout; a bare launch opens it only on the inbox. */
+function initialThreadsOpen(
+  layout: LaunchLayout | undefined,
+  sessionId: string | undefined,
+): boolean {
+  return layout ? layout.threads : sessionId === undefined;
+}
+
 export function App({
   home,
   sessionId,
@@ -394,6 +245,8 @@ export function App({
   role = "owner",
   selfAuthor,
   appearance = "dark",
+  layout,
+  servedArtifact,
 }: AppProps): React.ReactNode {
   const { observer, isOwner } = computeRoleCapabilities(readOnly, role);
   const controller = useMemo(
@@ -407,6 +260,7 @@ export function App({
         clock,
         openClient,
         shareTransport,
+        servedArtifact,
       }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [home, sessionId],
@@ -461,9 +315,19 @@ export function App({
   // picking a thread keeps the sidebar as it was. It opens when the app lands with
   // nothing selected (pick a thread) and stays collapsed on a direct thread open,
   // where the thread owns the width.
-  const [sidebarOpen, setSidebarOpen] = useState(sessionId === undefined);
+  const [sidebarOpen, setSidebarOpen] = useState(() => initialThreadsOpen(layout, sessionId));
   // the Changes + Project right region and its editor grid (tabs, splits, zoom)
-  const workbench = useChangesWorkbench();
+  const workbench = useChangesWorkbench({ layout });
+  // only the session view persists from here; the bare shell owns its own (NoThreadShell), so this
+  // workbench stays inactive with no session and never clobbers what the shell saved
+  useRememberLayout(
+    layout,
+    session !== null,
+    sidebarOpen,
+    workbench.changesOpen,
+    workbench.projectOpen,
+    workbench.zoomed,
+  );
   const [mode, setMode] = useState<Mode>({ type: "normal" });
   // the top-left settings gear drop-down and the centered dialog it opens
   const [menuDialog, setMenuDialog] = useState<"keybinds" | "settings" | null>(null);
@@ -813,6 +677,7 @@ export function App({
             onRename={(id, title) => setMode({ type: "renameThread", sessionId: id, text: title })}
             quickActions={quickActions}
             onWelcomeComposingChange={setWelcomeComposing}
+            layout={layout}
           />
         </PaletteNamesContext.Provider>
       </SlashSkillsContext.Provider>

package/src/App.workbench.test.tsx

@@ -15,6 +15,8 @@ import { testRender } from "@opentui/react/test-utils";
 import { DaemonServer } from "@cueloop/daemon";
 import type { Thread } from "@cueloop/schema";
 import { App } from "./App";
+import { loadConfig } from "./config";
+import { planLayout, reviewLayout } from "./launch-layout";
 import {
   dragText,
   isolateUserConfig,
@@ -247,6 +249,29 @@ describe("the four-pane workbench", () => {
     expect(diffToggleColumn(setup)).toBeGreaterThan(0);
   });
 
+  test("a create-command session remembers its zoom toggle for the next bare launch", async () => {
+    // a create-command opens the review zoomed; toggling zoom off must persist to the remembered layout
+    const setup = await renderReadyApp(
+      <App home={home} sessionId={session.id} layout={reviewLayout()} />,
+      {
+        width: 160,
+        height: 20,
+      },
+    );
+    await waitForText(setup, "store.ts");
+
+    const zoom = locateText(setup, NERD.zoom);
+    await setup.mockMouse.click(zoom.column, zoom.row);
+    await waitForState(
+      setup,
+      () =>
+        loadConfig({ userConfigPath: process.env.CUELOOP_CONFIG }).ui.layout?.zoomChanges === false,
+    );
+    expect(loadConfig({ userConfigPath: process.env.CUELOOP_CONFIG }).ui.layout?.zoomChanges).toBe(
+      false,
+    );
+  });
+
   test("selecting a non-diff thread while zoomed exits zoom and restores the Thread pane", async () => {
     // a second, non-diff thread to navigate to; its sync has no Changes editor to fill a zoom
     server.core.sessionCreate({
@@ -303,11 +328,11 @@ describe("the four-pane workbench", () => {
     const setup = await renderApp();
 
     // the tip is not painted until the pointer is over the control
-    expect(setup.captureCharFrame()).not.toContain("Toggle Right Sidebar");
+    expect(setup.captureCharFrame()).not.toContain("Toggle Sidebar");
 
     await setup.mockMouse.moveTo(rightToggleColumn(setup), HEADER_ROW);
     // the label surfaces at the root, escaping the header cell that would otherwise clip it
-    await waitForText(setup, "Toggle Right Sidebar");
+    await waitForText(setup, "Toggle Sidebar");
   });
 });
 
@@ -396,6 +421,82 @@ describe("the bare-launch welcome shell", () => {
     expect(setup.captureCharFrame()).toContain("README.md");
   });
 
+  test("a review layout opens the Changes panel, listing the working-tree changes", async () => {
+    const setup = await testRender(
+      <App home={welcomeHome} sessionId={undefined} cwd={welcomeRepo} layout={reviewLayout()} />,
+      { width: 180, height: 14 },
+    );
+    await waitForText(setup, "README.md");
+    expect(setup.captureCharFrame()).toContain("README.md");
+  });
+
+  test("a plan layout opens with the right region closed, so no Changes panel shows", async () => {
+    const setup = await testRender(
+      <App home={welcomeHome} sessionId={undefined} cwd={welcomeRepo} layout={planLayout()} />,
+      { width: 180, height: 14 },
+    );
+    await waitForText(setup, "cueloop");
+    // rightSidebar "off": neither the Changes list nor the launch repo's files paint
+    expect(setup.captureCharFrame()).not.toContain("README.md");
+  });
+
+  test("a hand-edited off+zoom layout drops the zoom so the center is not stranded blank", async () => {
+    // zoom fills the middle with the Changes editor; with the region off there is none, so honoring zoom
+    // would hide the Thread pane over a blank center. The Thread placeholder must still render.
+    const setup = await testRender(
+      <App
+        home={welcomeHome}
+        sessionId={undefined}
+        cwd={welcomeRepo}
+        layout={{ threads: true, rightSidebar: "off", zoomChanges: true }}
+      />,
+      { width: 180, height: 14 },
+    );
+    await waitForText(setup, "no threads");
+    expect(setup.captureCharFrame()).toContain("no threads");
+  });
+
+  test("closing the right region on the vanilla shell remembers it for the next launch", async () => {
+    const setup = await testRender(
+      <App
+        home={welcomeHome}
+        sessionId={undefined}
+        cwd={welcomeRepo}
+        layout={{ threads: true, rightSidebar: "changes", zoomChanges: false }}
+      />,
+      { width: 180, height: 14 },
+    );
+    await waitForText(setup, "README.md");
+
+    // close the Changes/Project region; the remembered layout follows it to "off"
+    await setup.mockMouse.click(rightToggleColumn(setup), HEADER_ROW);
+    await waitForState(
+      setup,
+      () =>
+        loadConfig({ userConfigPath: process.env.CUELOOP_CONFIG }).ui.layout?.rightSidebar ===
+        "off",
+    );
+    expect(loadConfig({ userConfigPath: process.env.CUELOOP_CONFIG }).ui.layout).toEqual({
+      threads: true,
+      rightSidebar: "off",
+      zoomChanges: false,
+    });
+  });
+
+  test("clicking a changed file in the bare shell opens its diff, not its contents", async () => {
+    const setup = await renderWelcome();
+
+    await waitForText(setup, "README.md");
+    const readme = locateText(setup, "README.md");
+    await setup.mockMouse.click(readme.column, readme.row);
+
+    // a diff shows both the removed old line and the added new line; contents would show only the new
+    await waitForText(setup, "A tiny tracked repo.");
+    const frame = setup.captureCharFrame();
+    expect(frame).toContain("A tiny tracked repo.");
+    expect(frame).toContain("edited in the working tree");
+  });
+
   test("a bare launch rides a Welcome tab in the editor while the Thread pane waits empty", async () => {
     const setup = await renderWelcome();
 

package/src/app-screens.tsx

@@ -1,9 +1,11 @@
 import { ScrollArea } from "./components/ScrollArea";
-import React, { useEffect, useState, type Dispatch, type SetStateAction } from "react";
+import React, { useEffect, useMemo, useState, type Dispatch, type SetStateAction } from "react";
 import type { DiffFileContents, Thread, VerdictKind } from "@cueloop/schema";
 import { returnPaneFor } from "@cueloop/schema";
 import type { Theme } from "./theme";
 import type { QuickAction } from "./config";
+import type { LaunchLayout } from "./launch-layout";
+import { useRememberLayout } from "./use-remember-layout";
 import type { Mode, TreeAsk } from "./intent-dispatch";
 import type { Intent } from "./keymap";
 import type { ReviewController, ToastState } from "./thread-controller";
@@ -23,7 +25,8 @@ import { AppShell, type ProjectPanelMode } from "./components/AppShell";
 import { EditorGrid } from "./components/EditorGrid";
 import { ProjectTreeView } from "./components/ProjectTreeView";
 import { ChangesFileTree } from "./components/ChangesColumn";
-import { BareWorkbenchFileView } from "./components/BareWorkbenchFileView";
+import { BareWorkbenchFileView, draftThread } from "./components/BareWorkbenchFileView";
+import { GridTabContent, type DiffSurfaceProps } from "./components/GridTabContent";
 import { useChangesWorkbench } from "./use-changes-workbench";
 import { ConfirmDialog } from "./components/ConfirmDialog";
 import { PromptDialog } from "./components/PromptDialog";
@@ -88,15 +91,22 @@ export function MenuChrome(props: {
 }
 
 /** The welcome shell's Project pane: the launch repo's changed files in changes mode, its full tree otherwise. */
+/** A shared empty rejected-rows set: the bare-launch diff rejects nothing, and this keeps a stable ref. */
+const EMPTY_ROWS: Set<number> = new Set();
+
 function WelcomeProjectPanel({
   mode,
   controller,
-  onOpenFile,
+  onOpenChangedFile,
+  onOpenProjectFile,
   theme,
 }: {
   mode: ProjectPanelMode;
   controller: ReviewController;
-  onOpenFile: (path: string) => void;
+  /** Changes tree click -> open the file's working-tree diff. */
+  onOpenChangedFile: (path: string) => void;
+  /** Project tree click -> open the file's read-only contents. */
+  onOpenProjectFile: (path: string) => void;
   theme: Theme;
 }): React.ReactNode {
   const [changes, setChanges] = useState<readonly DiffFileContents[]>([]);
@@ -119,13 +129,13 @@ function WelcomeProjectPanel({
   }, [controller]);
 
   if (mode === "changes") {
-    return <ChangesFileTree files={changes} onSelectFile={onOpenFile} theme={theme} />;
+    return <ChangesFileTree files={changes} onSelectFile={onOpenChangedFile} theme={theme} />;
   }
 
   return (
     <ProjectTreeView
       loadFiles={() => controller.repoFiles()}
-      onSelectFile={onOpenFile}
+      onSelectFile={onOpenProjectFile}
       theme={theme}
     />
   );
@@ -156,6 +166,8 @@ export function NoThreadShell(props: {
   quickActions: QuickAction[];
   /** Reports the welcome composer's open state, so the shell suspends its inbox keys while typing. */
   onWelcomeComposingChange: (composing: boolean) => void;
+  /** The pane composition this vanilla launch restores; changes here are remembered for the next one. */
+  layout?: LaunchLayout;
 }): React.ReactNode {
   const {
     rows,
@@ -173,12 +185,56 @@ export function NoThreadShell(props: {
     onRename,
     quickActions,
     onWelcomeComposingChange,
+    layout,
   } = props;
   const confirming = mode.type === "confirmDelete" ? mode : null;
   // The bare-launch shell is the same four panes as a thread: the Thread pane waits in its empty state
   // and a disposable Welcome tab rides in the Changes editor until a thread or diff is opened.
-  const workbench = useChangesWorkbench({ seed: "welcome" });
-  const openRepoFile = (path: string): void => workbench.openFile(path, "contents");
+  const workbench = useChangesWorkbench({ seed: "welcome", layout });
+  // the vanilla shell remembers the composition the user leaves it in, for the next bare launch
+  useRememberLayout(
+    layout,
+    true,
+    sidebarOpen,
+    workbench.changesOpen,
+    workbench.projectOpen,
+    workbench.zoomed,
+  );
+  // the Changes tree opens a file's working-tree diff; the Project tree opens read-only contents
+  const openChangedFile = (path: string): void => {
+    // no thread means no live-diff refresh loop, so re-capture on open or a long-lived shell goes
+    // stale; the catch keeps a fire-and-forget refresh from throwing when the shell tears down
+    void controller.repoChanges().catch(() => undefined);
+    workbench.openFile(path, "diff");
+  };
+  const openProjectFile = (path: string): void => workbench.openFile(path, "contents");
+  // a bare launch has no thread yet, so the diff renders against a draft session; the first note
+  // promotes it to the per-repo workbench thread (commentOnWorkbenchDiff)
+  const draft = useMemo(() => draftThread(), []);
+  const bareSurface: DiffSurfaceProps = {
+    session: draft,
+    quickActions,
+    observer: false,
+    commentsEnabled: true,
+    resolved: false,
+    suspended: false,
+    onComposingChange: onWelcomeComposingChange,
+    onObserverBlocked: () => {},
+    onCursorChange: () => {},
+    focusedAnnotationId: undefined,
+    onFocusAnnotation: () => {},
+    onAnnotate: (span, body) =>
+      void controller.commentOnWorkbenchDiff(
+        span.start.blockIndex,
+        span.start.char,
+        span.end.char,
+        span.end.blockIndex,
+        body,
+      ),
+    onReply: () => undefined,
+    onUpdateAnnotation: () => {},
+    onExit: () => {},
+  };
 
   return (
     <ThemeProvider theme={theme}>
@@ -241,7 +297,7 @@ export function NoThreadShell(props: {
                   onComposingChange={onWelcomeComposingChange}
                   theme={theme}
                 />
-              ) : (
+              ) : tab.fileView === "contents" ? (
                 <BareWorkbenchFileView
                   path={tab.path ?? ""}
                   controller={controller}
@@ -250,6 +306,23 @@ export function NoThreadShell(props: {
                   onExit={() => {}}
                   theme={theme}
                 />
+              ) : (
+                <GridTabContent
+                  tab={tab}
+                  rows={controller.rows()}
+                  surface={bareSurface}
+                  rejectedRows={EMPTY_ROWS}
+                  dimmed={false}
+                  readFile={(path) => controller.repoReadFile(path)}
+                  onAddFileComment={(path, anchor, body) =>
+                    void controller.commentOnWorkbench(
+                      anchor,
+                      { kind: "file", path, rev: "worktree" },
+                      body,
+                    )
+                  }
+                  theme={theme}
+                />
               )
             }
             theme={theme}
@@ -259,7 +332,8 @@ export function NoThreadShell(props: {
           <WelcomeProjectPanel
             mode={workbench.projectMode}
             controller={controller}
-            onOpenFile={openRepoFile}
+            onOpenChangedFile={openChangedFile}
+            onOpenProjectFile={openProjectFile}
             theme={theme}
           />
         }

package/src/components/AppShell.brand.test.tsx

@@ -0,0 +1,58 @@
+/**
+ * The collapsed-sidebar brand row keeps the gear, the Threads toggle, and the
+ * "cueloop" mark on one line. A long thread title used to shrink the brand box
+ * until "cueloop" and the toggle wrapped onto the header's underline row; the
+ * title truncates instead, so the brand never shrinks.
+ */
+
+import { describe, expect, test } from "bun:test";
+import { testRender } from "@opentui/react/test-utils";
+import React from "react";
+import { AppShell } from "./AppShell";
+import { NERD } from "./primitives/icons";
+import { settle } from "../test-support";
+
+const LONG_TITLE = "working tree @ GRO-1981-fe-billing-promo-cookie-migration";
+
+async function brandFrame(): Promise<string[]> {
+  const setup = await testRender(
+    <AppShell
+      sidebarOpen={false}
+      onToggleSidebar={() => {}}
+      onOpenMenu={() => {}}
+      threadsPanel={<text>threads</text>}
+      threadTitle={LONG_TITLE}
+      threadPanel={<text>review the changes on the right</text>}
+      changesOpen
+      projectOpen
+      onToggleChanges={() => {}}
+      onToggleProject={() => {}}
+      onToggleRight={() => {}}
+      projectMode="changes"
+      projectPanel={<text>project</text>}
+      changesPanel={<text>diff</text>}
+    />,
+    { width: 160, height: 12 },
+  );
+
+  await settle(setup);
+  await settle(setup);
+  const lines = setup.captureCharFrame().split("\n");
+
+  setup.renderer.destroy();
+
+  return lines;
+}
+
+describe("collapsed-sidebar brand row", () => {
+  test("the Threads toggle stays on the cueloop row and the title tails off in an ellipsis", async () => {
+    const lines = await brandFrame();
+    const brandRow = lines.findIndex((line) => line.includes("cueloop"));
+    const toggleRow = lines.findIndex((line) => line.includes(NERD.sidebarLeftOff));
+
+    expect(brandRow).toBeGreaterThanOrEqual(0);
+    expect(toggleRow).toBe(brandRow);
+    expect(lines[brandRow]).toContain("…");
+    expect(lines[brandRow]).not.toContain(LONG_TITLE);
+  });
+});