codeblog-app 0.3.0 → 0.4.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "codeblog-app",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "CLI client for CodeBlog — the forum where AI writes the posts",
   "type": "module",
   "license": "MIT",
@@ -56,15 +56,35 @@
     "typescript": "5.8.2"
   },
   "dependencies": {
+    "@ai-sdk/amazon-bedrock": "^4.0.60",
     "@ai-sdk/anthropic": "^3.0.44",
+    "@ai-sdk/azure": "^3.0.30",
+    "@ai-sdk/cerebras": "^2.0.33",
+    "@ai-sdk/cohere": "^3.0.21",
+    "@ai-sdk/deepinfra": "^2.0.34",
+    "@ai-sdk/gateway": "^3.0.46",
     "@ai-sdk/google": "^3.0.29",
+    "@ai-sdk/google-vertex": "^4.0.58",
+    "@ai-sdk/groq": "^3.0.24",
+    "@ai-sdk/mistral": "^3.0.20",
     "@ai-sdk/openai": "^3.0.29",
+    "@ai-sdk/openai-compatible": "^2.0.30",
+    "@ai-sdk/perplexity": "^3.0.19",
+    "@ai-sdk/togetherai": "^2.0.33",
+    "@ai-sdk/vercel": "^2.0.32",
+    "@ai-sdk/xai": "^3.0.56",
+    "@openrouter/ai-sdk-provider": "^2.2.3",
+    "@opentui/core": "^0.1.79",
+    "@opentui/solid": "^0.1.79",
     "ai": "^6.0.86",
     "drizzle-orm": "1.0.0-beta.12-a5629fb",
+    "fuzzysort": "^3.1.0",
     "hono": "4.10.7",
     "ink": "^6.7.0",
     "open": "10.1.2",
     "react": "^19.2.4",
+    "remeda": "^2.33.6",
+    "solid-js": "^1.9.11",
     "xdg-basedir": "5.1.0",
     "yargs": "18.0.0",
     "zod": "4.1.8"

package/src/ai/provider.ts

@@ -1,117 +1,311 @@
 import { createAnthropic } from "@ai-sdk/anthropic"
 import { createOpenAI } from "@ai-sdk/openai"
 import { createGoogleGenerativeAI } from "@ai-sdk/google"
-import { type LanguageModel } from "ai"
+import { createAmazonBedrock } from "@ai-sdk/amazon-bedrock"
+import { createAzure } from "@ai-sdk/azure"
+import { createGoogleGenerativeAI as createVertex } from "@ai-sdk/google"
+import { createOpenAICompatible } from "@ai-sdk/openai-compatible"
+import { createOpenRouter } from "@openrouter/ai-sdk-provider"
+import { createXai } from "@ai-sdk/xai"
+import { createMistral } from "@ai-sdk/mistral"
+import { createGroq } from "@ai-sdk/groq"
+import { createDeepInfra } from "@ai-sdk/deepinfra"
+import { createCerebras } from "@ai-sdk/cerebras"
+import { createCohere } from "@ai-sdk/cohere"
+import { createGateway } from "@ai-sdk/gateway"
+import { createTogetherAI } from "@ai-sdk/togetherai"
+import { createPerplexity } from "@ai-sdk/perplexity"
+import { createVercel } from "@ai-sdk/vercel"
+import { type LanguageModel, type Provider as SDK } from "ai"
 import { Config } from "../config"
 import { Log } from "../util/log"
+import { Global } from "../global"
+import path from "path"
 
 const log = Log.create({ service: "ai-provider" })
 
 export namespace AIProvider {
-  export type ProviderID = "anthropic" | "openai" | "google"
+  // ---------------------------------------------------------------------------
+  // Bundled providers — same mapping as opencode
+  // ---------------------------------------------------------------------------
+  const BUNDLED_PROVIDERS: Record<string, (options: any) => SDK> = {
+    "@ai-sdk/amazon-bedrock": createAmazonBedrock,
+    "@ai-sdk/anthropic": createAnthropic,
+    "@ai-sdk/azure": createAzure,
+    "@ai-sdk/google": createGoogleGenerativeAI,
+    "@ai-sdk/google-vertex": createVertex as any,
+    "@ai-sdk/openai": createOpenAI,
+    "@ai-sdk/openai-compatible": createOpenAICompatible,
+    "@openrouter/ai-sdk-provider": createOpenRouter as any,
+    "@ai-sdk/xai": createXai,
+    "@ai-sdk/mistral": createMistral,
+    "@ai-sdk/groq": createGroq,
+    "@ai-sdk/deepinfra": createDeepInfra,
+    "@ai-sdk/cerebras": createCerebras,
+    "@ai-sdk/cohere": createCohere,
+    "@ai-sdk/gateway": createGateway,
+    "@ai-sdk/togetherai": createTogetherAI,
+    "@ai-sdk/perplexity": createPerplexity,
+    "@ai-sdk/vercel": createVercel,
+  }
+
+  // ---------------------------------------------------------------------------
+  // Provider env key mapping
+  // ---------------------------------------------------------------------------
+  const PROVIDER_ENV: Record<string, string[]> = {
+    anthropic: ["ANTHROPIC_API_KEY"],
+    openai: ["OPENAI_API_KEY"],
+    google: ["GOOGLE_GENERATIVE_AI_API_KEY", "GOOGLE_API_KEY"],
+    "amazon-bedrock": ["AWS_ACCESS_KEY_ID"],
+    azure: ["AZURE_API_KEY", "AZURE_OPENAI_API_KEY"],
+    xai: ["XAI_API_KEY"],
+    mistral: ["MISTRAL_API_KEY"],
+    groq: ["GROQ_API_KEY"],
+    deepinfra: ["DEEPINFRA_API_KEY"],
+    cerebras: ["CEREBRAS_API_KEY"],
+    cohere: ["COHERE_API_KEY"],
+    togetherai: ["TOGETHER_AI_API_KEY", "TOGETHERAI_API_KEY"],
+    perplexity: ["PERPLEXITY_API_KEY"],
+    openrouter: ["OPENROUTER_API_KEY"],
+    "openai-compatible": ["OPENAI_COMPATIBLE_API_KEY"],
+  }
+
+  // ---------------------------------------------------------------------------
+  // Provider → npm package mapping
+  // ---------------------------------------------------------------------------
+  const PROVIDER_NPM: Record<string, string> = {
+    anthropic: "@ai-sdk/anthropic",
+    openai: "@ai-sdk/openai",
+    google: "@ai-sdk/google",
+    "amazon-bedrock": "@ai-sdk/amazon-bedrock",
+    azure: "@ai-sdk/azure",
+    "google-vertex": "@ai-sdk/google-vertex",
+    xai: "@ai-sdk/xai",
+    mistral: "@ai-sdk/mistral",
+    groq: "@ai-sdk/groq",
+    deepinfra: "@ai-sdk/deepinfra",
+    cerebras: "@ai-sdk/cerebras",
+    cohere: "@ai-sdk/cohere",
+    gateway: "@ai-sdk/gateway",
+    togetherai: "@ai-sdk/togetherai",
+    perplexity: "@ai-sdk/perplexity",
+    vercel: "@ai-sdk/vercel",
+    openrouter: "@openrouter/ai-sdk-provider",
+    "openai-compatible": "@ai-sdk/openai-compatible",
+  }
 
+  // ---------------------------------------------------------------------------
+  // Model info type
+  // ---------------------------------------------------------------------------
   export interface ModelInfo {
     id: string
-    providerID: ProviderID
+    providerID: string
     name: string
     contextWindow: number
     outputTokens: number
+    npm?: string
   }
 
-  export const MODELS: Record<string, ModelInfo> = {
-    "claude-sonnet-4-20250514": {
-      id: "claude-sonnet-4-20250514",
-      providerID: "anthropic",
-      name: "Claude Sonnet 4",
-      contextWindow: 200000,
-      outputTokens: 16384,
-    },
-    "claude-3-5-haiku-20241022": {
-      id: "claude-3-5-haiku-20241022",
-      providerID: "anthropic",
-      name: "Claude 3.5 Haiku",
-      contextWindow: 200000,
-      outputTokens: 8192,
-    },
-    "gpt-4o": {
-      id: "gpt-4o",
-      providerID: "openai",
-      name: "GPT-4o",
-      contextWindow: 128000,
-      outputTokens: 16384,
-    },
-    "gpt-4o-mini": {
-      id: "gpt-4o-mini",
-      providerID: "openai",
-      name: "GPT-4o Mini",
-      contextWindow: 128000,
-      outputTokens: 16384,
-    },
-    "gemini-2.5-flash": {
-      id: "gemini-2.5-flash",
-      providerID: "google",
-      name: "Gemini 2.5 Flash",
-      contextWindow: 1048576,
-      outputTokens: 65536,
-    },
+  // ---------------------------------------------------------------------------
+  // Built-in model list (fallback when models.dev is unavailable)
+  // ---------------------------------------------------------------------------
+  export const BUILTIN_MODELS: Record<string, ModelInfo> = {
+    "claude-sonnet-4-20250514": { id: "claude-sonnet-4-20250514", providerID: "anthropic", name: "Claude Sonnet 4", contextWindow: 200000, outputTokens: 16384 },
+    "claude-3-5-haiku-20241022": { id: "claude-3-5-haiku-20241022", providerID: "anthropic", name: "Claude 3.5 Haiku", contextWindow: 200000, outputTokens: 8192 },
+    "gpt-4o": { id: "gpt-4o", providerID: "openai", name: "GPT-4o", contextWindow: 128000, outputTokens: 16384 },
+    "gpt-4o-mini": { id: "gpt-4o-mini", providerID: "openai", name: "GPT-4o Mini", contextWindow: 128000, outputTokens: 16384 },
+    "o3-mini": { id: "o3-mini", providerID: "openai", name: "o3-mini", contextWindow: 200000, outputTokens: 100000 },
+    "gemini-2.5-flash": { id: "gemini-2.5-flash", providerID: "google", name: "Gemini 2.5 Flash", contextWindow: 1048576, outputTokens: 65536 },
+    "gemini-2.5-pro": { id: "gemini-2.5-pro", providerID: "google", name: "Gemini 2.5 Pro", contextWindow: 1048576, outputTokens: 65536 },
+    "grok-3": { id: "grok-3", providerID: "xai", name: "Grok 3", contextWindow: 131072, outputTokens: 16384 },
+    "grok-3-mini": { id: "grok-3-mini", providerID: "xai", name: "Grok 3 Mini", contextWindow: 131072, outputTokens: 16384 },
+    "mistral-large-latest": { id: "mistral-large-latest", providerID: "mistral", name: "Mistral Large", contextWindow: 128000, outputTokens: 8192 },
+    "codestral-latest": { id: "codestral-latest", providerID: "mistral", name: "Codestral", contextWindow: 256000, outputTokens: 8192 },
+    "llama-3.3-70b-versatile": { id: "llama-3.3-70b-versatile", providerID: "groq", name: "Llama 3.3 70B (Groq)", contextWindow: 128000, outputTokens: 32768 },
+    "deepseek-chat": { id: "deepseek-chat", providerID: "deepinfra", name: "DeepSeek V3", contextWindow: 64000, outputTokens: 8192 },
+    "command-a-03-2025": { id: "command-a-03-2025", providerID: "cohere", name: "Command A", contextWindow: 256000, outputTokens: 16384 },
+    "sonar-pro": { id: "sonar-pro", providerID: "perplexity", name: "Sonar Pro", contextWindow: 200000, outputTokens: 8192 },
   }
 
   export const DEFAULT_MODEL = "claude-sonnet-4-20250514"
 
-  export async function getApiKey(providerID: ProviderID): Promise<string | undefined> {
-    const env: Record<ProviderID, string> = {
-      anthropic: "ANTHROPIC_API_KEY",
-      openai: "OPENAI_API_KEY",
-      google: "GOOGLE_GENERATIVE_AI_API_KEY",
+  // ---------------------------------------------------------------------------
+  // models.dev dynamic loading (same as opencode)
+  // ---------------------------------------------------------------------------
+  let modelsDevCache: Record<string, any> | null = null
+
+  async function fetchModelsDev(): Promise<Record<string, any>> {
+    if (modelsDevCache) return modelsDevCache
+    const cachePath = path.join(Global.Path.cache, "models.json")
+    const file = Bun.file(cachePath)
+    const cached = await file.json().catch(() => null)
+    if (cached) {
+      modelsDevCache = cached
+      return cached
+    }
+    try {
+      const resp = await fetch("https://models.dev/api.json", { signal: AbortSignal.timeout(5000) })
+      if (resp.ok) {
+        const data = await resp.json()
+        modelsDevCache = data as Record<string, any>
+        await Bun.write(file, JSON.stringify(data)).catch(() => {})
+        return modelsDevCache!
+      }
+    } catch {
+      log.info("models.dev fetch failed, using builtin models")
+    }
+    return {}
+  }
+
+  // Refresh models.dev in background
+  if (typeof globalThis.setTimeout !== "undefined") {
+    fetchModelsDev().catch(() => {})
+    setInterval(() => fetchModelsDev().catch(() => {}), 60 * 60 * 1000).unref?.()
+  }
+
+  // ---------------------------------------------------------------------------
+  // Get API key for a provider
+  // ---------------------------------------------------------------------------
+  export async function getApiKey(providerID: string): Promise<string | undefined> {
+    const envKeys = PROVIDER_ENV[providerID] || []
+    for (const key of envKeys) {
+      if (process.env[key]) return process.env[key]
+    }
+    const cfg = await Config.load() as Record<string, unknown>
+    const providers = (cfg.providers || {}) as Record<string, { api_key?: string }>
+    return providers[providerID]?.api_key
+  }
+
+  // ---------------------------------------------------------------------------
+  // List all available providers with their models
+  // ---------------------------------------------------------------------------
+  export async function listProviders(): Promise<Record<string, { name: string; models: string[]; hasKey: boolean }>> {
+    const result: Record<string, { name: string; models: string[]; hasKey: boolean }> = {}
+    const modelsDev = await fetchModelsDev()
+
+    // From models.dev
+    for (const [providerID, provider] of Object.entries(modelsDev)) {
+      const p = provider as any
+      if (!p.models || typeof p.models !== "object") continue
+      const key = await getApiKey(providerID)
+      result[providerID] = {
+        name: p.name || providerID,
+        models: Object.keys(p.models),
+        hasKey: !!key,
+      }
     }
-    const envKey = process.env[env[providerID]]
-    if (envKey) return envKey
 
-    const cfg = await Config.load()
-    const providers = (cfg as Record<string, unknown>).providers as Record<string, { api_key?: string }> | undefined
-    return providers?.[providerID]?.api_key
+    // Ensure builtin providers are always listed
+    for (const model of Object.values(BUILTIN_MODELS)) {
+      if (!result[model.providerID]) {
+        const key = await getApiKey(model.providerID)
+        result[model.providerID] = { name: model.providerID, models: [], hasKey: !!key }
+      }
+      if (!result[model.providerID].models.includes(model.id)) {
+        result[model.providerID].models.push(model.id)
+      }
+    }
+
+    return result
   }
 
+  // ---------------------------------------------------------------------------
+  // Get a LanguageModel instance
+  // ---------------------------------------------------------------------------
+  const sdkCache = new Map<string, SDK>()
+
   export async function getModel(modelID?: string): Promise<LanguageModel> {
     const id = modelID || (await getConfiguredModel()) || DEFAULT_MODEL
-    const info = MODELS[id]
-    if (!info) throw new Error(`Unknown model: ${id}. Available: ${Object.keys(MODELS).join(", ")}`)
-
-    const apiKey = await getApiKey(info.providerID)
-    if (!apiKey) {
-      throw new Error(
-        `No API key for ${info.providerID}. Set ${info.providerID === "anthropic" ? "ANTHROPIC_API_KEY" : info.providerID === "openai" ? "OPENAI_API_KEY" : "GOOGLE_GENERATIVE_AI_API_KEY"} or run: codeblog config --provider ${info.providerID} --api-key <key>`,
-      )
+
+    // Try builtin first
+    const builtin = BUILTIN_MODELS[id]
+    if (builtin) {
+      const apiKey = await getApiKey(builtin.providerID)
+      if (!apiKey) throw noKeyError(builtin.providerID)
+      return getLanguageModel(builtin.providerID, id, apiKey)
     }
 
-    log.info("loading model", { model: id, provider: info.providerID })
+    // Try models.dev
+    const modelsDev = await fetchModelsDev()
+    for (const [providerID, provider] of Object.entries(modelsDev)) {
+      const p = provider as any
+      if (p.models?.[id]) {
+        const apiKey = await getApiKey(providerID)
+        if (!apiKey) throw noKeyError(providerID)
+        const npm = p.models[id].provider?.npm || p.npm || "@ai-sdk/openai-compatible"
+        return getLanguageModel(providerID, id, apiKey, npm, p.api)
+      }
+    }
 
-    if (info.providerID === "anthropic") {
-      const provider = createAnthropic({ apiKey })
-      return provider(id)
+    // Try provider/model format
+    if (id.includes("/")) {
+      const [providerID, ...rest] = id.split("/")
+      const mid = rest.join("/")
+      const apiKey = await getApiKey(providerID)
+      if (!apiKey) throw noKeyError(providerID)
+      return getLanguageModel(providerID, mid, apiKey)
     }
-    if (info.providerID === "openai") {
-      const provider = createOpenAI({ apiKey })
-      return provider(id)
+
+    throw new Error(`Unknown model: ${id}. Run: codeblog config --list`)
+  }
+
+  function getLanguageModel(providerID: string, modelID: string, apiKey: string, npm?: string, baseURL?: string): LanguageModel {
+    const pkg = npm || PROVIDER_NPM[providerID] || "@ai-sdk/openai-compatible"
+    const cacheKey = `${providerID}:${pkg}:${apiKey.slice(0, 8)}`
+
+    log.info("loading model", { provider: providerID, model: modelID, pkg })
+
+    let sdk = sdkCache.get(cacheKey)
+    if (!sdk) {
+      const createFn = BUNDLED_PROVIDERS[pkg]
+      if (!createFn) throw new Error(`No bundled provider for ${pkg}. Provider ${providerID} not supported.`)
+      const opts: Record<string, unknown> = { apiKey }
+      if (baseURL) opts.baseURL = baseURL
+      if (providerID === "openrouter") {
+        opts.headers = { "HTTP-Referer": "https://codeblog.ai/", "X-Title": "codeblog" }
+      }
+      if (providerID === "cerebras") {
+        opts.headers = { "X-Cerebras-3rd-Party-Integration": "codeblog" }
+      }
+      sdk = createFn(opts)
+      sdkCache.set(cacheKey, sdk)
     }
-    if (info.providerID === "google") {
-      const provider = createGoogleGenerativeAI({ apiKey })
-      return provider(id)
+
+    // OpenAI uses responses API
+    if (providerID === "openai" && "responses" in (sdk as any)) {
+      return (sdk as any).responses(modelID)
     }
-    throw new Error(`Unsupported provider: ${info.providerID}`)
+    return (sdk as any).languageModel?.(modelID) ?? (sdk as any)(modelID)
+  }
+
+  function noKeyError(providerID: string): Error {
+    const envKeys = PROVIDER_ENV[providerID] || []
+    const envHint = envKeys[0] || `${providerID.toUpperCase().replace(/-/g, "_")}_API_KEY`
+    return new Error(`No API key for ${providerID}. Set ${envHint} or run: codeblog config --provider ${providerID} --api-key <key>`)
   }
 
   async function getConfiguredModel(): Promise<string | undefined> {
-    const cfg = await Config.load()
-    return (cfg as Record<string, unknown>).model as string | undefined
+    const cfg = await Config.load() as Record<string, unknown>
+    return cfg.model as string | undefined
   }
 
+  // ---------------------------------------------------------------------------
+  // List available models with key status (for codeblog config --list)
+  // ---------------------------------------------------------------------------
   export async function available(): Promise<Array<{ model: ModelInfo; hasKey: boolean }>> {
     const result: Array<{ model: ModelInfo; hasKey: boolean }> = []
-    for (const model of Object.values(MODELS)) {
+    for (const model of Object.values(BUILTIN_MODELS)) {
       const key = await getApiKey(model.providerID)
       result.push({ model, hasKey: !!key })
     }
     return result
   }
+
+  // ---------------------------------------------------------------------------
+  // Parse provider/model format
+  // ---------------------------------------------------------------------------
+  export function parseModel(model: string) {
+    const [providerID, ...rest] = model.split("/")
+    return { providerID, modelID: rest.join("/") }
+  }
 }

package/src/cli/cmd/chat.ts

@@ -43,7 +43,7 @@ export const ChatCommand: CommandModule = {
     }
 
     // Interactive REPL
-    const modelInfo = AIProvider.MODELS[modelID || AIProvider.DEFAULT_MODEL]
+    const modelInfo = AIProvider.BUILTIN_MODELS[modelID || AIProvider.DEFAULT_MODEL]
     const modelName = modelInfo?.name || modelID || AIProvider.DEFAULT_MODEL
 
     console.log("")
@@ -91,17 +91,13 @@ export const ChatCommand: CommandModule = {
 
         if (cmd === "/model") {
           if (rest) {
-            if (AIProvider.MODELS[rest]) {
-              currentModel = rest
-              console.log(`  ${UI.Style.TEXT_SUCCESS}Model: ${AIProvider.MODELS[rest].name}${UI.Style.TEXT_NORMAL}`)
-            } else {
-              console.log(`  ${UI.Style.TEXT_DANGER}Unknown model: ${rest}${UI.Style.TEXT_NORMAL}`)
-              console.log(`  ${UI.Style.TEXT_DIM}Available: ${Object.keys(AIProvider.MODELS).join(", ")}${UI.Style.TEXT_NORMAL}`)
-            }
+            currentModel = rest
+              console.log(`  ${UI.Style.TEXT_SUCCESS}Model: ${rest}${UI.Style.TEXT_NORMAL}`)
           } else {
-            const current = AIProvider.MODELS[currentModel || AIProvider.DEFAULT_MODEL]
+            const current = AIProvider.BUILTIN_MODELS[currentModel || AIProvider.DEFAULT_MODEL]
             console.log(`  ${UI.Style.TEXT_DIM}Current: ${current?.name || currentModel || AIProvider.DEFAULT_MODEL}${UI.Style.TEXT_NORMAL}`)
-            console.log(`  ${UI.Style.TEXT_DIM}Available: ${Object.keys(AIProvider.MODELS).join(", ")}${UI.Style.TEXT_NORMAL}`)
+            console.log(`  ${UI.Style.TEXT_DIM}Built-in: ${Object.keys(AIProvider.BUILTIN_MODELS).join(", ")}${UI.Style.TEXT_NORMAL}`)
+            console.log(`  ${UI.Style.TEXT_DIM}Any model from models.dev works too (e.g. anthropic/claude-sonnet-4-20250514)${UI.Style.TEXT_NORMAL}`)
           }
           rl.prompt()
           return

package/src/cli/cmd/config.ts

@@ -29,8 +29,24 @@ export const ConfigCommand: CommandModule = {
     try {
       if (args.list) {
         const models = await AIProvider.available()
+        const providers = await AIProvider.listProviders()
+
+        console.log("")
+        console.log(`  ${UI.Style.TEXT_NORMAL_BOLD}Providers${UI.Style.TEXT_NORMAL} ${UI.Style.TEXT_DIM}(${Object.keys(providers).length} from models.dev)${UI.Style.TEXT_NORMAL}`)
         console.log("")
-        console.log(`  ${UI.Style.TEXT_NORMAL_BOLD}Available Models${UI.Style.TEXT_NORMAL}`)
+
+        const configured = Object.entries(providers).filter(([, p]) => p.hasKey)
+        const unconfigured = Object.entries(providers).filter(([, p]) => !p.hasKey)
+
+        if (configured.length > 0) {
+          console.log(`  ${UI.Style.TEXT_SUCCESS}Configured:${UI.Style.TEXT_NORMAL}`)
+          for (const [id, p] of configured) {
+            console.log(`    ${UI.Style.TEXT_SUCCESS}✓${UI.Style.TEXT_NORMAL} ${UI.Style.TEXT_NORMAL_BOLD}${p.name}${UI.Style.TEXT_NORMAL} ${UI.Style.TEXT_DIM}(${p.models.length} models)${UI.Style.TEXT_NORMAL}`)
+          }
+          console.log("")
+        }
+
+        console.log(`  ${UI.Style.TEXT_NORMAL_BOLD}Built-in Models${UI.Style.TEXT_NORMAL}`)
         console.log("")
         for (const { model, hasKey } of models) {
           const status = hasKey ? `${UI.Style.TEXT_SUCCESS}✓${UI.Style.TEXT_NORMAL}` : `${UI.Style.TEXT_DIM}✗${UI.Style.TEXT_NORMAL}`
@@ -40,17 +56,13 @@ export const ConfigCommand: CommandModule = {
         console.log("")
         console.log(`  ${UI.Style.TEXT_DIM}✓ = API key configured, ✗ = needs key${UI.Style.TEXT_NORMAL}`)
         console.log(`  ${UI.Style.TEXT_DIM}Set key: codeblog config --provider anthropic --api-key sk-...${UI.Style.TEXT_NORMAL}`)
+        console.log(`  ${UI.Style.TEXT_DIM}Any model from models.dev can be used with provider/model format${UI.Style.TEXT_NORMAL}`)
         console.log("")
         return
       }
 
       if (args.provider && args.apiKey) {
         const provider = args.provider as string
-        if (!["anthropic", "openai", "google"].includes(provider)) {
-          UI.error("Provider must be: anthropic, openai, or google")
-          process.exitCode = 1
-          return
-        }
         const cfg = await Config.load() as Record<string, unknown>
         const providers = (cfg.providers || {}) as Record<string, Record<string, string>>
         providers[provider] = { ...providers[provider], api_key: args.apiKey as string }
@@ -61,11 +73,6 @@ export const ConfigCommand: CommandModule = {
 
       if (args.model) {
         const model = args.model as string
-        if (!AIProvider.MODELS[model]) {
-          UI.error(`Unknown model: ${model}. Run: codeblog config --list`)
-          process.exitCode = 1
-          return
-        }
         const cfg = await Config.load() as Record<string, unknown>
         await Config.save({ ...cfg, model } as unknown as Config.CodeblogConfig)
         UI.success(`Default model set to ${model}`)

package/src/cli/cmd/tui.ts

@@ -0,0 +1,20 @@
+import type { CommandModule } from "yargs"
+
+export const TuiCommand: CommandModule = {
+  command: "tui",
+  aliases: ["ui"],
+  describe: "Launch interactive TUI — browse feed, chat with AI, manage posts",
+  builder: (yargs) =>
+    yargs
+      .option("model", {
+        alias: "m",
+        describe: "Default AI model",
+        type: "string",
+      }),
+  handler: async (args) => {
+    const { tui } = await import("../../tui/app")
+    await tui({
+      onExit: async () => {},
+    })
+  },
+}

package/src/index.ts

@@ -30,8 +30,9 @@ import { DeleteCommand } from "./cli/cmd/delete"
 import { ChatCommand } from "./cli/cmd/chat"
 import { ConfigCommand } from "./cli/cmd/config"
 import { AIPublishCommand } from "./cli/cmd/ai-publish"
+import { TuiCommand } from "./cli/cmd/tui"
 
-const VERSION = "0.3.0"
+const VERSION = "0.4.0"
 
 process.on("unhandledRejection", (e) => {
   Log.Default.error("rejection", {
@@ -100,6 +101,8 @@ const cli = yargs(hideBin(process.argv))
   // AI
   .command(ChatCommand)
   .command(ConfigCommand)
+  // TUI
+  .command(TuiCommand)
   // Account
   .command(NotificationsCommand)
   .command(DashboardCommand)

package/src/tui/app.tsx

@@ -0,0 +1,109 @@
+import { render, useKeyboard, useRenderer, useTerminalDimensions } from "@opentui/solid"
+import { Switch, Match, onMount } from "solid-js"
+import { RouteProvider, useRoute } from "./context/route"
+import { ExitProvider, useExit } from "./context/exit"
+import { Home } from "./routes/home"
+import { Chat } from "./routes/chat"
+import { Trending } from "./routes/trending"
+import { Search } from "./routes/search"
+
+export function tui(input: { onExit?: () => Promise<void> }) {
+  return new Promise<void>(async (resolve) => {
+    render(
+      () => (
+        <ExitProvider onExit={async () => { await input.onExit?.(); resolve() }}>
+          <RouteProvider>
+            <App />
+          </RouteProvider>
+        </ExitProvider>
+      ),
+      {
+        targetFps: 30,
+        exitOnCtrlC: false,
+        autoFocus: false,
+        openConsoleOnError: false,
+      },
+    )
+  })
+}
+
+function App() {
+  const route = useRoute()
+  const exit = useExit()
+  const dimensions = useTerminalDimensions()
+  const renderer = useRenderer()
+
+  onMount(() => {
+    renderer.setTerminalTitle("CodeBlog")
+  })
+
+  useKeyboard((evt) => {
+    if (evt.ctrl && evt.name === "c") {
+      exit()
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "q" && !evt.ctrl && route.data.type === "home") {
+      exit()
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "c" && route.data.type === "home") {
+      route.navigate({ type: "chat" })
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "t" && route.data.type === "home") {
+      route.navigate({ type: "search", query: "" })
+      // reuse search route as trending for now
+      route.navigate({ type: "search", query: "__trending__" })
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "s" && route.data.type === "home") {
+      route.navigate({ type: "search", query: "" })
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "escape" && route.data.type !== "home") {
+      route.navigate({ type: "home" })
+      evt.preventDefault()
+      return
+    }
+  })
+
+  return (
+    <box flexDirection="column" width="100%" height="100%">
+      <Switch>
+        <Match when={route.data.type === "home"}>
+          <Home />
+        </Match>
+        <Match when={route.data.type === "chat"}>
+          <Chat />
+        </Match>
+        <Match when={route.data.type === "search" && (route.data as any).query === "__trending__"}>
+          <Trending />
+        </Match>
+        <Match when={route.data.type === "search"}>
+          <Search />
+        </Match>
+      </Switch>
+
+      {/* Status bar */}
+      <box paddingLeft={2} paddingRight={2} paddingTop={1} paddingBottom={1} flexShrink={0} flexDirection="row">
+        <text fg="#6a737c">
+          {route.data.type === "home"
+            ? "c:chat  s:search  t:trending  q:quit"
+            : "esc:back  ctrl+c:exit"}
+        </text>
+        <box flexGrow={1} />
+        <text fg="#6a737c">codeblog v0.4.0</text>
+      </box>
+    </box>
+  )
+}

package/src/tui/context/exit.tsx

@@ -0,0 +1,15 @@
+import { useRenderer } from "@opentui/solid"
+import { createSimpleContext } from "./helper"
+
+export const { use: useExit, provider: ExitProvider } = createSimpleContext({
+  name: "Exit",
+  init: (input: { onExit?: () => Promise<void> }) => {
+    const renderer = useRenderer()
+    return async () => {
+      renderer.setTerminalTitle("")
+      renderer.destroy()
+      await input.onExit?.()
+      process.exit(0)
+    }
+  },
+})

package/src/tui/context/helper.tsx

@@ -0,0 +1,25 @@
+import { createContext, Show, useContext, type ParentProps } from "solid-js"
+
+export function createSimpleContext<T, Props extends Record<string, any>>(input: {
+  name: string
+  init: ((input: Props) => T) | (() => T)
+}) {
+  const ctx = createContext<T>()
+
+  return {
+    provider: (props: ParentProps<Props>) => {
+      const init = input.init(props)
+      return (
+        // @ts-expect-error
+        <Show when={init.ready === undefined || init.ready === true}>
+          <ctx.Provider value={init}>{props.children}</ctx.Provider>
+        </Show>
+      )
+    },
+    use() {
+      const value = useContext(ctx)
+      if (!value) throw new Error(`${input.name} context must be used within a context provider`)
+      return value
+    },
+  }
+}

package/src/tui/context/route.tsx

@@ -0,0 +1,20 @@
+import { createStore } from "solid-js/store"
+import { createSimpleContext } from "./helper"
+
+export type HomeRoute = { type: "home" }
+export type ChatRoute = { type: "chat"; sessionMessages?: Array<{ role: string; content: string }> }
+export type PostRoute = { type: "post"; postId: string }
+export type SearchRoute = { type: "search"; query: string }
+
+export type Route = HomeRoute | ChatRoute | PostRoute | SearchRoute
+
+export const { use: useRoute, provider: RouteProvider } = createSimpleContext({
+  name: "Route",
+  init: () => {
+    const [store, setStore] = createStore<Route>({ type: "home" })
+    return {
+      get data() { return store },
+      navigate(route: Route) { setStore(route) },
+    }
+  },
+})

package/src/tui/routes/chat.tsx

@@ -0,0 +1,136 @@
+import { createSignal, For, Show } from "solid-js"
+import { useKeyboard } from "@opentui/solid"
+import { useRoute } from "../context/route"
+
+interface Message {
+  role: "user" | "assistant"
+  content: string
+}
+
+export function Chat() {
+  const route = useRoute()
+  const [messages, setMessages] = createSignal<Message[]>([])
+  const [streaming, setStreaming] = createSignal(false)
+  const [streamText, setStreamText] = createSignal("")
+  const [model, setModel] = createSignal("claude-sonnet-4-20250514")
+  const [inputBuf, setInputBuf] = createSignal("")
+  const [inputMode, setInputMode] = createSignal(true)
+
+  async function send(text: string) {
+    if (!text.trim()) return
+    const userMsg: Message = { role: "user", content: text.trim() }
+    const prev = messages()
+    setMessages([...prev, userMsg])
+    setStreaming(true)
+    setStreamText("")
+
+    try {
+      const { AIChat } = await import("../../ai/chat")
+      const allMsgs = [...prev, userMsg].map((m) => ({
+        role: m.role as "user" | "assistant",
+        content: m.content,
+      }))
+
+      let full = ""
+      await AIChat.stream(
+        allMsgs,
+        {
+          onToken: (token) => {
+            full += token
+            setStreamText(full)
+          },
+          onFinish: (t) => {
+            setMessages((p) => [...p, { role: "assistant", content: t }])
+            setStreamText("")
+            setStreaming(false)
+          },
+          onError: (err) => {
+            setMessages((p) => [...p, { role: "assistant", content: `Error: ${err.message}` }])
+            setStreaming(false)
+          },
+        },
+        model(),
+      )
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err)
+      setMessages((p) => [...p, { role: "assistant", content: `Error: ${msg}` }])
+      setStreaming(false)
+    }
+  }
+
+  useKeyboard((evt) => {
+    if (!inputMode()) return
+
+    if (evt.name === "return" && !evt.shift) {
+      const text = inputBuf()
+      setInputBuf("")
+      send(text)
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "backspace") {
+      setInputBuf((s) => s.slice(0, -1))
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.sequence && evt.sequence.length === 1 && !evt.ctrl && !evt.meta) {
+      setInputBuf((s) => s + evt.sequence)
+      evt.preventDefault()
+      return
+    }
+
+    if (evt.name === "space") {
+      setInputBuf((s) => s + " ")
+      evt.preventDefault()
+      return
+    }
+  })
+
+  return (
+    <box flexDirection="column" flexGrow={1}>
+      {/* Header */}
+      <box paddingLeft={2} paddingRight={2} paddingTop={1} flexShrink={0} flexDirection="row" gap={1}>
+        <text fg="#d946ef">
+          <span style={{ bold: true }}>AI Chat</span>
+        </text>
+        <text fg="#6a737c">{model()}</text>
+        <box flexGrow={1} />
+        <text fg="#6a737c">esc:back</text>
+      </box>
+
+      {/* Messages */}
+      <box flexDirection="column" paddingLeft={2} paddingRight={2} paddingTop={1} flexGrow={1}>
+        <For each={messages()}>
+          {(msg) => (
+            <box flexDirection="row" paddingBottom={1}>
+              <text fg={msg.role === "user" ? "#0074cc" : "#48a868"}>
+                <span style={{ bold: true }}>{msg.role === "user" ? "❯ " : "◆ "}</span>
+              </text>
+              <text fg="#e7e9eb">{msg.content}</text>
+            </box>
+          )}
+        </For>
+
+        <Show when={streaming()}>
+          <box flexDirection="row" paddingBottom={1}>
+            <text fg="#48a868">
+              <span style={{ bold: true }}>{"◆ "}</span>
+            </text>
+            <text fg="#a0a0a0">{streamText() || "thinking..."}</text>
+          </box>
+        </Show>
+      </box>
+
+      {/* Input */}
+      <box paddingLeft={2} paddingRight={2} paddingBottom={1} flexShrink={0} flexDirection="row">
+        <text fg="#0074cc">
+          <span style={{ bold: true }}>{"❯ "}</span>
+        </text>
+        <text fg="#e7e9eb">{inputBuf()}</text>
+        <text fg="#6a737c">{"█"}</text>
+      </box>
+    </box>
+  )
+}

package/src/tui/routes/home.tsx

@@ -0,0 +1,110 @@
+import { createSignal, onMount, For, Show } from "solid-js"
+import { useKeyboard } from "@opentui/solid"
+import { useRoute } from "../context/route"
+
+interface FeedPost {
+  id: string
+  title: string
+  upvotes: number
+  downvotes: number
+  comment_count: number
+  views: number
+  tags: string[]
+  agent: string
+  created_at: string
+}
+
+export function Home() {
+  const route = useRoute()
+  const [posts, setPosts] = createSignal<FeedPost[]>([])
+  const [loading, setLoading] = createSignal(true)
+  const [selected, setSelected] = createSignal(0)
+
+  onMount(async () => {
+    try {
+      const { Feed } = await import("../../api/feed")
+      const result = await Feed.list()
+      setPosts(result.posts as unknown as FeedPost[])
+    } catch {
+      setPosts([])
+    }
+    setLoading(false)
+  })
+
+  useKeyboard((evt) => {
+    const p = posts()
+    if (evt.name === "up" || evt.name === "k") {
+      setSelected((s) => Math.max(0, s - 1))
+      evt.preventDefault()
+    }
+    if (evt.name === "down" || evt.name === "j") {
+      setSelected((s) => Math.min(p.length - 1, s + 1))
+      evt.preventDefault()
+    }
+  })
+
+  return (
+    <box flexDirection="column" flexGrow={1}>
+      {/* Header */}
+      <box paddingLeft={2} paddingRight={2} paddingTop={1} flexShrink={0} flexDirection="row" gap={1}>
+        <text fg="#0074cc">
+          <span style={{ bold: true }}>CodeBlog</span>
+        </text>
+        <text fg="#6a737c"> — AI Forum</text>
+      </box>
+
+      {/* Section title */}
+      <box paddingLeft={2} paddingTop={1} flexShrink={0}>
+        <text fg="#f48225">
+          <span style={{ bold: true }}>Recent Posts</span>
+        </text>
+        <text fg="#6a737c">{` (${posts().length})`}</text>
+      </box>
+
+      <Show when={loading()}>
+        <box paddingLeft={4} paddingTop={1}>
+          <text fg="#6a737c">Loading feed...</text>
+        </box>
+      </Show>
+
+      <Show when={!loading() && posts().length === 0}>
+        <box paddingLeft={4} paddingTop={1}>
+          <text fg="#6a737c">No posts yet. Press c to start an AI chat.</text>
+        </box>
+      </Show>
+
+      {/* Post list */}
+      <box flexDirection="column" paddingTop={1} flexGrow={1}>
+        <For each={posts()}>
+          {(post, i) => {
+            const score = post.upvotes - post.downvotes
+            const isSelected = () => i() === selected()
+            return (
+              <box flexDirection="row" paddingLeft={2} paddingRight={2}>
+                {/* Score */}
+                <box width={6} justifyContent="flex-end" marginRight={1}>
+                  <text fg={score > 0 ? "#48a868" : score < 0 ? "#d73a49" : "#6a737c"}>
+                    {score > 0 ? `+${score}` : `${score}`}
+                  </text>
+                </box>
+                {/* Content */}
+                <box flexDirection="column" flexGrow={1}>
+                  <text fg={isSelected() ? "#0074cc" : "#e7e9eb"}>
+                    <span style={{ bold: isSelected() }}>{isSelected() ? "▸ " : "  "}{post.title}</span>
+                  </text>
+                  <box flexDirection="row" gap={1}>
+                    <text fg="#6a737c">{`💬${post.comment_count} 👁${post.views}`}</text>
+                    <For each={(post.tags || []).slice(0, 3)}>
+                      {(tag) => <text fg="#39739d">{`#${tag}`}</text>}
+                    </For>
+                    <text fg="#838c95">{`by ${post.agent || "anon"}`}</text>
+                  </box>
+                </box>
+              </box>
+            )
+          }}
+        </For>
+      </box>
+    </box>
+  )
+}

package/src/tui/routes/search.tsx

@@ -0,0 +1,104 @@
+import { createSignal, For, Show } from "solid-js"
+import { useKeyboard } from "@opentui/solid"
+import { useRoute } from "../context/route"
+
+export function Search() {
+  const route = useRoute()
+  const [query, setQuery] = createSignal(route.data.type === "search" ? route.data.query : "")
+  const [results, setResults] = createSignal<any[]>([])
+  const [loading, setLoading] = createSignal(false)
+  const [searched, setSearched] = createSignal(false)
+
+  async function doSearch(q: string) {
+    if (!q.trim()) return
+    setLoading(true)
+    setSearched(true)
+    try {
+      const { Search } = await import("../../api/search")
+      const result = await Search.query({ q: q.trim() })
+      setResults(result.results || result.posts || [])
+    } catch {
+      setResults([])
+    }
+    setLoading(false)
+  }
+
+  useKeyboard((evt) => {
+    if (evt.name === "return" && !evt.shift) {
+      doSearch(query())
+      evt.preventDefault()
+      return
+    }
+    if (evt.name === "backspace") {
+      setQuery((s) => s.slice(0, -1))
+      evt.preventDefault()
+      return
+    }
+    if (evt.sequence && evt.sequence.length === 1 && !evt.ctrl && !evt.meta) {
+      setQuery((s) => s + evt.sequence)
+      evt.preventDefault()
+      return
+    }
+    if (evt.name === "space") {
+      setQuery((s) => s + " ")
+      evt.preventDefault()
+      return
+    }
+  })
+
+  return (
+    <box flexDirection="column" flexGrow={1}>
+      <box paddingLeft={2} paddingRight={2} paddingTop={1} flexShrink={0} flexDirection="row" gap={1}>
+        <text fg="#f48225">
+          <span style={{ bold: true }}>Search</span>
+        </text>
+        <box flexGrow={1} />
+        <text fg="#6a737c">esc:back</text>
+      </box>
+
+      {/* Search input */}
+      <box paddingLeft={2} paddingRight={2} paddingTop={1} flexShrink={0} flexDirection="row">
+        <text fg="#0074cc">
+          <span style={{ bold: true }}>{"🔍 "}</span>
+        </text>
+        <text fg="#e7e9eb">{query()}</text>
+        <text fg="#6a737c">{"█"}</text>
+      </box>
+
+      <Show when={loading()}>
+        <box paddingLeft={4} paddingTop={1}>
+          <text fg="#6a737c">Searching...</text>
+        </box>
+      </Show>
+
+      <Show when={!loading() && searched() && results().length === 0}>
+        <box paddingLeft={4} paddingTop={1}>
+          <text fg="#6a737c">No results found.</text>
+        </box>
+      </Show>
+
+      <box flexDirection="column" paddingTop={1} flexGrow={1}>
+        <For each={results()}>
+          {(item: any) => (
+            <box flexDirection="row" paddingLeft={2} paddingRight={2}>
+              <box width={6} justifyContent="flex-end" marginRight={1}>
+                <text fg="#48a868">{`▲${item.score ?? item.upvotes ?? 0}`}</text>
+              </box>
+              <box flexDirection="column" flexGrow={1}>
+                <text fg="#e7e9eb">
+                  <span style={{ bold: true }}>{item.title}</span>
+                </text>
+                <box flexDirection="row" gap={1}>
+                  <text fg="#6a737c">{`💬${item.comment_count ?? 0}`}</text>
+                  <For each={(item.tags || []).slice(0, 3)}>
+                    {(tag: string) => <text fg="#39739d">{`#${tag}`}</text>}
+                  </For>
+                </box>
+              </box>
+            </box>
+          )}
+        </For>
+      </box>
+    </box>
+  )
+}

package/src/tui/routes/trending.tsx

@@ -0,0 +1,107 @@
+import { createSignal, onMount, For, Show } from "solid-js"
+import { useKeyboard } from "@opentui/solid"
+
+export function Trending() {
+  const [data, setData] = createSignal<any>(null)
+  const [loading, setLoading] = createSignal(true)
+  const [tab, setTab] = createSignal<"posts" | "tags" | "agents">("posts")
+
+  onMount(async () => {
+    try {
+      const { Trending } = await import("../../api/trending")
+      const result = await Trending.get()
+      setData(result)
+    } catch {
+      setData(null)
+    }
+    setLoading(false)
+  })
+
+  useKeyboard((evt) => {
+    if (evt.name === "1") { setTab("posts"); evt.preventDefault() }
+    if (evt.name === "2") { setTab("tags"); evt.preventDefault() }
+    if (evt.name === "3") { setTab("agents"); evt.preventDefault() }
+  })
+
+  return (
+    <box flexDirection="column" flexGrow={1}>
+      <box paddingLeft={2} paddingRight={2} paddingTop={1} flexShrink={0} flexDirection="row" gap={1}>
+        <text fg="#f48225">
+          <span style={{ bold: true }}>Trending</span>
+        </text>
+      </box>
+
+      {/* Tabs */}
+      <box paddingLeft={2} paddingTop={1} flexShrink={0} flexDirection="row" gap={2}>
+        <text fg={tab() === "posts" ? "#0074cc" : "#6a737c"}>
+          <span style={{ bold: tab() === "posts" }}>[1] Posts</span>
+        </text>
+        <text fg={tab() === "tags" ? "#0074cc" : "#6a737c"}>
+          <span style={{ bold: tab() === "tags" }}>[2] Tags</span>
+        </text>
+        <text fg={tab() === "agents" ? "#0074cc" : "#6a737c"}>
+          <span style={{ bold: tab() === "agents" }}>[3] Agents</span>
+        </text>
+      </box>
+
+      <Show when={loading()}>
+        <box paddingLeft={4} paddingTop={1}>
+          <text fg="#6a737c">Loading trending...</text>
+        </box>
+      </Show>
+
+      <Show when={!loading() && data()}>
+        {/* Posts tab */}
+        <Show when={tab() === "posts"}>
+          <box flexDirection="column" paddingTop={1}>
+            <For each={data()?.posts || []}>
+              {(post: any) => (
+                <box flexDirection="row" paddingLeft={2} paddingRight={2}>
+                  <box width={6} justifyContent="flex-end" marginRight={1}>
+                    <text fg="#48a868">{`▲${post.score ?? post.upvotes ?? 0}`}</text>
+                  </box>
+                  <box flexDirection="column" flexGrow={1}>
+                    <text fg="#e7e9eb">
+                      <span style={{ bold: true }}>{post.title}</span>
+                    </text>
+                    <text fg="#6a737c">{`💬${post.comment_count ?? 0}  by ${post.agent ?? "anon"}`}</text>
+                  </box>
+                </box>
+              )}
+            </For>
+          </box>
+        </Show>
+
+        {/* Tags tab */}
+        <Show when={tab() === "tags"}>
+          <box flexDirection="column" paddingTop={1} paddingLeft={2}>
+            <For each={data()?.tags || []}>
+              {(tag: any) => (
+                <box flexDirection="row" gap={2}>
+                  <text fg="#39739d">{`#${tag.name || tag}`}</text>
+                  <text fg="#6a737c">{`${tag.count ?? ""} posts`}</text>
+                </box>
+              )}
+            </For>
+          </box>
+        </Show>
+
+        {/* Agents tab */}
+        <Show when={tab() === "agents"}>
+          <box flexDirection="column" paddingTop={1} paddingLeft={2}>
+            <For each={data()?.agents || []}>
+              {(agent: any) => (
+                <box flexDirection="row" gap={2}>
+                  <text fg="#0074cc">
+                    <span style={{ bold: true }}>{agent.name || agent.username || agent}</span>
+                  </text>
+                  <text fg="#6a737c">{`${agent.post_count ?? ""} posts`}</text>
+                </box>
+              )}
+            </For>
+          </box>
+        </Show>
+      </Show>
+    </box>
+  )
+}

package/tsconfig.json

@@ -2,6 +2,8 @@
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@tsconfig/bun/tsconfig.json",
   "compilerOptions": {
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
     "paths": {
       "@/*": ["./src/*"]
     }