Files
vessel/TODO.md
vikingowl 6013191376 feat: add system prompts, custom tools, theme toggle, and tool display
Major features implemented:
- System prompt management (/prompts route)
  - Create, edit, delete prompt templates
  - Set default and active prompts
  - Prompts stored in IndexedDB (v3 migration)
  - Injected into chat as system messages

- Custom tool creation (ToolEditor)
  - Create tools with JavaScript or HTTP implementations
  - Execute user-defined tools during chat
  - Tool call display in messages (ToolCallDisplay.svelte)

- Theme toggle
  - Light/dark mode switch in Settings
  - Theme persistence to localStorage
  - Flash prevention on page load

- Bug fixes
  - Disable USE_FUNCTION_MODEL (was routing all to functiongemma)
  - Add ready() promise to prompts store for async loading
  - Fix ToolEditor syntax error (extra script tag)

Files created:
- src/lib/storage/prompts.ts
- src/lib/stores/prompts.svelte.ts
- src/routes/prompts/+page.svelte
- src/lib/components/tools/ToolEditor.svelte
- src/lib/components/chat/ToolCallDisplay.svelte

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-31 19:31:15 +01:00

186 lines
5.8 KiB
Markdown

# Ollama Web UI - TODO
Status legend: ✅ Complete | ⚠️ Partial | ❌ Missing
---
## Phase 1: Project Foundation & Basic Chat ✅
All core features implemented:
- [x] SvelteKit + Tailwind + Skeleton UI setup
- [x] Layout shell (Sidenav, TopNav)
- [x] Chat with streaming (NDJSON parsing)
- [x] IndexedDB storage (Dexie.js)
- [x] Model selection
- [x] Svelte 5 runes state management
- [x] Chat branching (message tree)
---
## Phase 2: Advanced Chat Features ⚠️
### Implemented
- [x] Branch navigator UI (`< 1/3 >`)
- [x] Message actions (edit, copy, regenerate, delete)
- [x] Vision model support (image upload/paste)
- [x] Code syntax highlighting (Shiki)
- [x] Export as Markdown/JSON
### Missing
- [ ] **Share link** - requires backend endpoint for public share URLs
- [ ] **Inline edit** - currently creates new branch, no inline edit UI
---
## Phase 3: Backend & Sync ⚠️
### Implemented
- [x] Go backend structure (Gin + SQLite)
- [x] SQLite schema (chats, messages, attachments)
- [x] REST API endpoints (CRUD for chats)
- [x] Sync endpoints (`/api/v1/sync/push`, `/api/v1/sync/pull`)
- [x] Frontend sync manager (`sync-manager.svelte.ts`)
- [x] `markForSync()` calls in storage layer
- [x] **Automatic sync trigger** - `syncManager.initialize()` in `+layout.svelte`
### Missing
- [ ] **Conflict resolution UI** - for sync conflicts between devices
- [ ] **Offline indicator** - show when backend unreachable
- [ ] **Messages sync in pull** - `PullChangesHandler` returns chats but not messages
---
## Phase 4: Tool System ✅
### Implemented
- [x] Tool calling support (functiongemma middleware)
- [x] Built-in tools: `get_current_time`, `calculate`, `fetch_url`
- [x] Tool management UI (view, enable/disable)
- [x] URL proxy in backend (CORS bypass)
- [x] **ToolEditor component** - create/edit custom tools with JS/HTTP implementation
- [x] **Custom tool execution** - `executeJavaScriptTool()` and `executeHttpTool()` in executor.ts
- [x] **Tool call display component** - `ToolCallDisplay.svelte` shows tool calls in messages
- [x] **System prompt management**
- [x] `/prompts` route with full CRUD
- [x] `promptsState` store with IndexedDB persistence
- [x] Default prompt selection
- [x] Active prompt for session
- [ ] Prompt templates with variables (not implemented)
- [ ] Per-conversation system prompt override (not implemented)
- [ ] Quick-switch in TopNav (not implemented)
---
## Phase 5: Memory System ⚠️
### Implemented
- [x] Token estimation (`tokenizer.ts`)
- [x] Model context limits (`model-limits.ts`)
- [x] Context usage bar (`ContextUsageBar.svelte`) - displayed in ChatWindow
- [x] Summarizer utility (`summarizer.ts`)
- [x] Summary banner component (`SummaryBanner.svelte`)
- [x] Knowledge base UI (`/knowledge` route)
- [x] Document chunking (`chunker.ts`)
- [x] Embeddings via Ollama (`embeddings.ts`)
- [x] Vector store with similarity search (`vector-store.ts`)
- [x] **RAG integration in chat** - auto-injects relevant chunks as system message
- Wired in both `ChatWindow.svelte` and `+page.svelte`
- Combines with user system prompts when both are active
### Missing
- [ ] **Auto-truncate old messages** - when approaching context limit
- [ ] **Manual "summarize and continue"** - button to trigger summarization
- [ ] **PDF support** - currently only text files (pdf.js integration)
- [ ] **Summary storage** - persist summaries to IndexedDB
---
## Phase 6: Code Execution & Preview ⚠️
### Implemented
- [x] JavaScript executor (browser `Function`)
- [x] Python executor (Pyodide)
- [x] CodeBlock with run button
- [x] HTML preview (`HtmlPreview.svelte`)
- [x] Execution output display
### Missing
- [ ] **WebContainer integration** - full Node.js runtime in browser
- [ ] `webcontainer.ts` wrapper
- [ ] npm package installation
- [ ] Filesystem operations
- [ ] **Terminal component** - xterm.js for output streaming
- `Terminal.svelte`
- [ ] **FileTree component** - virtual filesystem viewer
- `FileTree.svelte`
- [ ] **React/JSX preview** - live render with Vite bundling
- `ReactPreview.svelte`
- [ ] **TypeScript execution** - transpilation before running
- [ ] **Matplotlib inline display** - capture matplotlib figures in Python
- [ ] **Line numbers toggle** in CodeBlock
---
## Phase 7: Polish & UI ✅
### Implemented
- [x] Dark theme (default)
- [x] Keyboard shortcuts (Cmd/Ctrl+K, N, B)
- [x] Loading skeletons
- [x] Error boundaries
- [x] Toast notifications
- [x] **Light/dark theme toggle** - in Settings modal
- [x] **Theme persistence** - saves to localStorage, prevents flash on load
### Missing
- [ ] **Mobile responsive polish** - sidenav drawer, touch gestures
- [ ] **Keyboard shortcuts help** - modal showing all shortcuts (partial in settings)
---
## Future Roadmap (Not Started)
From the original plan, these are stretch goals:
- [ ] Monaco IDE integration - full code editor
- [ ] Multi-file project support - workspace with Vite bundling
- [ ] Collaboration / real-time sync - WebSocket-based
- [ ] Plugin system - custom integrations
- [ ] Voice input/output - speech-to-text, TTS
- [ ] Image generation - if Ollama adds support
---
## Priority Order
### High Priority (Core Functionality) ✅ DONE
1. ~~RAG integration in chat~~
2. ~~Automatic sync trigger~~
3. ~~Custom tool creation (ToolEditor)~~
### Medium Priority (User Experience)
4. ~~System prompt management~~
5. ~~Light/dark theme toggle~~
6. WebContainer integration
7. Terminal component
### Lower Priority (Nice to Have)
8. Share link generation
9. PDF document support
10. Conflict resolution UI
11. Monaco editor integration
---
## Quick Wins ✅ DONE
Small tasks that were completed:
- [x] Wire `syncManager.initialize()` in `+layout.svelte`
- [x] Add theme toggle button to settings
- [x] Show context usage bar in ChatWindow
- [x] Add tool call display in message content
Still pending:
- [ ] Add `pdf.js` for PDF uploads in knowledge base