Skip to content

Add Skill & Plugin explorer to the left rail #55

@hachej

Description

@hachej

Problem

Boring UI loads agent skills (from .agents/skills, additional skill paths) and plugins (panels, commands, catalogs, surface resolvers) at startup, but the user has no visibility into what is actually loaded in the running workspace. To debug "why doesn't this skill trigger?" or "is my plugin registered?", you have to read the server log or grep source.

Proposal

Add a new left-rail entry — placement left-tab, surfaced in WorkbenchLeftPane — that opens a two-tab pane:

Tab 1: Skills

Lists every skill the agent currently has access to. For each skill:

  • Name
  • Source path (e.g. ~/project/.agents/skills/my-skill/SKILL.md)
  • Frontmatter description (one-liner)
  • "Trigger when…" excerpt
  • Click → opens the SKILL.md file in the surface pane (read-only viewer; reuses the existing file-viewer panel).

Data source: server endpoint GET /api/v1/skills that wraps pi's loadSkills() (already exported from @mariozechner/pi-coding-agent per dist/index.d.ts). Live-updated when the workspace registers new skills (e.g. plugin hot-reload).

Tab 2: Plugin Explorer

Lists every registered plugin and its outputs. Tree view:

  • <plugin-id>
    • Panels (id, title, placement)
    • Left tabs
    • Commands (id, label, keybinding if any)
    • Catalogs
    • Surface resolvers
    • Server tools (id, description)
    • Skills/prompts contributed via pi.skills/pi.prompts

Data source: the front already has a PanelRegistry (packages/workspace/src/front/registry/) — extend its snapshot to include plugin provenance. Server-side outputs need a new GET /api/v1/plugins route that introspects what was registered via defineServerPlugin/composePlugins.

Click a panel/command → opens it (via existing dispatchUiCommand). Click a tool → opens a docs viewer.

Wins

  • Onboarding: new users instantly see what the agent can do.
  • Debugging: "is my plugin loaded?" is one click away.
  • Discovery: surfaces the rich plugin contributions that are otherwise invisible.

Implementation notes

  • Add the entry as a left-tab plugin output in packages/workspace/src/plugins/ (new inspectorPlugin/ directory; mirror the shape of filesystemPlugin).
  • Icon: Sparkles (lucide) for the rail entry.
  • Search/filter input at the top of each tab (reuse the existing search pattern from WorkbenchLeftPane).
  • Empty states: "No skills loaded — drop SKILL.md files into .agents/skills" / "No plugins registered".
  • Keep it read-only initially. Future: enable/disable toggles for skills (mirroring pi config's package-resource toggle UI).

Open questions

  • Should this be on by default in the workspace shell, or opt-in via plugin import? Recommend default-on — discoverability matters more than payload size for a debug-class surface.
  • Live-sync when files change on disk? Out of scope for v1; require a workspace refresh.

Related

  • Skills loading: packages/workspace/src/app/server/createWorkspaceAgentServer.ts:100-129
  • Left tab registration: packages/workspace/src/front/chrome/workbench-left/WorkbenchLeftPane.tsx
  • Plugin output types: defineFrontPlugin / defineServerPlugin (packages/workspace/src/index.ts)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions