Tidy the bot chat: icon header controls, status in the rail, narrower thread

Drop the working-on panel. Rail rows show the bot's status line first.
The header's computer and model controls are ghost icons opening modals
that explain them, and the bot's text model, provider and computer show
under its name. The thread and composer are held to 760px.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

src/layouts/bots/(partials)/bot-row.tsx

@@ -14,21 +14,24 @@ type Props = {
     bot: BotWithLastMessage;
     selected?: boolean;
     /**
-     * Replaces the last-message snippet (the coordinator shows crew status).
+     * Shown when the bot has no status line, before the last-message
+     * snippet (the coordinator's crew counts).
      */
     subtitle?: string;
 };
 
 /**
- * 48px rail row. Status is the face: no badges, spinners or state dots.
+ * 48px rail row. Status is the face and the subtitle (the bot's status
+ * line while it has one): no badges, spinners or state dots.
  * Selected is ink at 5%, never a hue.
  */
 export default function BotRow({ bot, selected, subtitle }: Props) {
     const hue = (bot.hue || null) as BotHue | null;
     const snippet =
-        subtitle ??
-        (bot.last_message_text ? messagePreview({ text: bot.last_message_text }) : null) ??
-        bot.role ??
+        bot.status_line ||
+        subtitle ||
+        (bot.last_message_text ? messagePreview({ text: bot.last_message_text }) : "") ||
+        bot.role ||
         "";
     const at = bot.last_message_at || bot.last_activity_at;
 

src/layouts/bots/(partials)/coordinator-row.tsx

@@ -1,6 +1,6 @@
 import Divider from "@moduletrace/twui/layout/Divider";
 import type { BotWithLastMessage } from "@/src/types";
-import { crewStatusLine } from "@/src/utils/crew-status";
+import { crewCounts, crewStatusLine } from "@/src/utils/crew-status";
 import BotRow from "./bot-row";
 
 type Props = {
@@ -10,16 +10,18 @@ type Props = {
 };
 
 /**
- * Pinned first. Hue-less, and its subtitle is the crew status, not a
- * snippet.
+ * Pinned first. Hue-less. Its subtitle is its status line, else the crew
+ * counts while any worker is busy or needs you, else its last message.
  */
 export default function CoordinatorRow({ bot, bots, selected }: Props) {
+    const { working, needs_you } = crewCounts({ bots });
+
     return (
         <>
             <BotRow
                 bot={bot}
                 selected={selected}
-                subtitle={crewStatusLine({ bots })}
+                subtitle={working || needs_you ? crewStatusLine({ bots }) : undefined}
             />
             <Divider className="shrink-0 mx-1 lg:mx-3 my-2 w-auto border-hairline dark:border-hairline" />
         </>