[PR #5649] feat(plugin): add sidebar sections API for TUI customization #11513

Closed
opened 2026-02-16 18:16:21 -05:00 by yindo · 0 comments
Owner

Original Pull Request: https://github.com/anomalyco/opencode/pull/5649

State: closed
Merged: No


Summary

  • Add a new plugin hook tui.sidebar.sections that allows plugins to inject custom sections into the TUI sidebar
  • Enable plugins to display status information, metrics, and interactive links directly in the sidebar

Changes

  • Plugin SDK (packages/plugin/src/index.ts):

    • Add SidebarSection and SidebarItem types
    • Add tui.sidebar.sections hook to the Hooks interface
  • Plugin Runtime (packages/opencode/src/plugin/index.ts):

    • Add getSidebarSections() function to collect sections from all loaded plugins
    • Sort sections by priority (lower = higher in sidebar)
  • Server (packages/opencode/src/server/server.ts):

    • Add /sidebar/sections API endpoint
  • SDK (packages/sdk/js/src/v2/gen/):

    • Regenerated with new sidebar.sections() method
  • TUI (packages/opencode/src/cli/cmd/tui/):

    • Update sync store to fetch sidebar sections on bootstrap
    • Render plugin sections in sidebar with:
      • Text items (label + value)
      • Status items (colored indicator + label + value)
      • Link items (label + command)
      • Collapsible sections with expand/collapse state

Example Plugin Usage

const myPlugin: Plugin = async (input) => {
  return {
    "tui.sidebar.sections": async () => [
      {
        id: "my-plugin",
        title: "My Plugin",
        priority: 50,
        collapsible: true,
        defaultExpanded: true,
        items: [
          { type: "status", label: "Status", value: "Active", status: "success" },
          { type: "text", label: "Count", value: "42" },
          { type: "link", label: "Run command", command: "/my-command" },
        ],
      },
    ],
  }
}

Testing

  • Type checks pass
  • Created a test plugin (gitignored) to validate the API
**Original Pull Request:** https://github.com/anomalyco/opencode/pull/5649 **State:** closed **Merged:** No --- ## Summary - Add a new plugin hook `tui.sidebar.sections` that allows plugins to inject custom sections into the TUI sidebar - Enable plugins to display status information, metrics, and interactive links directly in the sidebar ## Changes - **Plugin SDK** (`packages/plugin/src/index.ts`): - Add `SidebarSection` and `SidebarItem` types - Add `tui.sidebar.sections` hook to the `Hooks` interface - **Plugin Runtime** (`packages/opencode/src/plugin/index.ts`): - Add `getSidebarSections()` function to collect sections from all loaded plugins - Sort sections by priority (lower = higher in sidebar) - **Server** (`packages/opencode/src/server/server.ts`): - Add `/sidebar/sections` API endpoint - **SDK** (`packages/sdk/js/src/v2/gen/`): - Regenerated with new `sidebar.sections()` method - **TUI** (`packages/opencode/src/cli/cmd/tui/`): - Update sync store to fetch sidebar sections on bootstrap - Render plugin sections in sidebar with: - Text items (label + value) - Status items (colored indicator + label + value) - Link items (label + command) - Collapsible sections with expand/collapse state ## Example Plugin Usage ```typescript const myPlugin: Plugin = async (input) => { return { "tui.sidebar.sections": async () => [ { id: "my-plugin", title: "My Plugin", priority: 50, collapsible: true, defaultExpanded: true, items: [ { type: "status", label: "Status", value: "Active", status: "success" }, { type: "text", label: "Count", value: "42" }, { type: "link", label: "Run command", command: "/my-command" }, ], }, ], } } ``` ## Testing - Type checks pass - Created a test plugin (gitignored) to validate the API
yindo added the pull-request label 2026-02-16 18:16:21 -05:00
yindo closed this issue 2026-02-16 18:16:21 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: anomalyco/opencode#11513