Phase 3 polish: admin fixes, model suggestions, test env shim

.claude/agents/infra.md

@@ -32,8 +32,7 @@ Manage deployment configuration, containerization, CI/CD pipelines, and local de
 
 - **docker-compose.yml:**
   - `app` — Rust backend (with hot reload via cargo-watch in dev)
-  - `postgres` — PostgreSQL 16 for development
-  - `postgres-test` — separate PostgreSQL instance for integration tests
+  - `postgres` — PostgreSQL 16 for development (tests reuse this server; `#[sqlx::test]` spins up per-test throwaway DBs)
   - Volume mounts for persistent data
   - Environment variables from `.env`
 

.env.example

@@ -1,6 +1,5 @@
 # Database
 DATABASE_URL=postgres://planner:planner@localhost:5434/planner
-DATABASE_TEST_URL=postgres://planner:planner@localhost:5433/planner_test
 
 # Auth
 JWT_SECRET=change-me-in-production

.github/workflows/ci.yml

@@ -9,7 +9,6 @@ on:
 env:
   CARGO_TERM_COLOR: always
   DATABASE_URL: postgres://planner:planner@localhost:5432/planner
-  DATABASE_TEST_URL: postgres://planner:planner@localhost:5432/planner_test
   SQLX_OFFLINE: "true"
 
 jobs:
@@ -46,10 +45,6 @@ jobs:
           cache-on-failure: true
           cache-all-crates: true
 
-      - name: Create test database
-        run: |
-          PGPASSWORD=planner psql -h localhost -U planner -d planner -c "CREATE DATABASE planner_test;"
-
       - name: Check formatting
         working-directory: backend
         run: cargo fmt -- --check
@@ -76,7 +71,6 @@ jobs:
         run: cargo test
         env:
           DATABASE_URL: postgres://planner:planner@localhost:5432/planner
-          DATABASE_TEST_URL: postgres://planner:planner@localhost:5432/planner_test
 
   frontend:
     name: Frontend (React)

Makefile

@@ -1,4 +1,4 @@
-.PHONY: help install db-up db-down db-reset migrate prepare backend frontend dev test test-backend test-frontend lint build clean deploy
+.PHONY: help install db-up db-down db-reset migrate prepare backend frontend dev test test-backend test-frontend lint build clean deploy check-backend check-frontend fullcheck
 
 help:
 	@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}; {printf "  \033[36m%-18s\033[0m %s\n", $$1, $$2}'
@@ -53,6 +53,17 @@ lint: ## Run clippy (zero warnings) + prettier check
 	cd backend && cargo clippy -- -D warnings
 	cd backend && cargo fmt --check
 
+check-backend: ## Mirror backend CI: fmt + clippy + sqlx-prepare + tests (requires `make db-up`)
+	cd backend && cargo fmt -- --check
+	cd backend && SQLX_OFFLINE=true cargo clippy -- -D warnings
+	cd backend && SQLX_OFFLINE=false cargo sqlx prepare --workspace --check -- --all-targets
+	cd backend && SQLX_OFFLINE=true cargo test
+
+check-frontend: ## Mirror frontend CI: prettier + tests + build
+	cd frontend && npm run check
+
+fullcheck: check-backend check-frontend ## Run backend + frontend CI checks locally (DB must be running)
+
 build: ## Production build for both sides
 	cd backend && cargo build --release
 	cd frontend && npm run build

docker-compose.yml

@@ -15,19 +15,5 @@ services:
       timeout: 5s
       retries: 5
 
-  postgres-test:
-    image: postgres:16-alpine
-    environment:
-      POSTGRES_USER: planner
-      POSTGRES_PASSWORD: planner
-      POSTGRES_DB: planner_test
-    ports:
-      - "5433:5432"
-    healthcheck:
-      test: ["CMD-SHELL", "pg_isready -U planner"]
-      interval: 5s
-      timeout: 5s
-      retries: 5
-
 volumes:
   pgdata:

frontend/package.json

@@ -9,7 +9,8 @@
     "preview": "vite preview",
     "format": "prettier --write 'src/**/*.{js,jsx,ts,tsx,css,json}'",
     "test": "vitest",
-    "format:check": "prettier --check 'src/**/*.{js,jsx,ts,tsx,css,json}'"
+    "format:check": "prettier --check 'src/**/*.{js,jsx,ts,tsx,css,json}'",
+    "check": "npm run format:check && npm test -- --run && npm run build"
   },
   "dependencies": {
     "@tailwindcss/vite": "^4.2.2",

frontend/src/index.css

@@ -1,5 +1,10 @@
 @import "tailwindcss";
 
+body {
+  color: #eeedf5;
+  background-color: #08060f;
+}
+
 @theme {
   /* Surface depth tokens */
   --color-base: #08060f;

frontend/src/pages/admin/AdminDashboard.jsx

@@ -13,7 +13,7 @@ function sumCost(metrics) {
 
 function activeProvider(settings) {
   if (!settings) return "—";
-  const entry = settings.find((s) => s.key === "active_provider");
+  const entry = settings.find((s) => s.key === "llm_default_provider");
   return entry ? entry.value : "—";
 }
 

frontend/src/pages/admin/AdminDashboard.test.jsx

@@ -74,7 +74,7 @@ describe("AdminDashboard", () => {
 
   it("displays the active provider from mock settings", async () => {
     renderDashboard();
-    // active_provider setting is "gemini"
+    // llm_default_provider setting is "gemini"
     expect(await screen.findByText("gemini")).toBeInTheDocument();
   });
 

frontend/src/pages/admin/AdminProviders.jsx

@@ -15,13 +15,29 @@ const LLM_SETTINGS = [
     key: "llm_gemini_model",
     label: "Gemini Model",
     type: "text",
-    placeholder: "e.g. gemini-2.0-flash",
+    placeholder: "e.g. gemini-2.5-flash-preview-05-20",
+    suggestions: [
+      "gemini-2.5-pro-preview-05-06",
+      "gemini-2.5-flash-preview-05-20",
+      "gemini-2.0-flash",
+      "gemini-2.0-flash-exp",
+      "gemini-1.5-pro",
+      "gemini-1.5-flash",
+    ],
   },
   {
     key: "llm_claude_model",
     label: "Claude Model",
     type: "text",
-    placeholder: "e.g. claude-3-5-haiku-20241022",
+    placeholder: "e.g. claude-sonnet-4-20250514",
+    suggestions: [
+      "claude-opus-4-7",
+      "claude-sonnet-4-6",
+      "claude-haiku-4-5-20251001",
+      "claude-sonnet-4-20250514",
+      "claude-3-5-sonnet-20241022",
+      "claude-3-5-haiku-20241022",
+    ],
   },
 ];
 
@@ -132,8 +148,8 @@ export default function AdminProviders() {
           {/* Chat kill-switch */}
           <section className="rounded-xl border border-purple-500/20 bg-[#161227] p-5">
             <h2
-              className="mb-3 text-base font-semibold text-[#f1eff8]"
-              style={{ fontFamily: "Outfit, sans-serif" }}
+              className="mb-3 text-base font-semibold"
+              style={{ fontFamily: "Outfit, sans-serif", color: "#f1eff8" }}
             >
               Chat Feature
             </h2>
@@ -143,16 +159,16 @@ export default function AdminProviders() {
           {/* LLM settings form */}
           <section className="rounded-xl border border-purple-500/20 bg-[#161227] p-5">
             <h2
-              className="mb-4 text-base font-semibold text-[#f1eff8]"
-              style={{ fontFamily: "Outfit, sans-serif" }}
+              className="mb-4 text-base font-semibold"
+              style={{ fontFamily: "Outfit, sans-serif", color: "#f1eff8" }}
             >
               LLM Configuration
             </h2>
 
             <form onSubmit={handleSave} noValidate>
               <div className="space-y-4">
                 {LLM_SETTINGS.map(
-                  ({ key, label, type, options, placeholder }) => (
+                  ({ key, label, type, options, placeholder, suggestions }) => (
                     <div key={key}>
                       <label
                         htmlFor={`setting-${key}`}
@@ -175,14 +191,26 @@ export default function AdminProviders() {
                           ))}
                         </select>
                       ) : (
-                        <input
-                          id={`setting-${key}`}
-                          type="text"
-                          value={form[key]}
-                          onChange={(e) => handleChange(key, e.target.value)}
-                          placeholder={placeholder}
-                          className="w-full rounded-lg border border-purple-500/30 bg-[#1e1836] px-3 py-2 text-sm text-[#f1eff8] placeholder-neutral-500 focus:outline-none focus:ring-2 focus:ring-purple-500/60"
-                        />
+                        <>
+                          <input
+                            id={`setting-${key}`}
+                            type="text"
+                            value={form[key]}
+                            onChange={(e) => handleChange(key, e.target.value)}
+                            placeholder={placeholder}
+                            list={
+                              suggestions ? `${key}-suggestions` : undefined
+                            }
+                            className="w-full rounded-lg border border-purple-500/30 bg-[#1e1836] px-3 py-2 text-sm text-[#f1eff8] placeholder-neutral-500 focus:outline-none focus:ring-2 focus:ring-purple-500/60"
+                          />
+                          {suggestions && (
+                            <datalist id={`${key}-suggestions`}>
+                              {suggestions.map((s) => (
+                                <option key={s} value={s} />
+                              ))}
+                            </datalist>
+                          )}
+                        </>
                       )}
                     </div>
                   ),

frontend/src/test/mocks/handlers.js

@@ -30,7 +30,7 @@ let mockUserRole = "user";
 
 let mockSettings = [
   {
-    key: "active_provider",
+    key: "llm_default_provider",
     value: "gemini",
     updated_at: "2026-01-01T00:00:00Z",
   },
@@ -93,7 +93,7 @@ const mockAuditLog = [
     actor_email: "admin@test.com",
     action: "setting.update",
     target_type: "setting",
-    target_id: "active_provider",
+    target_id: "llm_default_provider",
     payload: { old: "claude", new: "gemini" },
     created_at: "2026-04-01T12:00:00Z",
   },
@@ -170,7 +170,7 @@ export function resetMockState() {
   mockUserRole = "user";
   mockSettings = [
     {
-      key: "active_provider",
+      key: "llm_default_provider",
       value: "gemini",
       updated_at: "2026-01-01T00:00:00Z",
     },

frontend/src/test/setup.js

@@ -3,6 +3,37 @@ import { afterAll, afterEach, beforeAll } from "vitest";
 import { server } from "./mocks/server";
 import { resetMockState } from "./mocks/handlers";
 
+function createStorageShim() {
+  const store = new Map();
+  return {
+    getItem: (key) => (store.has(key) ? store.get(key) : null),
+    setItem: (key, value) => {
+      store.set(String(key), String(value));
+    },
+    removeItem: (key) => {
+      store.delete(key);
+    },
+    clear: () => {
+      store.clear();
+    },
+    key: (i) => Array.from(store.keys())[i] ?? null,
+    get length() {
+      return store.size;
+    },
+  };
+}
+
+Object.defineProperty(window, "localStorage", {
+  value: createStorageShim(),
+  writable: true,
+  configurable: true,
+});
+Object.defineProperty(window, "sessionStorage", {
+  value: createStorageShim(),
+  writable: true,
+  configurable: true,
+});
+
 Object.defineProperty(window, "matchMedia", {
   writable: true,
   value: (query) => ({
@@ -23,6 +54,7 @@ afterEach(() => {
   server.resetHandlers();
   resetMockState();
   localStorage.clear();
+  sessionStorage.clear();
 });
 
 afterAll(() => server.close());