diff --git a/Doku/api/rest.md b/Doku/api/rest.md index b6db0c3..30b8207 100644 --- a/Doku/api/rest.md +++ b/Doku/api/rest.md @@ -29,13 +29,38 @@ Basis: `/api/v1`. Antworten sind JSON; Fehler haben die Form `{"error": "Text"}` | POST | `/auth/alarms/test` | Test-Alarm (`channel`: `email`/`discord`/`webhook`, optional `target`) | | GET | `/users/directory`, `/collaborators` | Personen, die man sehen und mit denen man teilen kann (je nach `sharingMode`, [sharing-and-permissions.md](../sharing-and-permissions.md)) | | GET | `/stats` | Zähler fürs Dashboard | -| GET | `/search?q=` | Suche in eigenen Gedanken und Notizen | +| GET | `/search?q=` | Globale FTS5-Suche in zugänglichen Notizen (Titel & Blöcke), Aufgaben und Listen → `{thoughts, documents, listItems, hits}` | | GET | `/export` | Datenexport als JSON | | GET | `/export/markdown` | Obsidian-kompatibles ZIP (`mindsift-vault-DATUM.zip`), direkt gestreamt: Notizen als `.md` mit YAML-Frontmatter in der Ordnerstruktur des Nutzers (inkl. geteilter), `Aufgaben/.md` im Format des Tasks-Plugins (`📅`, `⏫`/`🔺`), `Listen/.md` | | GET/POST | `/themes` | Eigene CSS-Themes; anlegen oder mit `id` ändern (`name`, `css`, max. 200 KB) | | DELETE | `/themes/{id}` | Eigenes Theme löschen | | GET/POST/DELETE | `/keys`, `/keys/{id}` | API-Keys verwalten (Klartext nur bei Erstellung) | +### Globale Suche (`GET /api/v1/search?q=`) + +Führt eine Volltextsuche über SQLite FTS5 mit BM25-Relevanz-Ranking aus. +- Durchsucht Aufgaben/Gedanken (Inhalt, Notizen, Unteraufgaben), Notizen (Titel sowie Inhalte aktiver Blöcke) und Listeneinträge. +- Beachtet strikt alle Zugriffsregeln: Nur eigene Gedanken/Aufgaben und solche in zugänglichen Aufgabenlisten; nur eigene und geteilte Notizen (direkt, über Gruppen oder freigegebene Ordner); nur eigene und geteilte Listen. +- Titel-Treffer werden höher gewichtet als Treffer im Fließtext. +- Liefert rückwärtskompatible Collections (`thoughts`, `documents`, `listItems`) sowie strukturierte `hits` mit Snippet und ``-Hervorhebung: + ```json + { + "thoughts": [...], + "documents": [...], + "listItems": [...], + "hits": [ + { + "type": "document", + "id": "blk_123", + "title": "Projektplanung", + "snippet": "... wichtige Notiz zum Release ...", + "docId": "doc_abc", + "blockId": "blk_123" + } + ] + } + ``` + ## Gedanken, Triage, Aufgaben | Methode | Pfad | Zweck | diff --git a/Doku/flaws.md b/Doku/flaws.md index 9edf419..eaace45 100644 --- a/Doku/flaws.md +++ b/Doku/flaws.md @@ -27,7 +27,7 @@ Schweregrade: **Hoch** (Datenabfluss oder Rechteumgehung möglich), **Mittel** ( | FLAW-15 | Realtime | ~~`WriteTimeout` von 30 s beendet SSE-Streams~~ | **Behoben** | | FLAW-16 | Setup | `/auth/setup` ist bis zum ersten Konto offen; Demo-Modus legt `admin/admin` an | Mittel | | FLAW-17 | Workspace | ~~Bearbeiter-Freigaben für Notizen nicht wählbar~~ | **Behoben** | -| FLAW-18 | Suche | Nur eigene Gedanken und Dokumente, `LIKE` ohne Escaping, keine FTS | Niedrig | +| FLAW-18 | Suche | ~~Nur eigene Gedanken und Dokumente, `LIKE` ohne Escaping, keine FTS~~ | **Behoben** | | FLAW-19 | Qualität | Frontend-Tests nur für den Outliner, `lint` ist ein Platzhalter | Niedrig | | FLAW-20 | Qualität | Sehr große Dateien, duplizierte Zugriffslogik | Niedrig | | FLAW-21 | Repo | `LICENSE` fehlt, obwohl README MIT angibt | Niedrig | @@ -147,9 +147,8 @@ Schweregrade: **Hoch** (Datenabfluss oder Rechteumgehung möglich), **Mittel** ( - **Maßnahme:** Entweder Schreibfreigaben mit Konfliktbehandlung ergänzen oder den toten Code und das Schema bereinigen. ### FLAW-18: Suche -- **Fundstelle:** `Store.SearchAll`. -- **Probleme:** Durchsucht nur eigene Gedanken (30) und eigene Dokumente (20); geteilte Dokumente, Aufgaben aus geteilten Listen, Einkaufslisten und Blöcke bleiben außen vor. `LIKE '%…%'` ohne Escaping von `%`/`_`, keine Indizes, keine Relevanz. -- **Maßnahme:** FTS5-Index über Blöcke/Gedanken; Berechtigungen mitberücksichtigen. +- **Status: Behoben.** SQLite FTS5-Volltexttabellen mit BM25-Ranking (`thoughts_fts`, `documents_fts`, `list_items_fts`), Trigger zur automatischen Synchronisation und initialem Backfill beim Start. Sicheres Query-Escaping, Präfixsuche. Strikte Berechtigungsprüfung über `accessibleTaskListIDsQuery`, `DocRole` (eigene, geteilte Notizen, über Ordner gemountete Notizen) und zugängliche Listen. Rückwärtskompatible API-Antwort mit Snippets (``) und Frontend-Integration über `CommandPalette` (`Cmd+K` / `Ctrl+K` / `/`). +- **Fundstellen:** `internal/storage/search.go`, `internal/api/server.go`, `frontend/src/components/CommandPalette.tsx`. ### FLAW-19: Geringe Frontend-Testabdeckung - **Stand:** Vitest mit jsdom und Testing Library ist eingerichtet (`npm run test:run`) und läuft beim Image-Build. Getestet sind bisher nur Outliner-Funktionen (Backspace-Zusammenführen, Cursor-Position beim Klicken). diff --git a/Doku/modules/workspace.md b/Doku/modules/workspace.md index e775e8f..e72ee6a 100644 --- a/Doku/modules/workspace.md +++ b/Doku/modules/workspace.md @@ -32,6 +32,7 @@ Code: [WorkspaceView.tsx](../../frontend/src/features/workspace/WorkspaceView.ts - **Konfliktkopien** sind farbig markiert („Konflikt – Version von …“) mit „Übernehmen“ (Text ersetzt den ursprünglichen Punkt bzw. den Titel, die Kopie verschwindet) und „Verwerfen“. - **Rückgängig:** `Strg+Z`/`Cmd+Z` nimmt die eigene letzte Änderung zurück, `Strg+Umschalt+Z` oder `Strg+Y` wiederholt (auch im Titel und über das Kontextmenü/mobile Tastaturen). Tippen im selben Punkt bis 1 s Pause ist ein Schritt; bis zu 200 Schritte je Tab. Hat jemand anderes den Punkt inzwischen geändert oder hält ihn gesperrt, wird der Schritt mit Hinweis übersprungen. - `PUT /documents/{id}` ändert nur noch Symbol, Anheften und Ordner (Titel wird ins Log übernommen); Inhalte laufen ausschließlich über die Engine. Das To-Do-Rollup hakt per einzelner Operation über denselben Sync-Endpunkt ab. +- **Notiz-Icon (Emoji-Picker):** Vollständiger Emoji-Katalog mit Kategoriereitern, Suche, Verlauf zuletzt verwendeter Symbole (`localStorage`) und dynamischer Theme-Anpassung. Auf Mobilgeräten (< 640 px) als Bottom-Sheet mit touch-freundlichen Zielen (≥ 44 px) und `text-base`-Suchfeld (verhindert iOS-Zoom). ## Explorer, Tags, To-Dos @@ -50,7 +51,7 @@ Code: [WorkspaceView.tsx](../../frontend/src/features/workspace/WorkspaceView.ts - Keine gleichzeitige Mehrbenutzerbearbeitung, keine Cursor-Anzeige, keine Versionshistorie. - Keine Virtualisierung langer Dokumente; sehr große Notizen können auf Mobilgeräten träge werden *(nicht gemessen)*. -- Suche (`/search`) erfasst nur Titel und Inhalt eigener Notizen ([FLAW-18](../flaws.md)). +- ~~Suche (`/search`) erfasst nur Titel und Inhalt eigener Notizen~~: Mit der globalen FTS5-Suche (`Cmd+K` / `Ctrl+K` / `/`) werden sowohl Titel als auch Block-Inhalte aller zugänglichen Notizen (eigene und freigegebene) durchsucht ([FLAW-18](../flaws.md)). ## Export als Markdown-Archiv diff --git a/cmd/server/main.go b/cmd/server/main.go index 9333166..e04bf9d 100644 --- a/cmd/server/main.go +++ b/cmd/server/main.go @@ -37,18 +37,18 @@ func main() { } defer store.Close() - // Seed SMTP defaults from environment variables into DB if not yet configured in DB - store.SeedSMTPDefaultsFromEnv(cfg.SMTPHost, cfg.SMTPPort, cfg.SMTPUser, cfg.SMTPPass, cfg.SMTPFrom, cfg.SMTPTLS, cfg.SMTPSkipVerify) - if cfg.DemoMode { - slog.Info("🧪 Demo-Modus aktiv (MINDA_DEMO=true): Richte Demo-Benutzer admin/admin und user/user ein...") - if err := store.EnsureDemoAccounts(); err != nil { - slog.Warn("⚠️ Fehler beim Anlegen der Demo-Accounts", "error", err) + slog.Info("🧪 Demo-Modus aktiv: Setze Datenbank zurück und richte Demo-Accounts ein...") + if err := store.ResetAndSeedDemo(); err != nil { + slog.Warn("⚠️ Fehler beim Einrichten des Demo-Modus", "error", err) } else { slog.Info("✅ Demo-Accounts bereit: admin / admin (Admin-Rolle) und user / user (Standard-Rolle)") } } + // Seed SMTP defaults from environment variables into DB if not yet configured in DB + store.SeedSMTPDefaultsFromEnv(cfg.SMTPHost, cfg.SMTPPort, cfg.SMTPUser, cfg.SMTPPass, cfg.SMTPFrom, cfg.SMTPTLS, cfg.SMTPSkipVerify) + wsHub := ws.NewHub() staticFS, err := fs.Sub(embeddedDist, "dist") diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 4154551..c0f45f8 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -9,6 +9,7 @@ "version": "0.2.0", "dependencies": { "@types/prismjs": "^1.26.6", + "emoji-picker-react": "^4.12.0", "framer-motion": "^11.15.0", "lucide-react": "^0.468.0", "prismjs": "^1.30.0", @@ -2101,6 +2102,21 @@ "dev": true, "license": "ISC" }, + "node_modules/emoji-picker-react": { + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/emoji-picker-react/-/emoji-picker-react-4.12.0.tgz", + "integrity": "sha512-q2c8UcZH0eRIMj41bj0k1akTjk69tsu+E7EzkW7giN66iltF6H9LQvQvw6ugscsxdC+1lmt3WZpQkkY65J95tg==", + "license": "MIT", + "dependencies": { + "flairup": "1.0.0" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "react": ">=16" + } + }, "node_modules/entities": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz", @@ -2302,6 +2318,12 @@ "node": ">=8" } }, + "node_modules/flairup": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/flairup/-/flairup-1.0.0.tgz", + "integrity": "sha512-IKlE+pNvL2R+kVL1kEhUYqRxVqeFnjiIvHWDMLFXNaqyUdFXQM2wte44EfMYJNHkW16X991t2Zg8apKkhv7OBA==", + "license": "MIT" + }, "node_modules/form-data": { "version": "4.0.6", "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.6.tgz", diff --git a/frontend/package.json b/frontend/package.json index 935837f..2d22bc8 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -13,6 +13,7 @@ }, "dependencies": { "@types/prismjs": "^1.26.6", + "emoji-picker-react": "4.12.0", "framer-motion": "^11.15.0", "lucide-react": "^0.468.0", "prismjs": "^1.30.0", diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index fc2a4f3..9124344 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -23,6 +23,7 @@ import { Flame, Mic, MicOff, + Search, } from 'lucide-react'; import { AuthStatus, DashboardStats, PriorityLevel, SharedList, Thought, User, UserTheme } from './lib/types'; import { @@ -56,6 +57,7 @@ import { GroupsView } from './features/teams/GroupsView'; import { useMobileActions } from './context/MobileActionContext'; import { MobileHeaderMenu } from './components/MobileHeaderMenu'; import { UserAvatar } from './components/UserAvatar'; +import { CommandPalette } from './components/CommandPalette'; import { APP_VERSION } from './version'; type ActiveTab = @@ -136,6 +138,8 @@ export const App: React.FC = () => { const [selectedDocId, setSelectedDocId] = useState(null); const [selectedBlockId, setSelectedBlockId] = useState(null); const [selectedTaskId, setSelectedTaskId] = useState(null); + const [selectedListId, setSelectedListId] = useState(null); + const [showCommandPalette, setShowCommandPalette] = useState(false); const [captureFocusCount, setCaptureFocusCount] = useState(0); const [refreshRevision, setRefreshRevision] = useState(0); @@ -594,6 +598,36 @@ export const App: React.FC = () => { setActiveTab('tasks'); }, []); + const handleOpenList = (listId: string) => { + setSelectedListId(listId); + setActiveTab('lists'); + }; + + // Global Command Palette shortcuts: Cmd+K / Ctrl+K, and '/' when not in input + useEffect(() => { + const handleKeyDown = (e: KeyboardEvent) => { + const el = e.target as HTMLElement; + const isEditing = + el.tagName === 'INPUT' || + el.tagName === 'TEXTAREA' || + el.isContentEditable; + + if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === 'k') { + e.preventDefault(); + setShowCommandPalette((prev) => !prev); + return; + } + + if (!isEditing && e.key === '/') { + e.preventDefault(); + setShowCommandPalette(true); + } + }; + + window.addEventListener('keydown', handleKeyDown); + return () => window.removeEventListener('keydown', handleKeyDown); + }, []); + const handleTriggerAddButton = () => { triggerHaptic(20); if (window.innerWidth < 640) { @@ -710,6 +744,19 @@ export const App: React.FC = () => { )} + + {/* User Profile Pill & Dropdown Menu */} @@ -1010,7 +1068,11 @@ export const App: React.FC = () => { )} {activeTab === 'lists' && ( - + )} {activeTab === 'groups' && ( @@ -1533,6 +1595,15 @@ export const App: React.FC = () => { )} + + {/* Global Command Palette (Cmd+K / Ctrl+K / '/') */} + setShowCommandPalette(false)} + onOpenDocument={handleOpenDocument} + onOpenTask={handleOpenTask} + onOpenList={handleOpenList} + /> ); }; diff --git a/frontend/src/components/CommandPalette.tsx b/frontend/src/components/CommandPalette.tsx new file mode 100644 index 0000000..ed521c3 --- /dev/null +++ b/frontend/src/components/CommandPalette.tsx @@ -0,0 +1,327 @@ +import React, { useEffect, useMemo, useRef, useState } from 'react'; +import { + Search, + FileText, + CheckSquare, + ShoppingCart, + X, + Loader2, + ArrowRight, + CornerDownLeft, +} from 'lucide-react'; +import { SearchHit } from '../lib/types'; +import { api } from '../lib/api'; + +interface CommandPaletteProps { + isOpen: boolean; + onClose: () => void; + onOpenDocument: (docId: string, blockId?: string) => void; + onOpenTask: (taskId: string) => void; + onOpenList: (listId: string) => void; +} + +// Safely render snippet containing ... without dangerouslySetInnerHTML +const SnippetRenderer: React.FC<{ snippet: string }> = ({ snippet }) => { + const parts = useMemo(() => { + if (!snippet) return []; + return snippet.split(/([\s\S]*?<\/mark>)/g); + }, [snippet]); + + return ( + + {parts.map((part, i) => { + if (part.startsWith('') && part.endsWith('')) { + const text = part.slice(6, -7); + return ( + + {text} + + ); + } + return {part}; + })} + + ); +}; + +export const CommandPalette: React.FC = ({ + isOpen, + onClose, + onOpenDocument, + onOpenTask, + onOpenList, +}) => { + const [query, setQuery] = useState(''); + const [hits, setHits] = useState([]); + const [selectedIndex, setSelectedIndex] = useState(0); + const [loading, setLoading] = useState(false); + + const inputRef = useRef(null); + const debounceTimerRef = useRef(null); + + // Group hits by category: Notizen, Aufgaben, Listen + const groupedHits = useMemo(() => { + const docs: SearchHit[] = []; + const tasks: SearchHit[] = []; + const lists: SearchHit[] = []; + + for (const h of hits) { + if (h.type === 'document') { + docs.push(h); + } else if (h.type === 'thought') { + tasks.push(h); + } else if (h.type === 'list_item') { + lists.push(h); + } + } + + return [ + { key: 'documents', label: 'Notizen', icon: FileText, items: docs }, + { key: 'tasks', label: 'Aufgaben', icon: CheckSquare, items: tasks }, + { key: 'lists', label: 'Listen', icon: ShoppingCart, items: lists }, + ].filter((g) => g.items.length > 0); + }, [hits]); + + // Flattened array for simple up/down index navigation + const flatHits = useMemo(() => { + return groupedHits.flatMap((g) => g.items); + }, [groupedHits]); + + // Focus input and reset on open + useEffect(() => { + if (isOpen) { + setQuery(''); + setHits([]); + setSelectedIndex(0); + setTimeout(() => inputRef.current?.focus(), 50); + } + }, [isOpen]); + + // 150ms debounce search + useEffect(() => { + if (debounceTimerRef.current !== null) { + window.clearTimeout(debounceTimerRef.current); + } + + const trimmed = query.trim(); + if (!trimmed) { + setHits([]); + setLoading(false); + setSelectedIndex(0); + return; + } + + setLoading(true); + debounceTimerRef.current = window.setTimeout(async () => { + try { + const res = await api.searchAll(trimmed); + setHits(res.hits || []); + setSelectedIndex(0); + } catch { + setHits([]); + } finally { + setLoading(false); + } + }, 150); + + return () => { + if (debounceTimerRef.current !== null) { + window.clearTimeout(debounceTimerRef.current); + } + }; + }, [query]); + + // Keyboard navigation: ↑, ↓, Enter, Escape + useEffect(() => { + if (!isOpen) return; + + const handleKeyDown = (e: KeyboardEvent) => { + if (e.key === 'Escape') { + e.preventDefault(); + onClose(); + return; + } + + if (flatHits.length === 0) return; + + if (e.key === 'ArrowDown') { + e.preventDefault(); + setSelectedIndex((prev) => (prev + 1) % flatHits.length); + } else if (e.key === 'ArrowUp') { + e.preventDefault(); + setSelectedIndex((prev) => (prev - 1 + flatHits.length) % flatHits.length); + } else if (e.key === 'Enter') { + e.preventDefault(); + const selected = flatHits[selectedIndex]; + if (selected) { + executeSelection(selected); + } + } + }; + + window.addEventListener('keydown', handleKeyDown); + return () => window.removeEventListener('keydown', handleKeyDown); + }, [isOpen, flatHits, selectedIndex]); + + const executeSelection = (hit: SearchHit) => { + onClose(); + if (hit.type === 'document') { + onOpenDocument(hit.docId || hit.id, hit.blockId); + } else if (hit.type === 'thought') { + onOpenTask(hit.id); + } else if (hit.type === 'list_item') { + if (hit.listId) { + onOpenList(hit.listId); + } + } + }; + + if (!isOpen) return null; + + return ( +
+ {/* Search Modal Container */} +
e.stopPropagation()} + > + {/* Top Input Bar */} +
+ + setQuery(e.target.value)} + placeholder="Globale Suche in Notizen, Aufgaben und Listen…" + className="flex-1 bg-transparent border-0 outline-none text-main placeholder-muted text-base sm:text-sm focus:ring-0 p-0" + /> + {loading && } + {query && !loading && ( + + )} + +
+ + {/* Results Container */} +
+ {query.trim() === '' ? ( +
+

MindSift Globale Suche

+

Tippe ein Stichwort ein, um alle Inhalte in Sekundenschnelle zu durchsuchen.

+
+ ) : flatHits.length === 0 && !loading ? ( +
+

Keine Treffer gefunden

+

Keine Notizen, Aufgaben oder Listen-Einträge stimmen mit „{query}“ überein.

+
+ ) : ( + groupedHits.map((group) => { + const GroupIcon = group.icon; + return ( +
+
+ + {group.label} +
+ +
+ {group.items.map((item) => { + const overallIndex = flatHits.indexOf(item); + const isSelected = overallIndex === selectedIndex; + return ( +
executeSelection(item)} + onMouseEnter={() => setSelectedIndex(overallIndex)} + className={` + px-3 py-2.5 rounded-btn flex items-start gap-2.5 transition-colors cursor-pointer border + ${ + isSelected + ? 'bg-panel-elevated border-accent text-main' + : 'bg-canvas/50 border-transparent text-main hover:bg-panel-elevated' + } + `} + > +
+ {item.icon || (item.type === 'document' ? '📝' : item.type === 'thought' ? '✅' : '🛒')} +
+ +
+
+ + {item.title || 'Unbenannt'} + + {isSelected && ( + + Öffnen + + + )} +
+ + {item.snippet && ( +
+ +
+ )} +
+
+ ); + })} +
+
+ ); + }) + )} +
+ + {/* Footer Shortcut Bar (Desktop) */} +
+
+ + ↑{' '} + ↓ Navigieren + + + ↵ Auswählen + + + Esc Schließen + +
+ +
+ {flatHits.length} Treffer +
+
+
+
+ ); +}; diff --git a/frontend/src/features/capture/InstantCaptureBar.tsx b/frontend/src/features/capture/InstantCaptureBar.tsx index 5bf73ef..cffc170 100644 --- a/frontend/src/features/capture/InstantCaptureBar.tsx +++ b/frontend/src/features/capture/InstantCaptureBar.tsx @@ -103,7 +103,7 @@ export const InstantCaptureBar: React.FC = ({ el.tagName === 'TEXTAREA' || el.isContentEditable; - if (!isEditing && (e.key === 'c' || e.key === 'C' || e.key === '/')) { + if (!isEditing && (e.key === 'c' || e.key === 'C')) { e.preventDefault(); inputRef.current?.focus(); } else if (e.key === 'Escape' && document.activeElement === inputRef.current) { diff --git a/frontend/src/features/help/HelpView.tsx b/frontend/src/features/help/HelpView.tsx index 4e14b14..2ea0e3f 100644 --- a/frontend/src/features/help/HelpView.tsx +++ b/frontend/src/features/help/HelpView.tsx @@ -343,6 +343,42 @@ export const HelpView: React.FC = ({ onBack }) => { ), }, + { + id: 'workspace-search-cmdk', + category: 'workspace', + title: 'Globale Suche & Command Palette (Cmd+K)', + subtitle: 'FTS5-Volltextsuche in Notizen, Blöcken, Aufgaben und Listen', + icon: Command, + keywords: [ + 'suche', + 'search', + 'command', + 'palette', + 'cmdk', + 'find', + 'fts', + 'volltext', + 'tastatur', + ], + content: ( +
+

+ Drücke Cmd + K / Strg + K oder / (wenn kein Textfeld aktiv ist), um die globale Suche zu öffnen: +

+
    +
  • + Volltextsuche (FTS5): Durchsucht Notiz-Titel und Blöcke, Aufgaben und Listeneinträge blitzschnell mit Relevanz-Ranking (BM25) und Präfixsuche. +
    • +
  • + Sicherheit: Zeigt nur Inhalte, auf die du tatsächlich Zugriff hast (eigene sowie freigegebene Notizen, Aufgabenlisten und Listen). +
    • +
  • + Tastaturnavigation: Mit ↑ und ↓ blättern, mit Enter Treffer direkt öffnen (Notizen direkt am gefundenen Block). +
    • +
+
+ ), + }, // TRIAGE & QUICK DUMP { @@ -658,7 +694,8 @@ export const HelpView: React.FC = ({ onBack }) => { // Keyboard shortcuts table data const shortcuts = useMemo( () => [ - { key: 'C oder /', scope: 'Global', desc: 'Fokus sofort in die Schnellerfassungsleiste setzen' }, + { key: 'Cmd + K / Strg + K oder /', scope: 'Global', desc: 'Globale Volltextsuche (Command Palette) öffnen' }, + { key: 'C', scope: 'Global', desc: 'Fokus sofort in die Schnellerfassungsleiste setzen' }, { key: 'Enter', scope: 'Schnellerfassung', desc: 'Gedanken blitzschnell speichern' }, { key: 'Esc', scope: 'Schnellerfassung', desc: 'Eingabe leeren & Optionen schließen' }, { key: 'Enter', scope: 'Workspace Outliner', desc: 'Neuen Bullet-Point anlegen (oder leeren Block ausrücken)' }, diff --git a/frontend/src/features/lists/SharedListsView.tsx b/frontend/src/features/lists/SharedListsView.tsx index 372d47c..68d7e14 100644 --- a/frontend/src/features/lists/SharedListsView.tsx +++ b/frontend/src/features/lists/SharedListsView.tsx @@ -20,6 +20,7 @@ import { useMobileActions } from '../../context/MobileActionContext'; interface SharedListsViewProps { onRefreshGlobal: () => void; currentUser?: User | null; + initialListId?: string | null; } export function parseListItemInput(rawText: string, defaultQty?: string): { @@ -79,10 +80,16 @@ export function deduplicateItems(items: ListItem[]): ListItem[] { return result; } -export const SharedListsView: React.FC = ({ onRefreshGlobal, currentUser }) => { +export const SharedListsView: React.FC = ({ onRefreshGlobal, currentUser, initialListId }) => { const { setGroups, setPrimaryAction } = useMobileActions(); const [lists, setLists] = useState([]); - const [activeListId, setActiveListId] = useState(''); + const [activeListId, setActiveListId] = useState(initialListId || ''); + + useEffect(() => { + if (initialListId) { + setActiveListId(initialListId); + } + }, [initialListId]); const [newItemText, setNewItemText] = useState(''); const [newItemQty, setNewItemQty] = useState(''); @@ -128,7 +135,9 @@ export const SharedListsView: React.FC = ({ onRefreshGloba items: deduplicateItems(l.items || []), })); setLists(deduplicated); - if (deduplicated.length > 0 && (!activeListId || !deduplicated.some((l) => l.id === activeListId))) { + if (initialListId && deduplicated.some((l) => l.id === initialListId)) { + setActiveListId(initialListId); + } else if (deduplicated.length > 0 && (!activeListId || !deduplicated.some((l) => l.id === activeListId))) { setActiveListId(deduplicated[0].id); } } catch { diff --git a/frontend/src/features/workspace/DocumentEditor.tsx b/frontend/src/features/workspace/DocumentEditor.tsx index b88c4e8..19d97ae 100644 --- a/frontend/src/features/workspace/DocumentEditor.tsx +++ b/frontend/src/features/workspace/DocumentEditor.tsx @@ -44,63 +44,7 @@ export interface DocumentEditorProps { onSaveStatusChange?: (status: DocSaveStatus, errorMsg?: string) => void; } -interface EmojiItem { - emoji: string; - category: string; - keywords: string; -} - -const EMOJI_CATALOG: EmojiItem[] = [ - // Notizen & Dokumente - { emoji: '📝', category: 'Notizen', keywords: 'notiz schreiben memo text note' }, - { emoji: '📄', category: 'Notizen', keywords: 'dokument seite page doc' }, - { emoji: '📋', category: 'Notizen', keywords: 'clipboard klemmbrett liste' }, - { emoji: '📂', category: 'Notizen', keywords: 'ordner mappe folder datei' }, - { emoji: '📁', category: 'Notizen', keywords: 'ordner folder directory' }, - { emoji: '📌', category: 'Notizen', keywords: 'pin anheften bookmark wichtig' }, - { emoji: '📍', category: 'Notizen', keywords: 'standort ort pin location' }, - { emoji: '🏷️', category: 'Notizen', keywords: 'tag etikett label markierung' }, - { emoji: '📚', category: 'Notizen', keywords: 'buch bibliothek lesen studium' }, - { emoji: '📖', category: 'Notizen', keywords: 'buch open book wissen' }, - - // Ideen & Fokus - { emoji: '🧠', category: 'Ideen', keywords: 'gehirn brain denken wissen thought mind' }, - { emoji: '💡', category: 'Ideen', keywords: 'idee inspiration lampe glühbirne idea' }, - { emoji: '🎯', category: 'Ideen', keywords: 'ziel target fokus mission okr' }, - { emoji: '🚀', category: 'Ideen', keywords: 'rakete start launch projekt rocket' }, - { emoji: '⚡', category: 'Ideen', keywords: 'blitz energie schnell quick power' }, - { emoji: '🔥', category: 'Ideen', keywords: 'feuer flame priorität hot wichtig' }, - { emoji: '⭐', category: 'Ideen', keywords: 'stern favoriten star top' }, - { emoji: '✨', category: 'Ideen', keywords: 'funkeln magie neu neuigkeit sparkles' }, - { emoji: '🧩', category: 'Ideen', keywords: 'puzzle teil lösung problem' }, - { emoji: '🔬', category: 'Ideen', keywords: 'mikroskop forschung analyse test' }, - - // Tech & Dev - { emoji: '💻', category: 'Tech', keywords: 'laptop computer dev code programming' }, - { emoji: '🖥️', category: 'Tech', keywords: 'desktop monitor bildschirm workstation' }, - { emoji: '🛠️', category: 'Tech', keywords: 'werkzeug tools optionen settings einstellungen' }, - { emoji: '⚙️', category: 'Tech', keywords: 'zahnrad config settings system' }, - { emoji: '📊', category: 'Tech', keywords: 'diagramm chart daten statistik dashboard' }, - { emoji: '📈', category: 'Tech', keywords: 'wachstum trend kurve business' }, - { emoji: '🔒', category: 'Tech', keywords: 'schloss sicherheit geheim privat secure' }, - { emoji: '🔑', category: 'Tech', keywords: 'schlüssel key passwort access' }, - { emoji: '🌐', category: 'Tech', keywords: 'web internet network welt globus' }, - { emoji: '📦', category: 'Tech', keywords: 'paket box release lieferung package' }, - - // Alltag & Organisation - { emoji: '💬', category: 'Alltag', keywords: 'chat nachricht kommentar call sprechen' }, - { emoji: '✉️', category: 'Alltag', keywords: 'mail email brief post nachricht' }, - { emoji: '📅', category: 'Alltag', keywords: 'kalender datum termin plan event' }, - { emoji: '⏰', category: 'Alltag', keywords: 'wecker uhr zeit deadline alarm' }, - { emoji: '🛒', category: 'Alltag', keywords: 'warenkorb einkauf shopping liste' }, - { emoji: '☕', category: 'Alltag', keywords: 'kaffee pause bistro morning' }, - { emoji: '🏠', category: 'Alltag', keywords: 'haus heim home wohnung' }, - { emoji: '🏢', category: 'Alltag', keywords: 'büro firma arbeit office work' }, - { emoji: '✈️', category: 'Alltag', keywords: 'flugzeug reise urlaub trip travel' }, - { emoji: '🎨', category: 'Alltag', keywords: 'kunst farbe design creative' }, - { emoji: '🏆', category: 'Alltag', keywords: 'pokal erfolg win trophy award' }, - { emoji: '✅', category: 'Alltag', keywords: 'haken check done erledigt' }, -]; +import { EmojiPickerModal } from './EmojiPickerModal'; function ensureNonEmptyBlocks(docId: string, blocks?: DocumentBlock[]): DocumentBlock[] { if (!blocks || blocks.length === 0) { @@ -250,21 +194,12 @@ export const DocumentEditor: React.FC = ({ const [loading, setLoading] = useState(!initialDoc); const [error, setError] = useState(null); const [showEmojiPicker, setShowEmojiPicker] = useState(false); - const [emojiSearch, setEmojiSearch] = useState(''); const [zoomedBlockId, setZoomedBlockId] = useState(null); // Sync engine (operation log): stores every change locally and syncs it with the server const engineRef = useRef(null); const [engineState, setEngineState] = useState(null); - const filteredEmojis = useMemo(() => { - const q = emojiSearch.trim().toLowerCase(); - if (!q) return EMOJI_CATALOG; - return EMOJI_CATALOG.filter( - (item) => item.keywords.includes(q) || item.emoji.includes(q) || item.category.toLowerCase().includes(q) - ); - }, [emojiSearch]); - const titleInputRef = useRef(null); const outlinerTreeRef = useRef(null); @@ -1044,72 +979,11 @@ export const DocumentEditor: React.FC = ({ {doc?.icon || '📝'} {showEmojiPicker && canEdit && ( -
e.stopPropagation()} - > -
- - setEmojiSearch(e.target.value)} - placeholder="Icon suchen oder Emoji eingeben…" - className="input-field w-full pl-7 pr-2 py-1 text-xs" - /> -
- {doc?.icon && ( - - )} - {emojiSearch.trim() && ( - - )} -
- {filteredEmojis.map((item) => ( - - ))} - {filteredEmojis.length === 0 && ( -
- Kein passendes Standard-Icon -
- )} -
-
+ setShowEmojiPicker(false)} + /> )} diff --git a/frontend/src/features/workspace/EmojiPickerModal.tsx b/frontend/src/features/workspace/EmojiPickerModal.tsx new file mode 100644 index 0000000..9646fbc --- /dev/null +++ b/frontend/src/features/workspace/EmojiPickerModal.tsx @@ -0,0 +1,226 @@ +import React, { Suspense, useEffect, useRef, useState } from 'react'; +import { X, Trash2, Loader2, Clock } from 'lucide-react'; +import type { EmojiClickData } from 'emoji-picker-react'; +import { EmojiStyle, Theme, SuggestionMode } from 'emoji-picker-react'; + +// Lazy-load emoji-picker-react so the main bundle size stays small +const EmojiPicker = React.lazy(() => import('emoji-picker-react')); + +const RECENT_EMOJIS_STORAGE_KEY = 'mindsift_recent_emojis'; +const MAX_RECENT_EMOJIS = 10; + +function getStoredRecentEmojis(): string[] { + try { + const raw = localStorage.getItem(RECENT_EMOJIS_STORAGE_KEY); + if (!raw) return ['📝', '💡', '🚀', '⭐', '🔥', '🎯', '📚', '💻']; + const parsed = JSON.parse(raw); + if (Array.isArray(parsed) && parsed.length > 0) { + return parsed.slice(0, MAX_RECENT_EMOJIS); + } + } catch { + // fallback + } + return ['📝', '💡', '🚀', '⭐', '🔥', '🎯', '📚', '💻']; +} + +function saveRecentEmoji(emoji: string): void { + try { + const current = getStoredRecentEmojis(); + const updated = [emoji, ...current.filter((e) => e !== emoji)].slice(0, MAX_RECENT_EMOJIS); + localStorage.setItem(RECENT_EMOJIS_STORAGE_KEY, JSON.stringify(updated)); + } catch { + // ignore + } +} + +interface EmojiPickerModalProps { + currentIcon?: string; + onSelectEmoji: (emoji: string) => void; + onClose: () => void; +} + +export const EmojiPickerModal: React.FC = ({ + currentIcon, + onSelectEmoji, + onClose, +}) => { + const [recentEmojis, setRecentEmojis] = useState(getStoredRecentEmojis); + const [isDark, setIsDark] = useState(() => + typeof document !== 'undefined' + ? document.documentElement.classList.contains('dark') + : true + ); + + const containerRef = useRef(null); + + // Sync theme changes + useEffect(() => { + const observer = new MutationObserver(() => { + setIsDark(document.documentElement.classList.contains('dark')); + }); + observer.observe(document.documentElement, { + attributes: true, + attributeFilter: ['class', 'data-theme'], + }); + return () => observer.disconnect(); + }, []); + + // Close on Escape or click outside (desktop popover) + useEffect(() => { + const handleKeyDown = (e: KeyboardEvent) => { + if (e.key === 'Escape') { + e.preventDefault(); + onClose(); + } + }; + + const handleClickOutside = (e: MouseEvent) => { + if ( + containerRef.current && + !containerRef.current.contains(e.target as Node) + ) { + onClose(); + } + }; + + window.addEventListener('keydown', handleKeyDown); + document.addEventListener('mousedown', handleClickOutside); + return () => { + window.removeEventListener('keydown', handleKeyDown); + document.removeEventListener('mousedown', handleClickOutside); + }; + }, [onClose]); + + const handlePick = (emoji: string) => { + saveRecentEmoji(emoji); + setRecentEmojis(getStoredRecentEmojis()); + onSelectEmoji(emoji); + }; + + const handlePickerEmojiClick = (emojiData: EmojiClickData) => { + handlePick(emojiData.emoji); + }; + + return ( + <> + {/* Mobile Backdrop (< 640px) */} +