Redesign New run tab + add Model settings view

[inhaq]

This pull request was created by @kiro-agent on behalf of @inhaq 👻

Comment with /kiro fix to address specific feedback or /kiro all to address everything.
_{Learn about Kiro Web}

---

Summary

Reworks the desktop app so the New run tab is minimal and model configuration lives in its own place.

• New run tab is now just a box: the goal input + a Start run button. The selected repository is shown top-right of the box, and the writer / reviewer models in use are shown bottom-right — so at a glance you can see "these two models are in use, in this repo." All the runner/role/options clutter is gone from the run form.
• New "Model settings" tab holds everything that used to clutter the run form: pick the model that writes the code (actor) and the one that reviews it (critic) via clean grouped dropdowns, set the repository, and tune run options (max parallel, worktrees, mechanical gate). Selections are persisted and applied to every new run.
• Removed the placeholder models / runner-profile JSON editor. Replaced with a real model catalog grouped by the environment key that unlocks each provider (OpenAI / Anthropic / Google).
• Secrets (environment key) view now confirms, per key, whether it's stored and exactly which models it unlocks.

Implementation notes

• New desktop/src/settings.ts: the model catalog, localStorage-backed run settings, and buildRunEnv() which maps the writer/reviewer choice to the engine's LOOPWRIGHT_RUNNERS + role-binding env vars. The engine stays vendor-neutral — nothing changed server-side.
• In the desktop app, models whose API key isn't stored are still listed but flagged with a link to add the key; in the browser build (keys live in the engine env) nothing is gated.

Tested

• npx tsc --noEmit passes.
• npm run build (tsc + vite build) succeeds with no errors.

Notes / limitations

• The repository field is a label persisted client-side (the engine still runs in its configured working directory); it surfaces "which repo you're working in" on the run box. Happy to wire it to a real backend repo selector if you'd like that next.
• Model lists are a curated catalog; we can extend providers/models or make it dynamic later.

Summary by CodeRabbit

Release Notes

• New Features
  • Added a “Model settings” sidebar entry and a dedicated model selection page.
  • Writer/reviewer model selection now adapts to available HTTP API keys and detected local CLI tools, with shortcuts to add missing keys.
  • Reworked the start flow to be driven by persisted settings, including live run options (parallel tasks, worktrees, mechanical gate) and branch/push/PR controls.
  • Added an “Advanced” override area for customizing runner behavior.
  • Extended the secrets area to display “models by environment key” availability.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 8ce476c6-fcf5-4cea-a5fa-ae7a830670f3

📥 Commits

Reviewing files that changed from the base of the PR and between 7cdc328 and 101730a.

📒 Files selected for processing (2)

• desktop/src/main.ts
• desktop/src/settings.ts

🚧 Files skipped from review as they are similar to previous changes (1)

• desktop/src/settings.ts

---

📝 Walkthrough

Walkthrough

Adds a "Model settings" navigation view to the desktop app. A new settings.ts module defines a typed model/provider catalog, persists selections to localStorage, and translates settings into LOOPWRIGHT_* environment variables. The start form is simplified to use these persisted settings, and a new renderModels() view with API-key-aware provider/model selectors is introduced alongside an updated secrets view that lists which models each stored key unlocks.

Changes

Model Settings Feature

