feat: redesign model picker with provider grouping and visibility controls

[cnjack]

Summary

Redesigns the model picker in both TUI and Web UI to match an OpenCode-style provider-based layout with recommended models, visibility toggles, and robust filter support.

Changes

Backend

• Add Recommended and DefaultEnabled fields to RegistryModel
• Add curated recommendedModels map per provider (zhipuai, deepseek, alibaba-cn, moonshotai, minimax, openai, anthropic, google)
• Add ModelState with EnabledModels/DisabledModels persistence (internal/config/model_state.go)
• Add /api/model-state and /api/model-state/enabled API endpoints

TUI

• Redesign model picker: provider-grouped sections, current model section, favorites, recommended badges, Manage Models action item
• Add Manage Models view with per-model visibility toggles via Space key (internal/tui/manage_models.go)
• Fix BubbleTea list filter: add FilterState() == list.Filtering guard so Enter/Esc pass through during active filtering; forward FilterMatchesMsg to active pickers so async filter results are applied
• Add ResetFilter() on all picker exit paths to clear stale filter state
• Apply same filter fixes to setup TUI (Add New Provider) providerList/modelList

Web UI

• Update model picker dropdown with provider sections, recommended badges, enabled/disabled model state
• Add Manage Models dialog with filter input, provider grouping, and toggle checkboxes
• Add SetupView.vue for provider setup flow
• ESC key handling for dialogs via global keydown handler

Summary by CodeRabbit

• New Features
  • Added initial setup wizard for first-time provider and model configuration
  • Introduced "Manage Models" interface to enable/disable models per provider
  • Implemented favorites system to bookmark preferred models for quick access
  • Added recent model history tracking
  • Enhanced provider management with credential validation
  • Added recommended model indicators and default model suggestions

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: e6637069-a75f-4534-b7eb-cb875a49eccb

📥 Commits

Reviewing files that changed from the base of the PR and between 0a1c1a3 and ac87e92.

📒 Files selected for processing (17)

• internal/command/web.go
• internal/config/model_state.go
• internal/model/registry.go
• internal/model/validate.go
• internal/tui/input_views.go
• internal/tui/manage_models.go
• internal/tui/pickers.go
• internal/tui/setup.go
• internal/tui/tui.go
• internal/web/server.go
• web/src/App.vue
• web/src/components/ChatInput.vue
• web/src/components/SettingsDialog.vue
• web/src/components/SetupView.vue
• web/src/composables/api.ts
• web/src/stores/chat.ts
• web/src/types/api.ts

---

📝 Walkthrough

Walkthrough

This PR introduces a comprehensive model and provider management system with initial setup flows. It adds persistent model state tracking (favorites, recent selections, enabled/disabled status), restructures model selection UI with filtering and action items across CLI and web interfaces, implements setup-mode gating for both TUI and web servers, and provides new API endpoints and provider validation for managing multiple providers and their models.

Changes

Cohort / File(s)	Summary
Setup Flow & Initialization internal/command/web.go, web/src/App.vue, web/src/components/SetupView.vue	Web server startup now checks setup status and avoids loading full configuration until setup is complete; frontend conditionally displays setup wizard overlay on boot before loading chat state.
Model State Management internal/config/model_state.go, internal/model/registry.go, internal/model/validate.go	New module tracks recent, favorite, enabled, and disabled models with persistence; registry models gain Recommended and DefaultEnabled metadata with static initialization; provider validation endpoint added to verify API credentials via HTTP.
TUI Model Selection & Management internal/tui/input_views.go, internal/tui/manage_models.go, internal/tui/pickers.go, internal/tui/setup.go, internal/tui/tui.go	Settings menu updated to include "Manage Models"; new manage-models overlay screen for toggling model visibility; model picker restructured with favorites section, current-model section, provider grouping, and action items; wizard list filtering improved to prevent interference with key handling.
Web API & Handler Layer internal/web/server.go	Introduces setup-mode gating that rejects chat requests until setup completes; adds routes for provider validation, listing, addition, deletion, and setup completion; extends model listing with metadata and enabled state derived from persisted ModelState; model switching now tracks recent selections.
Frontend API Client & Types web/src/composables/api.ts, web/src/types/api.ts	New API client methods for setup flow (provider/model retrieval, validation, completion), provider management (list, add, delete), and model state queries/mutations; type definitions extended with setup/state interfaces and richer ModelInfo metadata.
Frontend UI Components web/src/components/ChatInput.vue, web/src/components/SettingsDialog.vue	Model picker overhauled with favorites, current model display, recommended badges, and toggle favorite buttons; new manage-models modal for filtering and toggling model visibility; new Providers settings tab for provider management workflow (add, delete, list).
Frontend State Management web/src/stores/chat.ts	Chat store now tracks favorite and recent models with async actions to sync/update state; computed enabledProviders filters to only enabled models; health response propagated for setup status checks.

