feat: Add global settings modal and simplify agent controls

Adds a settings system for global configuration with YOLO mode toggle and
model selection. Simplifies the agent control UI by removing redundant
status indicator and pause functionality.

## Settings System
- New SettingsModal with YOLO mode toggle and model selection
- Settings persisted in SQLite (registry.db) - shared across all projects
- Models fetched from API endpoint (/api/settings/models)
- Single source of truth for models in registry.py - easy to add new models
- Optimistic UI updates with rollback on error

## Agent Control Simplification
- Removed StatusIndicator ("STOPPED"/"RUNNING" label) - redundant
- Removed Pause/Resume buttons - just Start/Stop toggle now
- Start button shows flame icon with fiery gradient when YOLO mode enabled

## Code Review Fixes
- Added focus trap to SettingsModal for accessibility
- Fixed YOLO button color contrast (WCAG AA compliance)
- Added model validation to AgentStartRequest schema
- Added model to AgentStatus response
- Added aria-labels to all icon-only buttons
- Added role="radiogroup" to model selection
- Added loading indicator during settings save
- Added SQLite timeout (30s) and retry logic with exponential backoff
- Added thread-safe database engine initialization
- Added orphaned lock file cleanup on server startup

## Files Changed
- registry.py: Model config, Settings CRUD, SQLite improvements
- server/routers/settings.py: New settings API
- server/schemas.py: Settings schemas with validation
- server/services/process_manager.py: Model param, orphan cleanup
- ui/src/components/SettingsModal.tsx: New modal component
- ui/src/components/AgentControl.tsx: Simplified to Start/Stop only

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Auto
2026-01-07 12:29:07 +02:00
parent 122f03dc21
commit 45ba266f71
16 changed files with 825 additions and 173 deletions

View File

@@ -4,7 +4,7 @@
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
import * as api from '../lib/api'
import type { FeatureCreate } from '../lib/types'
import type { FeatureCreate, ModelsResponse, Settings, SettingsUpdate } from '../lib/types'
// ============================================================================
// Projects
@@ -200,3 +200,74 @@ export function useValidatePath() {
mutationFn: (path: string) => api.validatePath(path),
})
}
// ============================================================================
// Settings
// ============================================================================
// Default models response for placeholder (until API responds)
const DEFAULT_MODELS: ModelsResponse = {
models: [
{ id: 'claude-opus-4-5-20251101', name: 'Claude Opus 4.5' },
{ id: 'claude-sonnet-4-5-20250929', name: 'Claude Sonnet 4.5' },
],
default: 'claude-opus-4-5-20251101',
}
const DEFAULT_SETTINGS: Settings = {
yolo_mode: false,
model: 'claude-opus-4-5-20251101',
}
export function useAvailableModels() {
return useQuery({
queryKey: ['available-models'],
queryFn: api.getAvailableModels,
staleTime: 300000, // Cache for 5 minutes - models don't change often
retry: 1,
placeholderData: DEFAULT_MODELS,
})
}
export function useSettings() {
return useQuery({
queryKey: ['settings'],
queryFn: api.getSettings,
staleTime: 60000, // Cache for 1 minute
retry: 1,
placeholderData: DEFAULT_SETTINGS,
})
}
export function useUpdateSettings() {
const queryClient = useQueryClient()
return useMutation({
mutationFn: (settings: SettingsUpdate) => api.updateSettings(settings),
onMutate: async (newSettings) => {
// Cancel outgoing refetches
await queryClient.cancelQueries({ queryKey: ['settings'] })
// Snapshot previous value
const previous = queryClient.getQueryData<Settings>(['settings'])
// Optimistically update
queryClient.setQueryData<Settings>(['settings'], (old) => ({
...DEFAULT_SETTINGS,
...old,
...newSettings,
}))
return { previous }
},
onError: (_err, _newSettings, context) => {
// Rollback on error
if (context?.previous) {
queryClient.setQueryData(['settings'], context.previous)
}
},
onSettled: () => {
queryClient.invalidateQueries({ queryKey: ['settings'] })
},
})
}