DSH Tauri Panel

Understand the desktop sidebar shell, panel action slot, and stable panel content protocol.

dsh-tauri-panel is the shared entry point for desktop UI extensions. It provides one sidebar layout and lets other plugins add panels without copying the sidebar implementation.

Sidebar structure

The sidebar preserves official sidebar.workspaces, sidebar.footer.action, and sidebar.settings slots and adds:

• the new-session action;
• the sidebar.panel.action list slot for consistent third-party entries;
• shared wide/compact state and active styling.

panel.protocol

Interface	Purpose
ActionItem	Creates a sidebar item with consistent styling, collapse behavior, and active state
renderPanelContent(spec)	Replaces the official conversation area with extension content
closePanelContent()	Closes extension content and restores the official conversation view

Extensions provide only their icon, label, identifier, and content. They do not need to depend on generated CSS classes or copy the official sidebar.

Minimal example

The following client plugin registers a Projects entry in sidebar.panel.action. Clicking it replaces the conversation area with custom content:

import type { ReactElement } from 'react'
import type { PanelProtocol } from 'dsh-tauri-panel/client'

const PANEL_SLOT = 'sidebar.panel.action'
const PANEL_SERVICE = 'panel.protocol'

function ProjectPanel(): ReactElement {
  return <div>Project panel content</div>
}

export function apply(ctx): void {
  ctx.slots.inject(PANEL_SLOT, () => {
    const panel = ctx.reflect.get(PANEL_SERVICE) as PanelProtocol | undefined
    if (panel === undefined)
      return () => {}

    const { ActionItem, renderPanelContent } = panel

    function renderProjectPanel(): void {
      renderPanelContent({
        id: 'project-panel',
        render: ProjectPanel,
      })
    }

    function Action(): ReactElement {
      return (
        <ActionItem id="project-panel" onClick={renderProjectPanel} icon={<ProjectIcon />}>
          Projects
        </ActionItem>
      )
    }

    return ctx.slots.register(
      {
        name: PANEL_SLOT,
        id: 'project-panel-action',
        registrant: 'my-plugin',
        inject: () => ({}),
      },
      Action,
    )
  })
}

Return to a conversation

When an action inside the panel needs to open a conversation, close the extension content first:

panel.closePanelContent()
sessions.open(sessionId)

A production plugin should safely handle a missing slot or service and return the matching disposer when it is unloaded. See dsh-tauri-panel-extension for a complete implementation.

Current consumer

dsh-tauri-panel-extension is a complete consumer. It adds the Extensions entry through the protocol and renders Skills/MCP management content.

View source