@devin-ai-integration[bot]agent3mo ago
'Toolkit detail page should be side panel' ([DASH-293](https://linear.app/composio/issue/DASH-293/toolkit-detail-page-should-be-side-panel))
User instruction: @devin follow the spec,
Replaces full-page navigation on toolkit card click with an animated side panel that slides in from the right, matching the existing Sessions page pattern (session-preview-panel.tsx).
Key changes:
ToolkitPreviewPanel component — Displays toolkit name/logo, metadata (tools count, triggers, version), auth scheme pills, a tools list tab (with search/pagination via useToolkitTools), and an info tab (description, categories, auth). Includes expand icon to navigate to the full detail page.ToolkitCard refactored — Now accepts an optional onClick prop. When provided, renders as a <button> instead of a <Link>. Card content extracted into a shared ToolkitCardContent component to avoid duplication.ToolkitsListing updated — Manages selectedSlug state. Clicking a card opens/toggles the panel. Panel animates in/out with framer-motion (AnimatePresence + motion.div, spring transition matching sessions).ToolkitPreviewExpandClickEvent, ToolkitPreviewTabChangeEvent.ToolkitCardClickEvent import resolves — toolkits-listing.tsx imports ToolkitCardClickEvent from _analytics.ts. Confirm this export exists in the full file (not visible in diff). If it doesn't exist, this will be a build error.w-[520px] with absolute positioning. On narrow viewports this may overflow or fully cover the grid. Compare with sessions page behavior to see if additional responsive handling is needed.ToolsList and useToolkitTools work correctly in panel context — The tools tab reuses the same hook and component from the full detail page. Confirm search, pagination, and infinite scroll work within the constrained panel height.PanelHeader vs inline header — The error state uses a separate PanelHeader function while the main render has an inline header. Both should render consistently (expand link + close button).Suggested manual test plan:
@composio/db package in the dev environment — relying on CI for validation.'Toolkit detail page should be side panel' ([DASH-293](https://linear.app/composio/issue/DASH-293/toolkit-detail-page-should-be-side-panel))
User instruction: @devin follow the spec,
I'll be helping with this pull request! Here's what you should know:
✅ I will automatically:
⚙️ Control Options:
When exploring toolkits, clicking should open a side panel instead of navigating to a new page.
Source: Loom feedback @ 12:52-13:25
Repo: composio_dashboard
Goal: Replace full-page navigation with side panel (matching Sessions page pattern).
Reference: Follow the Sessions page panel implementation:
/src/app/(project)/[org]/[project]/sessions/_components/session-preview-panel.tsxChanges:
ToolkitPreviewPanel component:
/src/app/(project)/[org]/[project]/toolkits/_components/toolkit-preview-panel.tsxSessionPreviewPanel structurerouter.push() with local state for selected toolkitToolkitPreviewPanel when toolkit is selectedRelated:
Ready for Devin
The latest updates on your projects. Learn more about Vercel for GitHub.
| Project | Deployment | Actions | Updated (UTC) |
|---|
| dashboard | Mar 13, 2026 4:09am |