Skip to content

WebUI: evolve into general-purpose AI workspace with virtual filesystem and artifact rendering #31

@marksverdhei

Description

@marksverdhei

Vision

Grow the llama-server WebUI from a chat UI into a general-purpose AI workspace for conversation, notes, and artifact management — without reshuffling the existing Svelte/chat layout or causing regressions in the router-mode flow.

The existing chat screen stays the primary entry point. New capabilities appear as progressive surfaces (right-hand artifact panel, sidebar nav entries for notes/files) rather than a redesign.

Subsystems (checkboxes)

  • Managed virtual filesystem. Browser-side (IndexedDB/OPFS) store with a minimal fs-like API (list, read, write, mkdir, rename, delete) plus optional sync to the server's LLAMA_CACHE / models dir. Expose via a files sidebar view.

  • Artifact extraction. Detect artifact-shaped content in assistant output (fenced code blocks with known languages, explicit <artifact> tags, tool-call outputs). Store artifacts as first-class entities in the virtual FS with {id, version, mime, title, sourceMessageId}.

  • In-browser artifact rendering. Sandboxed renderers per mime: HTML (iframe with CSP), SVG, Markdown, Mermaid, images, code (read-only with syntax highlight), plain text. Error-bound each renderer; never let artifact JS bleed into the host UI.

  • Artifact side panel. Collapsible right-hand panel showing the current artifact with tabs for Preview / Source / History. Opens automatically on new artifact, dismissible. Reuses existing panel primitives to stay consistent with the chat sidebar.

  • Notes mode. A second conversation-like surface for freeform notes linked to the filesystem. Notes are markdown files in the virtual FS; editing is the same editor used for artifact source. No separate datastore.

Non-goals (for this epic)

  • Cloud sync / multi-device replication
  • Rich collaborative editing (CRDT, presence)
  • Executable artifacts beyond sandboxed HTML/SVG (no JS runtime for Python, etc.)
  • Redesigning the chat layout

Design constraints

  • Svelte components and stores only; no new framework dependencies.
  • Keep the router-mode proxy flow intact — artifact features must work whether the backend is single-model or router.
  • Preserve the current bundle-size budget; prefer lazy-loading renderers.

Proposed order

  1. Artifact extraction + rendering (smallest visible slice)
  2. Artifact side panel
  3. Virtual filesystem
  4. Notes mode (builds on FS)

Each subsystem will get its own design spec and implementation plan before code lands.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions