Merge feature/web-ui-phase0: Complete Phase 0 Web UI

- Backend API with system/projects/queue/services endpoints
- React + TypeScript frontend with 9 routes
- Dashboard with system metrics and charts
- Projects management (CRUD operations)
- Services management (systemd control)
- Queue management (view and clear)
- Settings page (GitHub token configuration)
- Route-based navigation with modern UI
- Dark mode support
- Full documentation

Closes #26

Author: yusufkaraaslan

PHASE0_UI_SUMMARY.md

@@ -0,0 +1,191 @@
+# Phase 0 Web UI - Completion Summary
+
+## ✅ What Was Built
+
+### Architecture
+- **Route-based navigation** - No modals, full-page forms for better UX
+- **React 18 + TypeScript** - Modern, type-safe React application
+- **TanStack Query** - Server state management with caching
+- **React Router** - Client-side routing with URL parameters
+- **Tailwind CSS** - Utility-first styling with dark mode support
+- **Vite** - Lightning-fast build tool with HMR
+
+### Pages Implemented
+
+| Page | Route | Features |
+|------|-------|----------|
+| **Dashboard** | `/` | System status cards, resource monitoring |
+| **Projects List** | `/projects` | View all projects, enable/disable, delete |
+| **Add Project** | `/projects/add` | Full-page form for creating projects |
+| **Edit Project** | `/projects/:id/edit` | Full-page form for editing projects |
+| **Services List** | `/services` | systemd services, start/stop/restart controls |
+| **Create Service** | `/services/add` | Full-page editor for systemd service files |
+| **Edit Service** | `/services/:name/edit` | Full-page editor for service configuration |
+| **Queue** | `/queue` | View queued tasks, task details |
+| **Settings** | `/settings` | GitHub token, service management |
+
+### Key Features
+
+**✅ Project Management**
+- Full CRUD operations (Create, Read, Update, Delete)
+- Enable/disable projects
+- Configure test and build commands
+- Multi-framework support (Godot, Python, Rust, Node.js, etc.)
+
+**✅ Service Management**
+- List all systemd user services
+- Start, stop, restart services
+- Create new services with templates
+- Edit service files (full systemd configuration)
+- Enable/disable auto-start
+
+**✅ System Monitoring**
+- Service status (running/stopped)
+- Resource usage (CPU, memory, disk)
+- Service uptime tracking
+- Live status updates (5-second polling)
+
+**✅ Settings**
+- GitHub access token configuration
+- Token validation and testing
+- Service control from settings page
+
+**✅ Modern UI/UX**
+- Dark mode support (system-aware)
+- Responsive design (mobile-friendly)
+- Clean, minimal interface
+- Proper loading states
+- Error handling
+- Smooth transitions
+- Bookmarkable URLs
+- Browser back/forward navigation
+
+### Route-Based Architecture Benefits
+
+**Why we chose routes over modals:**
+
+1. **More space** - Full page for complex forms
+2. **Bookmarkable** - Can share URLs like `/projects/add`
+3. **Navigation** - Browser back button works naturally
+4. **Mobile** - Better experience on smaller screens
+5. **Focus** - Single task per page, less distraction
+
+### Technical Implementation
+
+**State Management:**
+- TanStack Query handles all server state
+- Automatic background refetching every 10 seconds
+- Optimistic updates for instant feedback
+- Cache invalidation on mutations
+
+**TypeScript:**
+- Full type safety across the application
+- API response types defined
+- Props interfaces for all components
+- Type-safe route parameters
+
+**API Integration:**
+- Centralized API client (`src/lib/api.ts`)
+- Custom hooks for all operations
+- Automatic error handling
+- Request/response interceptors
+
+**Component Structure:**
+```
+Pages (route handlers)
+  ↓
+Custom Hooks (API logic)
+  ↓
+API Client (HTTP requests)
+  ↓
+Backend Flask API
+```
+
+## 📝 Documentation Updated
+
+### Files Updated:
+1. **web/README.md** - Complete web UI documentation
+2. **web/frontend/README.md** - Frontend developer guide
+
+### Documentation Includes:
+- Architecture decisions explained
+- Routing table with all routes
+- State management approach
+- Component structure
+- Development tips
+- Common tasks guide
+- TypeScript examples
+- API communication patterns
+
+## 🎯 Phase 0 Status: COMPLETE
+
+All planned Phase 0 features are implemented and tested:
+- ✅ Dashboard page
+- ✅ Projects CRUD
+- ✅ Services management
+- ✅ Settings page
+- ✅ Queue viewer
+- ✅ Route-based navigation
+- ✅ Modern UI design
+- ✅ Documentation
+
+## 🚀 Next Steps (Phase 1)
+
+**Planned for Phase 1:**
+1. Task log viewer (view Claude Code execution logs)
+2. Task cancellation (cancel running tasks)
+3. Enhanced error handling
+4. Toast notifications
+5. Loading skeletons
+6. Better empty states
+7. Search/filter functionality
+
+## 📦 Commits Made
+
+1. `52d4989` - Add ProjectForm modal component with React Portal
+2. `766f1ae` - Redesign ProjectForm with modern, minimal UI
+3. `9a8f859` - Convert project form from modal to separate routes
+4. `d2e0149` - Convert Services page from modals to route-based navigation
+5. `dc5acd6` - Update documentation to reflect route-based UI architecture
+
+## 🔧 How to Run
+
+```bash
+# Backend (Terminal 1)
+cd web/backend
+python3 -m venv venv
+source venv/bin/activate
+pip install -r requirements.txt
+python3 app.py
+
+# Frontend (Terminal 2)
+cd web/frontend
+npm install
+npm run dev
+```
+
+**Access at:** `http://localhost:5173`
+
+## 📊 Statistics
+
+- **Total Routes:** 9
+- **Pages:** 8 (DashboardPage, ProjectsPage, ProjectFormPage, ServicesPage, ServiceFormPage, QueuePage, SettingsPage, Layout)
+- **Custom Hooks:** 2 (useProjects, useSystem)
+- **Components:** 2 (Layout, ProjectForm)
+- **Lines of Code:** ~3,000+ (TypeScript + TSX)
+- **Dependencies:** React, React Router, TanStack Query, Tailwind, Lucide Icons, Axios
+
+## ✨ Quality
+
+- ✅ TypeScript strict mode enabled
+- ✅ No console errors
+- ✅ All routes working
+- ✅ Dark mode support
+- ✅ Responsive design
+- ✅ Clean code structure
+- ✅ Comprehensive documentation
+- ✅ Proper error handling
+
+---
+
+**Phase 0 Web UI is production-ready!** 🎉

