@within-7/minto 0.3.9 → 0.3.10

package/dist/commands/setup.js

@@ -1,7 +1,11 @@
-import React from "react";
+import React, { useState, useCallback, useMemo } from "react";
 import { Text, Box } from "ink";
+import { join } from "path";
+import { homedir } from "os";
 import { SimpleSpinner } from "../components/Spinner.js";
-import { SEMANTIC_COLORS } from "../constants/colors.js";
+import { t } from "../i18n/index.js";
+import { getCwd } from "../utils/state.js";
+import { TabbedListView } from "../components/TabbedListView/TabbedListView.js";
 import {
   fetchTeamConfig,
   loadTeamConfigFromFile,
@@ -10,128 +14,607 @@ import {
   installPlugins,
   installRemoteAgents,
   installInlineAgents,
-  installTeamHooks
+  installTeamHooks,
+  installInlineSkills,
+  installInlineCommands
 } from "../utils/teamConfig.js";
+function countHooks(hooks) {
+  if (!hooks) return 0;
+  return (hooks.sessionStart?.length || 0) + (hooks.sessionEnd?.length || 0) + (hooks.userPromptSubmit?.length || 0) + (hooks.preToolUse?.length || 0) + (hooks.postToolUse?.length || 0);
+}
+function buildTabs(config) {
+  const tabs = [
+    { id: "overview", label: t("commands.setup.tabOverview") }
+  ];
+  if (config.models?.profiles && config.models.profiles.length > 0) {
+    tabs.push({
+      id: "models",
+      label: t("commands.setup.tabModels"),
+      badge: config.models.profiles.length
+    });
+  }
+  if (config.mcpServers && Object.keys(config.mcpServers).length > 0) {
+    tabs.push({
+      id: "mcp",
+      label: t("commands.setup.tabMcp"),
+      badge: Object.keys(config.mcpServers).length
+    });
+  }
+  const pluginCount = (config.plugins?.install?.length || 0) + (config.plugins?.userInstall?.length || 0) + (config.plugins?.projectInstall?.length || 0) + (config.plugins?.marketplaces?.length || 0);
+  if (pluginCount > 0) {
+    tabs.push({
+      id: "plugins",
+      label: t("commands.setup.tabPlugins"),
+      badge: pluginCount
+    });
+  }
+  const agentCount = (config.agents?.remoteAgents?.length || 0) + (config.agents?.inlineAgents?.length || 0) + (config.agents?.userAgents?.length || 0) + (config.agents?.projectAgents?.length || 0);
+  if (agentCount > 0) {
+    tabs.push({
+      id: "agents",
+      label: t("commands.setup.tabAgents"),
+      badge: agentCount
+    });
+  }
+  const skillCount = (config.skills?.userSkills?.length || 0) + (config.skills?.projectSkills?.length || 0);
+  if (skillCount > 0) {
+    tabs.push({
+      id: "skills",
+      label: t("commands.setup.tabSkills"),
+      badge: skillCount
+    });
+  }
+  const commandCount = (config.commands?.userCommands?.length || 0) + (config.commands?.projectCommands?.length || 0);
+  if (commandCount > 0) {
+    tabs.push({
+      id: "commands",
+      label: t("commands.setup.tabCommands"),
+      badge: commandCount
+    });
+  }
+  const hookCount = countHooks(config.hooks) + countHooks(config.projectHooks);
+  if (hookCount > 0) {
+    tabs.push({
+      id: "hooks",
+      label: t("commands.setup.tabHooks"),
+      badge: hookCount
+    });
+  }
+  if (config.settings && Object.keys(config.settings).length > 0) {
+    tabs.push({
+      id: "settings",
+      label: t("commands.setup.tabSettings"),
+      badge: Object.keys(config.settings).length
+    });
+  }
+  return tabs;
+}
+function buildItems(tabId, config) {
+  switch (tabId) {
+    case "overview": {
+      const items = [
+        {
+          id: "name",
+          label: config.name || "Team Configuration",
+          description: config.description,
+          category: "Info"
+        }
+      ];
+      if (config.scope) {
+        items.push({
+          id: "overview-scope",
+          label: `Scope: ${config.scope}`,
+          category: "Info"
+        });
+      }
+      const modelCount = config.models?.profiles?.length || 0;
+      if (modelCount > 0) {
+        items.push({
+          id: "overview-models",
+          label: `${modelCount} model profile${modelCount !== 1 ? "s" : ""}`,
+          category: "Summary"
+        });
+      }
+      const mcpCount = config.mcpServers ? Object.keys(config.mcpServers).length : 0;
+      if (mcpCount > 0) {
+        items.push({
+          id: "overview-mcp",
+          label: `${mcpCount} MCP server${mcpCount !== 1 ? "s" : ""}`,
+          category: "Summary"
+        });
+      }
+      const pluginCount = (config.plugins?.install?.length || 0) + (config.plugins?.userInstall?.length || 0) + (config.plugins?.projectInstall?.length || 0);
+      if (pluginCount > 0) {
+        items.push({
+          id: "overview-plugins",
+          label: `${pluginCount} plugin${pluginCount !== 1 ? "s" : ""}`,
+          category: "Summary"
+        });
+      }
+      const agentCount = (config.agents?.remoteAgents?.length || 0) + (config.agents?.inlineAgents?.length || 0) + (config.agents?.userAgents?.length || 0) + (config.agents?.projectAgents?.length || 0);
+      if (agentCount > 0) {
+        items.push({
+          id: "overview-agents",
+          label: `${agentCount} agent${agentCount !== 1 ? "s" : ""}`,
+          category: "Summary"
+        });
+      }
+      const skillCount = (config.skills?.userSkills?.length || 0) + (config.skills?.projectSkills?.length || 0);
+      if (skillCount > 0) {
+        items.push({
+          id: "overview-skills",
+          label: `${skillCount} skill${skillCount !== 1 ? "s" : ""}`,
+          category: "Summary"
+        });
+      }
+      const commandCount = (config.commands?.userCommands?.length || 0) + (config.commands?.projectCommands?.length || 0);
+      if (commandCount > 0) {
+        items.push({
+          id: "overview-commands",
+          label: `${commandCount} command${commandCount !== 1 ? "s" : ""}`,
+          category: "Summary"
+        });
+      }
+      return items;
+    }
+    case "models":
+      return (config.models?.profiles || []).map((p, i) => ({
+        id: `model-${i}`,
+        label: p.name,
+        description: `${p.provider} / ${p.modelName}`,
+        status: p.isActive ? "enabled" : "disabled"
+      }));
+    case "mcp":
+      return Object.entries(config.mcpServers || {}).map(([name, server]) => ({
+        id: `mcp-${name}`,
+        label: name,
+        description: server.type === "sse" ? `SSE: ${server.url}` : `stdio: ${server.command}`,
+        status: server.enabled !== false ? "enabled" : "disabled"
+      }));
+    case "plugins": {
+      const items = [];
+      for (const mp of config.plugins?.marketplaces || []) {
+        items.push({
+          id: `mp-${mp}`,
+          label: mp,
+          description: "Marketplace source",
+          category: "Marketplaces"
+        });
+      }
+      for (const p of config.plugins?.install || []) {
+        items.push({
+          id: `plugin-${p}`,
+          label: p,
+          description: "Plugin \u2192 User",
+          category: "User"
+        });
+      }
+      for (const p of config.plugins?.userInstall || []) {
+        items.push({
+          id: `plugin-user-${p}`,
+          label: p,
+          description: "Plugin \u2192 User",
+          category: "User"
+        });
+      }
+      for (const p of config.plugins?.projectInstall || []) {
+        items.push({
+          id: `plugin-project-${p}`,
+          label: p,
+          description: "Plugin \u2192 Project",
+          category: "Project"
+        });
+      }
+      return items;
+    }
+    case "agents": {
+      const items = [];
+      for (const a of config.agents?.remoteAgents || []) {
+        items.push({
+          id: `remote-agent-${a}`,
+          label: a,
+          description: "Remote agent URL",
+          category: "Remote"
+        });
+      }
+      for (const a of config.agents?.inlineAgents || []) {
+        items.push({
+          id: `inline-agent-${a.name}`,
+          label: a.name,
+          description: a.description,
+          category: "User"
+        });
+      }
+      for (const a of config.agents?.userAgents || []) {
+        items.push({
+          id: `user-agent-${a.name}`,
+          label: a.name,
+          description: a.description,
+          category: "User"
+        });
+      }
+      for (const a of config.agents?.projectAgents || []) {
+        items.push({
+          id: `project-agent-${a.name}`,
+          label: a.name,
+          description: a.description,
+          category: "Project"
+        });
+      }
+      return items;
+    }
+    case "skills": {
+      const items = [];
+      for (const s of config.skills?.userSkills || []) {
+        items.push({
+          id: `skill-user-${s.name}`,
+          label: s.name,
+          description: s.description,
+          category: "User"
+        });
+      }
+      for (const s of config.skills?.projectSkills || []) {
+        items.push({
+          id: `skill-project-${s.name}`,
+          label: s.name,
+          description: s.description,
+          category: "Project"
+        });
+      }
+      return items;
+    }
+    case "commands": {
+      const items = [];
+      for (const c of config.commands?.userCommands || []) {
+        items.push({
+          id: `cmd-user-${c.name}`,
+          label: c.name,
+          description: c.description,
+          category: "User"
+        });
+      }
+      for (const c of config.commands?.projectCommands || []) {
+        items.push({
+          id: `cmd-project-${c.name}`,
+          label: c.name,
+          description: c.description,
+          category: "Project"
+        });
+      }
+      return items;
+    }
+    case "hooks": {
+      const items = [];
+      const addHooks = (hookList, category, prefix) => {
+        if (!hookList) return;
+        for (let i = 0; i < hookList.length; i++) {
+          const h = hookList[i];
+          items.push({
+            id: `hook-${prefix}-${category}-${i}`,
+            label: h.type || h.command || `Hook ${i + 1}`,
+            description: h.command,
+            category
+          });
+        }
+      };
+      if (config.hooks) {
+        addHooks(config.hooks.sessionStart, "User \xB7 Session Start", "user");
+        addHooks(config.hooks.sessionEnd, "User \xB7 Session End", "user");
+        addHooks(
+          config.hooks.userPromptSubmit,
+          "User \xB7 User Prompt Submit",
+          "user"
+        );
+        addHooks(config.hooks.preToolUse, "User \xB7 Pre Tool Use", "user");
+        addHooks(config.hooks.postToolUse, "User \xB7 Post Tool Use", "user");
+      }
+      if (config.projectHooks) {
+        addHooks(
+          config.projectHooks.sessionStart,
+          "Project \xB7 Session Start",
+          "project"
+        );
+        addHooks(
+          config.projectHooks.sessionEnd,
+          "Project \xB7 Session End",
+          "project"
+        );
+        addHooks(
+          config.projectHooks.userPromptSubmit,
+          "Project \xB7 User Prompt Submit",
+          "project"
+        );
+        addHooks(
+          config.projectHooks.preToolUse,
+          "Project \xB7 Pre Tool Use",
+          "project"
+        );
+        addHooks(
+          config.projectHooks.postToolUse,
+          "Project \xB7 Post Tool Use",
+          "project"
+        );
+      }
+      return items;
+    }
+    case "settings":
+      return Object.entries(config.settings || {}).map(([key, value]) => ({
+        id: `setting-${key}`,
+        label: key,
+        description: String(value)
+      }));
+    default:
+      return [];
+  }
+}
+async function runInstall(config, strategy, shouldInstallPlugins, onProgress) {
+  const cwd = getCwd();
+  const home = homedir();
+  const userDir = join(home, ".minto");
+  const projectDir = join(cwd, ".minto");
+  onProgress(t("commands.setup.applying"));
+  const result = applyTeamConfig(config, strategy);
+  const summary = [];
+  if (result.modelsAdded > 0) {
+    summary.push(
+      `${result.modelsAdded} model${result.modelsAdded !== 1 ? "s" : ""}`
+    );
+  }
+  if (result.mcpServersAdded > 0) {
+    summary.push(
+      `${result.mcpServersAdded} MCP server${result.mcpServersAdded !== 1 ? "s" : ""}`
+    );
+  }
+  if (result.settingsUpdated.length > 0) {
+    summary.push(
+      `${result.settingsUpdated.length} setting${result.settingsUpdated.length !== 1 ? "s" : ""}`
+    );
+  }
+  if (shouldInstallPlugins) {
+    if (config.plugins?.marketplaces && config.plugins.marketplaces.length > 0) {
+      onProgress(t("commands.setup.addingMarketplaces"));
+      const mpResult = await addMarketplaces(config.plugins.marketplaces);
+      if (mpResult.added > 0) {
+        summary.push(
+          `${mpResult.added} marketplace${mpResult.added !== 1 ? "s" : ""}`
+        );
+      }
+    }
+    let pluginsInstalled = 0;
+    if (config.plugins?.install && config.plugins.install.length > 0) {
+      onProgress(t("commands.setup.installingPlugins"));
+      const r = await installPlugins(
+        config.plugins.install,
+        join(userDir, "plugins")
+      );
+      pluginsInstalled += r.installed;
+    }
+    if (config.plugins?.userInstall && config.plugins.userInstall.length > 0) {
+      onProgress(t("commands.setup.installingPlugins"));
+      const r = await installPlugins(
+        config.plugins.userInstall,
+        join(userDir, "plugins")
+      );
+      pluginsInstalled += r.installed;
+    }
+    if (config.plugins?.projectInstall && config.plugins.projectInstall.length > 0) {
+      onProgress(t("commands.setup.installingProjectPlugins"));
+      const r = await installPlugins(
+        config.plugins.projectInstall,
+        join(projectDir, "plugins")
+      );
+      pluginsInstalled += r.installed;
+    }
+    if (pluginsInstalled > 0) {
+      summary.push(
+        `${pluginsInstalled} plugin${pluginsInstalled !== 1 ? "s" : ""}`
+      );
+    }
+    let agentsInstalled = 0;
+    if (config.agents) {
+      if (config.agents.remoteAgents && config.agents.remoteAgents.length > 0) {
+        onProgress(t("commands.setup.installingAgents"));
+        const r = await installRemoteAgents(
+          config.agents.remoteAgents,
+          join(userDir, "agents")
+        );
+        agentsInstalled += r.installed;
+      }
+      if (config.agents.inlineAgents && config.agents.inlineAgents.length > 0) {
+        onProgress(t("commands.setup.installingAgents"));
+        const r = await installInlineAgents(
+          config.agents.inlineAgents,
+          join(userDir, "agents")
+        );
+        agentsInstalled += r.installed;
+      }
+      if (config.agents.userAgents && config.agents.userAgents.length > 0) {
+        onProgress(t("commands.setup.installingAgents"));
+        const r = await installInlineAgents(
+          config.agents.userAgents,
+          join(userDir, "agents")
+        );
+        agentsInstalled += r.installed;
+      }
+      if (config.agents.projectAgents && config.agents.projectAgents.length > 0) {
+        onProgress(t("commands.setup.installingAgents"));
+        const r = await installInlineAgents(
+          config.agents.projectAgents,
+          join(projectDir, "agents")
+        );
+        agentsInstalled += r.installed;
+      }
+    }
+    if (agentsInstalled > 0) {
+      summary.push(
+        `${agentsInstalled} agent${agentsInstalled !== 1 ? "s" : ""}`
+      );
+    }
+    let skillsInstalled = 0;
+    if (config.skills) {
+      if (config.skills.userSkills && config.skills.userSkills.length > 0) {
+        onProgress(t("commands.setup.installingSkills"));
+        const r = await installInlineSkills(
+          config.skills.userSkills,
+          join(userDir, "skills")
+        );
+        skillsInstalled += r.installed;
+      }
+      if (config.skills.projectSkills && config.skills.projectSkills.length > 0) {
+        onProgress(t("commands.setup.installingSkills"));
+        const r = await installInlineSkills(
+          config.skills.projectSkills,
+          join(projectDir, "skills")
+        );
+        skillsInstalled += r.installed;
+      }
+    }
+    if (skillsInstalled > 0) {
+      summary.push(
+        `${skillsInstalled} skill${skillsInstalled !== 1 ? "s" : ""}`
+      );
+    }
+    let commandsInstalled = 0;
+    if (config.commands) {
+      if (config.commands.userCommands && config.commands.userCommands.length > 0) {
+        onProgress(t("commands.setup.installingCommands"));
+        const r = await installInlineCommands(
+          config.commands.userCommands,
+          join(userDir, "commands")
+        );
+        commandsInstalled += r.installed;
+      }
+      if (config.commands.projectCommands && config.commands.projectCommands.length > 0) {
+        onProgress(t("commands.setup.installingCommands"));
+        const r = await installInlineCommands(
+          config.commands.projectCommands,
+          join(projectDir, "commands")
+        );
+        commandsInstalled += r.installed;
+      }
+    }
+    if (commandsInstalled > 0) {
+      summary.push(
+        `${commandsInstalled} command${commandsInstalled !== 1 ? "s" : ""}`
+      );
+    }
+    let hooksInstalled = false;
+    if (config.hooks) {
+      onProgress(t("commands.setup.installingHooks"));
+      const r = await installTeamHooks(
+        config.hooks,
+        join(userDir, "hooks.json")
+      );
+      if (r.installed) hooksInstalled = true;
+    }
+    if (config.projectHooks) {
+      onProgress(t("commands.setup.installingHooks"));
+      const r = await installTeamHooks(
+        config.projectHooks,
+        join(projectDir, "hooks.json")
+      );
+      if (r.installed) hooksInstalled = true;
+    }
+    if (hooksInstalled) {
+      summary.push("hooks");
+    }
+  }
+  return summary.length > 0 ? `${t("commands.setup.success")} (${summary.join(", ")})` : t("commands.setup.success");
+}
 function SetupComponent({
   source,
   strategy = "merge",
   installPlugins: shouldInstallPlugins = true,
   onDone
 }) {
-  const [state, setState] = React.useState({ stage: "loading" });
+  const [phase, setPhase] = useState("loading");
+  const [teamConfig, setTeamConfig] = useState(null);
+  const [activeTab, setActiveTab] = useState("overview");
+  const [statusOverlay, setStatusOverlay] = useState(null);
   React.useEffect(() => {
-    async function init() {
+    async function load() {
       try {
-        setState({ stage: "loading" });
-        const teamConfig = source.startsWith("http://") || source.startsWith("https://") ? await fetchTeamConfig(source) : loadTeamConfigFromFile(source);
-        setState({ stage: "applying" });
-        const result = applyTeamConfig(teamConfig, strategy);
-        let marketplacesAdded = 0;
-        if (shouldInstallPlugins && teamConfig.plugins?.marketplaces) {
-          const marketplaceCount = teamConfig.plugins.marketplaces.length;
-          setState({ stage: "adding-marketplaces", total: marketplaceCount });
-          const marketplaceResult = await addMarketplaces(
-            teamConfig.plugins.marketplaces
-          );
-          marketplacesAdded = marketplaceResult.added;
-        }
-        let pluginsInstalled = 0;
-        if (shouldInstallPlugins && teamConfig.plugins?.install) {
-          const pluginCount = teamConfig.plugins.install.length;
-          setState({ stage: "installing-plugins", total: pluginCount });
-          const pluginResult = await installPlugins(teamConfig.plugins.install);
-          pluginsInstalled = pluginResult.installed;
-        }
-        let agentsInstalled = 0;
-        if (shouldInstallPlugins && teamConfig.agents) {
-          const remoteCount = teamConfig.agents.remoteAgents?.length || 0;
-          const inlineCount = teamConfig.agents.inlineAgents?.length || 0;
-          const totalAgents = remoteCount + inlineCount;
-          if (totalAgents > 0) {
-            setState({ stage: "installing-agents", total: totalAgents });
-            if (teamConfig.agents.remoteAgents) {
-              const remoteResult = await installRemoteAgents(
-                teamConfig.agents.remoteAgents
-              );
-              agentsInstalled += remoteResult.installed;
-            }
-            if (teamConfig.agents.inlineAgents) {
-              const inlineResult = await installInlineAgents(
-                teamConfig.agents.inlineAgents
-              );
-              agentsInstalled += inlineResult.installed;
-            }
-          }
-        }
-        let hooksInstalled = false;
-        if (shouldInstallPlugins && teamConfig.hooks) {
-          setState({ stage: "installing-hooks" });
-          const hookResult = await installTeamHooks(teamConfig.hooks);
-          hooksInstalled = hookResult.installed;
-        }
-        setState({
-          stage: "success",
-          modelsAdded: result.modelsAdded,
-          mcpServersAdded: result.mcpServersAdded,
-          settingsUpdated: result.settingsUpdated,
-          marketplacesAdded: marketplacesAdded > 0 ? marketplacesAdded : void 0,
-          pluginsInstalled: pluginsInstalled > 0 ? pluginsInstalled : void 0,
-          agentsInstalled: agentsInstalled > 0 ? agentsInstalled : void 0,
-          hooksInstalled: hooksInstalled || void 0,
-          instructions: teamConfig.postInstallInstructions
-        });
-        setTimeout(() => onDone("Configuration applied successfully"), 2e3);
+        const config = source.startsWith("http://") || source.startsWith("https://") ? await fetchTeamConfig(source) : loadTeamConfigFromFile(source);
+        setTeamConfig(config);
+        setPhase("preview");
       } catch (error) {
-        const errorMessage = error instanceof Error ? error.message : String(error);
-        setState({
-          stage: "error",
-          message: errorMessage
+        setTeamConfig(null);
+        setPhase("preview");
+        setStatusOverlay({
+          type: "error",
+          message: `${t("commands.setup.failed")}: ${error instanceof Error ? error.message : String(error)}`
         });
-        setTimeout(() => onDone(), 2e3);
       }
     }
-    init();
-  }, [source, strategy, shouldInstallPlugins, onDone]);
-  if (state.stage === "loading") {
-    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, /* @__PURE__ */ React.createElement(SimpleSpinner, null), " Loading configuration from ", source, "..."));
-  }
-  if (state.stage === "applying") {
-    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, /* @__PURE__ */ React.createElement(SimpleSpinner, null), " Applying configuration..."));
-  }
-  if (state.stage === "adding-marketplaces") {
-    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, /* @__PURE__ */ React.createElement(SimpleSpinner, null), " Adding ", state.total, " marketplace", state.total !== 1 ? "s" : "", "..."));
-  }
-  if (state.stage === "installing-plugins") {
-    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, /* @__PURE__ */ React.createElement(SimpleSpinner, null), " Installing ", state.total, " plugin", state.total !== 1 ? "s" : "", "..."));
-  }
-  if (state.stage === "installing-agents") {
-    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, /* @__PURE__ */ React.createElement(SimpleSpinner, null), " Installing ", state.total, " agent", state.total !== 1 ? "s" : "", "..."));
-  }
-  if (state.stage === "installing-hooks") {
-    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, /* @__PURE__ */ React.createElement(SimpleSpinner, null), " Installing hooks..."));
-  }
-  if (state.stage === "error") {
-    return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(Text, { color: "red" }, "\u2717 Initialization failed"), /* @__PURE__ */ React.createElement(Text, { color: "red" }, state.message));
+    load();
+  }, [source]);
+  const tabs = useMemo(
+    () => teamConfig ? buildTabs(teamConfig) : [{ id: "overview", label: t("commands.setup.tabOverview") }],
+    [teamConfig]
+  );
+  const items = useMemo(
+    () => teamConfig ? buildItems(activeTab, teamConfig) : [],
+    [teamConfig, activeTab]
+  );
+  const handleSelect = useCallback(async () => {
+    if (!teamConfig || phase !== "preview") return;
+    setPhase("installing");
+    setStatusOverlay({
+      type: "loading",
+      message: t("commands.setup.applying")
+    });
+    try {
+      const successMessage = await runInstall(
+        teamConfig,
+        strategy,
+        shouldInstallPlugins,
+        (message) => {
+          setStatusOverlay({ type: "loading", message });
+        }
+      );
+      setStatusOverlay({
+        type: "success",
+        message: successMessage
+      });
+    } catch (error) {
+      setStatusOverlay({
+        type: "error",
+        message: `${t("commands.setup.failed")}: ${error instanceof Error ? error.message : String(error)}`
+      });
+    }
+  }, [teamConfig, phase, strategy, shouldInstallPlugins]);
+  const handleClose = useCallback(() => {
+    onDone();
+  }, [onDone]);
+  if (phase === "loading") {
+    return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(SimpleSpinner, null), /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, " ", t("commands.setup.loading")));
   }
