Skip to content

feat: add MCP apps sidebar to task threads#2220

Draft
fercgomes wants to merge 1 commit into
mainfrom
posthog-code/mcp-apps-sidebar
Draft

feat: add MCP apps sidebar to task threads#2220
fercgomes wants to merge 1 commit into
mainfrom
posthog-code/mcp-apps-sidebar

Conversation

@fercgomes
Copy link
Copy Markdown
Contributor

Summary

  • Adds a collapsible right-side sidebar inside the task conversation view that lists every MCP-app (UI-rendering) tool call in the thread.
  • Clicking an entry scrolls the chat to that exact item via the existing VirtualizedList.scrollToIndex mechanism (same as conversation search).
  • A toggle button lives in the task header next to ExternalAppsOpener.
  • A single global subscription to mcpApps.onDiscoveryComplete maintains a Set of tool keys with registered UI, so the sidebar filters to true "apps" without firing N hasUiForTool queries.

Files

New

  • mcp-apps/stores/mcpUiToolsStore.ts — runtime registry of MCP tool keys with UI
  • mcp-apps/hooks/useMcpUiToolsSubscription.ts — single global subscription that populates the registry
  • sessions/stores/mcpAppsSidebarStore.ts — persisted open/width via createSidebarStore
  • sessions/components/McpAppsSidebar.tsx — the panel with resize handle and clickable rows
  • task-detail/components/McpAppsToggleButton.tsx — header icon button

Modified

  • App.tsx — mounts the subscription once
  • ConversationView.tsx — single pass derives both mcpAppIndices (for keepMounted) and mcpEntries; root wrapped in a Flex to host the sidebar
  • TaskDetail.tsx — toggle button next to ExternalAppsOpener in the header

Test plan

  • pnpm --filter code typecheck passes
  • pnpm dev — open a task, generate a couple of PostHog MCP apps (insights / dashboard)
  • Click the SquaresFour icon in the task header → sidebar opens to 260px on the right
  • Sidebar lists only UI-rendering MCP calls; non-UI MCP tools are absent
  • Scroll the chat up; click an entry → conversation scrolls to that item centred, iframe state preserved
  • Drag the resize handle; reload the app → width persisted
  • Close the sidebar; reload → closed state persisted
  • Empty thread → sidebar shows empty state

Add a collapsible right-side sidebar in the task conversation view that
lists every MCP-app (UI-rendering) tool call in the thread. Clicking an
entry scrolls the chat to that exact item using the existing
VirtualizedList.scrollToIndex mechanism. A toggle button lives in the
task header next to ExternalAppsOpener.

A single global tRPC subscription to mcpApps.onDiscoveryComplete keeps a
Set of tool keys with registered UI, so the sidebar can filter to true
"apps" without firing N hasUiForTool queries.

Generated-By: PostHog Code
Task-Id: 4204eb27-ab56-4c84-b2c2-f832b4a34f06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant