fix(tui): clamp light accent contrast, neutral truncated cards, footer renders validation only

Author: elkaix

apps/pythinker-code/src/tui/components/chrome/footer.ts

@@ -272,7 +272,7 @@ export class FooterComponent implements Component {
           this.state.statusLine,
         );
     return viewModel.rows.flatMap((row) => {
-      if (row.kind === 'composer' || row.kind === 'status') return [];
+      if (row.kind === 'composer' || row.kind === 'status' || row.kind === 'activity') return [];
       return [truncateToWidth(renderLegacyRow(row), width, '…')];
     });
   }
@@ -374,21 +374,9 @@ export class FooterComponent implements Component {
 }
 
 function renderLegacyRow(
-  row: Exclude<
-    FooterViewModelRow,
-    { readonly kind: 'composer' } | { readonly kind: 'status' }
-  >,
+  row: Extract<FooterViewModelRow, { readonly kind: 'validation' }>,
 ): string {
-  switch (row.kind) {
-    case 'activity':
-      return row.primary.length === 0
-        ? row.indicators.join('  ')
-        : row.indicators.length === 0
-          ? row.primary
-          : `${row.primary}  ${row.indicators.join('  ')}`;
-    case 'validation':
-      return row.level === 'info' ? row.message : `${row.level}: ${row.message}`;
-  }
+  return row.level === 'info' ? row.message : `${row.level}: ${row.message}`;
 }
 
 function hasGoalBadge(goal: AppState['goal']): boolean {

apps/pythinker-code/src/tui/components/messages/tool-call.ts

@@ -660,11 +660,14 @@ export class ToolCallComponent extends Container {
     this.headerText.setText(truncateToWidth(this.buildHeader(), Math.max(0, width)));
     const lines = super.render(width);
     const background =
-      this.result === undefined && this.toolCall.truncated !== true
-        ? 'toolPendingBg'
-        : this.result !== undefined && this.result.is_error !== true
+      this.result === undefined
+        ? this.toolCall.truncated === true
+          ? undefined
+          : 'toolPendingBg'
+        : this.result.is_error !== true
           ? 'toolSuccessBg'
           : 'toolErrorBg';
+    if (background === undefined) return lines;
     return lines.map((line, index) =>
       index === 0
         ? line

apps/pythinker-code/src/tui/utils/session-accent.ts

@@ -5,7 +5,26 @@ export function sessionAccentHex(key: string, mode: 'dark' | 'light'): string {
     hash = Math.imul(hash, 33) + (key.codePointAt(index) ?? 0);
   }
 
-  return hslToHex((hash >>> 0) % 360, 0.9, mode === 'dark' ? 0.72 : 0.42);
+  return accentHexForHue((hash >>> 0) % 360, mode);
+}
+
+export function accentHexForHue(hue: number, mode: 'dark' | 'light'): string {
+  if (mode === 'dark') return hslToHex(hue, 0.9, 0.72);
+
+  for (let step = 0; step <= 11; step++) {
+    const accent = hslToHex(hue, 0.9, Math.max(0.2, 0.42 - step * 0.02));
+    if (1.05 / (relativeLuminance(accent) + 0.05) >= 3) return accent;
+  }
+  return hslToHex(hue, 0.9, 0.2);
+}
+
+function relativeLuminance(hex: string): number {
+  const linear = (channel: number) =>
+    channel <= 0.03928 ? channel / 12.92 : ((channel + 0.055) / 1.055) ** 2.4;
+  const red = linear(Number.parseInt(hex.slice(1, 3), 16) / 255);
+  const green = linear(Number.parseInt(hex.slice(3, 5), 16) / 255);
+  const blue = linear(Number.parseInt(hex.slice(5, 7), 16) / 255);
+  return 0.2126 * red + 0.7152 * green + 0.0722 * blue;
 }
 
 function hslToHex(hue: number, saturation: number, lightness: number): string {

apps/pythinker-code/test/tui/components/chrome/footer.test.ts

@@ -118,7 +118,7 @@ describe('FooterComponent', () => {
     expect(footer.render(160)).toEqual([]);
   });
 
-  it('renders activity and validation rows but suppresses shared status rows', () => {
+  it('renders validation rows but suppresses activity and shared status rows', () => {
     const footer = new FooterComponent(appState);
     const activity = selectFooterViewModel(
       foldFooterEvents(createFooterState(), [
@@ -137,7 +137,7 @@ describe('FooterComponent', () => {
     );
     footer.setViewModel(activity);
 
-    expect(footer.render(120).map(stripAnsi)).toEqual(['⠋ Waiting for response']);
+    expect(footer.render(120).map(stripAnsi)).toEqual([]);
 
     const validation = selectFooterViewModel(
       foldFooterEvents(createFooterState(), [

apps/pythinker-code/test/tui/components/messages/tool-call.test.ts

@@ -84,6 +84,33 @@ describe('ToolCallComponent', () => {
     }
   });
 
+  it('does not tint a truncated tool call without a result', () => {
+    const previousLevel = chalk.level;
+    chalk.level = 3;
+    const component = new ToolCallComponent(
+      {
+        id: 'call_truncated_tint',
+        name: 'Read',
+        args: { path: 'foo.ts' },
+        truncated: true,
+      },
+      undefined,
+    );
+
+    try {
+      const backgrounds = [
+        '\u001B[48;2;29;33;41m',
+        '\u001B[48;2;20;23;27m',
+        '\u001B[48;2;41;29;29m',
+      ];
+      expect(
+        component.render(40).every((line) => backgrounds.every((code) => !line.includes(code))),
+      ).toBe(true);
+    } finally {
+      chalk.level = previousLevel;
+    }
+  });
+
   it('renders MCP resource tools with friendly labels, context, and counts', () => {
     const list = new ToolCallComponent(
       {

apps/pythinker-code/test/tui/utils/session-accent.test.ts

@@ -1,11 +1,19 @@
 import { describe, expect, it } from 'vitest';
 
-import { sessionAccentHex } from '#/tui/utils/session-accent';
+import { accentHexForHue, sessionAccentHex } from '#/tui/utils/session-accent';
 
 function channelSum(hex: string): number {
   return [1, 3, 5].reduce((sum, start) => sum + Number.parseInt(hex.slice(start, start + 2), 16), 0);
 }
 
+function relativeLuminance(hex: string): number {
+  const channels = [1, 3, 5].map((start) => Number.parseInt(hex.slice(start, start + 2), 16) / 255);
+  const [red, green, blue] = channels.map((channel) =>
+    channel <= 0.03928 ? channel / 12.92 : ((channel + 0.055) / 1.055) ** 2.4,
+  );
+  return 0.2126 * red! + 0.7152 * green! + 0.0722 * blue!;
+}
+
 describe('sessionAccentHex', () => {
   it('returns a stable six-digit hex color for each key', () => {
     const accent = sessionAccentHex('session-alpha', 'dark');
@@ -25,4 +33,15 @@ describe('sessionAccentHex', () => {
       channelSum(sessionAccentHex('session-alpha', 'dark')),
     );
   });
+
+  it('keeps every light-theme hue above the chrome contrast floor', () => {
+    for (let hue = 0; hue < 360; hue++) {
+      const contrast = 1.05 / (relativeLuminance(accentHexForHue(hue, 'light')) + 0.05);
+      expect(contrast, `hue ${String(hue)}`).toBeGreaterThanOrEqual(3);
+    }
+  });
+
+  it('keeps the dark-theme hue mapping unchanged', () => {
+    expect(accentHexForHue(60, 'dark')).toBe('#F8F877');
+  });
 });