@alia-codea/cli 1.0.0 → 2.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alia-codea/cli",
-  "version": "1.0.0",
+  "version": "2.0.0",
   "description": "Codea CLI - AI coding assistant for your terminal by Alia",
   "main": "dist/index.js",
   "bin": {
@@ -8,7 +8,7 @@
   },
   "type": "module",
   "scripts": {
-    "build": "tsup src/index.ts --format esm --dts --clean",
+    "build": "tsup src/index.ts --format esm --clean",
     "dev": "tsx src/index.ts",
     "start": "node dist/index.js",
     "lint": "eslint src",
@@ -29,19 +29,19 @@
     "chalk": "^5.3.0",
     "commander": "^12.1.0",
     "conf": "^13.0.1",
-    "ink": "^5.0.1",
+    "ink": "^6.7.0",
     "ink-spinner": "^5.0.0",
     "ink-text-input": "^6.0.0",
     "marked": "^15.0.4",
     "marked-terminal": "^7.2.1",
     "openai": "^6.16.0",
     "ora": "^8.1.1",
-    "react": "^18.3.1",
+    "react": "19.2.0",
     "simple-git": "^3.27.0"
   },
   "devDependencies": {
     "@types/node": "^22.10.5",
-    "@types/react": "^18.3.12",
+    "@types/react": "^19.2.0",
     "tsup": "^8.3.5",
     "tsx": "^4.19.2",
     "typescript": "^5.7.2"

package/src/app.tsx

@@ -0,0 +1,281 @@
+import React, { useState, useCallback, useRef, useEffect } from 'react';
+import { Box, Text, useApp, useInput } from 'ink';
+import { Header } from './components/Header.js';
+import { MessageList, DisplayMessage } from './components/MessageList.js';
+import { InputBar } from './components/InputBar.js';
+import { ApprovalPrompt } from './components/ApprovalPrompt.js';
+import { processConversation, Message, ToolExecution } from './utils/conversation.js';
+import { buildSystemMessage, getCodebaseContext, loadProjectInstructions } from './utils/context.js';
+import { createSession, saveSession } from './utils/config.js';
+import { ApprovalMode } from './utils/approval.js';
+
+export interface AppOptions {
+  model: string;
+  approvalMode: ApprovalMode;
+  context: boolean;
+}
+
+let msgCounter = 0;
+function nextId(): string {
+  return `msg-${++msgCounter}`;
+}
+
+export function App({ options }: { options: AppOptions }) {
+  const { exit } = useApp();
+  const [displayMessages, setDisplayMessages] = useState<DisplayMessage[]>([]);
+  const [isProcessing, setIsProcessing] = useState(false);
+  const [thinkingLabel, setThinkingLabel] = useState('Thinking');
+  const [approvalMode, setApprovalMode] = useState<ApprovalMode>(options.approvalMode);
+  const [contextPercent, setContextPercent] = useState(100);
+  const [pendingApproval, setPendingApproval] = useState<{
+    execution: ToolExecution;
+    resolve: (approved: boolean) => void;
+  } | null>(null);
+  const [ready, setReady] = useState(false);
+  const [codebaseContext, setCodebaseContext] = useState('');
+  const [instructions, setInstructions] = useState('');
+
+  const messagesRef = useRef<Message[]>([]);
+  const sessionRef = useRef(createSession());
+  const activeRef = useRef(true);
+  const streamingIdRef = useRef<string | null>(null);
+
+  // Initialize on mount
+  useEffect(() => {
+    let cancelled = false;
+    (async () => {
+      let ctx = '';
+      let instr = '';
+      if (options.context !== false) {
+        ctx = await getCodebaseContext();
+        if (ctx && !cancelled) {
+          setDisplayMessages((prev) => [
+            ...prev,
+            { id: nextId(), type: 'info', content: `Loaded context from ${ctx.split('\n').length} lines` },
+          ]);
+        }
+      }
+      instr = await loadProjectInstructions();
+      if (instr && !cancelled) {
+        const count = instr.split('\n---\n').length;
+        setDisplayMessages((prev) => [
+          ...prev,
+          { id: nextId(), type: 'info', content: `Loaded ${count} CODEA.md instruction file(s)` },
+        ]);
+      }
+      if (!cancelled) {
+        setCodebaseContext(ctx);
+        setInstructions(instr);
+        setReady(true);
+      }
+    })();
+    return () => { cancelled = true; };
+  }, []);
+
+  // Handle Ctrl+C
+  useInput((_input, key) => {
+    if (key.ctrl && (_input === 'c' || _input === 'C')) {
+      if (isProcessing) {
+        activeRef.current = false;
+        setIsProcessing(false);
+        setPendingApproval(null);
+        setDisplayMessages((prev) => [
+          ...prev,
+          { id: nextId(), type: 'info', content: 'Cancelled.' },
+        ]);
+      } else {
+        exit();
+      }
+    }
+  });
+
+  const addMessage = useCallback((msg: DisplayMessage) => {
+    setDisplayMessages((prev) => [...prev, msg]);
+  }, []);
+
+  const updateLastAssistant = useCallback((text: string) => {
+    setDisplayMessages((prev) => {
+      const last = prev[prev.length - 1];
+      if (last && last.type === 'assistant' && last.streaming) {
+        return [...prev.slice(0, -1), { ...last, content: last.content + text }];
+      }
+      return prev;
+    });
+  }, []);
+
+  const finalizeAssistant = useCallback(() => {
+    setDisplayMessages((prev) => {
+      const last = prev[prev.length - 1];
+      if (last && last.type === 'assistant' && last.streaming) {
+        return [...prev.slice(0, -1), { ...last, streaming: false }];
+      }
+      return prev;
+    });
+  }, []);
+
+  const handleSubmit = useCallback(async (input: string) => {
+    // Handle slash commands
+    if (input.startsWith('/')) {
+      const [cmd, ...args] = input.slice(1).split(' ');
+      switch (cmd.toLowerCase()) {
+        case 'help':
+          addMessage({
+            id: nextId(),
+            type: 'info',
+            content: 'Commands: /help, /clear, /mode <suggest|auto-edit|full-auto>, /model <name>, /exit',
+          });
+          return;
+        case 'clear':
+          messagesRef.current = [];
+          setDisplayMessages([]);
+          setContextPercent(100);
+          return;
+        case 'mode':
+          if (args[0] && ['suggest', 'auto-edit', 'full-auto'].includes(args[0])) {
+            setApprovalMode(args[0] as ApprovalMode);
+            addMessage({ id: nextId(), type: 'info', content: `Approval mode: ${args[0]}` });
+          } else {
+            addMessage({ id: nextId(), type: 'info', content: `Current mode: ${approvalMode}. Options: suggest, auto-edit, full-auto` });
+          }
+          return;
+        case 'model':
+          if (args[0]) {
+            options.model = args[0].startsWith('alia-') ? args[0] : `alia-v1-${args[0]}`;
+            addMessage({ id: nextId(), type: 'info', content: `Model: ${options.model}` });
+          } else {
+            addMessage({ id: nextId(), type: 'info', content: `Current model: ${options.model}` });
+          }
+          return;
+        case 'exit':
+        case 'quit':
+          exit();
+          return;
+        default:
+          addMessage({ id: nextId(), type: 'info', content: `Unknown command: /${cmd}` });
+          return;
+      }
+    }
+
+    // Add user message
+    addMessage({ id: nextId(), type: 'user', content: input });
+    messagesRef.current.push({ role: 'user', content: input });
+
+    setIsProcessing(true);
+    activeRef.current = true;
+    streamingIdRef.current = null;
+
+    const systemMessage = buildSystemMessage(options.model, codebaseContext, instructions);
+
+    await processConversation({
+      messages: messagesRef.current,
+      systemMessage,
+      model: options.model,
+      approvalMode,
+      isActive: () => activeRef.current,
+      requestApproval: (execution) => {
+        return new Promise<boolean>((resolve) => {
+          setPendingApproval({ execution, resolve });
+        });
+      },
+      onEvent: (event) => {
+        switch (event.type) {
+          case 'thinking':
+            setThinkingLabel('Thinking');
+            // Start a new streaming assistant message
+            streamingIdRef.current = nextId();
+            setDisplayMessages((prev) => [
+              ...prev,
+              { id: streamingIdRef.current!, type: 'assistant', content: '', streaming: true },
+            ]);
+            break;
+          case 'content':
+            updateLastAssistant(event.text);
+            break;
+          case 'tool_start':
+            // Finalize any streaming text before showing tool
+            finalizeAssistant();
+            setThinkingLabel(`Running ${event.execution.tool}`);
+            addMessage({
+              id: nextId(),
+              type: 'tool',
+              content: '',
+              toolExecution: { ...event.execution },
+            });
+            break;
+          case 'tool_done':
+            // Update the tool message with result
+            setDisplayMessages((prev) => {
+              const idx = prev.findLastIndex(
+                (m) => m.type === 'tool' && m.toolExecution?.id === event.execution.id
+              );
+              if (idx >= 0) {
+                const updated = [...prev];
+                updated[idx] = {
+                  ...updated[idx],
+                  toolExecution: { ...event.execution },
+                };
+                return updated;
+              }
+              return prev;
+            });
+            break;
+          case 'done':
+            finalizeAssistant();
+            break;
+          case 'error':
+            finalizeAssistant();
+            addMessage({ id: nextId(), type: 'info', content: `Error: ${event.message}` });
+            break;
+        }
+      },
+    });
+
+    setIsProcessing(false);
+    setPendingApproval(null);
+
+    // Save session
+    const session = sessionRef.current;
+    session.messages = messagesRef.current.map((m) => ({ role: m.role, content: m.content }));
+    session.title = messagesRef.current[0]?.content.slice(0, 50) || 'New conversation';
+    session.updatedAt = Date.now();
+    saveSession(session);
+
+    // Update context estimate
+    const totalChars = messagesRef.current.reduce((acc, m) => acc + m.content.length, 0);
+    const maxContext = 128000;
+    setContextPercent(Math.max(5, 100 - Math.floor((totalChars / maxContext) * 100)));
+  }, [approvalMode, codebaseContext, instructions, options]);
+
+  const handleApprovalResolve = useCallback((approved: boolean) => {
+    if (pendingApproval) {
+      pendingApproval.resolve(approved);
+      setPendingApproval(null);
+    }
+  }, [pendingApproval]);
+
+  const modelDisplay = options.model.replace('alia-v1-', '');
+
+  return (
+    <Box flexDirection="column">
+      <Header
+        cwd={process.cwd()}
+        model={modelDisplay}
+        approvalMode={approvalMode}
+        contextPercent={contextPercent}
+      />
+      <MessageList messages={displayMessages} />
+      {pendingApproval ? (
+        <ApprovalPrompt
+          execution={pendingApproval.execution}
+          onResolve={handleApprovalResolve}
+        />
+      ) : (
+        <InputBar
+          onSubmit={handleSubmit}
+          isProcessing={isProcessing}
+          thinkingLabel={thinkingLabel}
+        />
+      )}
+    </Box>
+  );
+}

package/src/commands/auth.ts

@@ -1,18 +1,134 @@
 import * as readline from 'readline';
+import * as crypto from 'crypto';
+import * as http from 'http';
+import { exec } from 'child_process';
 import chalk from 'chalk';
 import { config } from '../utils/config.js';
-import { printSuccess, printError, printInfo } from '../utils/ui.js';
+function printSuccess(message: string): void {
+  console.log(chalk.green('✓ ') + message);
+}
 
-export async function login(): Promise<void> {
-  console.log();
-  console.log(chalk.bold('Codea CLI Login'));
-  console.log(chalk.gray('Enter your Alia API key to get started.'));
-  console.log(chalk.gray('Get your API key at: ') + chalk.cyan('https://alia.onl/settings/api'));
-  console.log();
+function printError(message: string): void {
+  console.log(chalk.red('✗ Error: ') + message);
+}
+
+function printInfo(message: string): void {
+  console.log(chalk.blue('ℹ ') + message);
+}
+
+function openBrowser(url: string): void {
+  const cmd =
+    process.platform === 'darwin'
+      ? 'open'
+      : process.platform === 'win32'
+        ? 'start ""'
+        : 'xdg-open';
+  exec(`${cmd} "${url}"`);
+}
+
+async function loginWithBrowser(): Promise<boolean> {
+  const codeVerifier = crypto.randomBytes(32).toString('base64url');
+  const codeChallenge = crypto
+    .createHash('sha256')
+    .update(codeVerifier)
+    .digest('base64url');
+
+  return new Promise((resolve) => {
+    const server = http.createServer(async (req, res) => {
+      const url = new URL(req.url!, `http://localhost`);
+      if (url.pathname !== '/callback') {
+        res.writeHead(404);
+        res.end();
+        return;
+      }
+
+      const code = url.searchParams.get('code');
+      const error = url.searchParams.get('error');
+
+      if (error || !code) {
+        res.writeHead(200, { 'Content-Type': 'text/html' });
+        res.end(
+          '<html><body style="font-family:system-ui;text-align:center;padding:60px">' +
+            '<h2>Authorization cancelled</h2><p>You can close this window.</p></body></html>',
+        );
+        server.close();
+        resolve(false);
+        return;
+      }
+
+      try {
+        const baseUrl = config.get('apiBaseUrl') || 'https://api.alia.onl';
+        const response = await fetch(`${baseUrl}/auth/token`, {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({
+            grant_type: 'authorization_code',
+            code,
+            code_verifier: codeVerifier,
+            client_id: 'codea',
+          }),
+        });
+
+        const data = (await response.json()) as { token?: string };
+
+        if (data.token) {
+          config.set('apiKey', data.token);
+          res.writeHead(200, { 'Content-Type': 'text/html' });
+          res.end(
+            '<html><body style="font-family:system-ui;text-align:center;padding:60px">' +
+              '<h2>Logged in!</h2><p>You can close this window and return to the terminal.</p></body></html>',
+          );
+          console.log();
+          printSuccess('Logged in successfully!');
+          server.close();
+          resolve(true);
+        } else {
+          throw new Error('No token received');
+        }
+      } catch {
+        res.writeHead(200, { 'Content-Type': 'text/html' });
+        res.end(
+          '<html><body style="font-family:system-ui;text-align:center;padding:60px">' +
+            '<h2>Login failed</h2><p>Please try again.</p></body></html>',
+        );
+        printError('Failed to exchange authorization code.');
+        server.close();
+        resolve(false);
+      }
+    });
+
+    server.listen(0, () => {
+      const port = (server.address() as { port: number }).port;
+      const callback = encodeURIComponent(`http://localhost:${port}/callback`);
+      const authorizeUrl =
+        `https://alia.onl/authorize?app=codea` +
+        `&callback=${callback}` +
+        `&code_challenge=${codeChallenge}` +
+        `&code_challenge_method=S256`;
 
+      printInfo('Opening browser for authorization...');
+      openBrowser(authorizeUrl);
+      console.log(
+        chalk.gray('\nIf the browser doesn\'t open, visit:\n') +
+          chalk.cyan(authorizeUrl) +
+          '\n',
+      );
+      console.log(chalk.gray('Waiting for authorization...'));
+    });
+
+    // Timeout after 5 minutes
+    setTimeout(() => {
+      server.close();
+      printError('Authorization timed out.');
+      resolve(false);
+    }, 5 * 60 * 1000);
+  });
+}
+
+async function loginWithApiKey(): Promise<boolean> {
   const rl = readline.createInterface({
     input: process.stdin,
-    output: process.stdout
+    output: process.stdout,
   });
 
   return new Promise((resolve) => {
@@ -20,46 +136,59 @@ export async function login(): Promise<void> {
       rl.close();
 
       const trimmedKey = apiKey.trim();
-
       if (!trimmedKey) {
         printError('No API key provided.');
-        resolve();
+        resolve(false);
         return;
       }
 
-      // Validate the API key by making a test request
       printInfo('Validating API key...');
 
       try {
         const baseUrl = config.get('apiBaseUrl') || 'https://api.alia.onl';
         const response = await fetch(`${baseUrl}/codea/me`, {
-          headers: {
-            'Authorization': `Bearer ${trimmedKey}`
-          }
+          headers: { Authorization: `Bearer ${trimmedKey}` },
         });
 
         if (response.ok) {
-          const data = await response.json();
+          const data = (await response.json()) as { name?: string };
           config.set('apiKey', trimmedKey);
           console.log();
-          printSuccess(`Logged in successfully!`);
+          printSuccess('Logged in successfully!');
           if (data.name) {
             console.log(chalk.gray(`Welcome, ${data.name}!`));
           }
-          console.log();
-          console.log(chalk.gray('Run ') + chalk.cyan('codea') + chalk.gray(' to start coding.'));
+          resolve(true);
         } else {
           printError('Invalid API key. Please check and try again.');
+          resolve(false);
         }
       } catch (error: any) {
         printError(`Could not validate API key: ${error.message}`);
+        resolve(false);
       }
-
-      resolve();
     });
   });
 }
 
+export async function login(): Promise<boolean> {
+  console.log();
+  console.log(chalk.bold('Codea CLI Login'));
+  console.log();
+
+  const success = await loginWithBrowser();
+  if (success) return true;
+
+  // Fallback to manual API key entry
+  console.log();
+  console.log(
+    chalk.gray('Alternatively, paste your API key from: ') +
+      chalk.cyan('https://alia.onl/settings/api'),
+  );
+  console.log();
+  return loginWithApiKey();
+}
+
 export function logout(): void {
   config.delete('apiKey');
   printSuccess('Logged out successfully.');