codemaxxing 1.0.17 → 1.1.1

package/dist/index.js

@@ -16,10 +16,11 @@ import { listServers, addServer, removeServer, getConnectedServers } from "./uti
 import { tryHandleSkillsCommand } from "./commands/skills.js";
 import { isOllamaRunning, stopOllama, listInstalledModelsDetailed } from "./utils/ollama.js";
 import { routeKeyPress } from "./ui/input-router.js";
+import { getCredential } from "./utils/auth.js";
 import { Banner, ConnectionInfo } from "./ui/banner.js";
 import { StatusBar } from "./ui/status-bar.js";
 import { refreshConnectionBanner as refreshConnectionBannerImpl, connectToProvider as connectToProviderImpl, } from "./ui/connection.js";
-import { CommandSuggestions, LoginPicker, LoginMethodPickerUI, SkillsMenu, SkillsBrowse, SkillsInstalled, SkillsRemove, ThemePickerUI, SessionPicker, DeleteSessionPicker, DeleteSessionConfirm, ModelPicker, OllamaDeletePicker, OllamaPullPicker, OllamaDeleteConfirm, OllamaPullProgress, OllamaExitPrompt, ApprovalPrompt, WizardConnection, WizardModels, WizardInstallOllama, WizardPulling, } from "./ui/pickers.js";
+import { CommandSuggestions, LoginPicker, LoginMethodPickerUI, SkillsMenu, SkillsBrowse, SkillsInstalled, SkillsRemove, ThemePickerUI, SessionPicker, DeleteSessionPicker, DeleteSessionConfirm, ProviderPicker, ModelPicker, OllamaDeletePicker, OllamaPullPicker, OllamaDeleteConfirm, OllamaPullProgress, OllamaExitPrompt, ApprovalPrompt, WizardConnection, WizardModels, WizardInstallOllama, WizardPulling, } from "./ui/pickers.js";
 import { createRequire } from "module";
 const _require = createRequire(import.meta.url);
 const VERSION = _require("../package.json").version;
