pi-message-sidebar 1.5.0 → 1.6.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 1.6.0
+
+> Readability pass driven by a live populated PTY audit: less cropping, more signal per row.
+
+- Collapsed message previews now use up to two wrapped lines instead of one clipped line.
+- Single header row: `Messages 5/5 · #5 01:26` replaces the two-row header.
+- Goal recap shows the objective on its own line(s) again, with a second line when dock space allows.
+- cmux row drops the label and leads with the surface ref (`surface:38 · title`), so operational identity never truncates away.
+- Status dock is priority-ordered (identity, goal status, objective, runtime, hint) and degrades to goal-status-only before dropping the goal.
+- Dock budget raised to five rows at normal heights; tiny-height behavior unchanged.
+
+
 ## 1.5.0
 
 - Replaced selected/newest pinning with a row-aware contiguous chronological viewport.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-message-sidebar",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "Persistent responsive message history sidebar for Pi",
   "keywords": [
     "pi-package",

package/src/sidebar-component.ts

@@ -134,7 +134,7 @@ export class SidebarComponent implements Component {
     if (signature === this.cachedSignature) return this.cachedLines;
 
     const fullHeader = this.renderHeader(safeWidth);
-    const headerRows = this.messages.length > 0 && targetHeight === 1 ? 0 : targetHeight <= 5 ? 1 : 2;
+    const headerRows = this.messages.length > 0 && targetHeight === 1 ? 0 : 1;
     const header = fullHeader.slice(0, Math.min(headerRows, targetHeight));
     const available = Math.max(0, targetHeight - header.length);
     // At tiny heights, keep one chronological message row before allocating dock chrome.
@@ -146,7 +146,7 @@ export class SidebarComponent implements Component {
       this.options.getThinkingLevel(),
       this.focused,
       this.options.getCmuxContext,
-      Math.min(4, Math.max(0, available - messageReserve)),
+      Math.min(5, Math.max(0, available - messageReserve)),
     );
     const bodyHeight = Math.max(0, targetHeight - header.length - dock.length);
     const result = [...header, ...this.renderBody(safeWidth, bodyHeight), ...dock];
@@ -165,14 +165,10 @@ export class SidebarComponent implements Component {
   private renderHeader(width: number): string[] {
     const position = this.selectedIndex() + 1;
     const count = this.messages.length;
-    const location = count > 0 ? `${position}/${count}` : "0";
     const selected = this.messages[this.selectedIndex()];
-    const detail = selected
-      ? `${this.focused ? "Selected" : "Current"} #${selected.index} ${formatTime(selected.timestamp)}`
-      : "User prompts";
+    const detail = selected ? ` ${FG_FAINT}·${RST} ${FG_DIM}#${selected.index} ${formatTime(selected.timestamp)}${RST}` : "";
     return [
-      fillRow(` ${BOLD}${FG_BRIGHT}Messages${RST} ${FG_FAINT}${location}${RST}`, width, BG_HDR),
-      fillRow(` ${FG_DIM}${detail}${RST}`, width, BG),
+      fillRow(` ${BOLD}${FG_BRIGHT}Messages${RST} ${FG_FAINT}${count > 0 ? `${position}/${count}` : "0"}${RST}${detail}`, width, BG_HDR),
     ];
   }
 
@@ -241,10 +237,20 @@ export class SidebarComponent implements Component {
     const selected = message.id === this.selectedId;
     const background = selected ? BG_SEL : BG;
     const arrow = selected && this.focused ? `${FG_ACC}›${RST}` : " ";
-    if (!this.expandedIds.has(message.id) || maxRows <= 1) {
+    if (!this.expandedIds.has(message.id)) {
+      // Collapsed preview: up to two wrapped lines so real prompts stay readable.
       const prefix = ` ${arrow} `;
-      const text = truncateToWidth(message.text.replace(/\s+/g, " "), Math.max(0, width - visibleWidth(prefix)), "…");
-      return [fillRow(`${prefix}${selected ? FG_BRIGHT : FG_NORM}${text}${RST}`, width, background)];
+      const textWidth = Math.max(1, width - visibleWidth(prefix));
+      const wrapped = wrapText(message.text, textWidth);
+      const rows = Math.max(1, Math.min(2, maxRows));
+      const shown = wrapped.slice(0, rows);
+      if (wrapped.length > shown.length && shown.length > 0) {
+        const overflow = shown[shown.length - 1]!;
+        shown[shown.length - 1] = truncateToWidth(overflow, Math.max(1, textWidth - 1), "") + "…";
+      }
+      return shown.map((line, position) =>
+        fillRow(`${position === 0 ? prefix : "   "}${selected ? FG_BRIGHT : FG_NORM}${line}${RST}`, width, background),
+      );
     }
 
     const number = `${FG_FAINT}#${message.index}${RST}`;

package/src/status-dock.ts

@@ -99,7 +99,7 @@ function goalStatus(goal: ThreadGoal): { icon: string; color: string; label: str
   }
 }
 
-function renderGoal(width: number, goal: ThreadGoal): string[] {
+function renderGoal(width: number, goal: ThreadGoal, objectiveLines: number): string[] {
   const status = goalStatus(goal);
   const budget = goal.tokenBudget
     ? `${formatTokens(goal.usage.tokensUsed)}/${formatTokens(goal.tokenBudget)}`
@@ -108,7 +108,7 @@ function renderGoal(width: number, goal: ThreadGoal): string[] {
   const metadata = `${status.color}${status.icon} ${status.label}${RST} ${overBudget ? FG_ERR : FG_MID}${budget}${RST} ${FG_FAINT}${formatDuration(goal.usage.activeSeconds)}${RST}`;
   const objective = wrapText(goal.objective, Math.max(1, width - 4));
   const lines = [fillRow(` ${metadata}`, width, BG)];
-  if (objective[0]) lines.push(fillRow(`   ${FG_BRIGHT}${objective[0]}${RST}`, width, BG));
+  for (const line of objective.slice(0, Math.max(0, objectiveLines))) lines.push(fillRow(`   ${FG_BRIGHT}${line}${RST}`, width, BG));
   return lines;
 }
 
@@ -124,15 +124,13 @@ function renderWorkspace(width: number, ctx: ExtensionContext, footerData: Reado
 }
 
 function renderCmux(width: number, cmux: CmuxContext): string {
-  const prefix = ` ${FG_FAINT}cmux${RST} `;
-  const available = Math.max(0, width - visibleWidth(prefix));
-  const surfaceText = cmux.surfaceRef ?? "";
-  const surface = truncateToWidth(surfaceText, available, "");
+  // Operational identity first: the surface ref never truncates away.
+  const surface = cmux.surfaceRef ?? "";
   const separator = surface ? ` ${FG_FAINT}·${RST} ` : "";
-  const titleBudget = Math.max(0, available - visibleWidth(separator) - visibleWidth(surface));
-  const titleText = cmux.workspaceTitle ?? cmux.workspaceRef ?? "cmux";
+  const titleText = cmux.workspaceTitle ?? cmux.workspaceRef ?? "";
+  const titleBudget = Math.max(0, width - 2 - visibleWidth(surface) - visibleWidth(separator));
   const title = truncateToWidth(titleText, titleBudget, "…");
-  return fillRow(`${prefix}${FG_BRIGHT}${title}${RST}${separator}${FG_INFO}${surface}${RST}`, width, BG);
+  return fillRow(` ${FG_INFO}${surface}${RST}${separator}${FG_BRIGHT}${title}${RST}`, width, BG);
 }
 
 function renderRuntime(width: number, ctx: ExtensionContext, footerData: ReadonlyFooterDataProvider | null, thinkingLevel: string, usage: Usage): string | null {
@@ -165,9 +163,9 @@ export function renderStatusDock(
   thinkingLevel: string,
   focused: boolean,
   getCmuxContext: () => CmuxContext | null,
-  maxRows = 4,
+  maxRows = 5,
 ): string[] {
-  const limit = Math.max(0, Math.min(4, Math.floor(maxRows)));
+  const limit = Math.max(0, Math.min(5, Math.floor(maxRows)));
   if (limit === 0) return [];
   const hint = fillRow(
     ` ${FG_DIM}${focused ? "↑↓ move  Enter open  c copy  Esc close" : "Ctrl+Shift+H focus"}${RST}`,
@@ -179,18 +177,31 @@ export function renderStatusDock(
   const usage = computeUsage(ctx);
   const goal = readSessionGoal(ctx);
   const cmux = getCmuxContext();
-  const rows: string[] = [];
 
-  // A cmux surface reference is operational identity. Keep it ahead of optional
-  // title, runtime, and status text so truncation cannot discard it.
-  if (cmux) rows.push(renderCmux(width, cmux));
-  if (goal) rows.push(...renderGoal(width, goal));
-  if (!cmux && !goal) rows.push(renderWorkspace(width, ctx, footerData));
-  const runtime = renderRuntime(width, ctx, footerData, thinkingLevel, usage);
-  if (runtime) rows.push(runtime);
-  if (!goal) {
+  // Priority order: identity, goal status, first objective line, runtime, then
+  // the second objective line. Truncation drops the least important rows last.
+  const rows: string[] = [];
+  const push = (line: string | string[] | null): boolean => {
+    if (!line) return true;
+    const added = Array.isArray(line) ? line : [line];
+    if (rows.length + added.length > limit - 1) return false;
+    rows.push(...added);
+    return true;
+  };
+  if (cmux) push(renderCmux(width, cmux));
+  else if (!goal) push(renderWorkspace(width, ctx, footerData));
+  if (goal) {
+    if (!push(renderGoal(width, goal, 1)) && rows.length + 1 <= limit - 1) {
+      // Degrade to goal status without the objective line before dropping it entirely.
+      rows.push(...renderGoal(width, goal, 0));
+    }
+    const runtime = renderRuntime(width, ctx, footerData, thinkingLevel, usage);
+    if (!push(runtime)) return [...rows.slice(0, limit - 1), hint];
+    push(renderGoal(width, goal, 2).slice(2));
+  } else {
+    push(renderRuntime(width, ctx, footerData, thinkingLevel, usage));
     const status = validExtensionStatuses(footerData)[0];
-    if (status) rows.push(row(width, "stat", `${FG_MID}${status}${RST}`));
+    if (status) push(row(width, "stat", `${FG_MID}${status}${RST}`));
   }
 
   return [...rows.slice(0, limit - 1), hint];