feat: add commit panel and file status indicators to repo workspace

- Add CommitPanel component for viewing changed files and committing - Show file status indicators (M/A/D/?) in file tree - Integrate git status with workspace for real-time updates - Add CSS styles for commit panel and status badges Part of git-control change implementation.
2026-05-19 15:00:25 +02:00
parent 762e0de44c
commit 875594d66d
21 changed files with 2242 additions and 73 deletions
@@ -0,0 +1,2 @@
+schema: spec-driven
+created: 2026-05-19
@@ -0,0 +1,154 @@
+# Documentation Overhaul - Design
+
+## Documentation Structure
+
+```
+docs/
+├── README.md              # Documentation index
+├── architecture/
+│   ├── backend.md         # Backend architecture
+│   ├── frontend.md        # Frontend architecture
+│   ├── database.md        # Database schema
+│   └── deployment.md      # Deployment architecture
+├── features/
+│   ├── projects.md        # Project management
+│   ├── repositories.md    # Git repositories
+│   ├── workspace.md       # Repository workspace
+│   ├── git-history.md     # Git history visualization
+│   ├── auth.md            # Authentication
+│   ├── tool-types.md      # Tool type management
+│   └── settings.md        # User settings
+├── api/
+│   ├── README.md          # API overview
+│   ├── auth.md            # Auth endpoints
+│   ├── projects.md        # Project endpoints
+│   ├── repositories.md    # Repository endpoints
+│   └── users.md           # User endpoints
+├── deployment/
+│   ├── docker.md          # Docker setup
+│   ├── traefik.md         # Traefik configuration
+│   ├── authentik.md       # Authentik setup
+│   └── environment.md     # Environment variables
+├── development/
+│   ├── setup.md           # Development setup
+│   ├── testing.md         # Testing strategy (moved from README)
+│   ├── contributing.md    # How to contribute
+│   └── quality-gates.md   # Code quality
+└── templates/
+    ├── feature-doc.md     # Template for new features
+    ├── api-endpoint.md    # Template for API docs
+    └── architecture.md    # Template for architecture docs
+```
+
+## README.md Structure
+
+```markdown
+# Headquarter
+
+## Overview
+Short description of what the project is and does.
+
+## Features
+- Feature 1 (with link to docs)
+- Feature 2 (with link to docs)
+
+## Quick Start
+1. Clone repo
+2. Copy .env.example to .env
+3. docker compose up
+4. Open http://localhost:5173
+
+## Architecture
+Link to architecture docs.
+
+## Documentation
+- [User Guide](docs/features/)
+- [API Docs](docs/api/)
+- [Deployment](docs/deployment/)
+- [Development](docs/development/)
+
+## Tech Stack
+- Backend: FastAPI + SQLAlchemy + PostgreSQL
+- Frontend: React + TypeScript + Vite
+- Auth: Authentik (OAuth2)
+- Deployment: Docker + Traefik
+```
+
+## Documentation Templates
+
+### Feature Documentation Template
+```markdown
+# Feature Name
+
+## Overview
+What does this feature do?
+
+## How to Use
+Step-by-step user guide.
+
+## Screenshots/Diagrams
+Visual aids.
+
+## API Endpoints
+Related API endpoints.
+
+## Configuration
+Relevant config options.
+
+## Related Features
+Links to related docs.
+```
+
+### API Endpoint Template
+```markdown
+## GET /api/endpoint
+
+**Description:** What this endpoint does.
+
+**Authentication:** Required/Optional
+
+**Request:**
+- Query params
+- Body schema
+
+**Response:**
+- Success schema
+- Error codes
+
+**Example:**
+```bash
+curl /api/endpoint
+```
+```
+
+## Auto-Documentation Process
+
+For new features, documentation should be created:
+
+1. **During implementation** (not after):
+   - When creating a new feature, create its doc file
+   - Use the template from docs/templates/
+   - Update README features list
+
+2. **In the same commit**:
+   - Code changes + doc changes in same PR
+   - Review docs alongside code
+
+3. **Checklist**:
+   - [ ] Feature doc created in docs/features/
+   - [ ] API endpoints documented in docs/api/
+   - [ ] README updated with feature link
+   - [ ] Architecture doc updated if needed
+
+## Maintenance
+
+- **Monthly review**: Check for outdated docs
+- **Version tracking**: Tag docs with app version
+- **OpenSpec integration**: Link to OpenSpec changes for context
+
+## Tools
+
+- **Markdown**: All docs in Markdown
+- **Mermaid**: Diagrams in Mermaid syntax
+- **FastAPI docs**: Auto-generated from code
+- **GitHub Pages**: Optional static site generation
@@ -0,0 +1,56 @@
+# Documentation Overhaul
+
+## Problem
+
+The project has grown significantly but documentation hasn't kept up:
+
+- **README is minimal**: Only contains testing strategy, no project overview
+- **No feature documentation**: Users can't discover what the app does
+- **No API docs**: Developers have to read source code
+- **No deployment guide**: Docker/Traefik setup is tribal knowledge
+- **No architecture docs**: New contributors can't understand the codebase
+- **No user guide**: Features like repo workspace, git history aren't explained
+- **OpenSpec changes aren't linked**: Completed changes exist but aren't referenced
+
+## Solution
+
+Create a comprehensive documentation system:
+
+1. **Rewrite README**: Project overview, features, quick start, architecture
+2. **Create docs/ directory**: Structured documentation
+3. **Document all features**: What exists and how to use it
+4. **Create API documentation**: Auto-generated + manual docs
+5. **Create deployment guide**: Docker, Traefik, Authentik setup
+6. **Create architecture docs**: Backend, frontend, data flow
+7. **Create documentation templates**: For future features
+8. **Create CONTRIBUTING.md**: How to add docs for new features
+
+## Benefits
+
+- **Onboarding**: New developers understand the project in minutes
+- **Discovery**: Users discover features they didn't know existed
+- **Maintenance**: Architecture docs help refactoring decisions
+- **Deployment**: Clear setup instructions reduce support burden
+- **Future-proof**: Templates ensure new features get documented
+
+## Scope
+
+### What gets documented:
+- All existing features (projects, repos, git history, workspace, auth, etc.)
+- Architecture (backend, frontend, database, deployment)
+- API endpoints
+- Configuration options
+- Development setup
+
+### What gets created:
+- README.md (rewritten)
+- docs/ directory with structured docs
+- docs/templates/ for new features
+- docs/api/ for API documentation
+- docs/architecture/ for system design
+- docs/deployment/ for setup guides
+- docs/features/ for user guides
+
+### What stays:
+- Testing strategy (moved to docs/testing.md)
+- OpenSpec changes (archived as-is)
@@ -0,0 +1,178 @@
+# Documentation Overhaul Specification
+
+## Requirements
+
+### Functional Requirements
+
+1. **README Rewrite**: Comprehensive project overview with features, quick start, and links
+2. **Feature Documentation**: Every feature has a user guide in docs/features/
+3. **API Documentation**: All endpoints documented with examples
+4. **Architecture Docs**: Backend, frontend, and deployment architecture explained
+5. **Deployment Guide**: Step-by-step Docker/Traefik/Authentik setup
+6. **Development Guide**: Setup, testing, contributing guidelines
+7. **Templates**: Reusable templates for future documentation
+8. **Auto-Documentation**: Process ensuring new features get documented
+
+### Non-Functional Requirements
+
+1. **Discoverability**: Users can find docs easily from README
+2. **Completeness**: All current features documented
+3. **Accuracy**: Docs match current implementation
+4. **Maintainability**: Templates and processes keep docs up-to-date
+5. **Accessibility**: Markdown format, clear structure
+
+## Documentation Inventory
+
+### Current Features to Document
+
+1. **Project Management**
+   - Create/edit/delete projects
+   - Project list view
+   - Project workspace (default view)
+
+2. **Git Repositories**
+   - Create repositories (bare init, mirror clone)
+   - Smart URL parsing
+   - Repository list
+   - Repository deletion
+
+3. **Repository Workspace**
+   - File browser (tree view)
+   - File viewer (syntax highlighting)
+   - Branch switching
+   - Repository switching
+   - Quick file editing
+
+4. **Git History**
+   - Commit history visualization
+   - Branch graph
+   - Commit details (diff, stats)
+   - Branch filtering
+
+5. **Authentication**
+   - Authentik OAuth2 flow
+   - Session-based auth
+   - User profile
+   - Logout
+
+6. **User Settings**
+   - Theme selection
+   - Git identity
+   - Default editor
+
+7. **Tool Types**
+   - Built-in types (code-server, jupyter)
+   - Custom type creation
+   - Compose template validation
+
+8. **SSH Keys**
+   - Generate key pairs
+   - List/delete keys
+   - Copy public key
+
+## API Endpoints to Document
+
+### Auth
+- GET /auth/login
+- GET /auth/callback
+- GET /auth/me
+- POST /auth/logout
+
+### Projects
+- GET /projects
+- POST /projects
+- GET /projects/{id}
+- PUT /projects/{id}
+- DELETE /projects/{id}
+
+### Repositories
+- GET /projects/{id}/repositories
+- POST /projects/{id}/repositories
+- DELETE /projects/{id}/repositories/{id}
+- GET /projects/{id}/repositories/{id}/files
+- GET /projects/{id}/repositories/{id}/files/content
+- POST /projects/{id}/repositories/{id}/files/content
+- GET /projects/{id}/repositories/{id}/branches
+- GET /projects/{id}/repositories/{id}/history
+- GET /projects/{id}/repositories/{id}/commits/{hash}
+
+### Users
+- GET /users/me
+- PUT /users/me
+- POST /users/me/avatar
+- GET /users/me/config
+- PATCH /users/me/config
+
+### Tool Types
+- GET /tool-types
+- POST /tool-types
+- GET /tool-types/{id}
+- PUT /tool-types/{id}
+- DELETE /tool-types/{id}
+
+### SSH Keys
+- GET /ssh-keys
+- POST /ssh-keys
+- DELETE /ssh-keys/{id}
+
+## Documentation Templates
+
+### Feature Doc Template
+```markdown
+# [Feature Name]
+
+## Overview
+[1-2 sentence description]
+
+## How to Use
+[Step-by-step guide]
+
+## Screenshots
+[If applicable]
+
+## API Reference
+[Links to API docs]
+
+## Configuration
+[Relevant env vars/settings]
+
+## Related
+[Links to related features]
+```
+
+### API Doc Template
+```markdown
+## [METHOD] [PATH]
+
+**Auth:** [Required/Optional]
+
+**Description:** [What it does]
+
+### Request
+[Params/body schema]
+
+### Response
+[Success/error schemas]
+
+### Example
+[Code example]
+```
+
+## Implementation Checklist
+
+For every new feature:
+- [ ] Create feature doc in docs/features/
+- [ ] Document API endpoints in docs/api/
+- [ ] Update README.md features list
+- [ ] Update architecture docs if needed
+- [ ] Add to CHANGELOG.md
+
+## Success Criteria
+
+1. README provides clear project overview
+2. All 8 feature areas have user guides
+3. All API endpoints have documentation
+4. New developer can set up project in < 15 minutes
+5. Deployment guide enables setup without asking questions
+6. Templates exist for future documentation
+7. CONTRIBUTING.md explains documentation requirements
@@ -0,0 +1,202 @@
+# Documentation Overhaul - Tasks
+
+## Phase 1: README Rewrite
+
+- [ ] **Task 1.1**: Rewrite README.md
+  - Add project overview and description
+  - List all features with brief descriptions
+  - Add quick start section
+  - Add tech stack section
+  - Add links to docs/ directory
+  - Keep testing strategy (or move to docs/testing.md)
+
+- [ ] **Task 1.2**: Create docs/README.md
+  - Documentation index
+  - Link to all doc sections
+  - Quick navigation
+
+## Phase 2: Create Documentation Structure
+
+- [ ] **Task 2.1**: Create docs/ directory structure
+  - mkdir docs/architecture
+  - mkdir docs/features
+  - mkdir docs/api
+  - mkdir docs/deployment
+  - mkdir docs/development
+  - mkdir docs/templates
+
+- [ ] **Task 2.2**: Create documentation templates
+  - docs/templates/feature-doc.md
+  - docs/templates/api-endpoint.md
+  - docs/templates/architecture.md
+
+## Phase 3: Feature Documentation
+
+- [ ] **Task 3.1**: Document Project Management
+  - docs/features/projects.md
+  - Creating/editing/deleting projects
+  - Project list view
+  - Project workspace
+
+- [ ] **Task 3.2**: Document Git Repositories
+  - docs/features/repositories.md
+  - Creating repos (bare init, mirror clone)
+  - Smart URL parsing
+  - Repository management
+
+- [ ] **Task 3.3**: Document Repository Workspace
+  - docs/features/workspace.md
+  - File browser
+  - File viewer
+  - Branch switching
+  - Quick editing
+
+- [ ] **Task 3.4**: Document Git History
+  - docs/features/git-history.md
+  - Commit history view
+  - Branch graph
+  - Commit details
+
+- [ ] **Task 3.5**: Document Authentication
+  - docs/features/auth.md
+  - Authentik OAuth2 flow
+  - Session management
+  - User profile
+
+- [ ] **Task 3.6**: Document User Settings
+  - docs/features/settings.md
+  - Theme selection
+  - Git identity
+  - Preferences
+
+- [ ] **Task 3.7**: Document Tool Types
+  - docs/features/tool-types.md
+  - Built-in types
+  - Custom type creation
+  - Compose templates
+
+- [ ] **Task 3.8**: Document SSH Keys
+  - docs/features/ssh-keys.md
+  - Key generation
+  - Management
+
+## Phase 4: API Documentation
+
+- [ ] **Task 4.1**: Document Auth API
+  - docs/api/auth.md
+  - All auth endpoints
+
+- [ ] **Task 4.2**: Document Projects API
+  - docs/api/projects.md
+  - All project endpoints
+
+- [ ] **Task 4.3**: Document Repositories API
+  - docs/api/repositories.md
+  - All repository endpoints
+  - File operations
+  - History endpoints
+
+- [ ] **Task 4.4**: Document Users API
+  - docs/api/users.md
+  - User profile endpoints
+  - Config endpoints
+
+- [ ] **Task 4.5**: Document Tool Types API
+  - docs/api/tool-types.md
+  - CRUD endpoints
+
+- [ ] **Task 4.6**: Document SSH Keys API
+  - docs/api/ssh-keys.md
+  - Key management endpoints
+
+## Phase 5: Architecture Documentation
+
+- [ ] **Task 5.1**: Create backend architecture doc
+  - docs/architecture/backend.md
+  - Tech stack
+  - Directory structure
+  - Data flow
+  - Auth flow
+
+- [ ] **Task 5.2**: Create frontend architecture doc
+  - docs/architecture/frontend.md
+  - Tech stack
+  - Directory structure
+  - State management
+  - Routing
+
+- [ ] **Task 5.3**: Create database schema doc
+  - docs/architecture/database.md
+  - Entity relationship diagram
+  - Table descriptions
+  - Migration strategy
+
+- [ ] **Task 5.4**: Create deployment architecture doc
+  - docs/architecture/deployment.md
+  - Docker architecture
+  - Traefik routing
+  - Service diagram
+
+## Phase 6: Deployment Guide
+
+- [ ] **Task 6.1**: Create Docker setup guide
+  - docs/deployment/docker.md
+  - Local development setup
+  - Docker compose configuration
+
+- [ ] **Task 6.2**: Create Traefik guide
+  - docs/deployment/traefik.md
+  - Traefik configuration
+  - Routing rules
+  - TLS setup
+
+- [ ] **Task 6.3**: Create Authentik guide
+  - docs/deployment/authentik.md
+  - Provider setup
+  - Application configuration
+  - OAuth2 settings
+
+- [ ] **Task 6.4**: Create environment variables guide
+  - docs/deployment/environment.md
+  - All env vars explained
+  - Required vs optional
+  - Default values
+
+## Phase 7: Development Guide
+
+- [ ] **Task 7.1**: Create setup guide
+  - docs/development/setup.md
+  - Prerequisites
+  - Installation steps
+  - Running locally
+
+- [ ] **Task 7.2**: Move testing strategy
+  - Move from README.md to docs/development/testing.md
+  - Update references
+
+- [ ] **Task 7.3**: Create contributing guide
+  - docs/development/contributing.md
+  - Code style
+  - PR process
+  - Documentation requirements
+
+- [ ] **Task 7.4**: Create quality gates doc
+  - docs/development/quality-gates.md
+  - Linting rules
+  - Type checking
+  - Testing requirements
+
+## Phase 8: Finalization
+
+- [ ] **Task 8.1**: Review all docs
+  - Check for completeness
+  - Check for accuracy
+  - Fix broken links
+
+- [ ] **Task 8.2**: Create CHANGELOG.md
+  - List all features implemented
+  - Link to OpenSpec changes
+
+- [ ] **Task 8.3**: Commit all documentation
+  - Single commit for docs
+  - Conventional commit message