@abacus-ai/cli 2.0.0-canary.1 → 2.0.0-canary.11

package/src/components/composer/index.tsx

@@ -1,1007 +0,0 @@
-import type { IAbacusConvoListResponse } from "@codellm/api";
-
-import { PromptHistory } from "@codellm/agent";
-import { getDeviceId } from "@codellm/auth";
-import { View, Text } from "@codellm/jar";
-import { product } from "@codellm/product";
-import {
-  type Ref,
-  memo,
-  Suspense,
-  useCallback,
-  useEffect,
-  useImperativeHandle,
-  useMemo,
-  useRef,
-  useState,
-} from "react";
-
-import type { InterruptHints } from "../../hooks/use-interrupt-manager.js";
-
-import { useAgentMode } from "../../context/agent-mode.js";
-import { useExtensionFile } from "../../context/extension-file.js";
-import { useShellSize } from "../../context/shell-size.js";
-import { useAgent } from "../../hooks/use-agent.js";
-import { useApiClient } from "../../hooks/use-api-client.js";
-import { useAvailableHeight } from "../../hooks/use-available-height.js";
-import { useModels } from "../../hooks/use-models.js";
-import {
-  clipboardHasImage,
-  saveClipboardImage,
-  readClipboardText,
-  isMacOSTempScreenshot,
-  copyTempScreenshotToProject,
-} from "../../lib/clipboard.js";
-import { MAX_RECENT_CONVERSATIONS } from "../../lib/constants.js";
-import {
-  parsePastedPaths,
-  prettifyMentionPath,
-  escapePathForMention,
-} from "../../lib/path-paste.js";
-import { abbreviateHome } from "../../lib/path.js";
-import { isWindows, sleep } from "../../lib/utils.js";
-import { AgentStatus } from "../../providers/agent.js";
-import { gracefulExit } from "../../terminal/exit.js";
-import { useTheme } from "../../theme/index.js";
-import { Input, InputKeyDownEvent } from "../ui/input.js";
-import { registerDefaultCommands } from "./commands/default-commands.js";
-import { commandRegistry } from "./commands/registry.js";
-import { ComposerProvider, useComposerContext } from "./context.js";
-import { buildMentionGrammar, getMentionAtCursor } from "./mentions.js";
-import { MessageQueue } from "./message-queue.js";
-import { ModePanel } from "./mode-panel.js";
-import { useModeHandlers } from "./modes/index.js";
-import { ComposerMode, ModeMeta } from "./types.js";
-
-const MODE_META: Record<ComposerMode, ModeMeta> = {
-  [ComposerMode.Prompt]: {
-    color: undefined,
-    placeholder: 'Try "Build a ecommerce website..."',
-    prefix: "❯",
-  },
-  [ComposerMode.Help]: {
-    color: undefined,
-    placeholder: 'Try "Build a ecommerce website..."',
-    prefix: "❯",
-  },
-  [ComposerMode.Bash]: {
-    color: "greenBright",
-    placeholder: isWindows() ? 'Try "dir"' : 'Try "ls -la"',
-    prefix: "!",
-  },
-  [ComposerMode.Command]: {
-    color: "magentaBright",
-    placeholder: 'Try "/resume <chat title>"',
-    prefix: "❯",
-  },
-  [ComposerMode.Files]: { color: "cyanBright", placeholder: 'Try "@help.md"', prefix: "@" },
-};
-
-const MODE_TRIGGERS: Record<
-  string,
-  { mode: ComposerMode; preventDefault: boolean; atStartOnly: boolean }
-> = {
-  "!": { mode: ComposerMode.Bash, preventDefault: true, atStartOnly: true },
-  "?": { mode: ComposerMode.Help, preventDefault: true, atStartOnly: true },
-  "/": { mode: ComposerMode.Command, preventDefault: true, atStartOnly: true },
-  "@": { mode: ComposerMode.Files, preventDefault: false, atStartOnly: false },
-};
-
-export interface ComposerHandle {
-  hasText: () => boolean;
-  hasQueue: () => boolean;
-  saveAndClear: () => void;
-  clear: () => void;
-  clearQueue: () => void;
-}
-
-const ComposerInner = memo(
-  ({ hints, composerRef }: { hints?: InterruptHints; composerRef?: Ref<ComposerHandle> }) => {
-    const {
-      prompt,
-      setPrompt,
-      mode,
-      setMode,
-      bufferRef,
-      activity,
-      setActivity,
-      queuedMessages,
-      addToQueue,
-      clearQueue,
-      attachments,
-      addAttachment,
-      clearAttachments,
-    } = useComposerContext();
-
-    // Inline paste helpers — delegate to TextBuffer's built-in placeholder system
-    const expandPlaceholders = useCallback(
-      (text: string) => bufferRef.current?.getExpandedText(text) ?? text,
-      [bufferRef],
-    );
-    const clearPlaceholders = useCallback(() => {
-      // no-op: TextBuffer clears its own pastedContent map on setText("")
-    }, []);
-
-    // Non-bracketed paste debounce accumulator (for terminals without BP support)
-    const nonBpAccumRef = useRef<{ text: string; timer: ReturnType<typeof setTimeout> | null }>({
-      text: "",
-      timer: null,
-    });
-
-    // ── Prompt history (persisted across sessions) ──
-    const promptHistoryRef = useRef<PromptHistory | null>(null);
-    if (!promptHistoryRef.current) {
-      promptHistoryRef.current = new PromptHistory("cli-repl");
-      void promptHistoryRef.current.load();
-    }
-    const promptHistory = promptHistoryRef.current;
-    const draftRef = useRef<string>("");
-    const prevTextLenRef = useRef(0);
-
-    // Expose imperative handle for interrupt manager
-    useImperativeHandle(composerRef, () => ({
-      hasText: () => prompt.length > 0,
-      hasQueue: () => queuedMessages.length > 0,
-      saveAndClear: () => {
-        const text = prompt.trim();
-        if (text) {
-          promptHistory.append(text);
-          promptHistory.resetNavigation();
-        }
-        bufferRef.current?.setText("");
-        clearPlaceholders();
-        clearAttachments();
-      },
-      clear: () => {
-        bufferRef.current?.setText("");
-        clearPlaceholders();
-        clearAttachments();
-      },
-      clearQueue: () => clearQueue(),
-    }));
-    const { currentFile, selectionStartLine, selectionEndLine } = useExtensionFile();
-    const {
-      sendMessage,
-      clearSegments,
-      clearSegmentsOnly,
-      clearTempSegments,
-      stop,
-      addNotification,
-      mcp,
-      addAllowedDirectory,
-      refreshMcpTools,
-      loadConversation,
-      agentStatus,
-      segmentsLength,
-      dequeuedOnStop,
-      clearDequeuedOnStop,
-      networkOnline,
-    } = useAgent();
-    const { apiClient, authManager } = useApiClient();
-    const { data: models = [], refetch: refetchModels } = useModels(apiClient);
-    const { width: terminalWidth } = useShellSize();
-    const { cycleAgentMode, resetToNormal, isWaitingForYoloConfirm } = useAgentMode();
-    const { setTheme } = useTheme();
-    const availableHeight = useAvailableHeight();
-    const clearBuffer = useCallback(() => {
-      bufferRef.current?.setText("");
-    }, [bufferRef]);
-    const { handlers, getActivity, bashNavigateHistory } = useModeHandlers(
-      () => setMode(ComposerMode.Prompt),
-      clearBuffer,
-    );
-    const currentHandler = handlers.get(mode) || null;
-    const [conversations, setConversations] = useState<
-      NonNullable<IAbacusConvoListResponse["result"]>
-    >([]);
-    const [selectedModel, setSelectedModel] = useState<string>("");
-    const [isLoggedIn, setIsLoggedIn] = useState<boolean | null>(null);
-
-    const loadConversations = useCallback(async () => {
-      try {
-        const response = await apiClient.getConversationsList(product.agentType, process.cwd());
-        if (response?.result) {
-          setConversations(response.result.slice(0, MAX_RECENT_CONVERSATIONS));
-        }
-      } catch {
-        // Silently fail - conversations list is optional
-      }
-    }, [apiClient]);
-
-    useEffect(() => {
-      void loadConversations();
-    }, [loadConversations]);
-
-    useEffect(() => {
-      apiClient
-        .getUserInfo()
-        .then((res) => setIsLoggedIn(!!res?.result?.email))
-        .catch(() => {
-          // Network error or other failure — fall back to local auth check.
-          // Don't assume "not logged in" just because the server is unreachable.
-          setIsLoggedIn(authManager.isAuthenticated());
-        });
-    }, [apiClient, authManager]);
-
-    useEffect(() => {
-      if (dequeuedOnStop) {
-        bufferRef.current?.setText(dequeuedOnStop);
-        clearDequeuedOnStop();
-      }
-    }, [dequeuedOnStop, clearDequeuedOnStop, bufferRef]);
-
-    useEffect(() => {
-      registerDefaultCommands({
-        onExit: () => {
-          gracefulExit(0);
-        },
-        onNewChat: () => {
-          clearSegments();
-          clearQueue();
-          bufferRef.current?.setText("");
-        },
-        onClearChat: () => {
-          clearSegmentsOnly();
-          bufferRef.current?.setText("");
-        },
-        onStop: () => {
-          stop();
-        },
-        onModelChange: (llmName: string) => {
-          const matchedModel = models.find((m) => m.llmName === llmName);
-          if (matchedModel) {
-            setSelectedModel(matchedModel.llmName);
-            bufferRef.current?.setText("");
-            addNotification(
-              `Switched to model: ${matchedModel.name || matchedModel.llmName}`,
-              "info",
-            );
-          } else {
-            addNotification(`Model not found`, "error");
-          }
-        },
-        onResumeChat: async (title: string) => {
-          const matchedConversation = conversations.find((conv) => {
-            const convTitle = conv.name || conv.deploymentConversationId || "Untitled";
-            return convTitle.toLowerCase().includes(title.toLowerCase());
-          });
-
-          if (matchedConversation?.deploymentConversationId) {
-            try {
-              // Clear queue and buffer before loading conversation
-              // This ensures state is properly reset when resuming multiple times
-              clearQueue();
-              bufferRef.current?.setText("");
-              await loadConversation(matchedConversation.deploymentConversationId);
-              addNotification(
-                `Resumed conversation: ${matchedConversation.name || matchedConversation.deploymentConversationId}`,
-                "info",
-              );
-            } catch (error) {
-              addNotification(
-                `Failed to load conversation: ${error instanceof Error ? error.message : "Unknown error"}`,
-                "error",
-              );
-            }
-          } else {
-            addNotification(`Conversation "${title}" not found`, "error");
-          }
-        },
-        onLogin: async (emailOrApiKey?: string) => {
-          try {
-            if (authManager.isEnvAuth()) {
-              addNotification(
-                "You are authenticated via an environment variable. Unset it to use /login or /logout.",
-                "error",
-              );
-              return;
-            }
-
-            if (!emailOrApiKey) {
-              addNotification("Usage: /login <email> or /login <api_key>", "error");
-              return;
-            }
-
-            const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-            const isEmail = emailRegex.test(emailOrApiKey);
-
-            if (isEmail) {
-              const email = emailOrApiKey;
-              const deviceId = await getDeviceId();
-              const response = await apiClient.authenticateDeviceForCodeLlm(email, deviceId);
-              if (!response?.success || !response?.result) {
-                addNotification(response?.error ?? "Failed to start device code login", "error");
-                return;
-              }
-
-              const { verificationUri, userCode, pollingInterval } = response.result;
-              addNotification(
-                `Open the URL and enter the code to authenticate.\n\nURL:  ${verificationUri}\nCode: ${userCode}\n\nPolling for completion...`,
-                "info",
-              );
-
-              void (async () => {
-                const intervalMs = (pollingInterval || 5) * 1000;
-                const deadline = Date.now() + 10 * 60 * 1000;
-                while (Date.now() < deadline) {
-                  await sleep(intervalMs);
-                  try {
-                    const res = await apiClient.pollDeviceCode(userCode);
-                    if (res?.success && res.result?.deviceCode) {
-                      const token = res.result.deviceCode;
-                      const chatWebUrl = res.result.chatWebUrl;
-                      await authManager.loginWithDeviceCode(token);
-                      if (chatWebUrl) {
-                        const normalized = chatWebUrl.replace(/^https?:\/\//, "");
-                        apiClient.setChatWebDomain(normalized);
-                      }
-                      addNotification("Authentication successful!", "info");
-                      setIsLoggedIn(true);
-                      await loadConversations();
-                      await refetchModels();
-                      return;
-                    }
-                  } catch {
-                    // keep polling
-                  }
-                }
-                addNotification("Authentication timed out. Please try again.", "error");
-              })();
-            } else {
-              // API key login
-              await authManager.loginWithApiKey(emailOrApiKey);
-              try {
-                const userInfo = await apiClient.getUserInfo();
-                if (userInfo?.result?.email) {
-                  addNotification("API key login successful!", "info");
-                  setIsLoggedIn(true);
-                  await loadConversations();
-                  await refetchModels();
-                } else {
-                  await authManager.logout();
-                  addNotification("Invalid API key — authentication failed", "error");
-                }
-              } catch (error) {
-                await authManager.logout();
-                addNotification(
-                  `API key authentication failed: ${error instanceof Error ? error.message : "Unknown error"}`,
-                  "error",
-                );
-              }
-            }
-            bufferRef.current?.setText("");
-          } catch (error) {
-            addNotification(
-              `Login failed: ${error instanceof Error ? error.message : "Unknown error"}`,
-              "error",
-            );
-          }
-        },
-        onLogout: async () => {
-          if (authManager.isEnvAuth()) {
-            addNotification(
-              "You are authenticated via an environment variable. Unset it to use /login or /logout.",
-              "error",
-            );
-            return;
-          }
-          await authManager.logout();
-          setIsLoggedIn(false);
-        },
-        getUserInfo: async () => {
-          try {
-            const response = await apiClient.getUserInfo();
-            if (response?.success && response.result) {
-              const { name, email, organization } = response.result;
-              const team = organization?.name || "No team";
-              const authKind = authManager.getAuthKind();
-              const authMethod =
-                authKind.type === "env_api_key"
-                  ? "API key (env)"
-                  : authKind.type === "env_device_code"
-                    ? "Device code (env)"
-                    : authKind.type === "api_key"
-                      ? "API key"
-                      : authKind.type === "device_code"
-                        ? "Device code"
-                        : authKind.type === "oauth_token"
-                          ? "OAuth token"
-                          : "Unknown";
-              addNotification(
-                `User Status:\n\nName: ${name || "N/A"}\nEmail: ${email || "N/A"}\nTeam: ${team}\nAuth Method: ${authMethod}`,
-                "info",
-              );
-            } else {
-              addNotification("Failed to get user info", "error");
-            }
-          } catch {
-            addNotification("Failed to get user info", "error");
-          }
-        },
-        getModels: async () => {
-          return models
-            .filter((m) => m.codeAgentSupported)
-            .map((m) => ({
-              label: m.name || m.llmName,
-              value: m.llmName,
-              model: m,
-            }));
-        },
-        getChatTitles: async () => {
-          return conversations.map((conv) => {
-            const title = conv.name || conv.deploymentConversationId || "Untitled";
-            return title.length > 50 ? title.substring(0, 47) + "..." : title;
-          });
-        },
-        addNotification,
-        mcp,
-        addAllowedDirectory,
-        refreshMcpTools,
-        getAgentStatus: () => agentStatus,
-        setTheme,
-        checkEnvAuth: () => ({
-          isEnvAuth: authManager.isEnvAuth(),
-          shouldHide: authManager.isEnvAuth(),
-        }),
-      });
-    }, [
-      models,
-      clearSegments,
-      clearSegmentsOnly,
-      clearQueue,
-      bufferRef,
-      apiClient,
-      refetchModels,
-      stop,
-      addNotification,
-      mcp,
-      addAllowedDirectory,
-      refreshMcpTools,
-      loadConversation,
-      conversations,
-      loadConversations,
-      agentStatus,
-      setTheme,
-    ]);
-
-    // ── Clipboard attachment helper ─────────────────────────────────────────
-    const attachImageFromPath = useCallback(
-      async (imagePath: string) => {
-        try {
-          const { default: fsPromises } = await import("node:fs/promises");
-          const { default: pathMod } = await import("node:path");
-          const stats = await fsPromises.stat(imagePath);
-          const buffer = await fsPromises.readFile(imagePath);
-          const ext = pathMod.extname(imagePath).toLowerCase();
-          const mimeType = ext === ".jpg" || ext === ".jpeg" ? "image/jpeg" : "image/png";
-          const docId =
-            "tui-" + Math.random().toString(36).slice(2, 11) + "-" + Date.now().toString(36);
-          addAttachment({
-            doc_id: docId,
-            filename: imagePath,
-            filePath: pathMod.resolve(imagePath),
-            fileName: pathMod.basename(imagePath),
-            content: buffer.toString("base64"),
-            mimeType,
-            mime_type: mimeType,
-            size: stats.size,
-            metadata: {
-              uploadedAt: new Date().toISOString(),
-              source: "tui-clipboard",
-              isImage: true,
-              encoding: "base64",
-            },
-          });
-        } catch {
-          // silently ignore attachment errors
-        }
-      },
-      [addAttachment],
-    );
-
-    // ── Native clipboard paste handler (Ctrl+V / Cmd+V) ─────────────────────
-    // Triggered when the OS clipboard is read directly (not via bracketed paste).
-    const handleClipboardPaste = useCallback(async () => {
-      // 1. Check for clipboard image first
-      if (await clipboardHasImage()) {
-        const saved = await saveClipboardImage(process.cwd());
-        if (saved) {
-          const pretty = prettifyMentionPath(saved);
-          const escaped = escapePathForMention(pretty);
-          bufferRef.current?.insert(`@${escaped} `);
-          await attachImageFromPath(saved);
-          return;
-        }
-      }
-
-      // 2. Read clipboard text
-      const text = await readClipboardText();
-      if (!text) return;
-
-      // 3. Check if it looks like file paths
-      const paths = parsePastedPaths(text.trim());
-      if (paths) {
-        bufferRef.current?.insert(paths);
-        return;
-      }
-
-      // 4. Fall back to text insert with large-paste detection
-      bufferRef.current?.insert(text, { isPaste: true });
-    }, [bufferRef, attachImageFromPath]);
-
-    const handleKeyDown = useCallback(
-      (event: InputKeyDownEvent) => {
-        const atStart = event.target.cursor[0] === 0 && event.target.cursor[1] === 0;
-
-        // ── Ctrl+V / Cmd+V: native clipboard paste ───────────────────────────
-        // Only handle when bracketed paste is NOT also firing (guard: key.paste not set)
-        if (!event.key.paste) {
-          const isCmdV = process.platform === "darwin" && event.key.super && event.input === "v";
-          const isCtrlV =
-            (process.platform !== "darwin" && event.key.ctrl && event.input === "v") ||
-            (process.platform === "linux" &&
-              event.key.ctrl &&
-              event.key.shift &&
-              event.input === "V");
-          if (isCmdV || isCtrlV) {
-            void handleClipboardPaste();
-            event.preventDefault();
-            return;
-          }
-        }
-
-        // ── Bracketed paste (key.paste = true) ───────────────────────────────
-        if (event.key.paste) {
-          const rawText = event.input;
-          // Normalize: strip trailing \r\n from drag-and-drop
-          const text = rawText.replace(/[\r\n]+$/, "");
-
-          // 1. macOS temp screenshot path?
-          const trimmedSeg = text.trim();
-          if (isMacOSTempScreenshot(trimmedSeg)) {
-            const copied = copyTempScreenshotToProject(trimmedSeg);
-            if (copied) {
-              const pretty = prettifyMentionPath(copied);
-              const escaped = escapePathForMention(pretty);
-              bufferRef.current?.insert(`@${escaped} `);
-              void attachImageFromPath(copied);
-              event.preventDefault();
-              return;
-            }
-          }
-
-          // 2. Try file path detection
-          const paths = parsePastedPaths(text.trim());
-          if (paths) {
-            bufferRef.current?.insert(paths);
-            event.preventDefault();
-            return;
-          }
-
-          // 3. Check OS clipboard for image (e.g. GNOME sends 0x16 / SYN)
-          void (async () => {
-            if (await clipboardHasImage()) {
-              const saved = await saveClipboardImage(process.cwd());
-              if (saved) {
-                const pretty = prettifyMentionPath(saved);
-                const escaped = escapePathForMention(pretty);
-                bufferRef.current?.insert(`@${escaped} `);
-                await attachImageFromPath(saved);
-                return;
-              }
-            }
-            // 4. Regular text paste — large-paste detection handled by TextBuffer
-            bufferRef.current?.insert(text, { isPaste: true });
-          })();
-          event.preventDefault();
-          return;
-        }
-
-        // ── Non-bracketed paste debounce (terminals without BP support) ───────
-        // Multi-char input arriving rapidly without key.paste is likely a paste
-        if (event.input.length > 3 && !event.key.ctrl && !event.key.meta && !event.key.paste) {
-          nonBpAccumRef.current.text += event.input;
-          if (nonBpAccumRef.current.timer) clearTimeout(nonBpAccumRef.current.timer);
-          nonBpAccumRef.current.timer = setTimeout(() => {
-            const accumulated = nonBpAccumRef.current.text;
-            nonBpAccumRef.current = { text: "", timer: null };
-            const paths = parsePastedPaths(accumulated.trim());
-            if (paths) {
-              bufferRef.current?.insert(paths);
-              return;
-            }
-            bufferRef.current?.insert(accumulated, { isPaste: true });
-          }, 50);
-          event.preventDefault();
-          return;
-        }
-
-        // Handle editing queued message with up arrow in Prompt mode
-        // Only triggers when buffer is empty (cursor already at top edge)
-        if (
-          mode === ComposerMode.Prompt &&
-          event.key.upArrow &&
-          event.target.visualCursor[0] === 0 &&
-          queuedMessages.length > 0 &&
-          prompt.trim() === ""
-        ) {
-          const queuedMessage = queuedMessages[0];
-          bufferRef.current?.setText(queuedMessage);
-          clearQueue();
-          event.preventDefault();
-          return;
-        }
-
-        if (currentHandler?.shouldPreventDefault) {
-          if (currentHandler.shouldPreventDefault(event.input || "", event.key)) {
-            event.preventDefault();
-            return;
-          }
-        }
-
-        // Handle prompt history navigation for Prompt/Help/Files modes.
-        // Only trigger when the cursor is at the extreme edge of the buffer:
-        //   Up arrow → only when cursor is on the first visual line (top of buffer)
-        //   Down arrow → only when cursor is on the last visual line (bottom of buffer)
-        const usesPromptHistory =
-          mode === ComposerMode.Prompt || mode === ComposerMode.Help || mode === ComposerMode.Files;
-
-        if (usesPromptHistory && (event.key.upArrow || event.key.downArrow)) {
-          const buf = event.target;
-          const atTopEdge = buf.visualCursor[0] === 0;
-          const atBottomEdge = buf.visualCursor[0] >= buf.allVisualLines.length - 1;
-
-          if (event.key.upArrow && atTopEdge) {
-            // Save current text as draft before first navigation
-            if (promptHistory.getEntries().length > 0) {
-              const currentText = prompt;
-              const testEntry = promptHistory.navigateUp();
-              if (testEntry) {
-                if (draftRef.current === "" && currentText.trim() !== "") {
-                  draftRef.current = currentText;
-                }
-                bufferRef.current?.setText(testEntry.message);
-                event.preventDefault();
-                return;
-              }
-            }
-          } else if (event.key.downArrow && atBottomEdge) {
-            const entry = promptHistory.navigateDown();
-            if (entry) {
-              bufferRef.current?.setText(entry.message);
-            } else {
-              // Past newest — restore draft
-              bufferRef.current?.setText(draftRef.current);
-              draftRef.current = "";
-            }
-            event.preventDefault();
-            return;
-          }
-        }
-
-        // Handle history navigation in bash mode — only at buffer edges
-        if (mode === ComposerMode.Bash && bashNavigateHistory) {
-          const buf = event.target;
-          const bashAtTop = event.key.upArrow && buf.visualCursor[0] === 0;
-          const bashAtBottom =
-            event.key.downArrow && buf.visualCursor[0] >= buf.allVisualLines.length - 1;
-          if (bashAtTop || bashAtBottom) {
-            const historyCommand = bashNavigateHistory(event.key.upArrow ? "up" : "down");
-            if (historyCommand !== null) {
-              bufferRef.current?.setText(historyCommand);
-              event.preventDefault();
-              return;
-            }
-          }
-        }
-
-        if (atStart && event.key.backspace) {
-          if (isWaitingForYoloConfirm) {
-            resetToNormal();
-            event.preventDefault();
-            return;
-          }
-          if (mode !== ComposerMode.Prompt) {
-            setMode(ComposerMode.Prompt);
-            promptHistory.resetNavigation();
-            draftRef.current = "";
-            event.preventDefault();
-          }
-          return;
-        }
-
-        if (mode === ComposerMode.Prompt && event.key.shift && event.key.tab) {
-          cycleAgentMode();
-          event.preventDefault();
-          return;
-        }
-
-        const trigger = MODE_TRIGGERS[event.input];
-        if (trigger && (!trigger.atStartOnly || atStart)) {
-          if (mode !== trigger.mode) {
-            setMode(trigger.mode);
-          }
-          if (trigger.preventDefault && trigger.mode !== ComposerMode.Command) {
-            event.preventDefault();
-          }
-          return;
-        }
-      },
-      [
-        mode,
-        setMode,
-        currentHandler,
-        bashNavigateHistory,
-        bufferRef,
-        handleClipboardPaste,
-        attachImageFromPath,
-        queuedMessages,
-        prompt,
-        clearQueue,
-        isWaitingForYoloConfirm,
-        resetToNormal,
-        cycleAgentMode,
-        promptHistory,
-      ],
-    );
-
-    const handleChange = useCallback(
-      (text: string, buffer: any) => {
-        const prevLen = prevTextLenRef.current;
-        prevTextLenRef.current = text.length;
-        setPrompt(text);
-
-        // Clear temporary messages (like help) when user starts typing a regular message
-        const trimmed = text.trim();
-        const startsWithSlash = trimmed.startsWith("/");
-        const isAgentBusy =
-          agentStatus === AgentStatus.Submitted ||
-          agentStatus === AgentStatus.Streaming ||
-          agentStatus === AgentStatus.ExecutingTool ||
-          agentStatus === AgentStatus.WaitingForToolPermission;
-
-        if (text.length > 0 && !startsWithSlash && !isAgentBusy) {
-          clearTempSegments();
-        }
-
-        const mention = getMentionAtCursor(text, buffer.cursor);
-
-        // Auto-reset to Prompt mode when user deletes all text in trigger-based modes.
-        // Only triggers when the buffer previously had content (prevLen > 0), i.e. user
-        // backspaced to empty. Does NOT trigger when entering a mode on an already-empty
-        // buffer (e.g. typing "!" switches to Bash with empty buffer — stays in Bash).
-        if (
-          trimmed.length === 0 &&
-          prevLen > 0 &&
-          (mode === ComposerMode.Command ||
-            mode === ComposerMode.Bash ||
-            mode === ComposerMode.Help)
-        ) {
-          setMode(ComposerMode.Prompt);
-          return;
-        }
-
-        if (mention) {
-          if (mode !== ComposerMode.Files) setMode(ComposerMode.Files);
-          return;
-        }
-
-        if (mode === ComposerMode.Files) {
-          if (!mention) {
-            setMode(ComposerMode.Prompt);
-          }
-          return;
-        }
-
-        if (mode === ComposerMode.Help && trimmed.length > 0) {
-          setMode(ComposerMode.Prompt);
-        }
-
-        if (startsWithSlash && mode !== ComposerMode.Command) {
-          setMode(ComposerMode.Command);
-        } else if (!startsWithSlash && mode === ComposerMode.Command && trimmed.length > 0) {
-          setMode(ComposerMode.Prompt);
-        }
-      },
-      [mode, setPrompt, setMode, clearTempSegments, agentStatus],
-    );
-
-    const handleSubmit = useCallback(
-      async (value: string) => {
-        const trimmed = value.trim();
-        if (!trimmed.startsWith("/")) {
-          const aliasMatch = commandRegistry.match(trimmed, mode);
-          if (aliasMatch && (await commandRegistry.execute(aliasMatch))) {
-            bufferRef.current?.setText("");
-            clearAttachments();
-            return;
-          }
-        }
-
-        if (currentHandler?.onSubmit) {
-          currentHandler.onSubmit(value);
-          if (mode === ComposerMode.Bash) {
-            // Clear the input after submitting bash command
-            bufferRef.current?.setText("");
-            setActivity(getActivity());
-          } else if (mode === ComposerMode.Command) {
-            setMode(ComposerMode.Prompt);
-          }
-          clearAttachments();
-          return;
-        }
-
-        switch (mode) {
-          case ComposerMode.Prompt:
-            if (isLoggedIn === false) {
-              addNotification("Not logged in. Use /login email@example.com to login.", "warning");
-              return;
-            }
-
-            if (!networkOnline) {
-              addNotification("You are offline — check your connection and try again.", "error");
-              return;
-            }
-
-            const isAgentBusy =
-              agentStatus === AgentStatus.Submitted ||
-              agentStatus === AgentStatus.Streaming ||
-              agentStatus === AgentStatus.ExecutingTool ||
-              agentStatus === AgentStatus.WaitingForToolPermission;
-
-            if (isAgentBusy) {
-              const expanded = expandPlaceholders(value.trim());
-              addToQueue(expanded);
-              promptHistory.append(expanded);
-              promptHistory.resetNavigation();
-              draftRef.current = "";
-              clearPlaceholders();
-              bufferRef.current?.setText("");
-              return;
-            }
-
-            // Fall back to the first available model when none is explicitly selected,
-            // so the session never operates with an empty model string.
-            const modelToUse = selectedModel || models[0]?.llmName || undefined;
-
-            // Expand placeholder text with actual pasted content
-            const finalMessage = expandPlaceholders(value);
-
-            promptHistory.append(finalMessage);
-            promptHistory.resetNavigation();
-            draftRef.current = "";
-
-            void sendMessage({ message: finalMessage, selectedModel: modelToUse });
-            clearPlaceholders();
-            clearAttachments();
-            break;
-          default:
-        }
-      },
-      [
-        mode,
-        currentHandler,
-        sendMessage,
-        getActivity,
-        setActivity,
-        selectedModel,
-        setMode,
-        bufferRef,
-        agentStatus,
-        addToQueue,
-        addNotification,
-        attachments,
-        clearAttachments,
-        isLoggedIn,
-        expandPlaceholders,
-        clearPlaceholders,
-        promptHistory,
-      ],
-    );
-
-    const { color: modeColor, placeholder: modePlaceholder, prefix: modePrefix } = MODE_META[mode];
-
-    // Clear placeholder text after first message has been sent
-    const effectivePlaceholder = segmentsLength > 0 ? "" : modePlaceholder;
-
-    const inputWidth = useMemo(() => {
-      if (terminalWidth === undefined) return undefined;
-      return Math.max(1, terminalWidth - 3);
-    }, [terminalWidth]);
-
-    const grammar = useMemo(() => buildMentionGrammar(), []);
-    const effectiveActivity = mode === ComposerMode.Bash ? getActivity() : activity;
-    const isInputDisabled =
-      effectiveActivity === "pending" || agentStatus === AgentStatus.WaitingForToolPermission;
-
-    const pathText = (
-      <Text wrap="truncate-middle" color="yellowBright">
-        {abbreviateHome(process.cwd())}
-      </Text>
-    );
-
-    const statusAndPath = (
-      <View flexDirection="row" gap={1} justifyContent="flex-end">
-        {isLoggedIn === false && <Text dimColor>Not logged in</Text>}
-        {pathText}
-      </View>
-    );
-
-    return (
-      <View flexDirection="column">
-        {queuedMessages.length > 0 ? (
-          <MessageQueue pathElement={statusAndPath} />
-        ) : (
-          <View justifyContent="flex-end">{statusAndPath}</View>
-        )}
-        <View
-          borderStyle="single"
-          borderLeft={false}
-          borderRight={false}
-          borderColor={modeColor}
-          borderDimColor
-          flexDirection="row"
-          gap={1}
-        >
-          <Text color={modeColor}>{modePrefix}</Text>
-          <Input
-            ref={bufferRef}
-            onChange={handleChange}
-            onKeyDown={handleKeyDown}
-            onSubmit={handleSubmit}
-            placeholder={effectivePlaceholder}
-            grammar={grammar}
-            disabled={isInputDisabled}
-            width={inputWidth}
-          />
-        </View>
-        <View justifyContent="space-between">
-          <ModePanel
-            mode={mode}
-            prompt={prompt}
-            handler={currentHandler}
-            onExitFilesMode={() => setMode(ComposerMode.Prompt)}
-            hints={hints}
-            availableHeight={availableHeight}
-          />
-          <View flexDirection="row" gap={1}>
-            {currentFile && selectionStartLine !== undefined && selectionEndLine !== undefined ? (
-              <Text dimColor>
-                <Text color="cyan">{selectionEndLine - selectionStartLine + 1} lines selected</Text>{" "}
-                in <Text color="cyan">{currentFile}</Text>
-              </Text>
-            ) : (
-              currentFile && (
-                <Text dimColor>
-                  in <Text color="cyan">{currentFile}</Text>
-                </Text>
-              )
-            )}
-            {hints?.escClear && (
-              <Text wrap="truncate-middle" dimColor>
-                Press ESC again to clear input
-              </Text>
-            )}
-          </View>
-        </View>
-      </View>
-    );
-  },
-);
-ComposerInner.displayName = "ComposerInner";
-
-interface ComposerProps {
-  hints?: InterruptHints;
-  composerRef?: Ref<ComposerHandle>;
-}
-
-export const Composer = memo(({ hints, composerRef }: ComposerProps) => {
-  return (
-    <ComposerProvider>
-      <Suspense fallback={<Text dimColor>Loading models...</Text>}>
-        <ComposerInner hints={hints} composerRef={composerRef} />
-      </Suspense>
-    </ComposerProvider>
-  );
-});
-Composer.displayName = "Composer";