diff --git a/ROADMAP.md b/ROADMAP.md index 3f85a1d..f1e2281 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -2,1444 +2,127 @@ Stand: 20.04.2026 -## Aktueller Status +--- -### Implementiert (Phase 1-4) +## Ziel -| Feature | Status | Commit | -|---------|--------|--------| -| Tauri 2.0 + SvelteKit 5 App | ✅ | Initial | -| Claude Agent SDK Integration | ✅ | Phase 2 | -| Live-Streaming Text im Chat | ✅ | Phase 2 | -| SQLite Persistierung | ✅ | Phase 3 | -| Guard-Rails System | ✅ | Phase 3 | -| Claude Bridge (Node.js) | ✅ | Phase 3 | -| 4-Panel Layout (PaneForge) | ✅ | Phase 4 | -| Tab-Switching | ✅ | Phase 4 | -| Markdown-Rendering | ✅ | Phase 4 | -| Activity Panel (Tool-Tracking) | ✅ | Phase 4 | -| Memory Panel | ✅ | Phase 4 | -| Audit Log Panel | ✅ | Phase 4 | -| Agent-View | ✅ | Phase 4 | -| Modell-Auswahl (Haiku/Sonnet/Opus) | ✅ | 433e2de | -| Session-Historie persistent | ✅ | 4ba14a5 | -| STOPP-Button + Escape-Shortcut | ✅ | Vorhanden | -| Token/Kosten-Anzeige im Footer | ✅ | Vorhanden | -| Modell-Badge (Titlebar + Footer) | ✅ | 9129163 | -| Tray-Icon mit Menu | ✅ | 3c6da3b | -| **Subagent-Hierarchie (Phase 5)** | ✅ | 6cfcdb2 | -| **System-Monitor (Phase 16)** | ✅ | adb11fd | -| **UI: Code-Copy, Edit, Regenerate (Phase 7)** | ✅ | 9d837ef | -| **Session-Management (Phase 6)** | ✅ | abaf4eb | -| **Claude-DB Integration (Phase 8)** | ✅ | e6bd0de | -| **Context-Management (Phase 9)** | ✅ | eb91e54 | -| **Sprach-Interface (Phase 10)** | ✅ | 14.04.2026 | -| **Multi-Agent-Modi (Phase 11 — Basis)** | ✅ | 14.04.2026 | -| **Multi-Agent-Ausbau (Phase 11 — Vollendung)** | ✅ | 14.04.2026 | -| **Hook-System (Phase 12)** | ✅ | 14.04.2026 | -| **VSCodium-Integration (Phase 13)** | ✅ | 14.04.2026 | -| **Programm-Steuerung (Phase 14)** | ✅ | 14.04.2026 | -| **Schulungsmodus (Phase 15)** | ✅ | 14.04.2026 | -| **Aktivierung & Quick-Wins (Phase 1.5)** | ✅ | 20.04.2026 | - -### Phase 1.5: Aktivierung & Quick-Wins ✅ ERLEDIGT (20.04.2026) - -| Feature | Status | Datei(en) | -|---------|--------|-----------| -| SQL Priority-Fix: KB-Queries mit `priority DESC` | ✅ | `knowledge.rs` | -| KB-Hints in Claude-Prompt: Relevante Wissensbasis-Einträge automatisch injiziert | ✅ | `claude.rs`, `knowledge.rs` | -| Voice → Claude → TTS: `sendToClaudeWithTts()` Pipeline | ✅ | `VoicePanel.svelte` | -| Hook-System aktiviert: SessionStart, PreToolUse, PostToolUse feuern echte Events | ✅ | `hooks.rs`, `events.ts` | -| Pattern-Detektion: Tool-Fehler gegen bekannte Patterns prüfen | ✅ | `events.ts` | -| Slash-Command Autocomplete: `/`-Eingabe zeigt Dropdown | ✅ | `commands.rs`, `CommandPalette.svelte`, `ChatPanel.svelte` | -| Updater-Absicherung: Lock-Datei, Prozess-Guard, Graceful Shutdown, Bestätigungsdialog | ✅ | `update.rs`, `lib.rs`, `UpdateDialog.svelte` | +Claude Desktop soll **schneller und maechtiger** sein als Codium + Claude Code Extension. Kein Feature-Bloat — nur das was echten Geschwindigkeits- und Produktivitaetsvorteil bringt. --- -## Phase 5: Subagent-Hierarchie ✅ ERLEDIGT +## Abgeschlossen (v0.1.0 — 14.04.2026) -> **Commit:** 6cfcdb2 (14.04.2026) +Alles aus Phase 1-16 ist implementiert und funktionsfaehig: -### Implementiert - -- ✅ **scripts/claude-bridge.js** — Subagent-Tracking - - Map `activeSubagents` für Tool-ID → Agent-Info - - `SUBAGENT_TOOLS` erkennt Task/Agent Tool-Calls - - `subagent-started` / `subagent-stopped` Events - - `parentAgentId`, `depth`, `model` im Payload - -- ✅ **src/lib/stores/app.ts** — Agent mit Hierarchie - - `Agent.parentAgentId?: string` - - `Agent.depth: number` - - `buildAgentTree()` → rekursive Baumstruktur - - `agentTree` derived Store - -- ✅ **src/lib/stores/events.ts** — Event-Handler - - `SubagentEvent` Interface - - Listener für `subagent-started`, `subagent-stopped` - - `addSubAgent()` mit Parent-Verknüpfung - -- ✅ **src/lib/components/AgentView.svelte** — Baumansicht - - Rekursives `{#snippet agentNode}` für Hierarchie - - Einrückung mit CSS `--depth` Variable - - Verbindungslinien zwischen Parent/Child - - Collapse/Expand per Agent - - Typ-Icons (🎯 Main, 🔍 Explore, 📋 Plan, etc.) +- Tauri 2.0 + SvelteKit 5 + Claude Agent SDK +- 4-Panel Layout mit 24 UI-Komponenten +- Claude Bridge (Node.js, stdio JSON-Lines) +- Guard-Rails System (Safe/Moderate/Critical/Blocked) +- SQLite Persistierung + Session-Management +- Claude-DB Integration (Wissensbasis durchsuchen/speichern) +- 3-Schichten Context-Management (Sticky/Projekt/Hints) +- Sprach-Interface (Whisper STT + OpenAI TTS) +- Multi-Agent-Modi (Solo/Handlanger/Experten/Auto) +- Hook-System (SessionStart, PreToolUse, PostToolUse) +- VSCodium-Extension (WebSocket Port 7890) +- Programm-Steuerung (D-Bus, Xvfb, Playwright-MCP) +- Praesentations-/Schulungsmodus +- System-Monitor + Performance-Metriken +- Subagent-Hierarchie mit Baumansicht +- Auto-Updater (Forgejo Package Registry) +- Slash-Command Autocomplete +- KB-Hints Injection + Proaktive Intelligenz +- Error-Pattern Auto-Detection (3x → KB-Eintrag) --- -## Phase 6: Session-Management Verbesserungen ✅ ERLEDIGT +## Phase 3: Performance (naechster Schritt) -> **Commit:** abaf4eb (14.04.2026) +**Ziel:** Erste Antwort in < 1s, Bridge immer warm, kein Warten. -### Implementiert - -- ✅ **Session Auto-Load bei App-Start** - - `+layout.svelte` lädt aktive Session in `onMount` - - Session-Stats werden wiederhergestellt (Tokens, Kosten) - - Nachrichten aus DB geladen - -- ✅ **agent_id in messages-Tabelle** - - `ChatMessage` Struct erweitert - - DB-Schema enthält `agent_id` Spalte - - `DbMessage` Interface angepasst - -- ✅ **Session-Compacting** - - `compact_session(session_id, keep_last)` Funktion - - Fasst alte Nachrichten in Summary zusammen - - Standard: 30 letzte Nachrichten behalten - - Tauri Command registriert - -### Nachträglich implementiert - -- ✅ **Token-basiertes Compacting** — Warnung bei ~40k Token mit Bestätigungs-Dialog (ab95af2) -- ✅ **Claude-Session-ID** — SDK-Fortsetzung für nahtlose Konversationen (be65dee) - - Session-ID aus claude-result Event speichern - - Bei neuen Nachrichten automatisch fortsetzen - - Bridge nutzt `sessionId` in query() Optionen - -### Alle Phase 6 Features implementiert! +| Feature | Datei(en) | Beschreibung | +|---------|-----------|--------------| +| Bridge-Daemon | `claude.rs`, `claude-bridge.js` | Bridge als persistent laufender Prozess. App reconnected nur, kein Cold-Start | +| Unix Socket IPC | `claude.rs`, `claude-bridge.js` | stdio → Unix Domain Socket. Async bidirektional, kein Thread-Blocking | +| KB-Cache (RAM) | `knowledge.rs` | Top-50 KB-Entries im Rust-RAM, Invalidierung alle 60s | +| Session-Resume Fix | `claude-bridge.js`, `session.rs` | Stale Session-ID erkennen + instant Retry ohne User-Eingriff | +| Parallel Tool-Results | `claude-bridge.js` | Mehrere Tool-Ergebnisse gleichzeitig zurueckgeben wenn Claude parallel aufruft | +| Lazy Panel-Load | `+page.svelte` | Panels erst bei Tab-Wechsel mounten (kein DOM fuer unsichtbare Tabs) | --- -## Phase 7: UI-Verbesserungen ✅ ERLEDIGT +## Phase 4: Codium-Killer Features -> **Commit:** 9d837ef (14.04.2026) +**Ziel:** Dinge die Codium + Extension prinzipbedingt NICHT koennen. -### Implementiert - -- ✅ **Code-Block mit Copy-Button** - - Custom `marked` Renderer für `.code-block-wrapper` - - Svelte action `addCopyButtons` mit MutationObserver - - Sprach-Label oben links - - 📋 Copy-Button oben rechts - - Funktioniert auch beim Streaming - -- ✅ **Nachricht bearbeiten (Edit)** - - ✏️ Button bei User-Nachrichten (hover) - - Inline-Textarea im Edit-Modus - - "Speichern & Senden" → löscht folgende Nachrichten - - Escape zum Abbrechen - -- ✅ **Antwort regenerieren (Regenerate)** - - 🔄 Button bei letzter Assistant-Nachricht - - Löscht Antwort, sendet User-Nachricht erneut - - Nur wenn nicht isProcessing - -### Nachträglich implementiert - -- ✅ **DiffView.svelte** — Diff-Ansicht für Edit-Tool Ergebnisse (2653b4f) -- ✅ **FilePreview.svelte** — Dateivorschau für Read-Tool Ergebnisse (2653b4f) -- ✅ **Keyboard Shortcuts** — Ctrl+K (Focus), Ctrl+Enter (Senden), Ctrl+Shift+K (Leeren) (56eb2f5) +| Feature | Datei(en) | Beschreibung | +|---------|-----------|--------------| +| Projekt-Wechsel | `context.rs`, UI | Ein Klick wechselt Projekt (CWD, CLAUDE.md, Context, KB-Filter) | +| MCP-Hub nativ | `claude-bridge.js` | Alle MCP-Server direkt nutzbar (Docker, Forgejo, DB) ohne CLI-Umweg | +| Guard-Rails UI | `guard.rs`, `GuardPanel.svelte` | Live-Anzeige was Claude darf/nicht darf, Ein-Klick-Freigabe | +| Persistent Memory | `memory.rs`, `db.rs` | Cross-Session Gedaechtnis — Claude erinnert sich an ALLES | +| Quick-Actions | `CommandPalette.svelte` | Ctrl+K oeffnet Palette: Deploy, Build, Test, Commit — ein Tastendruck | +| Voice-Conversation | `voice.rs`, `ChatPanel.svelte` | Hands-free Loop: Sprechen → Claude antwortet → TTS → warten auf naechste Eingabe | --- -## Phase 8: Claude-DB Integration ✅ ERLEDIGT +## Phase 5: Lokale KI + Offline -> **Commit:** e6bd0de (14.04.2026) +**Ziel:** Unabhaengig von Cloud fuer Routine-Tasks. -### Problem -Die App hat keinen direkten Zugriff auf die zentrale Wissensbasis (`claude` DB auf 192.168.155.1). - -### Ziel -- Wissensbasis durchsuchen direkt in der App -- Erkenntnisse speichern ("Das merken") -- Skills/Hooks/Patterns aus DB laden - -### Implementiert - -- ✅ **src-tauri/src/knowledge.rs** (NEU) - - MySQL-Verbindung zu claude-db (192.168.155.1:3306) - - `search_knowledge(query)` — Volltextsuche mit MATCH AGAINST - - `save_knowledge(entry)` — Neuer Eintrag speichern - - `get_knowledge(id)` — Einzelnen Eintrag laden - - `get_knowledge_categories()` — Kategorien mit Count - - `get_recent_knowledge()` — Letzte Einträge - - `test_knowledge_connection()` — Verbindungstest - -- ✅ **src-tauri/Cargo.toml** - - `mysql_async = "0.34"` Dependency hinzugefügt - -- ✅ **src-tauri/src/lib.rs** - - Knowledge-Modul registriert (`mod knowledge`) - - Alle Tauri-Commands exportiert - -- ✅ **src/lib/components/KnowledgePanel.svelte** (NEU) - - Suchfeld mit Enter-Trigger - - Kategorie-Filter Chips - - Ergebnisliste mit Relevanz-Score - - Detail-Modal bei Klick - - "Das merken" Dialog mit Formular - - Verbindungsstatus-Anzeige - -- ✅ **src/routes/+page.svelte** - - Neuer Tab "Wissen" (📚) im mittleren Panel - - KnowledgePanel eingebunden - -### Nachträglich implementiert - -- ✅ **"Das merken" im Chat** — 💡 Button bei Nachrichten, Modal-Dialog (56eb2f5) - -### Nachträglich implementiert (14.04.2026) - -- ✅ **Sticky Context Auto-Load** — Context wird beim App-Start automatisch geladen und an die Bridge gesendet - - `init_sticky_context` Tauri Command erstellt - - Frontend ruft Command in `+layout.svelte` auf - - Context-Status im Footer angezeigt (📌 +XXctx) - - Enthält Anzahl Einträge und Token-Schätzung - -### Verifikation -```bash -# Wissensbasis durchsuchen → Ergebnisse in App -# "Das merken" klicken → Eintrag in claude.knowledge -# Kategorie-Filter → Einträge filtern -``` +| Feature | Datei(en) | Beschreibung | +|---------|-----------|--------------| +| Whisper.cpp lokal | `voice.rs` | STT ohne OpenAI-API, laeuft auf GPU | +| Piper-TTS lokal | `voice.rs` | Deutsche Stimme offline | +| Lokales Haiku-Equivalent | `claude-bridge.js` | Ollama/llama.cpp fuer simple Tasks (Commit-Messages, Uebersetzungen) | +| Offline-Queue | `session.rs` | Nachrichten queuen wenn kein Netz, spaeter absenden | --- -## Phase 9: Intelligentes Context-Management ✅ ERLEDIGT +## Phase 6: Desktop-Integration (Linux-Native) -> **Commit:** eb91e54 (14.04.2026) +**Ziel:** Claude steuert den Desktop wie ein zweiter User. -### Das Problem: Context-Verlust nach Compacting - -Compacting ist **notwendig** (Token-Limit, Kosten, Latenz), aber dabei geht kritischer Kontext verloren: -- Zugänge (DB-Hosts, API-Keys) -- Projekt-Kontext (CLAUDE.md) -- Getroffene Entscheidungen -- Aktuelle Aufgabe - -### Lösung: Drei-Schichten-Gedächtnis - -``` -┌─────────────────────────────────────────────────────────────┐ -│ SCHICHT 1: IMMER PRÄSENT (~200 Token) │ -│ • User-Info (Name, Firma) │ -│ • Aktive Zugänge (komprimiert) │ -│ • Aktuelle Projekt-ID + Phase │ -│ → Bei JEDEM API-Call dabei │ -├─────────────────────────────────────────────────────────────┤ -│ SCHICHT 2: PROJEKT-KONTEXT (~500 Token) │ -│ • CLAUDE.md (komprimiert) │ -│ • Architektur-Entscheidungen │ -│ • Offene TODOs │ -│ → Nach Compacting neu injiziert │ -├─────────────────────────────────────────────────────────────┤ -│ SCHICHT 3: WISSENS-HINTS (on-demand) │ -│ • Relevante DB-Einträge │ -│ • Ähnliche Probleme/Lösungen │ -│ → Bei Tool-Aufrufen automatisch geladen │ -└─────────────────────────────────────────────────────────────┘ -``` - -### Implementiert - -- ✅ **src-tauri/src/context.rs** (NEU) - - `StickyContext` Struct (Schicht 1) — User-Info, Credentials, Projekt, Regeln - - `ProjectContext` Struct (Schicht 2) — Entscheidungen, TODOs, Insights - - `ExtractedContext` — Kontext vor Compacting extrahieren - - `render()` Methoden für System-Prompt-Integration - - Token-Schätzung mit `estimate_tokens()` - -- ✅ **Datenbank-Schema** (SQLite) - - `sticky_context` Tabelle (key, value, priority) - - `compacting_archive` Tabelle (Entscheidungen, TODOs, etc.) - - `context_failures` Tabelle (für Prompt-Optimierung) - -- ✅ **Tauri-Commands** - - `get_sticky_context()` — Schicht 1 laden - - `set_sticky_context()` — Eintrag setzen - - `remove_sticky_context()` — Eintrag löschen - - `get_project_context()` — Schicht 2 aus Archiv - - `extract_context_before_compacting()` — Kritisches extrahieren - - `log_context_failure()` — Fehler loggen - - `get_full_context()` — Kombinierter Prompt - - `list_sticky_context()` — Alle Einträge auflisten - -- ✅ **src/lib/components/ContextPanel.svelte** (NEU) - - Sticky-Context-Einträge anzeigen/bearbeiten - - Eintrags-Typen: User-Info, Regeln, Credentials, Projekt - - Prioritäts-Management (1=kritisch bis 4=niedrig) - - Vorschau des gerenderten Context - - Token-Anzeige - -- ✅ **src/routes/+page.svelte** - - Neuer Tab "📌 Context" im rechten Panel - -### Nachträglich implementiert - -- ✅ **Bridge-Integration** — Context bei jedem API-Call injizieren (2653b4f) - - `claude-bridge.js`: Sticky Context als Prefix zur Nachricht - - `claude.rs`: Context automatisch aus DB laden - -### Noch offen (niedrigere Priorität) - -- [x] **Auto-Extraction vor Compacting** — Hook automatisch auslösen ✅ (14.04.2026) - - `performCompacting()` ruft jetzt `extract_context_before_compacting()` auf - - Entscheidungen, TODOs, Key-Insights werden vor Compacting archiviert -- [ ] **Validation** — Prüfen ob Claude den Context nutzt -- [x] **Wissens-Hints** — On-demand aus claude-db laden ✅ (14.04.2026) - - `get_tool_hints()` lädt relevante Einträge bei Tool-Start - - Intelligentes Keyword-Mapping (npm, git, docker, dolibarr, etc.) - - `activeKnowledgeHints` Store im Frontend - - Anzeige im KnowledgePanel - -### Verifikation -```bash -# Context-Panel öffnen → Einträge hinzufügen -# Vorschau → Tags sichtbar -# Nachricht senden → Monitor zeigt "+XX ctx" Token -``` - ---- - -## Phase 10: Sprach-Interface ✅ ERLEDIGT - -> **Implementiert:** 14.04.2026 - -### Technologie-Stack - -| Komponente | Technologie | Ort | -|------------|-------------|-----| -| Speech-to-Text | OpenAI Whisper API | Cloud | -| Voice Activity Detection | Custom (Audio Level) | Browser | -| Text-to-Speech | OpenAI TTS API | Cloud | -| Audio-Capture | Web Audio API | Browser | - -### Implementiert - -- [x] **Whisper Integration** - - [x] OpenAI Whisper API für STT - - [x] Deutsch als Default-Sprache - - [x] Audio-Upload als multipart/form-data - -- [x] **VAD (Voice Activity Detection)** - - [x] Audio-Level-basierte Stille-Erkennung - - [x] Pause > 1.5s → Aufnahme automatisch stoppen - - [x] Konfigurierbare Schwellwerte - -- [x] **TTS (Text-to-Speech)** - - [x] OpenAI TTS API Integration - - [x] 6 Stimmen verfügbar (Alloy, Echo, Fable, Onyx, Nova, Shimmer) - - [x] Audio als Base64 zurückgeben - -- [x] **UI** - - [x] Mikrofon-Button neben Send-Button - - [x] Echtzeit-Pegel-Anzeige (animiert) - - [x] Aufnahme-Status (pulsierend) - - [x] Live-Transkript-Anzeige - -### Dateien - -- `src-tauri/src/voice.rs` — Backend für STT/TTS -- `src/lib/components/ChatPanel.svelte` — UI + Audio-Capture - -### Konfiguration - -Benötigt `OPENAI_API_KEY` Umgebungsvariable für Whisper + TTS. - -### Zukünftige Verbesserungen - -- [ ] Lokales Whisper.cpp als Alternative (offline-fähig) -- [ ] Streaming-TTS für längere Texte -- [ ] Push-to-Talk Modus - ---- - -## Phase 11: Multi-Agent-Architektur (Context-Einsparung) ✅ ERLEDIGT - -> **Basis-Implementierung:** 14.04.2026 (Tool-Filterung + Persistenz + UI-Badge) - -### Implementiert (Basis) - -- ✅ **Bridge: Tool-Filterung je Modus** (`scripts/claude-bridge.js`) - - Handlanger: `allowedTools = ['Task', 'TodoWrite']` — erzwingt Delegation - - Experten: `allowedTools = ['Task', 'TodoWrite', 'Read', 'Grep', 'Glob']` — darf sondieren, nicht schreiben - - Solo/Auto: keine Einschränkung -- ✅ **Backend: Mode-Persistenz beim Bridge-Start** (`claude.rs`) - - Gespeicherter Modus wird nach `bridge-ready` automatisch gesetzt - - `agent_mode` Setting in SQLite -- ✅ **Generische Event-Weiterleitung** (`claude.rs`) - - Unbekannte Bridge-Events werden automatisch ans Frontend emit'et - - Löst `subagent-started`, `monitor-event`, `mode-changed` etc. -- ✅ **UI: Modus-Badge im Footer** (`+layout.svelte`) - - Farbcodiert: 👷 Handlanger (orange), 🎓 Experten (lila), 🤖 Auto (cyan) -- ✅ **Frontend: mode-changed Listener** (`events.ts`) - - Badge aktualisiert sich bei Modus-Wechsel live - -### Ausbau-Implementierung (14.04.2026) - -- ✅ **AUTO-Modus Keyword-Heuristik** (`chooseAutoMode()` in Bridge) - - < 80 Zeichen → solo - - "implementiere/refactor/baue…" → experten - - "lies/suche/finde/analysiere…" + > 120 Zeichen → handlanger - - > 300 Zeichen ohne klare Keywords → handlanger (safer default) - - Sendet `auto-mode-chosen` Event ans Frontend -- ✅ **Custom Sub-Agent-Definitionen via SDK `agents` Option** - - **Handlanger**: Sub-Agent "worker" auf **Haiku** — nur Ausführung, max 500 Tokens Rückmeldung - - **Experten**: 4 autonome Agents - - `research` — Code/Docs durchsuchen (Read, Grep, Glob, Bash) - - `implement` — Code schreiben nach Best-Practices (volle Tools) - - `test` — Testfälle wählen und ausführen (volle Tools) - - `review` — Code prüfen auf Qualität/Sicherheit (read-only) - - Experten erben Modell (`model: 'inherit'`), Handlanger nutzt explizit Haiku -- ✅ **AgentView: Delegations-Badge** - - Bei Sub-Agent-Knoten wird der aktuelle Delegations-Modus farbcodiert angezeigt - - 👷 Handlanger (orange), 🎓 Experten (lila), 🤖 Auto (cyan) -- ✅ **Orchestrator-Prompts angepasst** - - Verweisen explizit auf `subagent_type` der verfügbaren Custom Agents - - Anweisung: Formuliere WAS (Experten) oder EXAKT WIE (Handlanger) - -### Alle Phase 11 Features implementiert! - -### Die drei Agent-Modi (einstellbar!) - -``` -┌─────────────────────────────────────────────────────────────┐ -│ MODUS A: SOLO (Standard für kleine Aufgaben) │ -│ Main macht alles selbst, keine Subagents │ -│ → Kein Overhead, schnell, für Triviales │ -├─────────────────────────────────────────────────────────────┤ -│ MODUS B: HANDLANGER (Main denkt, Rest führt aus) │ -│ Main: "Lies Datei X, such Y, gib Zeilen 10-20" │ -│ Sub: Führt EXAKT aus, denkt NICHT selbst │ -│ → Für komplexe Aufgaben mit viel Koordination │ -├─────────────────────────────────────────────────────────────┤ -│ MODUS C: AUTONOME EXPERTEN (jeder denkt selbst) │ -│ Main: "Implementiere Feature X" │ -│ Research: Plant SELBST wie er sucht │ -│ Implement: Plant SELBST die Architektur │ -│ → Für parallelisierbare Aufgaben, Experten-Wissen │ -└─────────────────────────────────────────────────────────────┘ -``` - -### Wann welcher Modus? - -| Aufgabe | Modus | Grund | -|---------|-------|-------| -| "Fix Typo in Zeile 42" | Solo | Trivial | -| "Lies 50 Dateien, finde Bug" | Handlanger | Main koordiniert | -| "Implementiere OAuth2 komplett" | Experten | Jeder Teil braucht Planung | -| "Erkläre den Code" | Solo | Nur Analyse | - -### Automatische Modus-Wahl (optional) - -```javascript -function chooseMode(task) { - const tokens = estimateTokens(task); - const complexity = analyzeComplexity(task); - - if (tokens < 1000 && complexity === 'simple') return 'solo'; - if (complexity === 'coordination_heavy') return 'handlanger'; - if (complexity === 'parallelizable') return 'experten'; - return 'solo'; // Default -} -``` - -### Agent-Typen (für Modus B+C) - -| Agent | Aufgabe | Modus B (Handlanger) | Modus C (Experte) | -|-------|---------|---------------------|-------------------| -| **Research** | Code durchsuchen | "Lies X, gib Y" | "Finde selbst was relevant ist" | -| **Implement** | Code schreiben | "Schreib exakt das" | "Implementiere nach Best Practices" | -| **Test** | Testen | "Führe diese Tests aus" | "Schreib und führe passende Tests" | -| **Review** | Prüfen | "Prüfe auf X, Y, Z" | "Finde selbst Probleme" | - -### Aufgaben - -- [ ] **scripts/claude-bridge.js** - - [ ] `spawnSubAgent(type, task, maxTokens)` Funktion - - [ ] `summarizeResult(result, maxTokens)` — Ergebnis komprimieren - - [ ] Orchestrator-Modus: Main Agent delegiert automatisch - -- [ ] **Orchestrator-Prompt** - ``` - Du bist ein ORCHESTRATOR. Du machst NICHT selbst die Arbeit. - Für jede Aufgabe: - 1. Analysiere was nötig ist - 2. Delegiere an passenden Sub-Agent - 3. Warte auf ZUSAMMENFASSUNG (nicht rohe Daten) - 4. Entscheide nächsten Schritt - - Sub-Agents: Research, Implement, Test, Review - ``` - -- [ ] **Sub-Agent-Prompts** - - [ ] Research: "Fasse Ergebnisse in max 500 Token zusammen" - - [ ] Implement: "Berichte nur: welche Dateien, was geändert" - - [ ] Test: "Berichte nur: passed/failed, Fehlerursache" - -- [ ] **UI: Agent-Modus Einstellung** - - [ ] Settings: Dropdown "Agent-Modus" (Solo / Handlanger / Experten / Auto) - - [ ] "Auto" wählt basierend auf Aufgaben-Komplexität - - [ ] Anzeige in Footer welcher Modus aktiv - -- [ ] **UI: Agent-Delegation anzeigen** - - [ ] AgentView zeigt: Main → Sub-Agent Delegation - - [ ] Bei Handlanger: Exakte Anweisung sichtbar - - [ ] Bei Experten: Agent's eigene Planung sichtbar - - [ ] Ergebnis-Zusammenfassung pro Agent - -### Verifikation -```bash -# Große Aufgabe starten -# Prüfen: Main Agent delegiert statt selbst zu arbeiten -# Prüfen: Sub-Agent Ergebnisse sind komprimiert -# Prüfen: Main Agent Context bleibt klein -``` - ---- - -## Phase 12: Hook-System für Automatisierung ✅ ERLEDIGT - -> **Implementiert:** 14.04.2026 - -### Implementiert -- ✅ `src-tauri/src/hooks.rs` — HookManager mit Event-Registry + Ausführungs-Log -- ✅ HookEvent Enum: SessionStart, PreToolUse, PostToolUse, BeforeCompacting, AfterCompacting, ContextFailure, AgentStarted -- ✅ 5 Built-in Hooks: load-sticky-context, inject-knowledge-hints, save-failure-pattern, extract-critical-context, reinject-context -- ✅ Tauri-Commands: list_hooks, set_hook_enabled, get_hook_executions, fire_hook -- ✅ Event `hook-fired` ans Frontend -- ✅ HooksPanel.svelte im Rechts-Panel (🪝 Hooks Tab) - - Hooks gruppiert nach Event - - Ein/Aus-Toggle pro Hook - - Live Ausführungs-Log (50 Einträge) - -### ⏸ Detail - -### Konzept - -Hooks die automatisch bei bestimmten Events laufen: - -| Hook | Wann | Was | -|------|------|-----| -| `SessionStart` | App startet | Schicht 1+2 laden | -| `PreToolUse` | Vor jedem Tool | Wissens-Hints aus DB | -| `PostToolUse` | Nach Tool | Bei Fehler → Pattern speichern | -| `BeforeCompacting` | Vor Komprimierung | Kritisches extrahieren | -| `AfterCompacting` | Nach Komprimierung | Schicht 1+2 injizieren | - -### Aufgaben - -- [ ] **src-tauri/src/hooks.rs** (NEU) - - [ ] `HookManager` Struct - - [ ] `register_hook(event, callback)` - - [ ] `fire_hook(event, payload)` - -- [ ] **scripts/hooks/** (NEU) - - [ ] `session-start.js` → Lädt Projekt-Kontext - - [ ] `pre-tool.js` → Wissens-Hints aus claude-db - - [ ] `post-tool.js` → Fehler-Patterns speichern - - [ ] `before-compacting.js` → Kritisches extrahieren - - [ ] `after-compacting.js` → Context wiederherstellen - -- [ ] **UI: Hook-Konfiguration** - - [ ] Settings-Panel: Hooks ein/ausschalten - - [ ] Hook-Log im Audit-Panel - -### Verifikation -```bash -# Session starten → Hook-Log zeigt "Kontext geladen" -# Tool aufrufen → Hook-Log zeigt "Wissens-Hints: 3 gefunden" -# Fehler provozieren → Pattern wird gespeichert -``` - ---- - -## Claude-DB Schema-Erweiterungen - -Neue Tabellen für die zentrale Wissensbasis (192.168.155.1): - -```sql --- Projekt-Kontext (für Schicht 2) -CREATE TABLE project_context ( - id INT PRIMARY KEY AUTO_INCREMENT, - project_id VARCHAR(100), - type ENUM('claude_md', 'architecture', 'decision', 'todo', 'insight'), - content TEXT, - priority INT DEFAULT 5, - created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, - expires_at TIMESTAMP NULL, - INDEX idx_project (project_id) -); - --- Credentials (verschlüsselt) -CREATE TABLE credentials ( - id INT PRIMARY KEY AUTO_INCREMENT, - name VARCHAR(100) UNIQUE, - type ENUM('mysql', 'api', 'ssh', 'oauth'), - value_encrypted BLOB, - inject_pattern TEXT, -- Regex: wann automatisch laden - last_used TIMESTAMP -); - --- Compacting-Archive -CREATE TABLE compacting_archive ( - id INT PRIMARY KEY AUTO_INCREMENT, - session_id VARCHAR(100), - extracted_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, - decisions JSON, - open_questions JSON, - key_insights JSON, - zugaenge JSON -); - --- Begriff-Cache (für schnelle Wissens-Hints) -CREATE TABLE concept_cache ( - concept VARCHAR(100) PRIMARY KEY, - relevant_knowledge_ids JSON, - last_queried TIMESTAMP, - hit_count INT DEFAULT 0 -); -``` - ---- - -## Phase 13: VSCodium Integration (IDE-Steuerung) ✅ ERLEDIGT - -> **Implementiert:** 14.04.2026 - -### Implementiert -- ✅ **VSCode Extension** unter `vscode-extension/` - - WebSocket-Server auf Port 7890 (nur 127.0.0.1) - - Commands: ping, openFile, goToLine, formatDocument, findInFiles, openTerminal, getStatus, executeCommand - - Status-Bar Anzeige im Editor - - Auto-Connect konfigurierbar -- ✅ **src-tauri/src/ide.rs** — WebSocket-Client - - `ide_connect`, `ide_disconnect`, `ide_status`, `ide_call` - - tokio-tungstenite für WebSocket - - Pending-Requests Map für Response-Matching -- ✅ **IdePanel.svelte** — Teil von ProgramsPanel - - Verbindungsstatus + Port-Konfiguration - - Zeigt aktive Datei + Cursor-Zeile live - - Ping-Test Button - -### Setup (einmalig) -```bash -cd vscode-extension -npm install -npm run compile -# Dann in VSCodium: F5 für Extension Development Host -``` - -### ⏸ Detail - -### Das Ziel - -Claude bedient VSCodium komplett — OHNE deine Maus zu blockieren. - -### Architektur - -``` -Claude Desktop ←→ VSCode Extension Bridge ←→ VSCodium - │ │ - │ ├─ VSCode Commands (Tabs, Panels, Git) - │ ├─ LSP (Refactoring, Go-To, Find References) - │ └─ Debug Adapter (Breakpoints, Step) - │ - └─ Kein Computer Use! Keine Screenshots! Keine Maus-Simulation! -``` - -### Was Claude damit kann - -| Aktion | Wie | Aktuell? | -|--------|-----|----------| -| Datei öffnen | `workbench.action.files.openFile` | ❌ Nein | -| Code formatieren | `editor.action.formatDocument` | ❌ Nein | -| Suche in Projekt | `workbench.action.findInFiles` | ❌ Nein | -| Git Commit | `git.commit` | ❌ (nur CLI) | -| Debugger starten | `workbench.action.debug.start` | ❌ Nein | -| Refactoring | LSP `textDocument/rename` | ❌ Nein | -| Go-To Definition | LSP `textDocument/definition` | ❌ Nein | -| Terminal öffnen | `workbench.action.terminal.new` | ❌ Nein | - -### Aufgaben - -- [ ] **VSCode Extension: Claude Bridge** - - [ ] Neues Extension-Projekt erstellen - - [ ] WebSocket-Server für Kommunikation mit Claude Desktop - - [ ] Command-Executor: VSCode Commands ausführen - - [ ] LSP-Bridge: Language Server Anfragen weiterleiten - - [ ] Status-Reporter: Was ist gerade offen? Wo ist Cursor? - -- [ ] **Claude Desktop: IDE-Connector** - - [ ] `src-tauri/src/ide.rs` — Verbindung zur Extension - - [ ] `connectToIDE()` — WebSocket zu VSCodium - - [ ] `executeIDECommand(command, args)` — Befehl ausführen - - [ ] `getLSPInfo(file, position)` — Semantische Infos - -- [ ] **Neue Tools für Claude** - - [ ] `IDE.openFile(path)` — Datei im Editor öffnen - - [ ] `IDE.goToLine(path, line)` — Zu Zeile springen - - [ ] `IDE.formatDocument()` — Formatieren - - [ ] `IDE.rename(oldName, newName)` — Refactoring - - [ ] `IDE.findReferences(symbol)` — Alle Verwendungen - - [ ] `IDE.startDebug(config)` — Debugger starten - - [ ] `IDE.gitCommit(message)` — Via Git-Panel - -- [ ] **UI: IDE-Status anzeigen** - - [ ] Verbindungsstatus zu VSCodium - - [ ] Aktuell offene Datei - - [ ] Cursor-Position - -### Warum NICHT Computer Use? - -| Aspekt | Computer Use | Extension Commands | -|--------|--------------|-------------------| -| Geschwindigkeit | Langsam (Screenshots) | Sofort | -| Zuverlässigkeit | Fehleranfällig | 100% präzise | -| Maus blockiert? | Ja | Nein | -| Kosten | Hoch (viele API-Calls) | Minimal | -| Extra Display? | Ja (oder VM) | Nein | - -### Verifikation -```bash -# Claude Desktop starten, VSCodium starten -# In Claude: "Öffne die Datei src/lib.rs" -# → VSCodium öffnet die Datei, DU kannst weiter tippen -# In Claude: "Formatiere das Dokument" -# → Code wird formatiert, ohne dass du was tust -``` - ---- - -## Phase 14: Programm-Steuerung (Nicht nur IDE!) ✅ ERLEDIGT - -> **Implementiert:** 14.04.2026 - -### Implementiert -- ✅ **src-tauri/src/programs.rs** — 3-teiliges Modul - - **D-Bus**: `dbus_call(service, path, method, args)` + `dbus_list_services()` - - **Xvfb**: `xvfb_start/stop/status` + `xvfb_screenshot` via scrot - - **Playwright-Info**: Verweis auf MCP-Server für Browser-Automation -- ✅ **ProgramsPanel.svelte** — Tab im Mittel-Panel (🖥️ Programme) - - 4 Section-Tabs: VSCodium / Playwright / D-Bus / Xvfb - - D-Bus Service-Liste mit Live-Abruf - - Xvfb-Start/Stop + Screenshot-Anzeige -- ✅ **IdePanel** eingebettet in Programme-Tab - -### ⏸ Detail - -### Das Problem - -Terminal ist ein Flaschenhals für: -- **GUI-Programme** (Dolibarr im Browser, Systemeinstellungen) -- **Visuelle Aufgaben** (Screenshots prüfen, UI testen) -- **Programme ohne CLI** (viele Desktop-Apps) - -### Lösungs-Stack (je nach Programm-Typ) - -``` -┌────────────────────────────────────────────────────────────────┐ -│ PROGRAMM-TYP │ STEUERUNG │ -├────────────────────────────────────────────────────────────────┤ -│ VSCodium/IDE │ Extension Commands (Phase 13) │ -│ Browser/Web-Apps │ Playwright MCP ← Dolibarr! │ -│ Terminal/CLI │ Bash (bereits vorhanden) │ -│ Native Linux-Apps │ D-Bus + XDG-Portals │ -│ Alles andere │ Computer Use (separates Display) │ -└────────────────────────────────────────────────────────────────┘ -``` - -### Priorität 1: Playwright für Web-Apps (Dolibarr!) - -Der Playwright MCP-Server ist bereits konfiguriert! Damit kann Claude: - -| Aktion | Playwright-Tool | Use Case | -|--------|----------------|----------| -| Seite öffnen | `browser_navigate` | Dolibarr aufrufen | -| Element klicken | `browser_click` | Buttons, Links | -| Formular ausfüllen | `browser_fill_form` | Daten eingeben | -| Screenshot | `browser_take_screenshot` | UI prüfen | -| Warten | `browser_wait_for` | Auf Ladezeit warten | -| Snapshot (DOM) | `browser_snapshot` | Struktur analysieren | - -**Vorteil:** Läuft im Hintergrund, blockiert NICHT deine Maus! - -### Priorität 2: D-Bus für Linux-Apps - -Viele Linux-Programme sind über D-Bus steuerbar: - -```bash -# Beispiele -dbus-send --session --dest=org.kde.dolphin ... # Dateimanager -dbus-send --session --dest=org.kde.kate ... # Kate Editor -qdbus org.freedesktop.Notifications ... # Benachrichtigungen -``` - -### Priorität 3: Computer Use (Notfall-Option) - -Für Programme die KEINE API/CLI/D-Bus haben: - -``` -┌─────────────────────────────────────────────────────────────┐ -│ LÖSUNG: Separates Display (:1) │ -│ │ -│ Display :0 (Haupt) │ Display :1 (Claude) │ -│ ├─ Dein Desktop │ ├─ Xvfb (virtuell) │ -│ ├─ Deine Maus ✓ │ ├─ Claude steuert │ -│ └─ Kein Konflikt │ └─ VNC-Zugang optional │ -│ │ -│ Du arbeitest normal │ Claude bedient GUI-Programme │ -└─────────────────────────────────────────────────────────────┘ -``` - -### Aufgaben - -- [ ] **Playwright Integration aktivieren** - - [ ] MCP-Server ist bereits da → Tools verfügbar machen - - [ ] Dolibarr-Login automatisieren (Session merken) - - [ ] UI in App: Browser-Aktionen anzeigen - -- [ ] **D-Bus Modul** - - [ ] `src-tauri/src/dbus.rs` (NEU) - - [ ] `list_dbus_services()` — Was ist verfügbar? - - [ ] `call_dbus_method(service, path, method, args)` - - [ ] Wrapper für häufige Aktionen (Dolphin, Kate) - -- [ ] **Computer Use (separates Display)** - - [ ] `src-tauri/src/xdisplay.rs` (NEU) - - [ ] `start_virtual_display()` — Xvfb auf :1 starten - - [ ] `capture_display(display_num)` — Screenshot - - [ ] `send_input(display_num, action)` — Maus/Tastatur - - [ ] VNC-Server optional für Monitoring - -- [ ] **UI: Programm-Steuerung Panel** - - [ ] Browser-View (Playwright-Screenshots) - - [ ] D-Bus Services auflisten - - [ ] Computer-Use Display einbetten (VNC-Widget) - - [ ] Toggle: "Zeige was Claude gerade bedient" - -### Entscheidungsbaum für Claude - -``` -Aufgabe erhalten - │ - ├─ Ist es eine Web-App? ────────────→ Playwright - │ - ├─ Ist es VSCodium/IDE? ────────────→ Extension Commands - │ - ├─ Hat das Programm CLI? ───────────→ Terminal/Bash - │ - ├─ Hat das Programm D-Bus? ─────────→ D-Bus - │ - └─ Alles andere ────────────────────→ Computer Use (Display :1) -``` - -### Verifikation -```bash -# Test: Playwright -# Claude: "Öffne Dolibarr und zeige mir die offenen Rechnungen" -# → Browser öffnet, navigiert, Screenshot im App - -# Test: D-Bus -# Claude: "Öffne Dolphin im Ordner ~/Downloads" -# → Dolphin öffnet sich mit dem Ordner - -# Test: Computer Use -# Claude: "Öffne LibreOffice und erstelle ein Dokument" -# → Display :1 zeigt LibreOffice, VNC optional zum Zuschauen -``` - ---- - -## Phase 15: Präsentations- & Schulungsmodus (Lehrer-Modus) ✅ ERLEDIGT - -> **Implementiert:** 14.04.2026 - -### Implementiert -- ✅ **src-tauri/src/teaching.rs** — öffnet separates Webview-Fenster - - Tauri-Commands: `presentation_open/close/send_slide/clear` - - Events `presentation-slide` + `presentation-clear` -- ✅ **Route `/presentation/+page.svelte`** — eigenes Fenster - - Slide-Navigation (←/→/Space) - - Geschwindigkeits-Slider (60-400 WPM) - - Play/Pause-Steuerung -- ✅ **MermaidDiagram.svelte** — Live-Rendering mit dark theme - - Dynamischer `import('mermaid')` zur Laufzeit - - Fehleranzeige bei Parse-Fehlern -- ✅ **AnimatedCode.svelte** — Tipp-Animation - - Konfigurable WPM (Wörter pro Minute) - - Play/Pause/Reset/Skip Controls - - Blinkender Cursor während Animation -- ✅ **🎓 Button in der Titelbar** — öffnet Präsentationsfenster -- ✅ **Capabilities** um `core:webview:allow-create-webview-window` erweitert - -### Voraussetzung -```bash -npm install # wegen neuer mermaid dependency -``` - -### ⏸ Detail - -### Das Ziel - -Claude als **Lehrer** — erklärt, visualisiert, programmiert langsam und nachvollziehbar. - -``` -┌─────────────────────────────────────────────────────────────────┐ -│ NORMALER MODUS │ SCHULUNGSMODUS │ -│ • Claude arbeitet schnell │ • Claude erklärt jeden Schritt │ -│ • Ergebnis im Chat │ • Visualisierungen live │ -│ • Effizient │ • Code wird "getippt" │ -│ │ • Pause/Play jederzeit │ -│ │ • Geschwindigkeit einstellbar │ -└─────────────────────────────────────────────────────────────────┘ -``` - -### Features - -#### 1. Präsentationsfenster - -Separates Fenster (oder Panel) für Visualisierungen: - -``` -┌─────────────────────────────────────────────────────────────────┐ -│ Präsentation [─][□][×] │ -├─────────────────────────────────────────────────────────────────┤ -│ │ -│ ┌─────────┐ │ -│ │ Thema │ │ -│ └────┬────┘ │ -│ ┌───────┼───────┐ │ -│ ▼ ▼ ▼ │ -│ ┌───────┐ ┌───────┐ ┌───────┐ │ -│ │Punkt 1│ │Punkt 2│ │Punkt 3│ ← Live Mindmap │ -│ └───────┘ └───────┘ └───────┘ │ -│ │ -├─────────────────────────────────────────────────────────────────┤ -│ ◀◀ ▶ Pause ▶▶ │ Geschwindigkeit: [████░░░░] 60% │ 📢 TTS │ -└─────────────────────────────────────────────────────────────────┘ -``` - -#### 2. Visualisierungs-Typen - -| Typ | Technologie | Use Case | -|-----|-------------|----------| -| **Mindmap** | Mermaid.js | Konzepte erklären | -| **Flowchart** | Mermaid.js | Programmablauf | -| **Sequenzdiagramm** | Mermaid.js | API-Calls, Prozesse | -| **Code** | Monaco Editor | Live Coding | -| **Architektur** | Mermaid/D3.js | System-Übersicht | -| **Freihand** | Excalidraw | Skizzen | -| **Terminal** | xterm.js | Befehle zeigen | - -#### 3. Animiertes Coding - -Claude "tippt" Code langsam — wie ein Mensch: - -```typescript -// Geschwindigkeit einstellbar: 30-200 WPM -function animateCode(code: string, wpm: number) { - const charDelay = 60000 / (wpm * 5); // ~5 Zeichen/Wort - for (const char of code) { - await sleep(charDelay); - appendChar(char); - highlightLine(currentLine); - } -} -``` - -**Features:** -- Syntax-Highlighting während des Tippens -- Cursor-Animation -- Zeile wird hervorgehoben -- Erklärung erscheint parallel (Chat oder TTS) - -#### 4. Erklär-Modus - -Claude erklärt **während** er arbeitet: - -``` -┌─ Code-Panel ──────────────┬─ Erklärung ─────────────────────────┐ -│ │ │ -│ function add(a, b) { │ "Ich definiere eine Funktion │ -│ return a + b; ← cursor │ namens 'add' mit zwei Parametern. │ -│ } │ Diese gibt die Summe zurück." │ -│ │ │ -│ │ [🔊 Vorlesen] │ -└───────────────────────────┴──────────────────────────────────────┘ -``` - -#### 5. Interaktive Elemente - -- **Pause** — Jederzeit anhalten -- **Zurück** — Letzten Schritt wiederholen -- **Frage stellen** — Unterbricht Präsentation -- **Geschwindigkeit** — Slider (langsam ↔ schnell) -- **TTS ein/aus** — Sprachausgabe toggle -- **Vollbild** — Für Präsentationen - -### Schulungs-Modi - -``` -┌─────────────────────────────────────────────────────────────────┐ -│ MODUS: ERKLÄRER │ -│ Claude erklärt ein Konzept mit Visualisierungen │ -│ "Erkläre mir wie async/await funktioniert" │ -│ → Mindmap + Flowchart + Code-Beispiele │ -├─────────────────────────────────────────────────────────────────┤ -│ MODUS: LIVE CODING │ -│ Claude programmiert langsam und erklärt jeden Schritt │ -│ "Zeig mir wie man einen REST-API-Client baut" │ -│ → Code wird getippt, jede Zeile erklärt │ -├─────────────────────────────────────────────────────────────────┤ -│ MODUS: WALKTHROUGH │ -│ Claude führt durch existierenden Code │ -│ "Erkläre mir diese Datei" │ -│ → Code wird Zeile für Zeile durchgegangen │ -├─────────────────────────────────────────────────────────────────┤ -│ MODUS: KONFIGURATION │ -│ Claude erklärt Config-Dateien │ -│ "Erkläre mir die nginx.conf" │ -│ → Optionen werden einzeln erklärt + visualisiert │ -└─────────────────────────────────────────────────────────────────┘ -``` - -### Aufgaben - -- [ ] **Präsentationsfenster** - - [ ] Neues Tauri-Window für Präsentation - - [ ] Kann neben Hauptfenster existieren - - [ ] Steuerleiste (Play/Pause/Speed) - - [ ] Vollbild-Toggle - -- [ ] **Mermaid.js Integration** - - [ ] `src/lib/components/MermaidDiagram.svelte` - - [ ] Live-Rendering von Diagrammen - - [ ] Animierte Knoten-Hinzufügung - - [ ] Zoom und Pan - -- [ ] **Animiertes Code-Panel** - - [ ] `src/lib/components/AnimatedCode.svelte` - - [ ] Monaco Editor mit Tipp-Animation - - [ ] Geschwindigkeits-Kontrolle - - [ ] Zeilen-Highlighting - - [ ] Cursor-Animation - -- [ ] **Erklär-System** - - [ ] Claude generiert Erklärungen parallel zum Code - - [ ] Synchronisation: Code-Position ↔ Erklärung - - [ ] Optional: TTS für Erklärungen (Phase 10) - -- [ ] **Schulungs-Prompts** - - [ ] Spezieller System-Prompt für Lehrer-Modus - - [ ] "Du bist ein geduldiger Lehrer. Erkläre jeden Schritt." - - [ ] Strukturierte Ausgabe: `{code, explanation, visualization}` - -- [ ] **UI: Modus-Wechsel** - - [ ] Button: "Schulungsmodus aktivieren" - - [ ] Oder: "Erkläre mir das" Button bei jeder Antwort - - [ ] Settings: Standard-Geschwindigkeit, TTS an/aus - -- [ ] **Excalidraw-ähnliche Skizzen** - - [ ] Für Freihand-Diagramme - - [ ] Claude kann "zeichnen" (Koordinaten → Shapes) - - [ ] Export als PNG/SVG - -### Beispiel-Ablauf - -**User:** "Erkläre mir wie Git Branches funktionieren" - -**Claude (Schulungsmodus):** - -1. **Mindmap erscheint:** - ```mermaid - mindmap - root((Git Branches)) - Was ist ein Branch? - Zeiger auf Commit - Leichtgewichtig - Warum Branches? - Parallele Entwicklung - Features isolieren - Befehle - git branch - git checkout - git merge - ``` - -2. **Code-Animation:** - ```bash - # Neuen Branch erstellen - git branch feature-login ← tippt langsam - - # Zum Branch wechseln - git checkout feature-login - ``` - -3. **Erklärung (parallel):** - > "Ein Branch ist wie ein paralleles Universum für deinen Code. - > Du kannst Änderungen machen ohne den Hauptcode zu beeinflussen..." - -4. **Flowchart:** - ```mermaid - gitGraph - commit id: "Initial" - branch feature-login - commit id: "Login-Form" - checkout main - commit id: "Hotfix" - merge feature-login - ``` - -### Verifikation -```bash -# Test: Schulungsmodus aktivieren -# "Erkläre mir Promises in JavaScript" -# → Präsentationsfenster öffnet sich -# → Mindmap erscheint animiert -# → Code wird langsam getippt -# → Erklärungen synchron angezeigt -# → Pause funktioniert -# → Geschwindigkeit änderbar -``` - ---- - -## Phase 16: System-Monitor (Debug-Panel) ✅ ERLEDIGT - -> **Commit:** adb11fd (14.04.2026) - -### Das Ziel - -**Echtzeit-Einblick** was im Hintergrund passiert — vom Programm generiert, NICHT von der KI! - -``` -┌─────────────────────────────────────────────────────────────────┐ -│ System-Monitor [Filter ▼] │ -├─────────────────────────────────────────────────────────────────┤ -│ │ -│ 14:32:01.234 🔵 API → claude-3-opus [1.2s] 2.4k tok │ -│ 14:32:02.891 🟢 HOOK SessionStart fired │ -│ 14:32:03.012 🟡 TOOL Read src/lib.rs (245 lines) │ -│ 14:32:03.456 🔵 API ← Response streaming... │ -│ 14:32:04.123 🟡 TOOL Grep "handleError" (3 matches) │ -│ 14:32:04.567 🟣 MCP playwright.browser_navigate │ -│ 14:32:05.234 🔴 ERROR Connection timeout (retry 1/3) │ -│ 14:32:05.890 🟢 HOOK PreToolUse → injected 2 hints │ -│ │ -├─────────────────────────────────────────────────────────────────┤ -│ ▶ Details: API Request claude-3-opus [Copy] │ -│ ┌─────────────────────────────────────────────────────────────┐│ -│ │ Model: claude-3-opus-20240229 ││ -│ │ Input: 12,456 tokens ││ -│ │ Output: 2,341 tokens ││ -│ │ Cost: $0.42 ││ -│ │ Latency: 1,234ms (first token: 234ms) ││ -│ │ System Prompt: 2,100 tokens ││ -│ │ Context: Session abc123, Turn 5 ││ -│ └─────────────────────────────────────────────────────────────┘│ -└─────────────────────────────────────────────────────────────────┘ -``` - -### Event-Typen (Farbcodiert) - -| Farbe | Typ | Was wird geloggt | -|-------|-----|------------------| -| 🔵 Blau | **API** | Requests/Responses zu Claude API | -| 🟢 Grün | **HOOK** | Hook-Ausführungen (SessionStart, PreTool, etc.) | -| 🟡 Gelb | **TOOL** | Tool-Aufrufe (Read, Grep, Edit, Bash) | -| 🟣 Lila | **MCP** | MCP-Server Kommunikation | -| 🟠 Orange | **AGENT** | Subagent Start/Stop/Delegation | -| 🔴 Rot | **ERROR** | Fehler, Timeouts, Retries | -| ⚪ Grau | **DEBUG** | Interne Events (optional) | - -### Zwei Ansichten - -#### 1. Kompakt-Ansicht (Standard) -Eine Zeile pro Event: -``` -14:32:01 🔵 API → claude-3-opus [1.2s] 2.4k tok -``` - -#### 2. Detail-Ansicht (Klick auf Event) -Vollständige Informationen: -```json -{ - "type": "api_request", - "timestamp": "2026-04-14T14:32:01.234Z", - "model": "claude-3-opus-20240229", - "input_tokens": 12456, - "output_tokens": 2341, - "latency_ms": 1234, - "first_token_ms": 234, - "cost_usd": 0.42, - "session_id": "abc123", - "turn": 5, - "tools_available": ["Read", "Edit", "Bash", ...], - "system_prompt_tokens": 2100 -} -``` - -### Was wird geloggt? - -#### API-Events -- Request gesendet (Modell, Token-Schätzung) -- Streaming gestartet -- Response komplett (Token, Kosten, Latenz) -- Errors (Rate Limit, Timeout, etc.) - -#### Hook-Events -- Hook Name + Zeitpunkt -- Payload (gekürzt) -- Ergebnis (injizierte Hints, blockiert, etc.) -- Dauer - -#### Tool-Events -- Tool-Name + Parameter (gekürzt) -- Ergebnis-Zusammenfassung -- Dauer -- Fehler wenn vorhanden - -#### MCP-Events -- Server-Name -- Tool/Resource aufgerufen -- Parameter + Ergebnis -- Verbindungsstatus - -#### Agent-Events -- Agent gestartet (ID, Typ, Parent) -- Agent beendet (Tokens verbraucht) -- Delegation (von → an) - -### Implementiert - -- ✅ **Event-System (Frontend)** - - `src/lib/stores/app.ts` — MonitorEvent Interface, Stores - - Ringbuffer (max 1000 Events) im Frontend - - Derived Stores für Stats und Filter - -- ✅ **API-Interceptor** - - `scripts/claude-bridge.js` erweitert - - `sendMonitorEvent()` für alle Event-Typen - - Token, Kosten, Latenz geloggt - - `summarizeToolInput()` für kompakte Tool-Logs - -- ✅ **Tool-Logger** - - Automatisch bei `tool-start` / `tool-end` - - Parameter geloggt (gekürzt) - - `maskSensitive()` für Passwörter, API-Keys - -- ✅ **UI: Monitor-Panel** - - `src/lib/components/MonitorPanel.svelte` - - Farbcodierte Event-Liste (🔵🟢🟡🟣🟠🔴⚪) - - Filter-Dropdown nach Typ - - Auto-Scroll (toggle) - - Detail-Ansicht bei Klick - - Copy-Button für JSON - - Stats-Anzeige (Events, API-Calls, Errors, Latenz) - -### Nachträglich implementiert - -- ✅ **Log-Export** — JSON/Text Download Buttons (88f2d22) -- ✅ **Live Token-Anzeige** — Im Chat-Header mit Farbcodierung (84dc806) -- ✅ **Backend-Persistierung** — SQLite für Monitor-Events (9d73684) - - `monitor_events` Tabelle mit Auto-Cleanup (7 Tage) - - CRUD-Methoden + Tauri Commands - - Frontend lädt Events beim Start, speichert bei neuen Events -- ✅ **Performance-Metriken** — Kosten-Tracker + Statistiken (6b8f281) - - PerformancePanel.svelte mit Kosten, Token, Latenz - - Neuer Tab "📈 Kosten" im mittleren Panel - - Latenz-Verteilung (Min, P50, P95, Max) - - Session-Vergleich - -### Alle Phase 16 Features implementiert! - -### Sensitive Daten maskieren! - -```typescript -function maskSensitive(data: string): string { - return data - .replace(/password[=:]\s*\S+/gi, 'password=***') - .replace(/api[_-]?key[=:]\s*\S+/gi, 'api_key=***') - .replace(/bearer\s+\S+/gi, 'Bearer ***') - .replace(/sk-[a-zA-Z0-9]+/g, 'sk-***'); -} -``` - -### Datenstruktur - -```typescript -interface MonitorEvent { - id: string; - timestamp: Date; - type: 'api' | 'hook' | 'tool' | 'mcp' | 'agent' | 'error' | 'debug'; - - // Kompakt-Ansicht - summary: string; // "→ claude-3-opus [1.2s] 2.4k tok" - - // Detail-Ansicht - details: { - // Je nach Typ unterschiedlich - [key: string]: any; - }; - - // Metadaten - session_id?: string; - agent_id?: string; - duration_ms?: number; - error?: string; -} -``` - -### SQLite-Schema (optional für Persistierung) - -```sql -CREATE TABLE monitor_events ( - id TEXT PRIMARY KEY, - timestamp TEXT NOT NULL, - type TEXT NOT NULL, - summary TEXT NOT NULL, - details JSON, - session_id TEXT, - agent_id TEXT, - duration_ms INTEGER, - error TEXT, - - INDEX idx_timestamp (timestamp), - INDEX idx_type (type), - INDEX idx_session (session_id) -); - --- Automatisch alte Events löschen (> 7 Tage) -CREATE TRIGGER cleanup_old_events -AFTER INSERT ON monitor_events -BEGIN - DELETE FROM monitor_events - WHERE timestamp < datetime('now', '-7 days'); -END; -``` - -### Verifikation -```bash -# Test: Monitor-Panel öffnen -# Nachricht senden → Events erscheinen live -# 🔵 API Request/Response sichtbar -# 🟡 Tool-Aufrufe sichtbar -# Auf Event klicken → Details erscheinen -# Filter auf "ERROR" → nur Fehler sichtbar -# Export → JSON-Datei mit allen Events -``` - ---- - -## In Arbeit / Geplant - -### Phase 2.0: Proaktive Intelligenz ✅ ERLEDIGT (20.04.2026) - -| Feature | Status | Datei(en) | -|---------|--------|-----------| -| MySQL Pool als Managed State | ✅ | `knowledge.rs`, `lib.rs` | -| Proaktive KB-Abfrage bei SessionStart | ✅ | `knowledge.rs`, `claude.rs`, `events.ts` | -| Themen-Erkennung (Keyword-Extraktion) | ✅ | `knowledge.rs` (`extract_keywords()`, Stoppwort-Filter) | -| Auto-Fehler-Pattern (3x → KB-Eintrag) | ✅ | `db.rs` (`error_tracker` Tabelle), `events.ts`, `knowledge.rs` | - -#### Details - -- **MySQL Pool**: `MysqlPoolState` als Tauri Managed State, einmal beim App-Start erstellt -- **Proaktive Hints**: `proactive_session_hints()` lädt bei Session-Start relevante KB-Einträge basierend auf Projekt-Kontext -- **Keyword-Extraktion**: Deutsche + englische Stoppwörter gefiltert, max 6 Keywords, dedupliziert -- **Error-Tracking**: `error_tracker` SQLite-Tabelle mit Hash-basiertem Grouping. Bei 3+ Occurrences wird automatisch ein `fehler`-Eintrag in der claude-db (MySQL) erstellt -- **Neue Tauri-Commands**: `extract_message_keywords`, `get_session_hints`, `auto_save_error_pattern`, `track_error`, `set_error_kb_pattern`, `get_error_stats` - -### Phase 2.1: Desktop-Zugriff erweitern (geplant) -- [ ] Guard-Rails in Claude-Bridge einbauen -- [ ] Desktop-Steuerung erweitern (open_application, focus_window, type_text) -- [ ] VSCodium-Extension fertigstellen (Auto-Connect, IDE-Status im Context) - -### Phase 2.2: Voice fertigstellen & lokal (geplant) -- [ ] Lokales Whisper (whisper.cpp) als Fallback -- [ ] Piper-TTS lokal mit deutscher Stimme -- [ ] Vollständiger Voice-Conversation-Loop -- [ ] Mikrofon-Button im ChatPanel (Option A) -- [ ] Fullscreen Voice-Gesprächsmodus (Option B) - -### Phase 2.3: UX & Polish (Zukunft) -- [ ] Globaler Voice/Text Modus-Toggle -- [ ] Voice und Chat teilen eine Session nahtlos -- [ ] Hands-free Modus - ---- - -## Nicht geplant / Zukunft -- [ ] MCP-Server Integration in App -- [ ] Plugin-System -- [ ] Multi-User / Team-Features -- [ ] Cloud-Sync zwischen Geraten +| Feature | Datei(en) | Beschreibung | +|---------|-----------|--------------| +| D-Bus Actions | `programs.rs` | Vordefinierte Aktionen: Dolphin oeffnen, Kate starten, Notifications | +| Clipboard-Watch | neu: `clipboard.rs` | Claude reagiert auf Clipboard-Inhalt (Code-Snippet → erklaeren, URL → zusammenfassen) | +| File-Drop | `ChatPanel.svelte` | Dateien auf Chat droppen → Claude analysiert/bearbeitet | +| Screenshot-Analyse | `programs.rs` | Bildschirmbereich markieren → Claude beschreibt/debuggt UI | +| Global Hotkey | `lib.rs` | Super+C oeffnet Claude-Eingabe von ueberall | --- ## Technische Schulden -- [x] Dead Code in `memory.rs` (MemorySystem struct entfernt) ✅ (14.04.2026) -- [x] Warnings bei `cargo check` beheben ✅ (14.04.2026) -- [ ] TypeScript strict mode aktivieren -- [ ] E2E Tests mit Playwright -- [ ] CI/CD Pipeline (Forgejo Runner) +| Was | Prioritaet | +|-----|-----------| +| TypeScript strict mode | Niedrig | +| E2E Tests (Playwright) | Mittel | +| Cargo warnings eliminieren | Niedrig | +| Dead Code in alten Panels | Niedrig | +| Bridge Error-Handling verbessern | Mittel | + +--- + +## Nicht geplant + +- Multi-User / Team-Features +- Cloud-Sync +- Plugin-System (overkill fuer 1-User-App) +- Electron-Port (Tauri bleibt) --- ## Build & Entwicklung ```bash -# Entwicklung +# Dev (Hot-Reload) cd "/mnt/17 - Entwicklungen/20 - Projekte/ClaudeDesktop" CARGO_TARGET_DIR=/tmp/claude-desktop-target nix-shell --run "npx tauri dev" -# Produktion (AppImage) -CARGO_TARGET_DIR=/tmp/claude-desktop-target nix-shell --run "npx tauri build" +# Produktion +CARGO_TARGET_DIR=/tmp/claude-desktop-target nix-shell --run "npx tauri build -- --bundles appimage" + +# CI: Commit mit [appimage] → Forgejo Runner baut + uploaded ``` - ---- - -## Commits Ubersicht - -| Datum | Commit | Beschreibung | -|-------|--------|--------------| -| 13.04.2026 | Initial | Grundgerust | -| 13.04.2026 | Phase 2 | Claude SDK + Events | -| 13.04.2026 | Phase 3 | SQLite, Guard-Rails, Bridge | -| 13.04.2026 | Phase 4 | Tabs, Markdown, UI | -| 14.04.2026 | 433e2de | Modell-Auswahl | -| 14.04.2026 | 4ba14a5 | Session-Historie | -| 14.04.2026 | 9129163 | Titlebar aufgeraumt | -| 14.04.2026 | 3c6da3b | Tray-Icon | -| 14.04.2026 | 6cfcdb2 | **Phase 5:** Subagent-Hierarchie | -| 14.04.2026 | adb11fd | **Phase 16:** System-Monitor | -| 14.04.2026 | 9d837ef | **Phase 7:** UI Code-Copy, Edit, Regenerate | -| 14.04.2026 | abaf4eb | **Phase 6:** Session-Management, Auto-Load, Compacting | -| 14.04.2026 | e6bd0de | **Phase 8:** Claude-DB Integration, KnowledgePanel | -| 14.04.2026 | eb91e54 | **Phase 9:** Context-Management, ContextPanel | -| 14.04.2026 | 2653b4f | Bridge-Context Integration, DiffView, FilePreview | -| 14.04.2026 | 56eb2f5 | Keyboard Shortcuts + "Das merken" Button | -| 14.04.2026 | ab95af2 | Token-basiertes Compacting mit Dialog | -| 14.04.2026 | 84dc806 | Live Token-Anzeige im Chat-Header | -| 14.04.2026 | 88f2d22 | Log-Export im Monitor-Panel | -| 14.04.2026 | 9d73684 | Monitor-Events Backend-Persistierung | -| 14.04.2026 | 6b8f281 | Performance-Panel (Kosten-Tracker, Statistiken) | -| 14.04.2026 | be65dee | Claude-Session-ID für SDK-Fortsetzung | -| 20.04.2026 | 3993387 | Security-Fixes + UI-Verbesserungen | -| 20.04.2026 | 506f1d3 | Auto-Updater: Package Registry + update.json | -| 20.04.2026 | 29cce7f | UI-Polish: Icon, Stop-Button, Chat-Queue, Update-Safety | -| 20.04.2026 | (wip) | **Phase 1.5:** Aktivierung & Quick-Wins | diff --git a/TEST-ROADMAP.md b/TEST-ROADMAP.md deleted file mode 100644 index b458a79..0000000 --- a/TEST-ROADMAP.md +++ /dev/null @@ -1,82 +0,0 @@ -# Claude Desktop — Test-Roadmap (Fortsetzung) - -**Stand:** 15.04.2026 (aktualisiert) - -## Was bereits getestet & funktioniert -- ✅ Hooks-Panel: 5 Built-in Hooks sichtbar & toggelbar -- ✅ D-Bus: 80+ Services laden (Programme → D-Bus) -- ✅ Schulungs-Fenster öffnet via 🎓-Button -- ✅ Modus-Auswahl in Settings + Footer-Badge -- ✅ Chat funktioniert (Bridge-Fixes: `resume`, claude_session_id nur 1×) -- ✅ Sub-Agent erscheint im Tree (`addAgent({id})` Fix) -- ✅ Sub-Agent "Nur aktive" Toggle -- ✅ Filter-Dropdown im Monitor-Panel sichtbar -- ✅ Copy-Button in Chat-Nachrichten -- ✅ Error-Banner mit kopierbarem Text im Programme-Panel -- ✅ **Date-Panic in Wissensbasis** (Commit a203589) -- ✅ **Chat-Antwort bei komplexen Flows** -- ✅ **VSCodium-Extension Verbindung** -- ✅ **Auto-Session erscheint in Liste** (Commit 48fd61f) -- ✅ **Experten-Modus** (Research-Agent + Architekturanalyse) -- ✅ **Kontext-Auslastung im Footer** (Commit f191cd0) — zeigt X% ctx inkl. Cache - -## Erledigte Bugs - -### ~~1. Chat-Antwort bei komplexen Flows fehlt~~ ✅ GEFIXT -**Verifiziert:** 15.04.2026 — Handlanger-Modus mit Sub-Agent zeigt finale Antwort korrekt an. - -### ~~2. Date-Panic in Wissensbasis~~ ✅ GEFIXT -**Commit:** a203589 -**Fix:** 7 SELECTs in knowledge.rs auf `chrono::NaiveDateTime` umgestellt, mysql_async mit chrono-Feature. - -### ~~3. VSCodium-Extension nicht getestet~~ ✅ GETESTET -**Status:** Extension kompiliert, VSIX erstellt, Verbindung auf Port 7890 funktioniert. - -### 4. Xvfb-Screenshot fehlt Tool -**Status:** Xvfb-Start funktioniert, Screenshot braucht `imagemagick` (scrot/ffmpeg-x11 fehlen in NixOS-Build). -**Fix:** `imagemagick` in `/etc/nixos/configuration.nix` → `nixos-rebuild switch`. - -### ~~5. Experten-Modus nicht getestet~~ ✅ GETESTET -**Verifiziert:** 15.04.2026 — Research-Agent analysiert Projekt, erstellt Architektur-Übersicht. - -### 6. Haiku-Kostenersparnis funktioniert nicht -**Status:** Sub-Agents laufen auf Opus (inherit vom Main). Custom `agents`-Option in SDK scheint ignoriert zu werden bzw. spawnt Agents ohne Tools (halluziniert). -**Nächster Ansatz:** Im Orchestrator-Prompt Claude explizit vorgeben `model: "haiku"` in Task-Calls zu setzen. Ob das SDK das respektiert, ist offen. - -## Neue Features (15.04.2026) - -### Auto-Update System -- **Backend** ([update.rs](src-tauri/src/update.rs)): - - `check_for_update()` — Prüft Forgejo `/repos/data/claude-desktop/releases` - - `download_update()` — Lädt AppImage mit Progress-Events herunter - - `apply_update()` — Backup, Replace, Restart via `app.restart()` -- **Frontend** ([UpdateDialog.svelte](src/lib/components/UpdateDialog.svelte)): - - Automatischer Check 3s nach App-Start - - Dialog mit Versions-Vergleich (v0.1.0 → v1.0.0) - - Release-Notes Anzeige - - Download-Fortschrittsbalken - - "Später" / "Jetzt aktualisieren" / "Jetzt installieren & neustarten" -- **Status**: Implementiert, wartet auf erstes Forgejo Release mit `.AppImage` Asset - -## Letzte Commits -- Feature: Auto-Update System für AppImage -- `f191cd0` Feature: Kontext-Auslastung im Footer (X% ctx) -- `48fd61f` Fix: Auto-Session erscheint sofort in Session-Liste -- `a203589` Fix: Date-Panic in Wissensbasis (chrono::NaiveDateTime) -- `0c095a4` Phase 11 final: Tool-Restriction via System-Prompt - -## Schnellstart nach Neustart -```bash -cd "/mnt/17 - Entwicklungen/20 - Projekte/ClaudeDesktop" -CARGO_TARGET_DIR=/tmp/claude-desktop-target nix-shell --run "npx tauri dev" -# Dauert ~15s beim ersten Start nach Reboot wenn /tmp leer ist -``` - -## DB-Reset wenn Claude-Session-IDs veraltet -```bash -nix-shell -p sqlite --run 'sqlite3 "/home/data/.local/share/de.alles-watt-laeuft.claude-desktop/claude-desktop.db" "UPDATE sessions SET claude_session_id = NULL;"' -``` - -## Offene Punkte (niedrige Priorität) -- **Xvfb-Screenshot**: Braucht `imagemagick` in NixOS-Config -- **Haiku-Kostenersparnis**: SDK-Limitation, Sub-Agents erben Model vom Main