scripts/agent-runner.sh

@@ -4,6 +4,9 @@
 
 set -euo pipefail
 
+# Ensure user local bin is in PATH for godot and other tools
+export PATH="$HOME/.local/bin:$PATH"
+
 # Colors for output
 RED='\033[0;31m'
 GREEN='\033[0;32m'
@@ -233,6 +236,53 @@ create_worktree() {
     fi
 }
 
+# Initialize Godot project in worktree (gdUnit4 requires .godot directory)
+initialize_godot_worktree() {
+    # Only run for Godot projects
+    if [ "$PROJECT_TYPE" != "godot" ]; then
+        log_info "[$PROJECT_ID] Not a Godot project, skipping initialization"
+        return 0
+    fi
+
+    log_info "[$PROJECT_ID] Initializing Godot project in worktree..."
+
+    cd "$WORKTREE_PATH" || exit 3
+
+    # Check if godot command is available
+    if ! command -v godot &> /dev/null; then
+        log_warning "[$PROJECT_ID] godot command not found, skipping initialization"
+        return 0
+    fi
+
+    # Always run godot --editor --quit to initialize the project properly
+    # This scans all scripts and registers global classes, which is required for gdUnit4
+    log_info "[$PROJECT_ID] Running 'godot --editor --quit --headless' to scan scripts..."
+
+    local godot_log="/tmp/godot-init-$$.log"
+    if timeout 45 godot --editor --quit --headless > "$godot_log" 2>&1; then
+        log_success "[$PROJECT_ID] Godot project initialized successfully"
+
+        # Verify .godot directory was created
+        if [ -d ".godot" ]; then
+            log_success "[$PROJECT_ID] .godot directory created"
+
+            # Verify critical files exist
+            if [ -f ".godot/global_script_class_cache.cfg" ]; then
+                log_success "[$PROJECT_ID] Plugin class cache generated"
+            else
+                log_warning "[$PROJECT_ID] Plugin class cache not found (tests may fail)"
+            fi
+        else
+            log_warning "[$PROJECT_ID] .godot directory not created (tests may fail)"
+        fi
+    else
+        log_warning "[$PROJECT_ID] Godot initialization had issues (tests may fail)"
+        cat "$godot_log" || true
+    fi
+
+    return 0
+}
+
 # Run Claude Code
 run_claude() {
     log_info "[$PROJECT_ID] Running Claude Code on task..."
@@ -613,6 +663,9 @@ main() {
     log_info "Step 4/11: Creating worktree..."
     create_worktree
 
+    log_info "Step 4.5/11: Initializing Godot worktree..."
+    initialize_godot_worktree
+
     # Execute task
     log_info "Step 5/11: Running Claude Code..."
     if ! run_claude; then