-  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", paddingY: 1 }, /* @__PURE__ */ React.createElement(Text, { color: "green", bold: true }, "\u2713 Configuration applied successfully!"), /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", paddingTop: 1 }, state.modelsAdded > 0 && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Added ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, state.modelsAdded), " model profile", state.modelsAdded !== 1 ? "s" : ""), state.mcpServersAdded > 0 && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Added ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, state.mcpServersAdded), " MCP server", state.mcpServersAdded !== 1 ? "s" : ""), state.settingsUpdated.length > 0 && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Updated ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, state.settingsUpdated.length), " ", "setting", state.settingsUpdated.length !== 1 ? "s" : "", ":", " ", state.settingsUpdated.join(", ")), state.marketplacesAdded !== void 0 && state.marketplacesAdded > 0 && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Added ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, state.marketplacesAdded), " ", "marketplace", state.marketplacesAdded !== 1 ? "s" : ""), state.pluginsInstalled !== void 0 && state.pluginsInstalled > 0 && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Installed ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, state.pluginsInstalled), " ", "plugin", state.pluginsInstalled !== 1 ? "s" : ""), state.agentsInstalled !== void 0 && state.agentsInstalled > 0 && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Installed ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, state.agentsInstalled), " agent", state.agentsInstalled !== 1 ? "s" : ""), state.hooksInstalled && /* @__PURE__ */ React.createElement(Text, null, "\u2022 Installed ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, "hooks"), " configuration")), state.instructions && /* @__PURE__ */ React.createElement(
-    Box,
+  return /* @__PURE__ */ React.createElement(
+    TabbedListView,
     {
-      flexDirection: "column",
-      paddingTop: 1,
-      borderStyle: "round",
-      borderColor: "yellow",
-      paddingX: 1
-    },
-    /* @__PURE__ */ React.createElement(Text, { color: "yellow", bold: true }, "\u{1F4CB} Next Steps:"),
-    /* @__PURE__ */ React.createElement(Text, null, state.instructions)
-  ), /* @__PURE__ */ React.createElement(Box, { paddingTop: 1 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "Run ", /* @__PURE__ */ React.createElement(Text, { color: "cyan" }, "minto"), " to start using your configured setup.")));
+      title: t("commands.setup.previewTitle"),
+      tabs,
+      activeTab,
+      onTabChange: setActiveTab,
+      items,
+      searchEnabled: false,
+      onSelect: handleSelect,
+      onClose: handleClose,
+      footerHint: t("commands.setup.confirmHint"),
+      statusOverlay,
+      statusDismissHint: "Esc Close",
+      groupByCategory: activeTab === "overview" || activeTab === "plugins" || activeTab === "agents" || activeTab === "skills" || activeTab === "commands" || activeTab === "hooks",
+      isActive: phase !== "installing" || statusOverlay?.type !== "loading"
+    }
+  );
 }
 const command = {
   type: "local-jsx",
   name: "setup",
-  description: "Initialize Minto with team configuration from a URL or file",
+  description: t("commands.setup.description"),
   isEnabled: true,
   isHidden: false,
+  hidePromptInput: true,
   userFacingName() {
     return "setup";
   },
@@ -142,17 +625,20 @@ const command = {
     const strategyIndex = args.findIndex((arg) => arg === "--strategy");
     const noPluginsFlag = args.includes("--no-plugins");
     if (fromIndex === -1 || !args[fromIndex + 1]) {
-      onDone();
-      return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(Text, { color: "red" }, "Error: --from parameter is required"), /* @__PURE__ */ React.createElement(Text, null, "Usage: minto setup --from <url|path> [--strategy <merge|replace|skip-existing>] [--no-plugins]"));
+      onDone(
+        `${t("commands.setup.errorMissingFrom")}
+${t("commands.setup.errorUsage")}`
+      );
+      return null;
     }
     const source = args[fromIndex + 1];
-    const strategy = strategyIndex !== -1 && args[strategyIndex + 1] ? args[strategyIndex + 1] : "merge";
+    const setupStrategy = strategyIndex !== -1 && args[strategyIndex + 1] ? args[strategyIndex + 1] : "merge";
     const shouldInstallPlugins = !noPluginsFlag;
     return /* @__PURE__ */ React.createElement(
       SetupComponent,
       {
         source,
-        strategy,
+        strategy: setupStrategy,
         installPlugins: shouldInstallPlugins,
         onDone
       }