From 8d52505d147bf7b8a1b69d1a5e8c22dd4cdbf4b6 Mon Sep 17 00:00:00 2001 From: Eddy Date: Mon, 27 Apr 2026 22:45:51 +0200 Subject: [PATCH] =?UTF-8?q?docs:=20Phase=2016=20=E2=80=94=20Schulungsmodus?= =?UTF-8?q?-Ausbau=20zum=20Session-Replay=20geplant?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 7 Sub-Phasen, ~14-16 h Gesamt-Aufwand: - 16.1 Bridge-Telemetrie (SQLite session_timeline) - 16.2 3-Spalten-Layout im Praesentations-Fenster - 16.3 Datei-Baum mit Live-Markierung - 16.4 Workspace mit Edit-Replay - 16.5 Timeline mit chronologischer Navigation - 16.6 Optional: MCP-Tools fuer gezielte Erklaerung - 16.7 Polish + Session-Export Architektur-Entscheidung: Bridge-passiv vor MCP-Tools — Bridge sieht ohnehin alle Tool-Calls, Claude muss nichts wissen. MCP nur als optionale Erweiterung wenn passive Erfassung stabil laeuft. Co-Authored-By: Claude Opus 4.7 (1M context) --- ROADMAP.md | 107 ++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 106 insertions(+), 1 deletion(-) diff --git a/ROADMAP.md b/ROADMAP.md index a8e7440..6785f81 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -1,6 +1,6 @@ # Claude Desktop — Roadmap -Stand: 27.04.2026 +Stand: 28.04.2026 --- @@ -155,6 +155,111 @@ Alles aus Phase 1-16 ist implementiert und funktionsfaehig: --- +## Phase 16: Schulungsmodus-Ausbau — Session-Replay + +**Ziel:** Das Praesentations-Fenster wird vom Slide-Stream zum vollwertigen Session-Replay. Drei Spalten: Datei-Baum links (waechst mit den beruehrten Pfaden), Workspace in der Mitte (animierter Edit oder Diff-Viewer), Timeline rechts (klickbare Liste aller Tool-Aktionen). Live waehrend Claude arbeitet, retroaktiv fuer gespeicherte Sessions. + +**Architektur-Entscheidung:** Bridge-passiv vor MCP-Tools. Die Bridge sieht ohnehin jeden Tool-Call — sie schreibt einfach mit. Claude muss nichts wissen oder steuern. MCP-Tools fuer gezielte Erklaerung sind optional und kommen erst wenn die passive Erfassung sauber laeuft. + +**Tradeoff:** Reine Bridge-Loesung ist robust und funktioniert auch retroaktiv, aber „stumm" — sie zeigt was passiert, nicht warum. Reine MCP-Steuerung waere erklaerend, aber fragil (Claude muss konsistent zugreifen). Hybrid in dieser Reihenfolge gibt sofort 90 % des Werts und laesst sich spaeter erweitern. + +### Phase 16.1: Bridge-Telemetrie (Datenerfassung) + +**Aufwand:** ~3-4 h. Ohne UI-Aenderungen — am Ende der Phase liegen Daten in SQLite. + +| Feature | Datei(en) | Status | +|---------|-----------|--------| +| ⏳ SQLite-Schema `session_timeline` | `db.rs`, `migrations` | id, session_id, tool_id, tool, file_path, timestamp, action (read/edit/write/glob/grep/bash), before_hash, after_hash, line_start, line_end, payload_json | +| ⏳ Telemetry-Modul | `telemetry.rs` (NEU) | `record_tool_event(session_id, ev)`, dedupliziert nach tool_id, schreibt in `session_timeline` | +| ⏳ Hook in claude.rs | `claude.rs` | In `handle_bridge_message` bei `tool-start`/`tool-end`/`checkpoint-after` jeweils `telemetry::record_*` aufrufen | +| ⏳ Before/After-Snapshots | `db.rs` | Zusaetzlich zu Checkpoint-Tabelle: dauerhafter Diff pro Edit gespeichert (komprimiert), nicht nur fuer Rewind | +| ⏳ Tauri-Command `presentation_get_timeline` | `teaching.rs` | Liefert Timeline einer Session (live oder historisch) | +| ⏳ Tauri-Event `timeline-append` | `claude.rs` | Pro neuem Eintrag — Frontend kann live mitschreiben | + +**Risiko:** Datenmenge bei langen Sessions. Mitigation: Before/After als komprimiertes Diff (zstd), nicht als Volltext doppelt. + +### Phase 16.2: 3-Spalten-Layout im Praesentations-Fenster + +**Aufwand:** ~2-3 h. Reines Layout — die Spalten zeigen erstmal Platzhalter, Logik kommt in 16.3-16.5. + +| Feature | Datei(en) | Status | +|---------|-----------|--------| +| ⏳ PaneForge-Layout | `presentation/+page.svelte` | 3 PaneGroups: 22 % / 56 % / 22 %, resizable, persistente Breiten | +| ⏳ Mode-Toggle | `presentation/+page.svelte` | Knopf in Footer: „Slides" (alter Modus) ↔ „Replay" (neues Layout). Slide-Modus bleibt fuer Mermaid/Code/Text erhalten | +| ⏳ Container-Komponenten | `FileTree.svelte`, `Workspace.svelte`, `Timeline.svelte` (NEU) | Skelette, in den naechsten Phasen befuellt | +| ⏳ Default-View | `presentation/+page.svelte` | Bei offenem Fenster und neuer Tool-Aktion automatisch in Replay-Modus wechseln | + +### Phase 16.3: Datei-Baum mit Live-Markierung + +**Aufwand:** ~3 h. + +| Feature | Datei(en) | Status | +|---------|-----------|--------| +| ⏳ Tree-Aufbau aus Timeline | `FileTree.svelte` | Pfade aus Timeline-Eintraegen → hierarchischer Baum, Ordner-Knoten implizit | +| ⏳ Status-Farbcodierung | `FileTree.svelte` | grau=unbekannt, blau=gelesen, gruen=geaendert, gelb=erstellt, rot=geloescht, pulsierend=aktuell aktiv | +| ⏳ Auto-Expand bei Aktivitaet | `FileTree.svelte` | Wenn Datei in der Timeline auftaucht, Pfad bis zur Wurzel auffalten | +| ⏳ Klick auf Datei | `FileTree.svelte` → `Workspace.svelte` | Mitte zeigt letzten bekannten Stand + alle Edits dieser Datei untereinander | +| ⏳ Mini-Counter pro Knoten | `FileTree.svelte` | „edited.ts (3 ✏️)" — Anzahl Aenderungen direkt am Knoten | + +**Risiko:** Bei sehr breiten Repos wird der Tree unuebersichtlich. Mitigation: Nur Pfade die in der Timeline auftauchen — kein vollstaendiger Filesystem-Scan. Maximal 200 Knoten sichtbar, Rest collapsed. + +### Phase 16.4: Workspace (Mitte) — Edit-Replay + +**Aufwand:** ~2 h. Bauteile (`AnimatedFileEdit`) sind da, fehlen nur Verkettung und Auswahl-Logik. + +| Feature | Datei(en) | Status | +|---------|-----------|--------| +| ⏳ Aktive Datei-Anzeige | `Workspace.svelte` | Eine Datei zur Zeit, Header mit Pfad + „aktiv"/„abgeschlossen" Status | +| ⏳ Edit-Liste pro Datei | `Workspace.svelte` | Wenn mehrere Edits an gleicher Datei: chronologische Liste, jeder Edit als Karte mit Before/After-Diff | +| ⏳ Replay-Knopf pro Edit | `Workspace.svelte`, `AnimatedFileEdit.svelte` | Klick spielt die Animation erneut ab — `{#key}` fuer Reset | +| ⏳ Lese-Operationen anzeigen | `Workspace.svelte` | Read/Glob/Grep nicht animiert sondern als kompakte Eintraege („Gelesen: Zeilen 5-50") | +| ⏳ Bash-Snippets | `Workspace.svelte` | `Bash`-Calls als Terminal-Card mit Befehl + Output-Snippet | + +### Phase 16.5: Timeline (Rechts) — Chronologische Navigation + +**Aufwand:** ~2 h. + +| Feature | Datei(en) | Status | +|---------|-----------|--------| +| ⏳ Vertikale Timeline | `Timeline.svelte` | Chronologisch, neueste oben, Zeitstempel + Tool-Icon + Pfad-Snippet | +| ⏳ Filter-Chips | `Timeline.svelte` | Nur Edits / Nur Reads / Nur Bash / Alle — schmale Toggle-Reihe | +| ⏳ Klick → Workspace + Tree | `Timeline.svelte` | Klick aktiviert Datei in Tree und zeigt diesen Edit in Mitte | +| ⏳ Live-Indikator | `Timeline.svelte` | Pulsierender Punkt am neuesten Eintrag waehrend Session laeuft | +| ⏳ Session-Wechsler | `Timeline.svelte` | Dropdown oben: aktuelle Session / historische Sessions, laedt jeweilige Timeline | + +### Phase 16.6: Optional — MCP-Tools fuer gezielte Erklaerung + +**Aufwand:** ~3 h, optional. Erst nach 16.1-16.5 sinnvoll, vorher kein Mehrwert. + +**Konzept:** Wenn das Praesentations-Fenster offen ist, bekommt Claude per System-Prompt-Hint einen MCP-Server `presentation` mit drei Tools. Sie kann sie nutzen — muss aber nicht. Bridge-Telemetrie laeuft unabhaengig weiter. + +| Tool | Wirkung | +|------|---------| +| `present_focus(file, line_start?, line_end?)` | Markiert Datei + Zeilenbereich im Workspace, scrollt dorthin | +| `present_explain(text, anchor?)` | Sprechblase rechts neben Workspace, optional an Datei/Zeile gepinnt | +| `present_diagram(mermaid)` | Modal mit Mermaid-Diagramm — fuer Architektur/Flow-Erklaerungen | + +**Tradeoff:** Claude muss daran denken, das ist anfangs flackernd. System-Prompt sollte „nutze diese Tools sparsam, nur fuer Schluesselstellen" sagen, sonst wird's Spam. + +### Phase 16.7: Polish + Export + +**Aufwand:** ~2 h. + +| Feature | Datei(en) | Status | +|---------|-----------|--------| +| ⏳ Geschwindigkeitssteuerung global | `presentation/+page.svelte` | Speed-Steps wirken jetzt fuer alle Edits — auch beim Replay alter Eintraege | +| ⏳ Pause/Resume bei Live | `presentation/+page.svelte` | „Pause" friert Tree+Timeline ein, neue Eintraege werden gepuffert, „Resume" arbeitet sie ab | +| ⏳ Session-Export | `teaching.rs` | „Schulungsvideo" als JSON-Bundle exportieren — laed't in einer anderen Instanz wieder | +| ⏳ Hotkeys | `presentation/+page.svelte` | j/k = Timeline rauf/runter, Enter = Replay, t = Tree-Fokus | + +--- + +**Gesamt-Aufwand Phase 16 (ohne 16.6):** ~14-16 h, in 6 zusammenhaengenden Sub-Phasen. Jede Sub-Phase ist fuer sich nuetzlich — auch wenn nur 16.1-16.3 fertig werden, ist das schon ein lebender Datei-Baum mit Telemetrie-Backend. + +**Reihenfolge-Begruendung:** Telemetrie zuerst (16.1) — ohne Daten kein UI. Layout-Skelett (16.2) gibt einen Rahmen zum Befuellen. Dann von links nach rechts (16.3 Tree → 16.4 Workspace → 16.5 Timeline) weil das die natuerliche Lesereihenfolge des Users ist. Polish (16.7) am Ende. MCP (16.6) nur wenn Phase 16.1-16.5 stabil sind. + +--- + ## Technische Schulden | Was | Prioritaet |