@a-t-h-i/bot-lobby 0.5.0 → 0.5.1

package/src/lobby/runtime.ts

@@ -6,12 +6,12 @@
  * turn into the feed, passes plan comments to the Master that owns a task and
  * records each Master turn in the metrics log.
  */
-import type { ExtensionAPI, ExtensionContext } from "@earendil-works/pi-coding-agent";
+import type { ExtensionAPI, ExtensionContext, Theme } from "@earendil-works/pi-coding-agent";
 import { getSelectListTheme } from "@earendil-works/pi-coding-agent";
 import { Key, type OverlayHandle, type TUI } from "@earendil-works/pi-tui";
 import { TERMINAL_STATES } from "../schemas/task.ts";
 import { listTasks, loadTask } from "../state/persistence.ts";
-import { detectProjectRoot, loadConfig } from "../state/project.ts";
+import { detectProjectRoot, loadConfig, saveConfig } from "../state/project.ts";
 import { addPlanComment, commentMessage, markCommentsDelivered, readPlanComments, undeliveredComments } from "../state/comments.ts";
 import { discardPlannedTask, listPlannedTasks, markPlannedTaskStarted, plannedTaskRequest, type PlannedTask } from "../state/backlog.ts";
 import { appendMetrics, readMetrics, type MetricStatus } from "../state/metrics.ts";
@@ -21,13 +21,16 @@ import { isSubagentProcess } from "../pi/quiet.ts";
 import { modelRef, resolveLobbyProfile, resolvePanelProfile } from "../pi/model-support.ts";
 import { modelLookup } from "../pi/tools.ts";
 import { startTask } from "../pi/start-task.ts";
-import type { LobbyAgentKind, PanelMember } from "../schemas/configuration.ts";
+import type { LobbyAgentKind, LobbyPanel, PanelMember } from "../schemas/configuration.ts";
 import { chatFromEntries, chatText, lobbyFeed, textOf } from "./feed.ts";
+import { answerMessage, dialogAsker, loadAskTool, questionnaires, toolAsker, type Asker } from "./ask.ts";
 import { QuickFixQueue } from "./quickfix.ts";
 import { PlanningSession, type PlannerSeed } from "./planner.ts";
 import { execCommand, IssuesState } from "./issues.ts";
 import { LobbyView, type LobbyHost, type TabId } from "./view.ts";
 import type { LobbyTheme } from "./layout.ts";
+import { createMarkdownRenderer } from "./markdown.ts";
+import { openEntrySettings, openSettings } from "../pi/settings-ui.ts";
 
 export const ANCHOR_KEY = "bot-lobby-anchor";
 /** How often the owning session looks for new plan comments. */
@@ -50,6 +53,14 @@ interface Runtime {
   issues: IssuesState;
   poll?: ReturnType<typeof setInterval>;
   unsubscribeFeed?: () => void;
+  /** The ask-user-question tool (or pi's dialogs), loaded once on first use. */
+  asker?: Promise<Asker>;
+  /** A questionnaire is on screen. */
+  asking: boolean;
+  /** The lobby turned the terminal's mouse reporting on (pi's regular screen only). */
+  mouse: boolean;
+  /** Settings opened from the lobby are on screen; the lobby stays aside until they close. */
+  inSettings: boolean;
 }
 
 let runtime: Runtime | undefined;
@@ -164,14 +175,82 @@ function newPlanner(state: Runtime, seed?: PlannerSeed, seats?: readonly PanelMe
     toolStallTimeoutMs: workflow.toolStallTimeoutMs,
     feed: lobbyFeed,
     onChange: rerender,
+    onRound: (session) => {
+      // Put the questions to the user at once when they are looking at the Plan tab.
+      if (loadConfig().lobby.autoAsk && state.visible && state.view?.tab === "plan" && session.awaitingAnswers) void answerPanel(state);
+    },
   }, seed);
   return state.planner;
 }
 
+/** The library's questionnaire when it loads, pi's own dialogs otherwise. */
+function panelAsker(state: Runtime): Promise<Asker> {
+  state.asker ??= loadAskTool(state.pi).then((tool) => (tool ? toolAsker(tool) : dialogAsker()));
+  return state.asker;
+}
+
+/**
+ * The oracle puts the round's questions to the user, one at a time; answered
+ * questionnaires are kept if the user stops, so the next call resumes there.
+ * Once every questionnaire is done, the answers (and any line comments) start
+ * the next round. Returns a notice for the lobby.
+ */
+export async function answerPanel(state: Runtime | undefined = runtime): Promise<string> {
+  const session = state?.planner;
+  if (!state || !session) return "no planning session";
+  if (session.busy) return "the panel is still thinking";
+  if (session.questions.length === 0) return "no open questions";
+  if (state.asking) return "the questions are already open";
+  state.asking = true;
+  try {
+    const asker = await panelAsker(state);
+    const chunks = questionnaires(session.questions);
+    for (let index = session.answered.length; index < chunks.length; index++) {
+      const result = await asker(chunks[index]!, state.ctx);
+      if (result.cancelled) {
+        rerender();
+        return session.answered.length > 0 ? `answers kept — ${chunks.length - session.answered.length} questionnaire${chunks.length - session.answered.length === 1 ? "" : "s"} left; enter resumes` : "questions put away — enter brings them back";
+      }
+      session.answered = [...session.answered, result];
+    }
+    const message = answerMessage(session.questions, session.answered);
+    if (!message) {
+      session.answered = [];
+      return "nothing was answered — the questions stay open";
+    }
+    void session.send(message);
+    return "answers sent — the panel is on the next round";
+  } catch (error) {
+    return `could not put the questions: ${(error as Error).message}`;
+  } finally {
+    state.asking = false;
+    rerender();
+  }
+}
+
+const renderMarkdown = createMarkdownRenderer();
+const lobbyThemes = new WeakMap<Theme, LobbyTheme>();
+
+/** pi's theme as the lobby draws with it, plus Markdown rendering; one wrapper per theme so caches stay warm. */
+function lobbyTheme(theme: Theme): LobbyTheme {
+  let wrapped = lobbyThemes.get(theme);
+  if (!wrapped) {
+    wrapped = {
+      fg: (color, text) => theme.fg(color, text),
+      bold: (text) => theme.bold(text),
+      italic: (text) => theme.italic(text),
+      bg: (color, text) => theme.bg(color, text),
+      markdown: renderMarkdown,
+    };
+    lobbyThemes.set(theme, wrapped);
+  }
+  return wrapped;
+}
+
 function host(state: Runtime, tui: TUI): LobbyHost {
   return {
     rows: () => tui.terminal.rows,
-    theme: () => state.ctx.ui.theme as LobbyTheme,
+    theme: () => lobbyTheme(state.ctx.ui.theme),
     sessionId: () => state.ctx.sessionManager.getSessionId(),
     zen: () => {
       const snapshot = zenSnapshot();
@@ -198,7 +277,13 @@ function host(state: Runtime, tui: TUI): LobbyHost {
     quickfix: state.quickfix,
     planner: () => state.planner,
     newPlanner: (seed, seats) => newPlanner(state, seed, seats),
+    answerPanel: () => answerPanel(state),
     defaultPanel: () => loadConfig().lobby.planningPanel,
+    issuesEnabled: () => loadConfig().lobby.issues,
+    panels: () => loadConfig().lobby.panels,
+    savePanels: (panels) => savePanels(panels),
+    keys: () => loadConfig().lobby.keys,
+    openSettings: (entry) => lobbySettings(state, entry),
     seatLabel: (member) => {
       const profile = seatProfile(state, member);
       return `${profile.model ?? "session model"} · ${profile.thinking}`;
@@ -212,6 +297,63 @@ function host(state: Runtime, tui: TUI): LobbyHost {
   };
 }
 
+/**
+ * bot-lobby's settings (or one agent's entry) from inside the lobby. The
+ * lobby stays aside for the whole visit, not only for each menu, so it does
+ * not flash between them, and rereads the config when it comes back.
+ */
+async function lobbySettings(state: Runtime, entry?: "quickfix" | "planner"): Promise<void> {
+  if (state.inSettings) return;
+  state.inSettings = true;
+  setMouse(state, false);
+  state.handle?.setHidden(true);
+  try {
+    if (entry) await openEntrySettings(state.pi, state.ctx, entry);
+    else await openSettings(state.pi, state.ctx);
+  } catch (error) {
+    state.ctx.ui.notify(`bot-lobby: settings failed — ${(error as Error).message}`, "warning");
+  } finally {
+    state.inSettings = false;
+    state.asideForPrompt = false;
+    if (state.visible && state.handle) {
+      state.handle.setHidden(false);
+      state.handle.focus();
+      setMouse(state, true);
+    }
+    state.view?.reloadConfig();
+    rerender();
+  }
+}
+
+/** Remember which panes show, keeping every other setting as the file has it now. */
+function savePanels(panels: Record<LobbyPanel, boolean>): void {
+  try {
+    const config = loadConfig();
+    saveConfig({ ...config, lobby: { ...config.lobby, panels: { ...panels } } });
+  } catch {
+    // A read-only config only means the choice lasts for this session.
+  }
+}
+
+/** SGR mouse reporting: presses, releases and the wheel, in cell coordinates. */
+const MOUSE_ON = "\x1b[?1000h\x1b[?1006h";
+const MOUSE_OFF = "\x1b[?1006l\x1b[?1000l";
+
+/**
+ * In pi's regular screen nothing reports the mouse, so the lobby turns
+ * reporting on while it is up (clicks pick tabs and draft lines, the wheel
+ * scrolls) and off whenever it steps aside. Full-screen pi reports the mouse
+ * itself and hands the events to the lobby.
+ */
+function setMouse(state: Runtime, on: boolean): void {
+  const tui = state.tui;
+  if (!tui || tui.mode === "fullscreen") return;
+  const want = on && loadConfig().lobby.mouse;
+  if (want === state.mouse) return;
+  state.mouse = want;
+  tui.terminal.write(want ? MOUSE_ON : MOUSE_OFF);
+}
+
 /** Show the lobby (optionally on `tab`); false when there is no interactive TUI. */
 export function showLobby(tab?: TabId): boolean {
   const state = runtime;
@@ -229,6 +371,7 @@ export function showLobby(tab?: TabId): boolean {
   state.asideForPrompt = false;
   if (tab) state.view.setTab(tab);
   state.view.start();
+  setMouse(state, true);
   applyStatus(state.ctx, state.root, state.configDir);
   state.tui.requestRender();
   return true;
@@ -239,6 +382,7 @@ export function hideLobby(): void {
   if (!state?.view || !state.visible) return;
   state.visible = false;
   state.asideForPrompt = false;
+  setMouse(state, false);
   state.view.stop();
   state.handle?.setHidden(true);
   applyStatus(state.ctx, state.root, state.configDir);
@@ -261,16 +405,19 @@ export function autoOpenLobby(): void {
 /** Step aside while pi shows a dialog (an approval, a question), and come back after. */
 function promptStarted(): void {
   const state = runtime;
-  if (!state?.visible || !state.handle) return;
+  if (!state?.visible || !state.handle || state.inSettings) return;
   state.asideForPrompt = true;
+  setMouse(state, false);
   state.handle.setHidden(true);
 }
 
 function promptEnded(): void {
   const state = runtime;
-  if (!state?.asideForPrompt || !state.handle) return;
+  if (!state?.asideForPrompt || !state.handle || state.inSettings) return;
   state.asideForPrompt = false;
-  if (state.visible) state.handle.setHidden(false);
+  if (!state.visible) return;
+  state.handle.setHidden(false);
+  setMouse(state, true);
 }
 
 function shutdown(): void {
@@ -278,6 +425,7 @@ function shutdown(): void {
   if (!state) return;
   runtime = undefined;
   if (state.poll) clearInterval(state.poll);
+  setMouse(state, false);
   state.unsubscribeFeed?.();
   state.quickfix.cancelAll();
   state.planner?.cancel();
@@ -301,6 +449,9 @@ export function initLobby(pi: ExtensionAPI, ctx: ExtensionContext, configDir: st
     root,
     visible: false,
     asideForPrompt: false,
+    asking: false,
+    mouse: false,
+    inSettings: false,
     scene: new ZenScene(),
     quickfix: undefined as unknown as QuickFixQueue,
     issues: new IssuesState(execCommand, ctx.cwd, rerender),

package/src/lobby/tabs/home.ts

@@ -6,7 +6,12 @@
  */
 import type { Task } from "../../schemas/task.ts";
 import type { ActivityEntry, ChatEntry, ThoughtEntry } from "../feed.ts";
-import { bold, since, clock, columns, fill, italic, paint, rule, spinner, split, tail, wrap, wrapHanging, type LobbyColor, type LobbyTheme } from "../layout.ts";
+import type { LobbyPanel } from "../../schemas/configuration.ts";
+import { beside, bold, box, clock, fill, italic, markdownHanging, notePane, paint, since, spinner, wrap, wrapHanging, type LobbyColor, type LobbyTheme, type PaneLayout } from "../layout.ts";
+
+/** The Lobby tab's scrollable panes. */
+export const HOME_PANES = ["conversation", "activity", "thinking"] as const;
+export type HomePane = (typeof HOME_PANES)[number];
 
 export interface HomeInput {
   task?: Task;
@@ -22,10 +27,20 @@ export interface HomeInput {
   /** Active tasks owned by other sessions, and saved plans waiting to start. */
   others: number;
   pending: number;
-  /** Lines of conversation scrollback. */
-  chatOffset: number;
+  /** How far each pane is scrolled back, in lines from its newest; 0 follows the newest. */
+  offsets?: Partial<Record<HomePane, number>>;
+  /** The pane the arrow keys scroll; its border lights up. */
+  focus?: HomePane;
+  /** Filled with where each pane landed and how much it holds. */
+  panes?: PaneLayout;
   tick: number;
   now: number;
+  /** Which panes show. */
+  panels: Record<LobbyPanel, boolean>;
+  /** The search in force: panes show only matching entries. */
+  query?: string;
+  /** Key labels for the pane toggles, shown on the panes. */
+  keys?: Record<LobbyPanel, string>;
 }
 
 /** Wide terminals put the conversation and the activity log side by side. */
@@ -79,16 +94,23 @@ export function chatLines(chat: readonly ChatEntry[], width: number, theme?: Lob
   const lines: string[] = [];
   const push = (role: ChatEntry["role"], text: string) => {
     if (lines.length > 0) lines.push("");
-    const body = role === "note" ? paint(theme, "dim", text) : text;
-    lines.push(...wrapHanging(chatLead(role, theme), body, width));
+    // The oracle writes Markdown; what you typed and notes are shown as written.
+    if (role === "oracle") lines.push(...markdownHanging(chatLead(role, theme), text, width, theme));
+    else lines.push(...wrapHanging(chatLead(role, theme), role === "note" ? paint(theme, "dim", text) : text, width));
   };
   for (const entry of chat) push(entry.role, entry.text);
-  if (live?.trim()) push("oracle", `${live.trim()} ${paint(theme, "accent", spinner(tick))}`);
-  else if (busy) push("oracle", paint(theme, "dim", `${spinner(tick)} working…`));
+  if (live?.trim()) {
+    push("oracle", live.trim());
+    lines[lines.length - 1] = `${lines.at(-1)!.trimEnd()} ${paint(theme, "accent", spinner(tick))}`;
+  } else if (busy) {
+    if (lines.length > 0) lines.push("");
+    lines.push(...wrapHanging(chatLead("oracle", theme), paint(theme, "dim", `${spinner(tick)} working…`), width));
+  }
   return lines;
 }
 
 function emptyChat(input: HomeInput, width: number, theme?: LobbyTheme): string[] {
+  if (input.query) return wrap(paint(theme, "dim", `Nothing in the conversation matches "${input.query}".`), width);
   const lines = input.task
     ? [paint(theme, "dim", "Nothing said yet. Type below to talk to the oracle about this task.")]
     : [
@@ -103,16 +125,38 @@ function emptyChat(input: HomeInput, width: number, theme?: LobbyTheme): string[
   return [...lines.flatMap((line) => wrap(line, width)), ...(extra.length > 0 ? ["", ...extra.flatMap((line) => wrap(paint(theme, "muted", line), width))] : [])];
 }
 
-function conversation(input: HomeInput, width: number, height: number, theme?: LobbyTheme): string[] {
-  const all = input.chat.length > 0 || input.liveReply || input.busy ? chatLines(input.chat, width, theme, input.liveReply, input.busy, input.tick) : emptyChat(input, width, theme);
-  const shown = tail(all, height, input.chatOffset);
-  return fill(shown, height);
+function matches(text: string, query: string | undefined): boolean {
+  return !query || text.toLowerCase().includes(query.toLowerCase());
+}
+
+/** The feed as the search narrows it: only entries whose text (or source) contains the query. */
+export function filterFeed(input: Pick<HomeInput, "chat" | "activity" | "thoughts" | "query">): { chat: ChatEntry[]; activity: ActivityEntry[]; thoughts: ThoughtEntry[] } {
+  const query = input.query?.trim();
+  return {
+    chat: input.chat.filter((entry) => matches(entry.text, query)),
+    activity: input.activity.filter((entry) => matches(`${entry.source} ${entry.text}`, query)),
+    thoughts: input.thoughts.filter((entry) => matches(`${entry.source} ${entry.text}`, query)),
+  };
+}
+
+function conversation(input: HomeInput, chat: readonly ChatEntry[], width: number, theme?: LobbyTheme): string[] {
+  const searching = Boolean(input.query);
+  const live = searching ? undefined : input.liveReply;
+  const busy = !searching && input.busy;
+  return chat.length > 0 || live || busy ? chatLines(chat, width, theme, live, busy, input.tick) : emptyChat(input, width, theme);
+}
+
+function activity(input: HomeInput, entries: readonly ActivityEntry[], width: number, theme?: LobbyTheme): string[] {
+  if (entries.length === 0) return [paint(theme, "dim", input.query ? `No activity matches "${input.query}".` : "No activity yet.")];
+  return entries.map((entry) => activityLine(entry, width, input.tick, theme));
 }
 
-function activity(input: HomeInput, width: number, height: number, theme?: LobbyTheme): string[] {
-  if (input.activity.length === 0) return fill([paint(theme, "dim", "No activity yet.")], height);
-  const lines = input.activity.slice(-Math.max(height, 1)).map((entry) => activityLine(entry, width, input.tick, theme));
-  return fill(tail(lines, height), height);
+/** The last `rows` lines, `offset` lines back from the newest (clamped), and where they start. */
+export function tailWindow(lines: readonly string[], rows: number, offset = 0): { shown: string[]; start: number; offset: number } {
+  const max = Math.max(0, lines.length - rows);
+  const back = Math.min(Math.max(0, offset), max);
+  const start = max - back;
+  return { shown: lines.slice(start, start + Math.max(0, rows)), start, offset: back };
 }
 
 /** The thought to show: a live one first, otherwise the newest. */
@@ -120,45 +164,79 @@ export function currentThought(thoughts: readonly ThoughtEntry[]): ThoughtEntry
   return [...thoughts].reverse().find((entry) => entry.live) ?? thoughts.at(-1);
 }
 
-function thinking(input: HomeInput, width: number, height: number, theme?: LobbyTheme): string[] {
-  const thought = currentThought(input.thoughts);
-  const right = thought ? `${thought.source} · ${thought.live ? "thinking" : since(input.now - thought.at)}` : "";
-  const header = rule(width, "Thinking", theme, right);
-  if (height <= 1) return [header].slice(0, height);
-  if (!thought) return fill([header, paint(theme, "dim", "Thoughts from the oracle and every agent appear here, and only here.")], height);
-  const body = wrap(thought.text, width).map((line) => italic(theme, paint(theme, "dim", line)));
-  return fill([header, ...tail(body, height - 1)], height);
+/** Every thought, oldest first: who thought it, then the thought, dimmed. */
+export function thoughtLines(thoughts: readonly ThoughtEntry[], width: number, theme?: LobbyTheme): string[] {
+  return thoughts.flatMap((thought) => {
+    const lead = `${paint(theme, sourceColor(thought.source), thought.source.padEnd(SOURCE_WIDTH).slice(0, SOURCE_WIDTH))} `;
+    return wrapHanging(lead, italic(theme, paint(theme, "dim", thought.text.replace(/\s*\n\s*/g, " "))), width);
+  });
+}
+
+function thinkingContent(input: HomeInput, thoughts: readonly ThoughtEntry[], width: number, theme?: LobbyTheme): string[] {
+  if (thoughts.length > 0) return thoughtLines(thoughts, width, theme);
+  return [paint(theme, "dim", input.query ? `No thought matches "${input.query}".` : "Thoughts from the oracle and every agent appear here, and only here.")];
 }
 
 function sceneLines(input: HomeInput, width: number, height: number): string[] {
-  if (!input.task || !input.scene) return [];
+  if (!input.task || !input.scene || !input.panels.scene) return [];
   const budget = Math.min(MAX_SCENE, Math.floor(height * SCENE_SHARE));
   if (budget < 6) return [];
   return input.scene(width, budget).slice(0, budget);
 }
 
-/** The whole tab, exactly `height` lines of `width` columns. */
+function hiddenHint(input: HomeInput, width: number, height: number, theme?: LobbyTheme): string[] {
+  const keys = input.keys;
+  const text = keys
+    ? `Every pane is hidden — ${keys.conversation} conversation · ${keys.activity} activity · ${keys.thinking} thinking${input.task ? ` · ${keys.scene} scene` : ""}`
+    : "Every pane is hidden.";
+  const lines = wrap(paint(theme, "dim", text), width);
+  const top = Math.max(0, Math.floor((height - lines.length) / 2));
+  return fill([...Array.from({ length: top }, () => ""), ...lines], height, width);
+}
+
+/** `↓12` when a pane is scrolled back from its newest line, before the pane's usual note. */
+function rightNote(offset: number, note: string | undefined): string | undefined {
+  const parts = [offset > 0 ? `↓${offset}` : "", note ?? ""].filter(Boolean);
+  return parts.length > 0 ? parts.join(" · ") : undefined;
+}
+
+/** The whole tab, exactly `height` lines of `width` columns; hidden panes give their room to the rest. */
 export function renderHome(input: HomeInput, width: number, height: number, theme?: LobbyTheme): string[] {
   if (height <= 0) return [];
+  const { panels } = input;
+  const feed = filterFeed(input);
   const scene = sceneLines(input, width, height);
   const rest = height - scene.length;
-  const thinkHeight = rest >= 16 ? Math.max(4, Math.floor(rest * 0.25)) : rest >= 9 ? 3 : 0;
+  const showMain = panels.conversation || panels.activity;
+  const thinkHeight = !panels.thinking ? 0 : !showMain ? rest : rest >= 18 ? Math.max(5, Math.floor(rest * 0.25)) : rest >= 10 ? 4 : 0;
   const main = rest - thinkHeight;
-  const chatTitle = input.task ? `Conversation · ${input.task.id}` : "Conversation";
-  let body: string[];
-  if (width >= HOME_COLUMNS_MIN) {
-    const [left, right] = split(width, 0.56);
-    const headers = columns([rule(left, chatTitle, theme)], [rule(right, "Activity", theme)], left, right, " ┬ ", theme);
-    const rows = columns(conversation(input, left, main - 1, theme), activity(input, right, main - 1, theme), left, right, " │ ", theme);
-    body = [...headers, ...rows];
-  } else {
-    const chatHeight = Math.max(1, Math.ceil(main * 0.6));
-    const activityHeight = main - chatHeight;
-    body = [
-      rule(width, chatTitle, theme),
-      ...conversation(input, width, chatHeight - 1, theme),
-      ...(activityHeight > 0 ? [rule(width, "Activity", theme), ...activity(input, width, activityHeight - 1, theme)] : []),
-    ];
-  }
-  return fill([...scene, ...fill(body, main), ...thinking(input, width, thinkHeight, theme)], height, width);
+  if (!showMain && !panels.thinking) return fill([...scene, ...hiddenHint(input, width, rest, theme)], height, width);
+  const matches = (count: number) => `${count} match${count === 1 ? "" : "es"}`;
+  /** One scrollable pane: its lines, tailed to its rows and scrolled back by its offset, in a box that records where it sits. */
+  const pane = (name: HomePane, title: string, note: string | undefined, lines: (inner: number) => string[]) => (top: number, left: number, w: number, h: number): string[] => {
+    const all = lines(Math.max(1, w - 4));
+    const view = tailWindow(all, h - 2, input.offsets?.[name] ?? 0);
+    notePane(input.panes, name, top, left, w, h, all.length);
+    const right = rightNote(view.offset, note);
+    return box(w, h, view.shown, { title, ...(right ? { right } : {}), focused: input.focus === name, scroll: { total: all.length, start: view.start }, theme });
+  };
+  const chatBox = pane("conversation", input.task ? `Conversation · ${input.task.id}` : "Conversation", input.query ? matches(feed.chat.length) : input.keys?.conversation, (inner) => conversation(input, feed.chat, inner, theme));
+  const activityBox = pane("activity", "Activity", input.query ? matches(feed.activity.length) : input.keys?.activity, (inner) => activity(input, feed.activity, inner, theme));
+  const thought = currentThought(feed.thoughts);
+  const thinkingNote = thought ? `${thought.source} · ${thought.live ? "thinking" : since(input.now - thought.at)}` : input.keys?.thinking;
+  const thinkingBox = pane("thinking", "Thinking", thinkingNote, (inner) => thinkingContent(input, feed.thoughts, inner, theme));
+  const top = scene.length;
+  let body: string[] = [];
+  if (main > 0 && panels.conversation && panels.activity) {
+    if (width >= HOME_COLUMNS_MIN) {
+      const left = Math.round((width - 1) * 0.56);
+      body = beside([chatBox(top, 0, left, main), activityBox(top, left + 1, width - 1 - left, main)]);
+    } else {
+      const chatHeight = Math.max(3, Math.ceil(main * 0.6));
+      body = [...chatBox(top, 0, width, chatHeight), ...(main - chatHeight >= 3 ? activityBox(top + chatHeight, 0, width, main - chatHeight) : [])];
+    }
+  } else if (main > 0 && panels.conversation) body = chatBox(top, 0, width, main);
+  else if (main > 0 && panels.activity) body = activityBox(top, 0, width, main);
+  const think = thinkHeight >= 3 ? thinkingBox(top + main, 0, width, thinkHeight) : [];
+  return fill([...scene, ...fill(body, main), ...think], height, width);
 }