Problem
There is no web-based way to explore, search, and delete memories. The TUI (engram tui) exists but requires a terminal and isn't accessible for all users. A browser-based UI would complement the TUI and lower the barrier to inspecting memory state.
Proposed Approach
A static SPA embedded in the Go binary via go:embed, served from engram serve at /ui/. Zero external dependencies at runtime.
Stack
- Vanilla JS — no framework, no build step, no
node_modules
- Tailwind CSS via CDN — with the Engram Elephant color palette from
styles.go
- Hash-based routing —
#/memories, #/memories/:id, #/search, etc.
What it does (MVP scope)
- Dashboard — stats cards (sessions, observations, prompts, projects)
- Memory list — browse recent observations with type badges, project, date
- Memory detail — full content view with metadata
- Search — FTS5 full-text search with debounce, type/project filters
- Session list + detail — browse sessions and their observations
- Timeline — visual before/focus/after view
- Delete — soft-delete with confirmation modal (hard-delete option)
- Toast notifications — success/error feedback
What it does NOT include
- Editing or creating memories (agents create, UI reads)
- Authentication (same localhost-only model as current server)
- Build step or JS framework
- WebSocket / live updates
Backend changes (minimal)
- New
internal/server/embed.go with //go:embed webui/*
- One new route in
server.go: GET /ui/ serving the embedded SPA
- Zero new API endpoints — the existing HTTP API covers everything
- Optional
engram ui CLI command to open the browser
Design
- Matches the Engram Elephant palette from
internal/tui/styles.go (dark theme: #191724 base, #c4a7e7 lavender accent, #9ccfd8 green, #f6c177 peach, etc.)
- Responsive layout (sidebar on desktop, hamburger on mobile)
- Same screens as the TUI: Dashboard, Memories, Search, Sessions, Timeline
Risks / Tradeoffs
| Risk |
Mitigation |
| Tailwind CDN needs internet on first load |
Fallback CSS with basic layout + colors in styles.css |
| Binary size increase |
~50-80KB — negligible |
| Maintenance of vanilla JS long-term |
Perfect for MVP; can migrate to framework if it grows |
Affected Areas
internal/server/ — embed + route
internal/server/webui/ — new directory (HTML, JS, CSS)
cmd/engram/main.go — optional engram ui command
README.md, DOCS.md — documentation
Problem
There is no web-based way to explore, search, and delete memories. The TUI (
engram tui) exists but requires a terminal and isn't accessible for all users. A browser-based UI would complement the TUI and lower the barrier to inspecting memory state.Proposed Approach
A static SPA embedded in the Go binary via
go:embed, served fromengram serveat/ui/. Zero external dependencies at runtime.Stack
node_modulesstyles.go#/memories,#/memories/:id,#/search, etc.What it does (MVP scope)
What it does NOT include
Backend changes (minimal)
internal/server/embed.gowith//go:embed webui/*server.go:GET /ui/serving the embedded SPAengram uiCLI command to open the browserDesign
internal/tui/styles.go(dark theme:#191724base,#c4a7e7lavender accent,#9ccfd8green,#f6c177peach, etc.)Risks / Tradeoffs
styles.cssAffected Areas
internal/server/— embed + routeinternal/server/webui/— new directory (HTML, JS, CSS)cmd/engram/main.go— optionalengram uicommandREADME.md,DOCS.md— documentation