Ka-Note/docs/feature-commandbar.md

4.4 KiB

Feature: Command Bar (Kano-Bar)

Motivation

Die Sidebar in Ka-Note ist der primäre Navigationspfad. Das funktioniert gut, wird aber zum Engpass sobald man schnell zwischen Kontexten wechselt, eine Notiz erfassen will ohne den aktuellen Blick zu verlassen, oder auf dem Desktop tastaturgesteuert arbeitet.

Ein Cmd+K Command Bar (nach Slack-Vorbild) löst das:

  • Navigation ohne Maus in < 3 Tastendrücken
  • Schnelle Erfassung (Gedanke → Notiz in 2 Sekunden)
  • Sidebar kann geschlossen bleiben → mehr Platz für Inhalte

Konzept: Die "Kano-Bar"

Ein dezentes, zentriertes Modal das sich über den aktuellen Content legt.

Trigger: Ctrl+K (Windows/Linux) / Cmd+K (Mac)

Drei Modi — abhängig vom Input:

Input Modus Beschreibung
(leer) Recent Zuletzt besuchte Kontexte
Text Navigate Kontexte + Wiki-Seiten durchsuchen
/befehl Action Slash-Commands ausführen

Navigation

Beim Tippen werden Contexts (Jour Fixes, Projekte, Firmen, Personen) und Wiki-Seiten gefiltert.

┌────────────────────────────────────────┐
│  🔍  tis...                           │
├────────────────────────────────────────┤
│  📋  TISAX                  PROJEKT   │
│  📋  IT-Sicherheit / TISAX  WIKI   ↵  │
│  👤  Tischler, Martin       PERSON    │
└────────────────────────────────────────┘
  • Links: Icon nach Typ (📅 Meeting, 📋 Projekt, 👤 Person, 🏢 Firma, 📄 Wiki)
  • Rechts: Typ-Badge + Scope-Punkt (blau = Business, grau = Privat)
  • Markierter Eintrag: Hint rechts
  • Enter → Navigation zu /context/{id} oder /wiki/{id}

Slash-Commands

Command Funktion
/note [Text] Neues Topic im Daily Log erstellen
/todo [Text] Topic mit Wiedervorlage (heute) im Daily Log
/jf [Name] Zu passendem Jour-Fix-Kontext springen

Beispiel: /note Anruf bei Steffen wegen Angebot → sofort als Topic in daily-log gespeichert, ohne den aktuellen Screen zu verlassen.


Visuelles Design

Dark-Mode, passend zum bestehenden Ka-Note-Design:

Overlay:  bg-black/50 backdrop-blur-sm (z-200)
Modal:    bg-zinc-800, border border-amber-500/30, rounded-xl, shadow-2xl
Breite:   max-w-lg, mx-4 (responsiv)
Input:    text-lg, placeholder "Suchen oder Befehl eingeben..."
Liste:    max-h-80, overflow-y-auto
Auswahl:  bg-zinc-700 rounded

Goldener Rand (amber-500/30) greift das Ka-Note-Logo-Motiv auf.


Tastatursteuerung

Taste Funktion
Ctrl/Cmd+K Bar öffnen
Escape Bar schließen
↑ / ↓ Auswahl navigieren
Enter Ausgewählte Aktion ausführen

Recent Items

Wenn die Bar ohne Eingabe geöffnet wird, zeigt sie die 5 zuletzt besuchten Kontexte (sessionStorage recentContexts). Aktualisierung in +layout.svelte nach jeder Navigation via afterNavigate().


Technische Umsetzung

Neue Datei

ka-note/client/src/lib/components/CommandBar.svelte

Änderungen

ka-note/client/src/routes/+layout.svelte:

  • CommandBar mounten
  • Globaler keydown-Listener: Ctrl/Cmd+K → öffnen
  • afterNavigate → recentContexts aktualisieren

Datenquellen (bestehende Stores/Queries)

  • allActiveContexts() aus lib/stores/agenda.ts — Contexts
  • allPages() aus lib/stores/wiki.ts — Wiki-Seiten
  • Kein neuer Backend-Endpunkt nötig (alles Dexie/IndexedDB)

Filterung

In-Memory: label.toLowerCase().includes(query) — reicht für typische Datenmengen (< 200 Contexts).


Scope

In Scope:

  • Navigation zu Contexts und Wiki-Seiten
  • Slash-Commands: /note, /todo, /jf
  • Recent-Items (sessionStorage)
  • Tastatursteuerung
  • Responsive (Modal auf Mobile funktioniert)

Out of Scope (v1):

  • Fuzzy-Suche / Treffergewichtung
  • @-Mention-Suche (Personen-Aktivität)
  • Server-seitige Volltextsuche
  • Persistente "Favourites" in der Bar
  • Konfigurierbarer Shortcut

Offene Fragen

  1. Mobile: Lupe-Icon in BottomTabBar öffnet die Bar. ✓
  2. /todo: Wiedervorlage auf heute setzen. ✓
  3. Ergebnis-Limit: 3 Contexts + 3 Wiki-Seiten + alle Slash-Commands. ✓
  4. Archivierte Contexts: Ausblenden. ✓