@@ -51,9 +52,8 @@ const SLASH_COMMANDS = [
     { cmd: "/push", desc: "push to remote" },
     { cmd: "/git on", desc: "enable auto-commits" },
     { cmd: "/git off", desc: "disable auto-commits" },
-    { cmd: "/models", desc: "list available models" },
+    { cmd: "/models", desc: "switch model" },
     { cmd: "/theme", desc: "switch color theme" },
-    { cmd: "/model", desc: "switch model mid-session" },
     { cmd: "/sessions", desc: "list past sessions" },
     { cmd: "/session delete", desc: "delete a session" },
     { cmd: "/resume", desc: "resume a past session" },
@@ -182,8 +182,12 @@ function App() {
     const [ollamaDeletePickerIndex, setOllamaDeletePickerIndex] = useState(0);
     const [ollamaPullPicker, setOllamaPullPicker] = useState(false);
     const [ollamaPullPickerIndex, setOllamaPullPickerIndex] = useState(0);
-    const [modelPicker, setModelPicker] = useState(null);
+    const [modelPickerGroups, setModelPickerGroups] = useState(null);
     const [modelPickerIndex, setModelPickerIndex] = useState(0);
+    const [flatModelList, setFlatModelList] = useState([]);
+    const [providerPicker, setProviderPicker] = useState(null);
+    const [providerPickerIndex, setProviderPickerIndex] = useState(0);
+    const [selectedProvider, setSelectedProvider] = useState(null);
     // ── Setup Wizard State ──
     const [wizardScreen, setWizardScreen] = useState(null);
     const [wizardIndex, setWizardIndex] = useState(0);
@@ -259,7 +263,7 @@ function App() {
             const selected = matches[idx];
             if (selected) {
                 // Commands that need args (like /commit, /model) — fill input instead of executing
-                if (selected.cmd === "/commit" || selected.cmd === "/model" || selected.cmd === "/session delete" ||
+                if (selected.cmd === "/commit" || selected.cmd === "/session delete" ||
                     selected.cmd === "/architect") {
                     setInput(selected.cmd + " ");
                     setCmdIndex(0);
@@ -320,8 +324,7 @@ function App() {
                 "  /help      — show this",
                 "  /connect   — retry LLM connection",
                 "  /login     — authentication setup (run codemaxxing login in terminal)",
-                "  /model     — switch model mid-session",
-                "  /models    — list available models",
+                "  /models    — switch model",
                 "  /map       — show repository map",
                 "  /sessions  — list past sessions",
                 "  /session delete — delete a session",
@@ -471,54 +474,140 @@ function App() {
             addMsg("info", `Messages in context: ${agent.getContextLength()}`);
             return;
         }
-        if (trimmed === "/models") {
+        if (trimmed === "/models" || trimmed === "/model") {
             addMsg("info", "Fetching available models...");
-            const { baseUrl, apiKey } = providerRef.current;
-            const models = await listModels(baseUrl, apiKey);
-            if (models.length === 0) {
-                addMsg("info", "No models found or couldn't reach provider.");
-            }
-            else {
-                addMsg("info", "Available models:\n" + models.map(m => `  ${m}`).join("\n"));
+            const groups = {};
+            const providerEntries = [];
+            // Local LLM (Ollama/LM Studio) — always show, auto-detect
+            let localFound = false;
+            // Check common local LLM endpoints
+            const localEndpoints = [
+                { name: "LM Studio", port: 1234 },
+                { name: "Ollama", port: 11434 },
+                { name: "vLLM", port: 8000 },
+                { name: "LocalAI", port: 8080 },
+            ];
+            for (const endpoint of localEndpoints) {
+                if (localFound)
+                    break;
+                try {
+                    const url = `http://localhost:${endpoint.port}/v1`;
+                    const models = await listModels(url, "local");
+                    if (models.length > 0) {
+                        groups["Local LLM"] = models.map(m => ({
+                            name: m,
+                            baseUrl: url,
+                            apiKey: "local",
+                            providerType: "openai",
+                        }));
+                        localFound = true;
+                    }
+                }
+                catch { /* not running */ }
             }
-            return;
-        }
-        if (trimmed === "/model") {
-            // Show picker of available models
-            addMsg("info", "Fetching available models...");
-            try {
-                const ollamaModels = await listInstalledModelsDetailed();
-                if (ollamaModels.length > 0) {
-                    setModelPicker(ollamaModels.map(m => m.name));
-                    setModelPickerIndex(0);
-                    return;
+            // Also check Ollama native API
+            if (!localFound) {
+                try {
+                    const ollamaModels = await listInstalledModelsDetailed();
+                    if (ollamaModels.length > 0) {
+                        groups["Local LLM"] = ollamaModels.map(m => ({
+                            name: m.name,
+                            baseUrl: "http://localhost:11434/v1",
+                            apiKey: "ollama",
+                            providerType: "openai",
+                        }));
+                        localFound = true;
+                    }
                 }
+                catch { /* Ollama not running */ }
+            }
+            if (localFound) {
+                providerEntries.push({ name: "Local LLM", description: "No auth needed — auto-detected", authed: true });
             }
-            catch (err) {
-                // Ollama not available or failed, try provider
+            // Anthropic
+            const anthropicCred = getCredential("anthropic");
+            const claudeModels = ["claude-sonnet-4-6", "claude-opus-4-6", "claude-haiku-4-5-20251001"];
+            if (anthropicCred) {
+                groups["Anthropic (Claude)"] = claudeModels.map(m => ({
+                    name: m,
+                    baseUrl: "https://api.anthropic.com",
+                    apiKey: anthropicCred.apiKey,
+                    providerType: "anthropic",
+                }));
             }
-            // Fallback: try provider's model list
-            if (providerRef.current?.baseUrl && providerRef.current.baseUrl !== "auto") {
+            providerEntries.push({ name: "Anthropic (Claude)", description: "Claude Opus, Sonnet, Haiku — use your subscription or API key", authed: !!anthropicCred });
+            // OpenAI
+            const openaiCred = getCredential("openai");
+            const openaiModels = ["gpt-5.4", "gpt-5.4-pro", "gpt-5", "gpt-5-mini", "gpt-4.1", "gpt-4.1-mini", "o3", "o4-mini", "gpt-4o"];
+            if (openaiCred) {
+                // OAuth tokens (non sk- keys) must use ChatGPT backend, not api.openai.com
+                const isOAuthToken = openaiCred.method === "oauth" || openaiCred.method === "cached-token" ||
+                    (!openaiCred.apiKey.startsWith("sk-") && !openaiCred.apiKey.startsWith("sess-"));
+                const baseUrl = isOAuthToken
+                    ? "https://chatgpt.com/backend-api"
+                    : (openaiCred.baseUrl || "https://api.openai.com/v1");
+                groups["OpenAI (ChatGPT)"] = openaiModels.map(m => ({
+                    name: m,
+                    baseUrl,
+                    apiKey: openaiCred.apiKey,
+                    providerType: "openai",
+                }));
+            }
+            providerEntries.push({ name: "OpenAI (ChatGPT)", description: "GPT-5, GPT-4.1, o3 — use your ChatGPT subscription or API key", authed: !!openaiCred });
+            // OpenRouter
+            const openrouterCred = getCredential("openrouter");
+            if (openrouterCred) {
                 try {
-                    const providerModels = await listModels(providerRef.current.baseUrl, providerRef.current.apiKey || "");
-                    if (providerModels.length > 0) {
-                        setModelPicker(providerModels);
-                        setModelPickerIndex(0);
-                        return;
+                    const orModels = await listModels(openrouterCred.baseUrl || "https://openrouter.ai/api/v1", openrouterCred.apiKey);
+                    if (orModels.length > 0) {
+                        groups["OpenRouter"] = orModels.slice(0, 20).map(m => ({
+                            name: m,
+                            baseUrl: openrouterCred.baseUrl || "https://openrouter.ai/api/v1",
+                            apiKey: openrouterCred.apiKey,
+                            providerType: "openai",
+                        }));
                     }
                 }
-                catch (err) {
-                    // Provider fetch failed
-                }
+                catch { /* skip */ }
+            }
+            providerEntries.push({ name: "OpenRouter", description: "200+ models (Claude, GPT, Gemini, Llama, etc.) — one login", authed: !!openrouterCred });
+            // Qwen
+            const qwenCred = getCredential("qwen");
+            if (qwenCred) {
+                groups["Qwen"] = ["qwen-max", "qwen-plus", "qwen-turbo"].map(m => ({
+                    name: m,
+                    baseUrl: qwenCred.baseUrl || "https://dashscope.aliyuncs.com/compatible-mode/v1",
+                    apiKey: qwenCred.apiKey,
+                    providerType: "openai",
+                }));
+            }
+            providerEntries.push({ name: "Qwen", description: "Qwen 3.5, Qwen Coder — use your Qwen CLI login or API key", authed: !!qwenCred });
+            // GitHub Copilot
+            const copilotCred = getCredential("copilot");
+            if (copilotCred) {
+                groups["GitHub Copilot"] = ["gpt-4o", "claude-3.5-sonnet"].map(m => ({
+                    name: m,
+                    baseUrl: copilotCred.baseUrl || "https://api.githubcopilot.com",
+                    apiKey: copilotCred.apiKey,
+                    providerType: "openai",
+                }));
+            }
+            providerEntries.push({ name: "GitHub Copilot", description: "Use your GitHub Copilot subscription", authed: !!copilotCred });
+            // Show provider picker (step 1)
+            if (providerEntries.length > 0) {
+                setModelPickerGroups(groups);
+                setProviderPicker(providerEntries);
+                setProviderPickerIndex(0);
+                setSelectedProvider(null);
+                return;
             }
-            // No models found anywhere
             addMsg("error", "No models available. Download one with /ollama pull or configure a provider.");
             return;
         }
         if (trimmed.startsWith("/model ")) {
             const newModel = trimmed.replace("/model ", "").trim();
             if (!newModel) {
-                addMsg("info", `Current model: ${modelName}\n  Usage: /model <model-name>`);
+                addMsg("info", `Current model: ${modelName}\n  Usage: /models`);
                 return;
             }
             agent.switchModel(newModel);
@@ -670,10 +759,18 @@ function App() {
             setSkillsPicker,
             sessionDisabledSkills,
             setSessionDisabledSkills,
-            modelPicker,
+            modelPickerGroups,
             modelPickerIndex,
             setModelPickerIndex,
-            setModelPicker,
+            setModelPickerGroups,
+            flatModelList,
+            setFlatModelList,
+            providerPicker,
+            providerPickerIndex,
+            setProviderPickerIndex,
+            setProviderPicker,
+            selectedProvider,
+            setSelectedProvider,
             ollamaDeletePicker,
             ollamaDeletePickerIndex,
             setOllamaDeletePickerIndex,
@@ -754,7 +851,7 @@ function App() {
                     default:
                         return _jsx(Text, { children: msg.text }, msg.id);
                 }
-            }), loading && !approval && !streaming && _jsx(NeonSpinner, { message: spinnerMsg, colors: theme.colors }), streaming && !loading && _jsx(StreamingIndicator, { colors: theme.colors }), approval && (_jsx(ApprovalPrompt, { approval: approval, colors: theme.colors })), loginPicker && (_jsx(LoginPicker, { loginPickerIndex: loginPickerIndex, colors: theme.colors })), loginMethodPicker && (_jsx(LoginMethodPickerUI, { loginMethodPicker: loginMethodPicker, loginMethodIndex: loginMethodIndex, colors: theme.colors })), skillsPicker === "menu" && (_jsx(SkillsMenu, { skillsPickerIndex: skillsPickerIndex, colors: theme.colors })), skillsPicker === "browse" && (_jsx(SkillsBrowse, { skillsPickerIndex: skillsPickerIndex, colors: theme.colors })), skillsPicker === "installed" && (_jsx(SkillsInstalled, { skillsPickerIndex: skillsPickerIndex, sessionDisabledSkills: sessionDisabledSkills, colors: theme.colors })), skillsPicker === "remove" && (_jsx(SkillsRemove, { skillsPickerIndex: skillsPickerIndex, colors: theme.colors })), themePicker && (_jsx(ThemePickerUI, { themePickerIndex: themePickerIndex, theme: theme })), sessionPicker && (_jsx(SessionPicker, { sessions: sessionPicker, selectedIndex: sessionPickerIndex, colors: theme.colors })), deleteSessionPicker && (_jsx(DeleteSessionPicker, { sessions: deleteSessionPicker, selectedIndex: deleteSessionPickerIndex, colors: theme.colors })), deleteSessionConfirm && (_jsx(DeleteSessionConfirm, { session: deleteSessionConfirm, colors: theme.colors })), modelPicker && (_jsx(ModelPicker, { models: modelPicker, selectedIndex: modelPickerIndex, activeModel: modelName, colors: theme.colors })), ollamaDeletePicker && (_jsx(OllamaDeletePicker, { models: ollamaDeletePicker.models, selectedIndex: ollamaDeletePickerIndex, colors: theme.colors })), ollamaPullPicker && (_jsx(OllamaPullPicker, { selectedIndex: ollamaPullPickerIndex, colors: theme.colors })), ollamaDeleteConfirm && (_jsx(OllamaDeleteConfirm, { model: ollamaDeleteConfirm.model, size: ollamaDeleteConfirm.size, colors: theme.colors })), ollamaPulling && (_jsx(OllamaPullProgress, { model: ollamaPulling.model, progress: ollamaPulling.progress, colors: theme.colors })), ollamaExitPrompt && (_jsx(OllamaExitPrompt, { colors: theme.colors })), wizardScreen === "connection" && (_jsx(WizardConnection, { wizardIndex: wizardIndex, colors: theme.colors })), wizardScreen === "models" && wizardHardware && (_jsx(WizardModels, { wizardIndex: wizardIndex, wizardHardware: wizardHardware, wizardModels: wizardModels, colors: theme.colors })), wizardScreen === "install-ollama" && (_jsx(WizardInstallOllama, { wizardHardware: wizardHardware, colors: theme.colors })), wizardScreen === "pulling" && (wizardSelectedModel || wizardPullProgress) && (_jsx(WizardPulling, { wizardSelectedModel: wizardSelectedModel, wizardPullProgress: wizardPullProgress, wizardPullError: wizardPullError, colors: theme.colors })), showSuggestions && (_jsx(CommandSuggestions, { cmdMatches: cmdMatches, cmdIndex: cmdIndex, colors: theme.colors })), _jsxs(Box, { borderStyle: "single", borderColor: approval ? theme.colors.warning : theme.colors.border, paddingX: 1, children: [_jsx(Text, { color: theme.colors.secondary, bold: true, children: "> " }), approval ? (_jsx(Text, { color: theme.colors.warning, children: "waiting for approval..." })) : ready && !loading && !wizardScreen ? (_jsxs(Box, { children: [pastedChunks.map((p) => (_jsxs(Text, { color: theme.colors.muted, children: ["[Pasted text #", p.id, " +", p.lines, " lines]"] }, p.id))), _jsx(TextInput, { value: input, onChange: (v) => { setInput(sanitizeInputArtifacts(v)); setCmdIndex(0); }, onSubmit: handleSubmit }, inputKey)] })) : (_jsx(Text, { dimColor: true, children: loading ? "waiting for response..." : "initializing..." }))] }), agent && (_jsx(StatusBar, { agent: agent, modelName: modelName, sessionDisabledSkills: sessionDisabledSkills }))] }));
+            }), loading && !approval && !streaming && _jsx(NeonSpinner, { message: spinnerMsg, colors: theme.colors }), streaming && !loading && _jsx(StreamingIndicator, { colors: theme.colors }), approval && (_jsx(ApprovalPrompt, { approval: approval, colors: theme.colors })), loginPicker && (_jsx(LoginPicker, { loginPickerIndex: loginPickerIndex, colors: theme.colors })), loginMethodPicker && (_jsx(LoginMethodPickerUI, { loginMethodPicker: loginMethodPicker, loginMethodIndex: loginMethodIndex, colors: theme.colors })), skillsPicker === "menu" && (_jsx(SkillsMenu, { skillsPickerIndex: skillsPickerIndex, colors: theme.colors })), skillsPicker === "browse" && (_jsx(SkillsBrowse, { skillsPickerIndex: skillsPickerIndex, colors: theme.colors })), skillsPicker === "installed" && (_jsx(SkillsInstalled, { skillsPickerIndex: skillsPickerIndex, sessionDisabledSkills: sessionDisabledSkills, colors: theme.colors })), skillsPicker === "remove" && (_jsx(SkillsRemove, { skillsPickerIndex: skillsPickerIndex, colors: theme.colors })), themePicker && (_jsx(ThemePickerUI, { themePickerIndex: themePickerIndex, theme: theme })), sessionPicker && (_jsx(SessionPicker, { sessions: sessionPicker, selectedIndex: sessionPickerIndex, colors: theme.colors })), deleteSessionPicker && (_jsx(DeleteSessionPicker, { sessions: deleteSessionPicker, selectedIndex: deleteSessionPickerIndex, colors: theme.colors })), deleteSessionConfirm && (_jsx(DeleteSessionConfirm, { session: deleteSessionConfirm, colors: theme.colors })), providerPicker && !selectedProvider && (_jsx(ProviderPicker, { providers: providerPicker, selectedIndex: providerPickerIndex, colors: theme.colors })), selectedProvider && modelPickerGroups && modelPickerGroups[selectedProvider] && (_jsx(ModelPicker, { providerName: selectedProvider, models: modelPickerGroups[selectedProvider], selectedIndex: modelPickerIndex, activeModel: modelName, colors: theme.colors })), ollamaDeletePicker && (_jsx(OllamaDeletePicker, { models: ollamaDeletePicker.models, selectedIndex: ollamaDeletePickerIndex, colors: theme.colors })), ollamaPullPicker && (_jsx(OllamaPullPicker, { selectedIndex: ollamaPullPickerIndex, colors: theme.colors })), ollamaDeleteConfirm && (_jsx(OllamaDeleteConfirm, { model: ollamaDeleteConfirm.model, size: ollamaDeleteConfirm.size, colors: theme.colors })), ollamaPulling && (_jsx(OllamaPullProgress, { model: ollamaPulling.model, progress: ollamaPulling.progress, colors: theme.colors })), ollamaExitPrompt && (_jsx(OllamaExitPrompt, { colors: theme.colors })), wizardScreen === "connection" && (_jsx(WizardConnection, { wizardIndex: wizardIndex, colors: theme.colors })), wizardScreen === "models" && wizardHardware && (_jsx(WizardModels, { wizardIndex: wizardIndex, wizardHardware: wizardHardware, wizardModels: wizardModels, colors: theme.colors })), wizardScreen === "install-ollama" && (_jsx(WizardInstallOllama, { wizardHardware: wizardHardware, colors: theme.colors })), wizardScreen === "pulling" && (wizardSelectedModel || wizardPullProgress) && (_jsx(WizardPulling, { wizardSelectedModel: wizardSelectedModel, wizardPullProgress: wizardPullProgress, wizardPullError: wizardPullError, colors: theme.colors })), showSuggestions && (_jsx(CommandSuggestions, { cmdMatches: cmdMatches, cmdIndex: cmdIndex, colors: theme.colors })), _jsxs(Box, { borderStyle: "single", borderColor: approval ? theme.colors.warning : theme.colors.border, paddingX: 1, children: [_jsx(Text, { color: theme.colors.secondary, bold: true, children: "> " }), approval ? (_jsx(Text, { color: theme.colors.warning, children: "waiting for approval..." })) : ready && !loading && !wizardScreen ? (_jsxs(Box, { children: [pastedChunks.map((p) => (_jsxs(Text, { color: theme.colors.muted, children: ["[Pasted text #", p.id, " +", p.lines, " lines]"] }, p.id))), _jsx(TextInput, { value: input, onChange: (v) => { setInput(sanitizeInputArtifacts(v)); setCmdIndex(0); }, onSubmit: handleSubmit }, inputKey)] })) : (_jsx(Text, { dimColor: true, children: loading ? "waiting for response..." : "initializing..." }))] }), agent && (_jsx(StatusBar, { agent: agent, modelName: modelName, sessionDisabledSkills: sessionDisabledSkills }))] }));
 }
 // Clear screen before render
 process.stdout.write("\x1B[2J\x1B[3J\x1B[H");

package/dist/ui/input-router.d.ts

@@ -36,10 +36,50 @@ export interface InputRouterContext extends WizardContext {
     setSkillsPicker: (val: "menu" | "browse" | "installed" | "remove" | null) => void;
     sessionDisabledSkills: Set<string>;
     setSessionDisabledSkills: (fn: (prev: Set<string>) => Set<string>) => void;
-    modelPicker: string[] | null;
+    providerPicker: Array<{
+        name: string;
+        description: string;
+        authed: boolean;
+    }> | null;
+    providerPickerIndex: number;
+    setProviderPickerIndex: (fn: (prev: number) => number) => void;
+    setProviderPicker: (val: Array<{
+        name: string;
+        description: string;
+        authed: boolean;
+    }> | null) => void;
+    selectedProvider: string | null;
+    setSelectedProvider: (val: string | null) => void;
+    modelPickerGroups: {
+        [providerName: string]: Array<{
+            name: string;
+            baseUrl: string;
+            apiKey: string;
+            providerType: "openai" | "anthropic";
+        }>;
+    } | null;
     modelPickerIndex: number;
     setModelPickerIndex: (fn: (prev: number) => number) => void;
-    setModelPicker: (val: string[] | null) => void;
+    setModelPickerGroups: (val: {
+        [providerName: string]: Array<{
+            name: string;
+            baseUrl: string;
+            apiKey: string;
+            providerType: "openai" | "anthropic";
+        }>;
+    } | null) => void;
+    flatModelList: Array<{
+        name: string;
+        baseUrl: string;
+        apiKey: string;
+        providerType: "openai" | "anthropic";
+    }>;
+    setFlatModelList: (val: Array<{
+        name: string;
+        baseUrl: string;
+        apiKey: string;
+        providerType: "openai" | "anthropic";
+    }>) => void;
     ollamaDeletePicker: {
         models: {
             name: string;

package/dist/ui/input-router.js

@@ -1,4 +1,6 @@
-import { PROVIDERS, openRouterOAuth, anthropicSetupToken, importCodexToken, importQwenToken, copilotDeviceFlow } from "../utils/auth.js";
+import { PROVIDERS, openRouterOAuth, importCodexToken, importQwenToken, copilotDeviceFlow } from "../utils/auth.js";
+import { loginOpenAICodexOAuth } from "../utils/openai-oauth.js";
+import { loginAnthropicOAuth } from "../utils/anthropic-oauth.js";
 import { listInstalledSkills, installSkill, removeSkill, getRegistrySkills } from "../utils/skills.js";
 import { listThemes, getTheme, THEMES } from "../themes.js";
 import { getSession, loadMessages, deleteSession } from "../utils/sessions.js";
@@ -15,6 +17,8 @@ export function routeKeyPress(inputChar, key, ctx) {
         return true;
     if (handleSkillsPicker(inputChar, key, ctx))
         return true;
+    if (handleProviderPicker(inputChar, key, ctx))
+        return true;
     if (handleModelPicker(inputChar, key, ctx))
         return true;
     if (handleOllamaDeletePicker(inputChar, key, ctx))
@@ -99,21 +103,37 @@ function handleLoginMethodPicker(inputChar, key, ctx) {
             })
                 .catch((err) => { ctx.addMsg("error", `OAuth failed: ${err.message}`); ctx.setLoading(false); });
         }
-        else if (method === "setup-token") {
-            ctx.addMsg("info", "Starting setup-token flow — browser will open...");
+        else if (method === "oauth" && providerId === "anthropic") {
+            ctx.addMsg("info", "Opening browser for Claude login...");
             ctx.setLoading(true);
-            ctx.setSpinnerMsg("Waiting for Claude Code auth...");
-            anthropicSetupToken((msg) => ctx.addMsg("info", msg))
+            ctx.setSpinnerMsg("Waiting for Anthropic authorization...");
+            loginAnthropicOAuth((msg) => ctx.addMsg("info", msg))
                 .then((cred) => { ctx.addMsg("info", `✅ Anthropic authenticated! (${cred.label})`); ctx.setLoading(false); })
-                .catch((err) => { ctx.addMsg("error", `Auth failed: ${err.message}`); ctx.setLoading(false); });
+                .catch((err) => {
+                ctx.addMsg("error", `OAuth failed: ${err.message}\n  Fallback: set your key via CLI:  codemaxxing auth api-key anthropic <your-key>\n  Or set ANTHROPIC_API_KEY env var and restart.\n  Get key at: console.anthropic.com/settings/keys`);
+                ctx.setLoading(false);
+            });
         }
-        else if (method === "cached-token" && providerId === "openai") {
+        else if (method === "oauth" && providerId === "openai") {
+            // Try cached Codex token first as a quick path
             const imported = importCodexToken((msg) => ctx.addMsg("info", msg));
             if (imported) {
                 ctx.addMsg("info", `✅ Imported Codex credentials! (${imported.label})`);
             }
             else {
-                ctx.addMsg("info", "No Codex CLI found. Install Codex CLI and sign in first.");
+                // Primary flow: browser OAuth
+                ctx.addMsg("info", "Opening browser for ChatGPT login...");
+                ctx.setLoading(true);
+                ctx.setSpinnerMsg("Waiting for OpenAI authorization...");
+                loginOpenAICodexOAuth((msg) => ctx.addMsg("info", msg))
+                    .then((cred) => {
+                    ctx.addMsg("info", `✅ OpenAI authenticated! (${cred.label})`);
+                    ctx.setLoading(false);
+                })
+                    .catch((err) => {
+                    ctx.addMsg("error", `OAuth failed: ${err.message}\n  Fallback: set your key via CLI:  codemaxxing auth api-key openai <your-key>\n  Or set OPENAI_API_KEY env var and restart.\n  Get key at: platform.openai.com/api-keys`);
+                    ctx.setLoading(false);
+                });
             }
         }
         else if (method === "cached-token" && providerId === "qwen") {
@@ -343,30 +363,68 @@ function handleSkillsPicker(_inputChar, key, ctx) {
     }
     return true; // absorb all keys when skills picker is active
 }
+function handleProviderPicker(_inputChar, key, ctx) {
+    if (!ctx.providerPicker || ctx.selectedProvider)
+        return false;
+    const len = ctx.providerPicker.length;
+    if (key.upArrow) {
+        ctx.setProviderPickerIndex((prev) => (prev - 1 + len) % len);
+        return true;
+    }
+    if (key.downArrow) {
+        ctx.setProviderPickerIndex((prev) => (prev + 1) % len);
+        return true;
+    }
+    if (key.escape) {
+        ctx.setProviderPicker(null);
+        return true;
+    }
+    if (key.return) {
+        const selected = ctx.providerPicker[ctx.providerPickerIndex];
+        ctx.setSelectedProvider(selected.name);
+        ctx.setModelPickerIndex(() => 0);
+        return true;
+    }
+    return true;
+}
 function handleModelPicker(_inputChar, key, ctx) {
-    if (!ctx.modelPicker)
+    if (!ctx.selectedProvider || !ctx.modelPickerGroups)
         return false;
+    const models = ctx.modelPickerGroups[ctx.selectedProvider];
+    if (!models)
+        return false;
+    const len = models.length;
     if (key.upArrow) {
-        ctx.setModelPickerIndex((prev) => (prev - 1 + ctx.modelPicker.length) % ctx.modelPicker.length);
+        ctx.setModelPickerIndex((prev) => (prev - 1 + len) % len);
         return true;
     }
     if (key.downArrow) {
-        ctx.setModelPickerIndex((prev) => (prev + 1) % ctx.modelPicker.length);
+        ctx.setModelPickerIndex((prev) => (prev + 1) % len);
         return true;
     }
     if (key.escape) {
-        ctx.setModelPicker(null);
+        ctx.setSelectedProvider(null);
+        ctx.setModelPickerIndex(() => 0);
         return true;
     }
     if (key.return) {
-        const selected = ctx.modelPicker[ctx.modelPickerIndex];
+        const selected = models[ctx.modelPickerIndex];
         if (selected && ctx.agent) {
-            ctx.agent.switchModel(selected);
-            ctx.setModelName(selected);
-            ctx.addMsg("info", `✅ Switched to: ${selected}`);
+            ctx.agent.switchModel(selected.name, selected.baseUrl, selected.apiKey, selected.providerType);
+            ctx.setModelName(selected.name);
+            ctx.addMsg("info", `✅ Switched to: ${selected.name}`);
             ctx.refreshConnectionBanner();
         }
-        ctx.setModelPicker(null);
+        else if (selected && !ctx.agent) {
+            // First-time: trigger reconnect which will create the agent
+            ctx.addMsg("info", `Initializing with ${selected.name}...`);
+            ctx.connectToProvider?.(false);
+        }
+        ctx.setModelPickerGroups(null);
+        ctx.setProviderPicker(null);
+        ctx.setSelectedProvider(null);
+        ctx.setModelPickerIndex(() => 0);
+        ctx.setProviderPickerIndex(() => 0);
         return true;
     }
     return true;

package/dist/ui/pickers.d.ts

@@ -77,13 +77,34 @@ interface DeleteSessionConfirmProps {
     colors: Theme["colors"];
 }
 export declare function DeleteSessionConfirm({ session, colors }: DeleteSessionConfirmProps): import("react/jsx-runtime").JSX.Element;
+export interface ModelEntry {
+    name: string;
+    baseUrl: string;
+    apiKey: string;
+    providerType: "openai" | "anthropic";
+}
+export interface GroupedModels {
+    [providerName: string]: ModelEntry[];
+}
+export interface ProviderPickerEntry {
+    name: string;
+    description: string;
+    authed: boolean;
+}
+interface ProviderPickerProps {
+    providers: ProviderPickerEntry[];
+    selectedIndex: number;
+    colors: Theme["colors"];
+}
+export declare function ProviderPicker({ providers, selectedIndex, colors }: ProviderPickerProps): import("react/jsx-runtime").JSX.Element;
 interface ModelPickerProps {
-    models: string[];
+    providerName: string;
+    models: ModelEntry[];
     selectedIndex: number;
     activeModel: string;
     colors: Theme["colors"];
 }
-export declare function ModelPicker({ models, selectedIndex, activeModel, colors }: ModelPickerProps): import("react/jsx-runtime").JSX.Element;
+export declare function ModelPicker({ providerName, models, selectedIndex, activeModel, colors }: ModelPickerProps): import("react/jsx-runtime").JSX.Element;
 interface OllamaDeletePickerProps {
     models: Array<{
         name: string;

package/dist/ui/pickers.js

@@ -13,6 +13,11 @@ export function LoginPicker({ loginPickerIndex, colors }) {
     return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: colors.secondary, children: "\uD83D\uDCAA Choose a provider:" }), PROVIDERS.filter((p) => p.id !== "local").map((p, i) => (_jsxs(Text, { children: [i === loginPickerIndex ? _jsx(Text, { color: colors.suggestion, bold: true, children: "▸ " }) : _jsx(Text, { children: "  " }), _jsx(Text, { color: i === loginPickerIndex ? colors.suggestion : colors.primary, bold: true, children: p.name }), _jsxs(Text, { color: colors.muted, children: [" — ", p.description] }), getCredentials().some((c) => c.provider === p.id) ? _jsx(Text, { color: colors.success, children: " \u2713" }) : null] }, p.id))), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter select · Esc cancel" })] }));
 }
 export function LoginMethodPickerUI({ loginMethodPicker, loginMethodIndex, colors }) {
+    // Provider-specific label overrides
+    const providerLabels = {
+        anthropic: { "oauth": "🔐 Login with Claude Pro/Max (browser)" },
+        openai: { "oauth": "🔐 Login with ChatGPT (browser)" },
+    };
     const labels = {
         "oauth": "🌐 Browser login (OAuth)",
         "setup-token": "🔑 Link subscription (via Claude Code CLI)",
@@ -20,7 +25,8 @@ export function LoginMethodPickerUI({ loginMethodPicker, loginMethodIndex, color
         "api-key": "🔒 Enter API key manually",
         "device-flow": "📱 Device flow (GitHub)",
     };
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: colors.secondary, children: "How do you want to authenticate?" }), loginMethodPicker.methods.map((method, i) => (_jsxs(Text, { children: [i === loginMethodIndex ? _jsx(Text, { color: colors.suggestion, bold: true, children: "▸ " }) : _jsx(Text, { children: "  " }), _jsx(Text, { color: i === loginMethodIndex ? colors.suggestion : colors.primary, bold: true, children: labels[method] ?? method })] }, method))), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter select · Esc back" })] }));
+    const getLabel = (method) => providerLabels[loginMethodPicker.provider]?.[method] ?? labels[method] ?? method;
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: colors.secondary, children: "How do you want to authenticate?" }), loginMethodPicker.methods.map((method, i) => (_jsxs(Text, { children: [i === loginMethodIndex ? _jsx(Text, { color: colors.suggestion, bold: true, children: "▸ " }) : _jsx(Text, { children: "  " }), _jsx(Text, { color: i === loginMethodIndex ? colors.suggestion : colors.primary, bold: true, children: getLabel(method) })] }, method))), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter select · Esc back" })] }));
 }
 export function SkillsMenu({ skillsPickerIndex, colors }) {
     const items = [
@@ -57,8 +63,11 @@ export function DeleteSessionPicker({ sessions, selectedIndex, colors }) {
 export function DeleteSessionConfirm({ session, colors }) {
     return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.warning, paddingX: 1, marginBottom: 0, children: [_jsxs(Text, { bold: true, color: colors.warning, children: ["Delete session ", session.id, "?"] }), _jsxs(Text, { color: colors.muted, children: ["  ", session.display] }), _jsxs(Text, { children: [_jsx(Text, { color: colors.error, bold: true, children: " [y]" }), _jsx(Text, { children: "es  " }), _jsx(Text, { color: colors.success, bold: true, children: "[n]" }), _jsx(Text, { children: "o" })] })] }));
 }
-export function ModelPicker({ models, selectedIndex, activeModel, colors }) {
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: colors.secondary, children: "Switch model:" }), _jsx(Text, { children: "" }), models.map((m, i) => (_jsxs(Text, { children: ["  ", i === selectedIndex ? _jsx(Text, { color: colors.primary, bold: true, children: "▸ " }) : "  ", _jsx(Text, { color: i === selectedIndex ? colors.primary : undefined, children: m }), m === activeModel ? _jsx(Text, { color: colors.success, children: " (active)" }) : null] }, m))), _jsx(Text, { children: "" }), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter to switch · Esc cancel" })] }));
+export function ProviderPicker({ providers, selectedIndex, colors }) {
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: colors.secondary, children: "Choose a provider:" }), _jsx(Text, { children: "" }), providers.map((p, i) => (_jsxs(Text, { children: [i === selectedIndex ? _jsx(Text, { color: colors.primary, bold: true, children: "▸ " }) : "  ", _jsx(Text, { color: i === selectedIndex ? colors.primary : undefined, bold: true, children: p.name }), _jsxs(Text, { dimColor: true, children: [" — ", p.description] }), p.authed ? _jsx(Text, { color: colors.success, children: " ✓" }) : null] }, p.name))), _jsx(Text, { children: "" }), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter select · Esc cancel" })] }));
+}
+export function ModelPicker({ providerName, models, selectedIndex, activeModel, colors }) {
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsxs(Text, { bold: true, color: colors.secondary, children: ["── ", providerName, " ──"] }), _jsx(Text, { children: "" }), models.map((entry, i) => (_jsxs(Text, { children: ["  ", i === selectedIndex ? _jsx(Text, { color: colors.primary, bold: true, children: "▸ " }) : "  ", _jsx(Text, { color: i === selectedIndex ? colors.primary : undefined, children: entry.name }), entry.name === activeModel ? _jsx(Text, { color: colors.success, children: " (active)" }) : null] }, entry.name))), _jsx(Text, { children: "" }), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter switch · Esc back" })] }));
 }
 export function OllamaDeletePicker({ models, selectedIndex, colors }) {
     return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: colors.border, paddingX: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: colors.secondary, children: "Delete which model?" }), _jsx(Text, { children: "" }), models.map((m, i) => (_jsxs(Text, { children: ["  ", i === selectedIndex ? _jsx(Text, { color: colors.primary, bold: true, children: "▸ " }) : "  ", _jsx(Text, { color: i === selectedIndex ? colors.primary : undefined, children: m.name }), _jsxs(Text, { color: colors.muted, children: [" (", (m.size / (1024 * 1024 * 1024)).toFixed(1), " GB)"] })] }, m.name))), _jsx(Text, { children: "" }), _jsx(Text, { dimColor: true, children: "  ↑↓ navigate · Enter to delete · Esc cancel" })] }));

package/dist/utils/anthropic-oauth.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Anthropic OAuth PKCE flow
+ *
+ * Lets users log in with their Claude Pro/Max subscription (no API key needed).
+ * Uses the same OAuth flow as Claude Code CLI.
+ */
+import { type AuthCredential } from "./auth.js";
+export declare function refreshAnthropicOAuthToken(refreshToken: string): Promise<{
+    access: string;
+    refresh: string;
+    expires: number;
+}>;
+export declare function loginAnthropicOAuth(onStatus?: (msg: string) => void): Promise<AuthCredential>;