Sequence Diagram(s)

sequenceDiagram
    participant Client
    participant WebServer as Web Server
    participant Config
    participant ModelState
    participant Registry

    Client->>WebServer: GET /api/health
    WebServer->>Config: Check NeedsSetup()
    alt Setup Required
        WebServer-->>Client: {"needs_setup": true}
        Client->>WebServer: POST /api/setup/providers
        WebServer->>Registry: List available providers
        Registry-->>WebServer: Provider list
        WebServer-->>Client: SetupProvider[]
        Client->>WebServer: POST /api/setup/validate<br/>(provider, api_key, base_url)
        WebServer->>WebServer: ValidateProvider(api_key, baseURL)
        WebServer-->>Client: {valid, error?}
        Client->>WebServer: POST /api/setup/complete<br/>(provider, model, api_key)
        WebServer->>Config: Save provider config
        Config->>ModelState: InitializeModelState()
        WebServer->>Registry: Resolve provider/model
        WebServer-->>Client: {status: "complete"}
    else Setup Complete
        WebServer-->>Client: {"needs_setup": false}
        Client->>WebServer: GET /api/chat
        WebServer-->>Client: Chat service active
    end

Loading

sequenceDiagram
    participant User
    participant ChatUI as Chat UI
    participant ModelPicker
    participant ManageModels
    participant Store as Chat Store
    participant API

    User->>ChatUI: Click model selector
    ChatUI->>Store: Fetch enabled providers<br/>and model state
    Store->>API: GET /api/model-state
    API-->>Store: {recent, favorites, enabled}
    Store-->>ChatUI: Render picker
    ChatUI->>ModelPicker: Show favorites section,<br/>current model, providers
    
    alt User toggles model enabled state
        User->>ChatUI: Click manage models
        ChatUI->>ManageModels: Open manage dialog
        ManageModels->>API: GET /api/models (all)
        ManageModels->>Store: Subscribe to enabled state
        User->>ManageModels: Toggle model checkbox
        ManageModels->>API: POST /api/models/manage<br/>(provider, model, enabled)
        API->>Store: Update enabled state
        Store-->>ManageModels: Refresh display
    else User selects model
        User->>ModelPicker: Select model
        ChatUI->>API: POST /api/chat/switch<br/>(provider, model)
        API->>Store: AddRecent(model)
        Store-->>ChatUI: Update picker display
    end

Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~50 minutes

Possibly related PRs

• fix: enhance tool call handling with toolCallID and improve logging #11: Both PRs modify agent construction in internal/command/web.go—the main PR defers provider/model selection during setup while the related PR adjusts tool building logic in response to configuration state.
• Feat/enhancement #3: Both PRs extensively refactor TUI picker and input handling (internal/tui/pickers.go, input_views.go, tui.go)—the main PR adds manage-models overlays and model-state filtering while the related PR restructures plan-mode and picker interactions.
• Feat/weixin #13: Both PRs modify web server startup and handler wiring in internal/command/web.go and internal/web/server.go—the main PR adds setup-mode gating and provider validation while the related PR adjusts agent initialization and notification logic.

Poem

🐰 Hoppy the Hare hops with delight,
Models now managed from morning to night,
Favorites starred, and recent ones too,
Setup flows cleanly—fresh starts for the crew! ⭐
With toggles and validations in place,
Config management sets the right pace! 🎉

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/model-picker-redesign

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}