feat: add fullscreen TUI mode with Ink React components

package.json

@@ -9,6 +9,7 @@
     "dev": "tsx watch src/index.ts",
     "start": "node dist/index.js",
     "tui": "tsx src/tui.ts",
+    "tui:fs": "tsx src/tui.ts --fullscreen",
     "tui:dev": "tsx watch src/tui.ts",
     "test": "vitest",
     "test:run": "vitest run",

src/frontends/tui/fullscreen.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { render } from 'ink';
+import { App } from './components/index.js';
+import type { ManagedSession } from '../../session/index.js';
+import type { ModelClient } from '../../models/types.js';
+
+export interface FullscreenTuiConfig {
+  session: ManagedSession;
+  modelClient: ModelClient;
+  systemPrompt: string;
+  model: string;
+  onExit?: () => void;
+}
+
+export async function startFullscreenTui(config: FullscreenTuiConfig): Promise<void> {
+  const { waitUntilExit } = render(
+    React.createElement(App, {
+      session: config.session,
+      modelClient: config.modelClient,
+      systemPrompt: config.systemPrompt,
+      model: config.model,
+      onExit: config.onExit,
+    })
+  );
+
+  await waitUntilExit();
+}

src/frontends/tui/index.ts

@@ -5,3 +5,10 @@ export {
   type TuiCommand,
   type MinimalTuiConfig,
 } from './minimal.js';
+
+export {
+  startFullscreenTui,
+  type FullscreenTuiConfig,
+} from './fullscreen.js';
+
+export { App, StatusBar, MessageList, InputBar } from './components/index.js';

src/tui.ts

@@ -1,7 +1,7 @@
 import { loadConfig } from './config/index.js';
 import { SessionStore, SessionManager } from './session/index.js';
 import { AnthropicClient, OpenAIClient, OllamaClient, ModelRouter } from './models/index.js';
-import { MinimalTui } from './frontends/tui/index.js';
+import { MinimalTui, startFullscreenTui } from './frontends/tui/index.js';
 import type { Config } from './config/index.js';
 import { resolve } from 'path';
 import { homedir } from 'os';
@@ -61,6 +61,9 @@ function createModelRouter(config: Config): ModelRouter {
 }
 
 async function main() {
+  const args = process.argv.slice(2);
+  const fullscreenMode = args.includes('--fullscreen') || args.includes('-f');
+
   console.log('Flynn TUI starting...');
 
   if (!existsSync(CONFIG_PATH)) {
@@ -83,7 +86,26 @@ async function main() {
   // Get TUI session
   const session = sessionManager.getSession('tui', 'local');
 
-  // Create and start minimal TUI
+  const cleanup = () => {
+    sessionStore.close();
+  };
+
+  process.on('SIGINT', () => {
+    cleanup();
+    process.exit(0);
+  });
+
+  if (fullscreenMode) {
+    // Start fullscreen Ink UI
+    await startFullscreenTui({
+      session,
+      modelClient: modelRouter,
+      systemPrompt: SYSTEM_PROMPT,
+      model: config.models.default.model,
+      onExit: cleanup,
+    });
+  } else {
+    // Start minimal readline UI
     const tui = new MinimalTui({
       session,
       modelClient: modelRouter,
@@ -97,22 +119,28 @@ async function main() {
           console.log(`Unknown transfer target: ${target}\n`);
         }
       },
-    onFullscreen: () => {
-      console.log('Fullscreen mode not yet implemented.\n');
+      onFullscreen: async () => {
+        tui.stop();
+        console.clear();
+        await startFullscreenTui({
+          session,
+          modelClient: modelRouter,
+          systemPrompt: SYSTEM_PROMPT,
+          model: config.models.default.model,
+          onExit: () => {
+            // Return to minimal mode would require re-init
+            // For now, just exit
+            cleanup();
+            process.exit(0);
+          },
+        });
       },
     });
 
-  // Handle shutdown
-  process.on('SIGINT', () => {
-    tui.stop();
-    sessionStore.close();
-    process.exit(0);
-  });
-
     await tui.start();
+  }
 
-  // Cleanup
-  sessionStore.close();
+  cleanup();
 }
 
 main().catch((error) => {