tycono 0.3.14-beta.0 → 0.3.14-beta.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tycono",
-  "version": "0.3.14-beta.0",
+  "version": "0.3.14-beta.10",
   "description": "Build an AI company. Watch them work.",
   "type": "module",
   "bin": {

package/src/api/src/create-server.ts

@@ -33,6 +33,7 @@ import { questsRouter } from './routes/quests.js';
 import { coinsRouter } from './routes/coins.js';
 import { activeSessionsRouter } from './routes/active-sessions.js';
 import { supervisionRouter } from './routes/supervision.js';
+import { presetsRouter } from './routes/presets.js';
 import { importKnowledge } from './services/knowledge-importer.js';
 import { AnthropicProvider, type LLMProvider } from './engine/llm-adapter.js';
 import { readConfig } from './services/company-config.js';
@@ -212,6 +213,7 @@ export function createExpressApp(): express.Application {
   app.use('/api/coins', coinsRouter);
   app.use('/api/active-sessions', activeSessionsRouter);
   app.use('/api/supervision', supervisionRouter);
+  app.use('/api/presets', presetsRouter);
 
   app.get('/api/health', (_req, res) => {
     res.json({ status: 'ok', companyRoot: COMPANY_ROOT });

package/src/api/src/engine/agent-loop.ts

@@ -29,6 +29,7 @@ export interface AgentConfig {
   tokenLedger?: TokenLedger;  // Token usage ledger (optional)
   attachments?: ImageAttachment[];  // Image attachments for vision
   targetRoles?: string[];          // Selective dispatch scope
+  presetId?: string;               // Wave-scoped preset for knowledge injection
   // Callbacks
   onText?: (text: string) => void;
   onToolExec?: (name: string, input: Record<string, unknown>) => void;
@@ -162,7 +163,7 @@ export async function runAgentLoop(config: AgentConfig): Promise<AgentResult> {
   const llm = config.llm ?? new AnthropicProvider();
 
   // 1. Assemble context
-  const context = assembleContext(companyRoot, roleId, task, sourceRole, orgTree, { teamStatus: config.teamStatus, targetRoles: config.targetRoles });
+  const context = assembleContext(companyRoot, roleId, task, sourceRole, orgTree, { teamStatus: config.teamStatus, targetRoles: config.targetRoles, presetId: config.presetId });
 
   // Trace: capture assembled prompt for debugging
   config.onPromptAssembled?.(context.systemPrompt, task);

package/src/api/src/engine/context-assembler.ts

@@ -51,7 +51,7 @@ export function assembleContext(
   task: string,
   sourceRole: string,
   orgTree: OrgTree,
-  options?: { teamStatus?: TeamStatus; targetRoles?: string[] },
+  options?: { teamStatus?: TeamStatus; targetRoles?: string[]; presetId?: string },
 ): AssembledContext {
   const node = orgTree.nodes.get(roleId);
   if (!node) {
@@ -123,6 +123,14 @@ Use the code repository path for all source code work (reading, writing, buildin
     sections.push(preKSection);
   }
 
+  // 11. Preset Knowledge (wave-scoped preset docs)
+  if (options?.presetId && options.presetId !== 'default') {
+    const presetKnowledge = loadPresetKnowledge(companyRoot, options.presetId);
+    if (presetKnowledge) {
+      sections.push('# Preset Knowledge\n\n' + presetKnowledge);
+    }
+  }
+
   // Task는 별도 필드로 분리
   let subordinates = getSubordinates(orgTree, roleId);
 
@@ -262,6 +270,27 @@ ${docList}
 > **Knowledging Rule**: Check these documents first. If your work produces new knowledge, update existing docs or create new ones with cross-links.`;
 }
 
+/**
+ * Load knowledge docs from a preset's knowledge/ directory.
+ * Returns concatenated content (capped at 2000 chars per doc).
+ */
+function loadPresetKnowledge(companyRoot: string, presetId: string): string | null {
+  const knowledgeDir = path.join(companyRoot, 'company', 'presets', presetId, 'knowledge');
+  if (!fs.existsSync(knowledgeDir)) return null;
+
+  const parts: string[] = [];
+  try {
+    const entries = fs.readdirSync(knowledgeDir).filter(f => f.endsWith('.md'));
+    for (const file of entries.slice(0, 10)) { // Cap at 10 docs
+      const content = fs.readFileSync(path.join(knowledgeDir, file), 'utf-8');
+      const preview = content.slice(0, 2000);
+      parts.push(`## ${file}\n\n${preview}${content.length > 2000 ? '\n\n... (truncated)' : ''}`);
+    }
+  } catch { /* ignore */ }
+
+  return parts.length > 0 ? parts.join('\n\n---\n\n') : null;
+}
+
 function loadCompanyRules(companyRoot: string): string | null {
   const parts: string[] = [];
 

package/src/api/src/engine/runners/claude-cli.ts

@@ -407,7 +407,7 @@ else:
  */
 export class ClaudeCliRunner implements ExecutionRunner {
   execute(config: RunnerConfig, callbacks: RunnerCallbacks): RunnerHandle {
-    const { companyRoot, roleId, task, sourceRole, orgTree, readOnly = false, teamStatus, attachments, targetRoles } = config;
+    const { companyRoot, roleId, task, sourceRole, orgTree, readOnly = false, teamStatus, attachments, targetRoles, presetId } = config;
 
     // Note: Claude CLI doesn't support inline image attachments.
     // Images will be ignored with a warning if passed.
@@ -416,7 +416,7 @@ export class ClaudeCliRunner implements ExecutionRunner {
     }
 
     // 1. Context Assembly
-    const context = assembleContext(companyRoot, roleId, task, sourceRole, orgTree, { teamStatus, targetRoles });
+    const context = assembleContext(companyRoot, roleId, task, sourceRole, orgTree, { teamStatus, targetRoles, presetId });
 
     // Trace: capture assembled prompt for debugging
     callbacks.onPromptAssembled?.(context.systemPrompt, task);

package/src/api/src/engine/runners/types.ts

@@ -45,6 +45,8 @@ export interface RunnerConfig {
   codeRoot?: string;
   /** PSM-004: Environment variables to inject (e.g., port assignments) */
   env?: Record<string, string>;
+  /** Wave-scoped preset ID for knowledge injection */
+  presetId?: string;
   /** SV-7: Supervision — abort a running session */
   onAbortSession?: (sessionId: string) => boolean;
   /** SV-6: Supervision — amend a running session */

package/src/api/src/routes/presets.ts

@@ -1,16 +1,21 @@
 /**
  * presets.ts — Preset API routes
  *
- * GET /api/presets          — list all preset summaries
- * GET /api/presets/:id      — get full preset detail
+ * GET  /api/presets          — list all preset summaries
+ * GET  /api/presets/:id      — get full preset detail
+ * POST /api/presets/install  — install preset from data
+ * DELETE /api/presets/:id    — remove installed preset
  */
 import { Router } from 'express';
+import fs from 'node:fs';
+import path from 'node:path';
+import YAML from 'yaml';
 import { COMPANY_ROOT } from '../services/file-reader.js';
-import { getPresetSummaries, getPresetById } from '../services/preset-loader.js';
+import { getPresetSummaries, getPresetById, loadPresets } from '../services/preset-loader.js';
 
 export const presetsRouter = Router();
 
-/** GET /api/presets — list preset summaries for TUI */
+/** GET /api/presets — list preset summaries */
 presetsRouter.get('/', (_req, res) => {
   try {
     const summaries = getPresetSummaries(COMPANY_ROOT);
@@ -33,3 +38,86 @@ presetsRouter.get('/:id', (req, res) => {
     res.status(500).json({ error: 'Failed to load preset' });
   }
 });
+
+/** POST /api/presets/install — install a preset from provided data */
+presetsRouter.post('/install', (req, res) => {
+  try {
+    const { id, preset } = req.body as { id: string; preset: Record<string, unknown> };
+    if (!id || !preset) {
+      res.status(400).json({ error: 'id and preset are required' });
+      return;
+    }
+
+    // Validate preset has required fields
+    if (!preset.name || !preset.roles || !Array.isArray(preset.roles)) {
+      res.status(400).json({ error: 'preset must have name and roles array' });
+      return;
+    }
+
+    // Check for conflict with existing preset
+    const existing = getPresetById(COMPANY_ROOT, id);
+    if (existing && !existing.isDefault) {
+      res.status(409).json({ error: `Preset already installed: ${id}` });
+      return;
+    }
+
+    // Create preset directory and write preset.yaml
+    const presetDir = path.join(COMPANY_ROOT, 'company', 'presets', id);
+    fs.mkdirSync(presetDir, { recursive: true });
+
+    // Write preset.yaml
+    const yamlContent = YAML.stringify(preset);
+    fs.writeFileSync(path.join(presetDir, 'preset.yaml'), yamlContent);
+
+    // Create subdirectories for roles/knowledge/skills
+    fs.mkdirSync(path.join(presetDir, 'roles'), { recursive: true });
+    fs.mkdirSync(path.join(presetDir, 'knowledge'), { recursive: true });
+    fs.mkdirSync(path.join(presetDir, 'skills'), { recursive: true });
+
+    // Write knowledge docs if provided
+    const knowledge = req.body.knowledge as Array<{ filename: string; content: string }> | undefined;
+    if (knowledge) {
+      for (const doc of knowledge) {
+        fs.writeFileSync(path.join(presetDir, 'knowledge', doc.filename), doc.content);
+      }
+    }
+
+    // Write role yamls if provided
+    const roleDefinitions = req.body.roleDefinitions as Array<{ id: string; yaml: string }> | undefined;
+    if (roleDefinitions) {
+      for (const role of roleDefinitions) {
+        const roleDir = path.join(presetDir, 'roles', role.id);
+        fs.mkdirSync(roleDir, { recursive: true });
+        fs.writeFileSync(path.join(roleDir, 'role.yaml'), role.yaml);
+      }
+    }
+
+    res.json({ ok: true, id, path: `company/presets/${id}` });
+  } catch (err) {
+    res.status(500).json({ error: `Install failed: ${err instanceof Error ? err.message : 'unknown'}` });
+  }
+});
+
+/** DELETE /api/presets/:id — remove installed preset */
+presetsRouter.delete('/:id', (req, res) => {
+  try {
+    const { id } = req.params;
+    if (id === 'default' || id === '_default') {
+      res.status(400).json({ error: 'Cannot remove default preset' });
+      return;
+    }
+
+    const presetDir = path.join(COMPANY_ROOT, 'company', 'presets', id);
+    if (!fs.existsSync(presetDir)) {
+      res.status(404).json({ error: `Preset not found: ${id}` });
+      return;
+    }
+
+    // Remove preset directory recursively
+    fs.rmSync(presetDir, { recursive: true, force: true });
+
+    res.json({ ok: true, id });
+  } catch (err) {
+    res.status(500).json({ error: `Remove failed: ${err instanceof Error ? err.message : 'unknown'}` });
+  }
+});

package/src/api/src/services/execution-manager.ts

@@ -1,3 +1,5 @@
+import fs from 'node:fs';
+import path from 'node:path';
 import { COMPANY_ROOT } from './file-reader.js';
 import { ActivityStream, type ActivityEvent } from './activity-stream.js';
 import { buildOrgTree } from '../engine/org-tree.js';
@@ -116,7 +118,20 @@ class ExecutionManager {
 
   startExecution(params: StartExecutionParams): Execution {
     const execId = `exec-${Date.now()}-${this.nextId++}`;
-    const orgTree = buildOrgTree(COMPANY_ROOT);
+
+    // Resolve preset from wave file for org tree building
+    let presetId: string | undefined;
+    const session = getSession(params.sessionId);
+    if (session?.waveId) {
+      try {
+        const wavePath = path.join(COMPANY_ROOT, 'operations', 'waves', `${session.waveId}.json`);
+        if (fs.existsSync(wavePath)) {
+          const waveData = JSON.parse(fs.readFileSync(wavePath, 'utf-8'));
+          presetId = waveData.preset;
+        }
+      } catch { /* ignore */ }
+    }
+    const orgTree = buildOrgTree(COMPANY_ROOT, presetId);
 
     // Authority gate
     if (params.sourceRole && params.sourceRole !== 'ceo') {
@@ -165,7 +180,7 @@ class ExecutionManager {
 
     this.executions.set(execId, execution);
 
-    this.initializeAndRunExecution(execution, params, orgTree);
+    this.initializeAndRunExecution(execution, params, orgTree, presetId);
 
     return execution;
   }
@@ -174,6 +189,7 @@ class ExecutionManager {
     execution: Execution,
     params: StartExecutionParams,
     orgTree: ReturnType<typeof buildOrgTree>,
+    presetId?: string,
   ): Promise<void> {
     try {
       const ports = await portRegistry.allocate(execution.sessionId || execution.id, params.roleId, params.task);
@@ -243,6 +259,7 @@ class ExecutionManager {
         sessionId: params.sessionId,
         teamStatus,
         targetRoles: params.targetRoles,
+        presetId,
         codeRoot: resolveCodeRoot(COMPANY_ROOT),
         attachments: params.attachments,
         env: {
@@ -676,7 +693,18 @@ class ExecutionManager {
     if (runningChildren.length === 0) return;
 
     // Only restart C-Level roles (CTO, CBO etc.)
-    const orgTree = buildOrgTree(COMPANY_ROOT);
+    // Resolve preset from wave file for correct org tree
+    let recoveryPresetId: string | undefined;
+    const deadSession = getSession(deadExecution.sessionId);
+    if (deadSession?.waveId) {
+      try {
+        const wp = path.join(COMPANY_ROOT, 'operations', 'waves', `${deadSession.waveId}.json`);
+        if (fs.existsSync(wp)) {
+          recoveryPresetId = JSON.parse(fs.readFileSync(wp, 'utf-8')).preset;
+        }
+      } catch { /* ignore */ }
+    }
+    const orgTree = buildOrgTree(COMPANY_ROOT, recoveryPresetId);
     const node = orgTree.nodes.get(deadExecution.roleId);
     if (!node || node.level !== 'c-level') return;
 
@@ -697,8 +725,8 @@ Your job: monitor progress, course-correct if needed, wait for completion, then
     console.log(`[ExecMgr] Supervision recovery: ${deadExecution.roleId} died with ${runningChildren.length} running children. Restarting.`);
 
     // Propagate waveId from the dead session
-    const deadSession = getSession(deadExecution.sessionId);
-    const waveId = deadSession?.waveId;
+    const deadSes = getSession(deadExecution.sessionId);
+    const waveId = deadSes?.waveId;
 
     // Create new session for recovery
     const newSession = createSession(deadExecution.roleId, {

package/src/api/src/services/supervisor-heartbeat.ts

@@ -172,13 +172,15 @@ class SupervisorHeartbeat {
       const waveSessions = listSessions().filter(s => s.waveId === waveId);
       const ceoSession = waveSessions.find(s => s.roleId === 'ceo') ?? null;
 
-      // Read original directive from wave artifact file
+      // Read original directive + preset from wave artifact file
       let originalDirective = '';
+      let originalPreset: string | undefined;
       try {
         const waveFile = path.join(COMPANY_ROOT, 'operations', 'waves', `${waveId}.json`);
         if (fs.existsSync(waveFile)) {
           const waveData = JSON.parse(fs.readFileSync(waveFile, 'utf-8'));
           originalDirective = waveData.directive ?? '';
+          originalPreset = waveData.preset;
         }
       } catch { /* ignore */ }
 
@@ -188,6 +190,7 @@ class SupervisorHeartbeat {
           waveId,
           directive: originalDirective || text,
           continuous: false,
+          preset: originalPreset,
           supervisorSessionId: ceoSession?.id ?? null,
           executionId: null,
           status: 'stopped',

package/src/tui/app.tsx

@@ -14,6 +14,8 @@
 import React, { useState, useCallback, useMemo, useEffect, useRef } from 'react';
 import { Box, Text, useApp, useInput } from 'ink';
 import { StatusBar } from './components/StatusBar';
+import { OrgTree } from './components/OrgTree';
+import { StreamView } from './components/StreamView';
 import { CommandMode, type StreamLine } from './components/CommandMode';
 import { PanelMode } from './components/PanelMode';
 import { SetupWizard } from './components/SetupWizard';
@@ -668,8 +670,51 @@ export const App: React.FC = () => {
   // Command Mode: scrollable terminal (no fullscreen)
   // Panel Mode: fullscreen (intentional — like vim for inspection)
   if (mode === 'panel') {
+    // OOM debug levels: 0=full, 1=minimal, 2=orgTree only, 3=stream only
+    const debugLevel = parseInt(process.env.PANEL_MINIMAL || '0', 10);
+    if (debugLevel === 1) {
+      return (
+        <Box flexDirection="column">
+          <Text color="cyan">Panel Mode (minimal)</Text>
+          <Text color="gray">Events: {sse.events.length} | Press Esc</Text>
+        </Box>
+      );
+    }
+    if (debugLevel === 2) {
+      return (
+        <Box flexDirection="column">
+          <OrgTree tree={orgTree} focused={true} selectedIndex={0} flatRoles={flatRoleIds} ceoStatus="idle" />
+          <Text color="gray">OrgTree only | Press Esc</Text>
+        </Box>
+      );
+    }
+    if (debugLevel === 3) {
+      return (
+        <Box flexDirection="column">
+          <StreamView events={sse.events} allRoleIds={flatRoleIds} streamStatus={sse.streamStatus} waveId={focusedWaveId} roleLabel="All" />
+          <Text color="gray">StreamView only | Press Esc</Text>
+        </Box>
+      );
+    }
+    if (debugLevel === 4) {
+      // Full layout structure but empty content
+      return (
+        <Box flexDirection="column" height={termHeight}>
+          <Box flexGrow={1}>
+            <Box flexDirection="column" width={28}>
+              <Text color="green">Left Panel</Text>
+            </Box>
+            <Text color="gray">{'\u2502'}</Text>
+            <Box flexGrow={1} flexDirection="column" overflow="hidden">
+              <Text color="cyan">Right Panel</Text>
+            </Box>
+          </Box>
+          <StatusBar companyName="test" waveIndex={1} waveCount={1} waveStatus="idle" activeCount={0} portCount={0} totalCost={0} />
+        </Box>
+      );
+    }
     return (
-      <Box flexDirection="column" height={termHeight}>
+      <Box flexDirection="column">
         <Box flexGrow={1} flexDirection="column">
           <PanelMode
             tree={orgTree}

package/src/tui/components/OrgTree.tsx

@@ -1,6 +1,6 @@
 /**
- * OrgTree — left panel showing organization hierarchy with real-time status
- * CEO is now selectable (index 0 in flatRoles)
+ * OrgTree — left panel showing organization hierarchy
+ * Simplified to single Text render to prevent yoga OOM on wide terminals
  */
 
 import React from 'react';
@@ -16,103 +16,36 @@ interface OrgTreeProps {
   ceoStatus?: string;
 }
 
-function statusColor(status: string): string {
-  switch (status) {
-    case 'working':
-    case 'streaming':
-      return 'green';
-    case 'done':
-      return 'gray';
-    case 'error':
-      return 'red';
-    case 'awaiting_input':
-      return 'yellow';
-    default:
-      return 'gray';
-  }
-}
-
-interface FlatEntry {
-  roleId: string;
-  level: string;
-  status: string;
-  prefix: string;
-}
-
-function flattenTree(nodes: OrgNode[], prefix: string = '', isLast: boolean[] = []): FlatEntry[] {
-  const result: FlatEntry[] = [];
-
+function flattenTree(nodes: OrgNode[], isLast: boolean[] = []): Array<{ roleId: string; status: string; line: string }> {
+  const result: Array<{ roleId: string; status: string; line: string }> = [];
   for (let i = 0; i < nodes.length; i++) {
     const node = nodes[i];
     const last = i === nodes.length - 1;
-
-    let linePrefix = '';
+    let prefix = '';
     for (let j = 0; j < isLast.length; j++) {
-      linePrefix += isLast[j] ? '   ' : '\u2502  ';
+      prefix += isLast[j] ? '   ' : '\u2502  ';
     }
-    linePrefix += isLast.length > 0 || i > 0 || nodes.length > 1
-      ? (last ? '\u2514\u2500 ' : '\u251C\u2500 ')
-      : '';
-
-    result.push({
-      roleId: node.role.id,
-      level: node.role.level,
-      status: node.status,
-      prefix: linePrefix,
-    });
-
+    prefix += last ? '\u2514\u2500 ' : '\u251C\u2500 ';
+    const icon = statusIcon(node.status);
+    result.push({ roleId: node.role.id, status: node.status, line: `${prefix}${icon} ${node.role.id}` });
     if (node.children.length > 0) {
-      result.push(...flattenTree(node.children, '', [...isLast, last]));
+      result.push(...flattenTree(node.children, [...isLast, last]));
     }
   }
-
   return result;
 }
 
 export const OrgTree: React.FC<OrgTreeProps> = React.memo(({ tree, focused, selectedIndex, flatRoles, ceoStatus }) => {
-  const entries = flattenTree(tree);
-  const isCeoSelected = focused && flatRoles[selectedIndex] === 'ceo';
   const ceoIcon = statusIcon(ceoStatus ?? 'idle');
-  const ceoColor = statusColor(ceoStatus ?? 'idle');
+  const entries = flattenTree(tree);
+
+  // Render entire tree as single Text block (1 yoga node instead of 50+)
+  const lines = [`${ceoIcon} CEO`, ...entries.map(e => e.line)];
 
   return (
     <Box flexDirection="column" paddingX={1}>
       <Text bold color={focused ? 'cyan' : 'gray'}>{'\u2500\u2500 Org Tree \u2500\u2500'}</Text>
-      <Box marginTop={1}>
-        <Text color={ceoColor} bold={ceoStatus === 'working'}>{ceoIcon} </Text>
-        <Text
-          color={isCeoSelected ? 'cyan' : 'yellow'}
-          bold={isCeoSelected}
-          inverse={isCeoSelected}
-        >
-          CEO
-        </Text>
-      </Box>
-      {entries.map((entry, i) => {
-        const isSelected = focused && flatRoles[selectedIndex] === entry.roleId;
-        const icon = statusIcon(entry.status);
-        const color = statusColor(entry.status);
-
-        return (
-          <Box key={entry.roleId + '-' + i}>
-            <Text color="gray">{entry.prefix}</Text>
-            <Text
-              color={color}
-              bold={entry.status === 'working'}
-            >
-              {icon}
-            </Text>
-            <Text> </Text>
-            <Text
-              color={isSelected ? 'cyan' : 'white'}
-              bold={isSelected}
-              inverse={isSelected}
-            >
-              {entry.roleId}
-            </Text>
-          </Box>
-        );
-      })}
+      <Text color="white">{'\n' + lines.join('\n')}</Text>
     </Box>
   );
 });

package/src/tui/components/PanelMode.tsx

@@ -139,7 +139,7 @@ function readFilePreview(filePath: string, maxLines: number): string[] {
   }
 }
 
-export const PanelMode: React.FC<PanelModeProps> = React.memo(({
+const PanelModeInner: React.FC<PanelModeProps> = ({
   tree, flatRoles, events, selectedRoleIndex, selectedRoleId,
   streamStatus, waveId, activeSessions, allSessions, companyRoot, waves,
   focusedWaveId, onMove, onSelect, onEscape, onFocusWave,
@@ -338,6 +338,19 @@ export const PanelMode: React.FC<PanelModeProps> = React.memo(({
     ? allSessions.filter(s => s.waveId === focusedWaveId).length
     : 0;
 
+  // Read preset from wave file on disk
+  const wavePreset = useMemo(() => {
+    if (!focusedWaveId || !companyRoot) return null;
+    try {
+      const wavePath = path.join(companyRoot, 'operations', 'waves', `${focusedWaveId}.json`);
+      if (fs.existsSync(wavePath)) {
+        const data = JSON.parse(fs.readFileSync(wavePath, 'utf-8'));
+        return data.preset as string | undefined;
+      }
+    } catch { /* ignore */ }
+    return null;
+  }, [focusedWaveId, companyRoot]);
+
   const leftWidth = 28;
 
   return (
@@ -347,6 +360,9 @@ export const PanelMode: React.FC<PanelModeProps> = React.memo(({
         <Box flexDirection="column" width={leftWidth}>
           <Box paddingX={1}>
             <Text color="green" bold>W{focusedWaveIndex}</Text>
+            {wavePreset && wavePreset !== 'default' && (
+              <Text color="magenta"> ({wavePreset})</Text>
+            )}
             <Text color="gray"> </Text>
             <Text color="white" wrap="truncate">
               {focusedWave?.directive ? focusedWave.directive.slice(0, leftWidth - 6) : '(idle)'}
@@ -385,7 +401,7 @@ export const PanelMode: React.FC<PanelModeProps> = React.memo(({
         <Text color="gray">{separatorStr}</Text>
 
         {/* Right: Tabbed panel */}
-        <Box flexGrow={1} flexDirection="column" overflow="hidden">
+        <Box flexGrow={1} flexDirection="column">
           {/* Tab bar */}
           <Box paddingX={1} marginBottom={0}>
             {(['stream', 'docs', 'info'] as RightTab[]).map(tab => (
@@ -505,6 +521,7 @@ export const PanelMode: React.FC<PanelModeProps> = React.memo(({
               <Text bold color="cyan">Wave Info</Text>
               <Text color="gray">{'\u2500'.repeat(40)}</Text>
               <Text color="white">Wave: {focusedWave?.waveId ?? 'none'}</Text>
+              {wavePreset && <Text color="magenta">Preset: {wavePreset}</Text>}
               <Text color="white">Directive: {focusedWave?.directive || '(idle)'}</Text>
               <Text color="white">Sessions: {waveSessionCount}</Text>
               <Text color="white">Files modified: {waveFileSet.size}</Text>
@@ -545,4 +562,6 @@ export const PanelMode: React.FC<PanelModeProps> = React.memo(({
       </Box>
     </Box>
   );
-}));
+};
+
+export const PanelMode = React.memo(PanelModeInner);