Layer / File(s)	Summary
Settings module: catalog, persistence, and buildRunEnv desktop/src/settings.ts	Defines ProviderKind, CatalogModel, Provider, MODEL_CATALOG with HTTP and CLI providers, ModelChoice, RunSettings, and DEFAULT_SETTINGS. Exports helper functions to resolve providers/models and check file-editing capability. Implements loadSettings/saveSettings with localStorage and stale-selection sanitization. Implements buildRunEnv to produce LOOPWRIGHT_* env vars with serialized runner profiles for writer/reviewer or advanced overrides.
Navigation wiring and simplified start form desktop/index.html, desktop/src/main.ts	Adds the "Model settings" nav button with SVG icon, imports settings module helpers, extends the nav type and icon catalog to include "models", and wires the navigate switch. Removes the old preset/advanced runner-profile editor from the start view and rebuilds the form to display settings-backed repository pill and model pills; changes submit handler to call buildRunEnv(settings) before startRun and persist resumable run config.
renderModels() view with model selectors and run options desktop/src/main.ts	Implements renderModels() to load persisted settings and compute provider availability via Tauri listSecretKeys() and CLI tool detection, rendering writer/reviewer model selectors grouped by provider with contextual notes and "add key" navigation links. Adds repository input/browse with recent-repo selection. Extends the form with persisted run options (max parallel, worktrees, mechanical gate) and branch/publishing controls (branch prefix, dry run, push/PR options, remote/branch, safety override), all using live saveSettings().
Secrets view catalog: models by environment key desktop/src/main.ts	Extends the secrets view with a new "Models by environment key" catalog section listing HTTP env vars from MODEL_CATALOG and the models each key enables, marked as stored vs not stored. Hooks renderCatalog() into the secrets refresh flow to re-render after loading stored keys.
CSS for model settings UI and responsive layout desktop/src/styles.css	Introduces "New run — minimal box" CSS block with selectors for the run container, repository pill with hover/unset behavior, textarea sizing, bottom controls and model pills, model-settings picker grid and supporting UI, and secrets key catalog UI with status styling and model tags. Updates mobile (max-width: 720px) media query to render model grid in single column and reduce repository pill width.

Sequence Diagram

sequenceDiagram
  participant User as User
  participant nav as Navigation
  participant renderModels as renderModels()
  participant settings as settings.ts
  participant Tauri as listSecretKeys()
  participant startForm as Start Form
  participant engine as startRun()

  User->>nav: clicks "Model settings"
  nav->>renderModels: renderModels()
  renderModels->>settings: loadSettings()
  settings-->>renderModels: RunSettings
  renderModels->>Tauri: listSecretKeys()
  Tauri-->>renderModels: storedKeys[]
  renderModels->>renderModels: render provider/model selectors (available/unavailable)
  User->>renderModels: selects writer/reviewer model
  renderModels->>settings: saveSettings(updated)

  User->>nav: navigates to Start
  startForm->>settings: loadSettings()
  settings-->>startForm: RunSettings
  startForm->>startForm: display repository and model pills
  User->>startForm: submits goal + repo
  startForm->>settings: buildRunEnv(settings)
  settings-->>startForm: LOOPWRIGHT_* env vars
  startForm->>engine: startRun({ goal, env })
  engine-->>startForm: sessionId

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• inhaq/loopwright#13: Modifies the same desktop/src/main.ts navigation structure, start view, and secrets flow that this PR further extends with the model settings view and persisted settings infrastructure.

Poem

🐇 Hippity hop, a new settings screen!
Provider pills and model dropdowns gleam.
The writer picks Claude, the reviewer agrees,
Keys stored in Tauri, unlocking with ease.
buildRunEnv packs it all in a neat little bow —
Now every run knows exactly which model to go! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 37.04% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the two main changes: redesigning the New run tab and adding a Model settings view, which align with the primary objectives and substantial code changes across multiple files.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ 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 redesign-new-run-model-settings

---

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

[coderabbitai]

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@desktop/src/main.ts`:
- Around line 343-346: In the commitParallel function, the assignment to
settings.maxParallel uses Number(parallelInput.value || "1"), which can return
NaN for non-numeric input. Since Math.max(1, NaN) also results in NaN, this
invalid value gets persisted and breaks the startup config. Replace the
assignment logic with a check that ensures the parsed number is finite and valid
(using Number.isFinite() or similar) before assigning it to
settings.maxParallel. If the parsed value is not a valid finite number, assign a
safe default value like 1 instead of allowing NaN to be persisted.

In `@desktop/src/settings.ts`:
- Around line 142-153: Add validation and coercion logic in the `loadSettings()`
function to normalize persisted settings before returning `merged`. After the
existing findModel checks for writer and reviewer, add validation for the fields
`maxParallel`, `worktrees`, `mechanicalGate`, and `repo` to ensure they have
valid types and values (coercing them to their expected types or falling back to
defaults from DEFAULT_SETTINGS if they are invalid, null, or have unexpected
types like strings where numbers are expected). This prevents invalid persisted
values from propagating to `buildRunEnv()` and causing run start failures.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 05d480ad-9f9e-4f1d-989b-9df6f4e7f87d

📥 Commits

Reviewing files that changed from the base of the PR and between b47952d and 69f3825.

📒 Files selected for processing (4)

• desktop/index.html
• desktop/src/main.ts
• desktop/src/settings.ts
• desktop/src/styles.css