highperfocused/multica
1
0
Fork 0
mirror of https://github.com/multica-ai/multica.git synced 2026-07-28 05:46:58 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(agents): pin capability/settings sub-nav while content scrolls (MUL-4426) (#5280)

Browse Source 
The agent detail page wrapped both the sidebar rail and the content pane
in one scroll container, so scrolling any Capabilities/Settings tab
dragged the Instructions/Skills/MCP rail out of view. Split scrolling on
md+ like settings-page.tsx: the outer container stops scrolling and each
pane scrolls itself. Below md the page still scrolls as one, and the
Overview/Work views keep whole-page scrolling.

Co-authored-by: Lambda <lambda@multica.ai>
Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
Jiayuan Zhang
2026-07-12 03:36:13 +08:00
committed by GitHub
parent 3a382d92b3
commit 8a05af0342
1 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
packages/views/agents/components/agent-overview-pane.tsx
View File

@@ -297,6 +297,7 @@ export function AgentOverviewPane({
const activeSecondaryTab = secondaryTabs.find(
(tab) => tab.id === effectiveView,
);
const isSecondaryLayout = secondaryTabs.length > 0 && activeSecondaryTab != null;
return (
<div className="flex min-h-0 flex-1 flex-col bg-background">
@@ -326,7 +327,15 @@ export function AgentOverviewPane({
</div>
</div>
<div className="min-h-0 flex-1 overflow-y-auto">
{/* Overview/Work scroll as one page. Sidebar views split scrolling on
md+ (nav rail pinned, content pane scrolls) like settings-page.tsx;
below md the rail is a horizontal strip and the page scrolls whole. */}
<div
className={cn(
"min-h-0 flex-1 overflow-y-auto",
isSecondaryLayout && "md:overflow-hidden",
)}
>
{effectiveView === "overview" && (
<div className="mx-auto max-w-[1440px] p-4 sm:p-6">
<div className="grid gap-6 xl:grid-cols-[minmax(0,1fr)_320px]">
@@ -347,8 +356,8 @@ export function AgentOverviewPane({
)}
{secondaryTabs.length > 0 && activeSecondaryTab && (
<div className="flex min-h-full flex-col md:flex-row">
<aside className="shrink-0 overflow-x-auto border-b border-surface-border bg-app-shell/70 p-2 md:w-52 md:overflow-x-visible md:border-b-0 md:border-r md:p-4">
<div className="flex min-h-full flex-col md:h-full md:flex-row">
<aside className="shrink-0 overflow-x-auto border-b border-surface-border bg-app-shell/70 p-2 md:w-52 md:overflow-y-auto md:border-b-0 md:border-r md:p-4">
<div
className="flex w-max min-w-full items-center gap-1 md:w-full md:flex-col md:items-stretch"
role="tablist"
@@ -378,7 +387,7 @@ export function AgentOverviewPane({
</div>
</aside>
<section className="min-w-0 flex-1">
<section className="min-w-0 flex-1 md:overflow-y-auto">
<div className="mx-auto w-full max-w-3xl p-4 sm:p-6 md:p-8">
<header>
<h2 className="text-base font-medium text-balance">