diff --git a/desktop/src/features/channels/ui/ChannelPane.tsx b/desktop/src/features/channels/ui/ChannelPane.tsx index 8a4e4a92b1..95dffd527f 100644 --- a/desktop/src/features/channels/ui/ChannelPane.tsx +++ b/desktop/src/features/channels/ui/ChannelPane.tsx @@ -31,6 +31,7 @@ import { ChannelManagementAuxiliaryPanel } from "@/features/channels/ui/ChannelM import { IdleAuxiliaryPanel } from "@/features/channels/ui/IdleAuxiliaryPanel"; import { MarkdownDocAuxiliaryPanel } from "@/features/channels/ui/MarkdownDocAuxiliaryPanel"; import { RightAuxiliaryPane } from "@/features/channels/ui/RightAuxiliaryPane"; +import { createChannelPaneAuxiliaryLayout } from "@/features/channels/ui/channelPaneAuxiliaryLayout"; import { ThreadPanelSurface, useThreadPanelSurface, @@ -51,11 +52,7 @@ import { WelcomeComposerGuidanceLayer, } from "@/features/channels/ui/WelcomeComposerBanner"; import { useWelcomeComposerBanner } from "@/features/channels/ui/useWelcomeComposerBanner"; -import { - mentionsKnownAgent, - shouldPrioritizeIdleAuxiliary, - shouldUseFocusIdleDrawer, -} from "@/features/channels/ui/ChannelPane.helpers"; +import { mentionsKnownAgent } from "@/features/channels/ui/ChannelPane.helpers"; import { HuddleStartingView, HuddleTranscriptIntro } from "@/features/huddle"; import { ChannelGlyph } from "@/features/channels/ui/ChannelGlyph"; import { useSearchHighlightProps } from "@/features/channels/ui/useSearchHighlightProps"; @@ -425,12 +422,7 @@ export const ChannelPane = React.memo(function ChannelPane({ threadHeadMessage, ]); const isOverlay = useIsThreadPanelOverlay(); - const useSplitAuxiliaryPane = !isSinglePanelView && !isOverlay; const threadViewMode = useThreadViewMode(); - const hasThreadSurface = - Boolean(threadHeadMessage) || shouldShowThreadSkeleton; - const useFocusThreadDrawer = - threadViewMode === "focus" && useSplitAuxiliaryPane && hasThreadSurface; const selectedAgent = React.useMemo( () => agentSessionSelection.resolveSelectedAgentSession({ @@ -441,28 +433,29 @@ export const ChannelPane = React.memo(function ChannelPane({ }), [agentSessionAgents, openAgentSessionPubkey, profilePanelPubkey, profiles], ); - const hasIdleAuxiliary = - Boolean(idleAuxiliaryPanel) && Boolean(onCloseIdleAuxiliaryPanel); - const priorityIdleAuxiliary = shouldPrioritizeIdleAuxiliary( - idleAuxiliaryOverridesThread, - hasIdleAuxiliary, - ); - const overlayIdleAuxiliaryOverThread = - priorityIdleAuxiliary && hasThreadSurface && !isOverlay; - const replaceThreadWithIdleAuxiliary = - priorityIdleAuxiliary && hasThreadSurface && isOverlay; - const useFocusIdleDrawer = shouldUseFocusIdleDrawer({ + const { + hasSplitAuxiliaryPane, + openMarkdownDoc, + priorityIdleAuxiliary, + replaceThreadWithIdleAuxiliary, + showIdleAuxiliaryOverThread, + useFocusIdleDrawer, + useFocusThreadDrawer, + useSplitAuxiliaryPane, + } = createChannelPaneAuxiliaryLayout({ channelManagementOpen, hasAgentSession: Boolean(activeChannel && selectedAgent), hasIdleAuxiliaryPanel: Boolean(idleAuxiliaryPanel), hasIdlePanelCloseHandler: Boolean(onCloseIdleAuxiliaryPanel), hasProfilePanel: Boolean(profilePanelPubkey), - hasThreadSurface, - overrideThread: overlayIdleAuxiliaryOverThread, - useSplitAuxiliaryPane, + hasThreadSurface: Boolean(threadHeadMessage) || shouldShowThreadSkeleton, + idleAuxiliaryOverridesThread, + isOverlay, + isSinglePanelView, + markdownDocName, + markdownDocUrl, + threadViewMode, }); - const showIdleAuxiliaryOverThread = - overlayIdleAuxiliaryOverThread && useFocusIdleDrawer; const { channelIsCovered, markExitComplete } = useFocusDrawerPresence( useFocusThreadDrawer || useFocusIdleDrawer, priorityIdleAuxiliary @@ -499,17 +492,6 @@ export const ChannelPane = React.memo(function ChannelPane({ threadMessages: threadMessages.map((entry) => entry.message), useFocusThreadDrawer, }); - const openMarkdownDoc = - markdownDocUrl && markdownDocName - ? { filename: markdownDocName, url: markdownDocUrl } - : null; - const hasSplitAuxiliaryPane = - useSplitAuxiliaryPane && - (channelManagementOpen || - Boolean(threadHeadMessage) || - shouldShowThreadSkeleton || - Boolean(activeChannel && selectedAgent) || - Boolean(profilePanelPubkey)); const wrapAux = ( panel: React.ReactNode, testId: string, @@ -803,8 +785,6 @@ export const ChannelPane = React.memo(function ChannelPane({ } showTopBorder={false} /> - {/* The reserved bottom rail keeps accessory fades from moving - the conversation while content remains responsive. */} ) : null} - {/* Serialize replacements so focus drawers keep one travel direction. */} {channelManagementOpen && activeChannel ? (