@agent-native/dispatch 0.22.0 → 0.23.0

package/dist/components/layout/Layout.js

@@ -417,7 +417,7 @@ function DispatchChatsSection({ onNavigate, showNewChat = false, prelude, chatFi
         if (threadId)
             openThread(threadId, { isNew: true });
     }
-    return (_jsxs("div", { className: cn("ms-4 min-w-0 space-y-0.5", showNewChat && "dispatch-chat-first-chats"), children: [showNewChat && chatFirstNavigation ? (_jsx("nav", { className: "space-y-0.5 px-2 py-2", children: _jsx(ChatFirstPrimaryNavigation, { copy: chatFirstCopy, onNewChat: () => void handleNewChat(), onOpenIntegrations: chatFirstNavigation.onOpenIntegrations, onOpenScheduled: chatFirstNavigation.onOpenScheduled, onSearch: openCommandMenu }) })) : null, prelude, !chatFirstMode ? (_jsx("div", { className: "flex justify-end px-2 pt-0.5", children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "data-dispatch-chat-source-toggle": true, "aria-pressed": includeExternal, "aria-label": includeExternal
+    return (_jsxs("div", { className: cn("min-w-0 space-y-0.5", showNewChat && "dispatch-chat-first-chats"), children: [showNewChat && chatFirstNavigation ? (_jsx("nav", { className: "space-y-0.5 px-2 py-2", children: _jsx(ChatFirstPrimaryNavigation, { copy: chatFirstCopy, onNewChat: () => void handleNewChat(), onOpenIntegrations: chatFirstNavigation.onOpenIntegrations, onOpenScheduled: chatFirstNavigation.onOpenScheduled, onSearch: openCommandMenu }) })) : null, prelude, !chatFirstMode ? (_jsx("div", { className: "flex justify-end px-2 pt-0.5", children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "data-dispatch-chat-source-toggle": true, "aria-pressed": includeExternal, "aria-label": includeExternal
                                     ? t("dispatch.sidebar.showLocalChats", {
                                         defaultValue: "Show local chats",
                                     })
@@ -432,7 +432,7 @@ function DispatchChatsSection({ onNavigate, showNewChat = false, prelude, chatFi
                                 }) })] }) })) : null, !chatFirstMode &&
                 chatsLoading &&
                 visibleThreads.length === 0 &&
-                Array.from({ length: 3 }).map((_, index) => (_jsxs("div", { className: "flex items-center gap-2 px-3 py-1", children: [_jsx(Skeleton, { className: "size-3.5 shrink-0 rounded-sm" }), _jsx(Skeleton, { className: "h-3 w-3/4 rounded" })] }, `chat-skeleton-${index}`))), chatFirstMode ? (_jsx(ChatFirstChatHistory, { items: chatItems, activeId: displayedActiveThreadId, loading: chatsLoading && visibleThreads.length === 0, loadingLabel: _jsx("div", { className: "space-y-1 px-2 py-1", children: [0, 1, 2].map((index) => (_jsxs("div", { className: "flex items-center gap-2 px-1 py-1", children: [_jsx(Skeleton, { className: "size-3.5 shrink-0 rounded-sm" }), _jsx(Skeleton, { className: "h-3 w-3/4 rounded" })] }, index))) }), label: t("dispatch.sidebar.chats", { defaultValue: "Chats" }), onSelect: (threadId) => openThread(threadId), renameMaxLength: 160, onRename: (threadId, title) => void renameThread(threadId, title), labels: {
+                Array.from({ length: 3 }).map((_, index) => (_jsxs("div", { className: "flex items-center gap-2 px-3 py-1", children: [_jsx(Skeleton, { className: "size-3.5 shrink-0 rounded-sm" }), _jsx(Skeleton, { className: "h-3 w-3/4 rounded" })] }, `chat-skeleton-${index}`))), chatFirstMode && (chatsLoading || visibleThreads.length > 0) ? (_jsx(ChatFirstChatHistory, { items: chatItems, activeId: displayedActiveThreadId, loading: chatsLoading && visibleThreads.length === 0, loadingLabel: _jsx("div", { className: "space-y-1 px-2 py-1", children: [0, 1, 2].map((index) => (_jsxs("div", { className: "flex items-center gap-2 px-1 py-1", children: [_jsx(Skeleton, { className: "size-3.5 shrink-0 rounded-sm" }), _jsx(Skeleton, { className: "h-3 w-3/4 rounded" })] }, index))) }), label: t("dispatch.sidebar.chats", { defaultValue: "Chats" }), onSelect: (threadId) => openThread(threadId), renameMaxLength: 160, onRename: (threadId, title) => void renameThread(threadId, title), labels: {
                     options: (item) => t("dispatch.sidebar.chatOptions", {
                         title: item.titleText ?? "",
                     }),
@@ -512,7 +512,10 @@ export function NavContent({ onNavigate, extensions, chatFirstMode = false, chat
     const chatFirstAppsRail = (_jsx(ChatFirstAppsRail, { apps: chatFirstApps, activeAppId: chatFirstActiveAppId, collapsed: collapsed, loading: chatFirstAppsLoading, error: chatFirstAppsError, layout: chatFirstAppLayout, onLayoutChange: onChatFirstAppLayoutChange, onRetry: onChatFirstAppsRetry, onOpenApp: (app) => {
             onChatFirstAppOpen?.(app);
             onNavigate?.();
-        }, createAppTrigger: chatFirstCreateAppTrigger, renderIcon: (app) => (_jsx(AppIcon, { id: app.id, name: app.name, size: "sm", className: "size-5 rounded-md" })), copy: chatFirstCopy }));
+        }, onOpenAllApps: () => {
+            navigate(dispatchNavLinkTarget("/apps"));
+            onNavigate?.();
+        }, createAppTrigger: chatFirstCreateAppTrigger, renderIcon: (app) => (_jsx(AppIcon, { id: app.id, name: app.name, size: "sm", monochrome: true, className: "size-5 rounded-md" })), copy: chatFirstCopy }));
     const renderNavItem = (item) => {
         const Icon = item.icon;
         const itemMatchesLocalPath = navItemMatchesPath(item, localPathname);
@@ -549,6 +552,9 @@ export function NavContent({ onNavigate, extensions, chatFirstMode = false, chat
                         ? "bg-sidebar-accent font-medium text-sidebar-accent-foreground"
                         : "text-sidebar-foreground/70 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"), children: [Icon ? (_jsx(Icon, { size: 16, className: "shrink-0" })) : (_jsx("span", { className: "h-4 w-4 shrink-0", "aria-hidden": "true" })), _jsx("span", { className: "truncate", children: label })] })), !collapsed && item.id === "chat" && itemMatchesLocalPath ? (_jsx(DispatchChatsSection, { onNavigate: onNavigate, chatFirstMode: chatFirstMode, chatFirstEmbedded: chatFirstEmbedded })) : null] }, item.id));
     };
+    const bottomNavigation = (_jsx("nav", { className: cn("py-1", collapsed ? "px-1.5" : "px-2"), children: _jsx("ul", { className: cn(collapsed ? "flex flex-col items-center gap-1" : "space-y-0.5"), children: BOTTOM_NAV_ITEMS.map(renderNavItem) }) }));
+    const organizationPicker = (_jsx("div", { className: cn("py-2", collapsed ? "flex justify-center px-1" : "px-3"), children: _jsx(OrgSwitcher, { compact: collapsed, reserveSpace: true }) }));
+    const sidebarFooterActions = (_jsx(SidebarFooterActions, { collapsed: collapsed, feedback: feedbackButton, search: searchButton, collapse: collapseButton }));
     return (_jsxs(_Fragment, { children: [_jsx("div", { className: cn("flex h-12 shrink-0 items-center border-b border-sidebar-border", collapsed ? "justify-center px-0" : "px-4"), children: _jsxs("div", { className: cn("flex items-center", collapsed ? "justify-center" : "gap-2"), children: [_jsx("img", { src: appPath("/agent-native-icon-light.svg"), alt: "", "aria-hidden": "true", width: 35, height: 20, className: cn("block shrink-0 object-contain object-center dark:hidden", collapsed ? "h-4 w-7" : "h-5 w-[35px]") }), _jsx("img", { src: appPath("/agent-native-icon-dark.svg"), alt: "", "aria-hidden": "true", width: 35, height: 20, className: cn("hidden shrink-0 object-contain object-center dark:block", collapsed ? "h-4 w-7" : "h-5 w-[35px]") }), !collapsed && (_jsx("div", { className: "min-w-0 flex-1", children: _jsx("div", { "data-dispatch-sidebar-label": true, className: "truncate text-lg font-bold tracking-tight text-foreground", children: DISPATCH_SIDEBAR_LABEL }) }))] }) }), chatFirstMode ? (_jsx("div", { className: "flex min-h-0 flex-1 flex-col overflow-y-auto", children: !collapsed ? (_jsx(DispatchChatsSection, { onNavigate: onNavigate, showNewChat: true, chatFirstMode: true, chatFirstEmbedded: chatFirstEmbedded, chatFirstNavigation: {
                         onOpenIntegrations: () => {
                             navigate(dispatchNavLinkTarget("/admin/integrations"));
@@ -558,7 +564,7 @@ export function NavContent({ onNavigate, extensions, chatFirstMode = false, chat
                             navigate(dispatchNavLinkTarget("/admin/automations"));
                             onNavigate?.();
                         },
-                    }, prelude: chatFirstAppsRail })) : (chatFirstAppsRail) })) : null, _jsxs("div", { className: cn("flex min-h-0 flex-1 flex-col overflow-y-auto", chatFirstMode && "hidden"), children: [_jsx("nav", { className: cn("py-2", collapsed ? "px-1.5" : "px-2"), children: _jsx("ul", { className: cn(collapsed ? "flex flex-col items-center gap-1" : "space-y-0.5"), children: primaryNavItems.map(renderNavItem) }) }), _jsxs("div", { className: "mt-auto shrink-0", children: [_jsx("nav", { className: cn("py-1", collapsed ? "px-1.5" : "px-2"), children: _jsx("ul", { className: cn(collapsed ? "flex flex-col items-center gap-1" : "space-y-0.5"), children: BOTTOM_NAV_ITEMS.map(renderNavItem) }) }), _jsx("div", { className: cn("py-2", collapsed ? "flex justify-center px-1" : "px-3"), children: _jsx(OrgSwitcher, { compact: collapsed, reserveSpace: true }) })] }), _jsx(SidebarFooterActions, { collapsed: collapsed, feedback: feedbackButton, search: searchButton, collapse: collapseButton })] }), chatFirstMode && collapsed ? (_jsx("div", { className: "mt-auto shrink-0", children: _jsx(SidebarFooterActions, { collapsed: true, feedback: feedbackButton, search: searchButton, collapse: collapseButton }) })) : null] }));
+                    }, prelude: chatFirstAppsRail })) : (chatFirstAppsRail) })) : null, _jsxs("div", { className: cn("flex min-h-0 flex-1 flex-col overflow-y-auto", chatFirstMode && "hidden"), children: [_jsx("nav", { className: cn("py-2", collapsed ? "px-1.5" : "px-2"), children: _jsx("ul", { className: cn(collapsed ? "flex flex-col items-center gap-1" : "space-y-0.5"), children: primaryNavItems.map(renderNavItem) }) }), _jsxs("div", { className: "mt-auto shrink-0", children: [bottomNavigation, organizationPicker] }), sidebarFooterActions] }), chatFirstMode ? (_jsxs("div", { className: "mt-auto shrink-0", children: [bottomNavigation, organizationPicker, collapsed ? sidebarFooterActions : null] })) : null] }));
 }
 export function Layout({ children, extensions, agentPageHref, }) {
     const t = useT();
@@ -578,22 +584,43 @@ export function Layout({ children, extensions, agentPageHref, }) {
     const localPathname = localDispatchPath(location.pathname);
     const isChatRoute = localPathname === "/chat" || localPathname.startsWith("/chat/");
     const chatFirstSurfaceScope = threadIdFromPath(localPathname) ?? "new";
-    const isWorkspaceAppHostRoute = localPathname.startsWith("/apps/");
+    const isWorkspaceAppRoute = localPathname.startsWith("/apps/");
+    const isWorkspaceAppHostRoute = isWorkspaceAppRoute &&
+        typeof window !== "undefined" &&
+        new URLSearchParams(window.location.search).get("embedded") === "1";
     const [chatFirstPreference, setChatFirstPreference] = useState(() => readChatFirstMode());
     const chatFirstEmbedded = typeof window !== "undefined" &&
         new URLSearchParams(window.location.search).get("chatFirst") === "1";
     const chatFirstMode = extensions?.chatFirst === true || chatFirstPreference || chatFirstEmbedded;
     const [chatFirstAppLayout, setChatFirstAppLayout] = useState(() => readChatFirstAppLayout());
     const chatFirstAppLayoutHydratedRef = useRef(false);
-    const chatFirstAppsQuery = useActionQuery("list-workspace-apps", { includeAgentCards: false }, { enabled: chatFirstMode && isChatRoute });
+    const chatFirstAppsQuery = useActionQuery("list-workspace-apps", { includeAgentCards: false }, { enabled: chatFirstMode });
+    const chatFirstGrantedAppsQuery = useActionQuery("list_apps", {}, { enabled: chatFirstMode });
     const chatFirstWorkspaceApps = useMemo(() => mergeChatFirstWorkspaceApps(chatFirstAppsQuery.data), [chatFirstAppsQuery.data]);
-    const chatFirstAppRegistrations = useMemo(() => chatFirstWorkspaceApps.map((app) => ({
-        id: app.id,
-        name: app.name,
-        path: app.path,
-        url: app.url,
-        enabled: app.status !== "pending" && app.archived !== true,
-    })), [chatFirstWorkspaceApps]);
+    const chatFirstAppRegistrations = useMemo(() => {
+        const registrations = new Map();
+        for (const app of chatFirstWorkspaceApps) {
+            registrations.set(app.id.toLowerCase(), {
+                id: app.id,
+                name: app.name,
+                path: app.path,
+                url: app.url,
+                enabled: app.status !== "pending" && app.archived !== true,
+            });
+        }
+        for (const app of chatFirstGrantedAppsQuery.data?.apps ?? []) {
+            const id = app.id.trim();
+            if (!id || registrations.has(id.toLowerCase()))
+                continue;
+            registrations.set(id.toLowerCase(), {
+                id,
+                name: app.name,
+                url: app.url,
+                enabled: true,
+            });
+        }
+        return [...registrations.values()];
+    }, [chatFirstGrantedAppsQuery.data?.apps, chatFirstWorkspaceApps]);
     const chatFirstAppItems = useMemo(() => chatFirstWorkspaceApps.map((app) => ({
         id: app.id,
         name: app.name,
@@ -621,10 +648,18 @@ export function Layout({ children, extensions, agentPageHref, }) {
     const previousChatFirstSurfaceScopeRef = useRef(chatFirstSurfaceScope);
     const previousChatFirstSurfaceTabCountRef = useRef(null);
     const activeChatFirstSurfaceTab = useMemo(() => chatFirstSurfaceTabs.tabs.find((tab) => tab.id === chatFirstSurfaceTabs.activeTabId) ?? null, [chatFirstSurfaceTabs]);
-    const activeChatFirstApp = useMemo(() => activeChatFirstSurfaceTab?.kind === "app" &&
+    const chatFirstAppTakesMain = chatFirstMode && isChatRoute && activeChatFirstSurfaceTab?.kind === "app";
+    const activeChatFirstAppRegistration = useMemo(() => activeChatFirstSurfaceTab?.kind === "app" &&
         activeChatFirstSurfaceTab.appId
-        ? (chatFirstWorkspaceApps.find((app) => app.id === activeChatFirstSurfaceTab.appId) ?? null)
-        : null, [activeChatFirstSurfaceTab, chatFirstWorkspaceApps]);
+        ? (chatFirstAppRegistrations.find((app) => app.id === activeChatFirstSurfaceTab.appId) ?? null)
+        : null, [activeChatFirstSurfaceTab, chatFirstAppRegistrations]);
+    const activeChatFirstApp = useMemo(() => activeChatFirstAppRegistration
+        ? {
+            id: activeChatFirstAppRegistration.id,
+            name: activeChatFirstAppRegistration.name ??
+                activeChatFirstAppRegistration.id,
+        }
+        : null, [activeChatFirstAppRegistration]);
     const chatFirstAgentActivities = useMemo(() => (chatFirstAgentsQuery.data?.threads ?? []).map((thread) => ({
         sessionId: thread.id,
         title: thread.title || chatFirstCopy("agentsTitle", { name: thread.id }),
@@ -635,7 +670,8 @@ export function Layout({ children, extensions, agentPageHref, }) {
     const chatFirstEmbedPath = activeChatFirstSurfaceTab?.kind === "app"
         ? (activeChatFirstSurfaceTab.path ??
             chatFirstPane?.path ??
-            activeChatFirstApp?.path)
+            activeChatFirstAppRegistration?.path ??
+            "/")
         : null;
     useEffect(() => {
         if (!chatFirstMode || !isChatRoute || !activeChatFirstApp) {
@@ -685,6 +721,9 @@ export function Layout({ children, extensions, agentPageHref, }) {
     const openChatFirstPane = useCallback((pane) => {
         setChatFirstNotice(null);
         closeChatFirstSessionWatch();
+        if (!isChatRoute) {
+            navigateWithAgentChatViewTransition(navigate, dispatchNavLinkTarget("/chat"));
+        }
         const app = chatFirstAppRegistrations.find((candidate) => candidate.id === pane.appId);
         chatFirstSurfaceTabsStore.open({
             id: chatFirstSurfaceTabId("app", `${pane.appId}:${pane.path ?? pane.view ?? "/"}`),
@@ -694,11 +733,15 @@ export function Layout({ children, extensions, agentPageHref, }) {
             ...(pane.path ? { path: pane.path } : {}),
             ...(pane.view ? { view: pane.view } : {}),
         });
+        setChatFirstSurfacePanelOpen(true);
         persistChatFirstPane(pane);
     }, [
         chatFirstAppRegistrations,
         chatFirstSurfaceTabsStore,
         persistChatFirstPane,
+        isChatRoute,
+        navigate,
+        setChatFirstSurfacePanelOpen,
     ]);
     const openChatFirstSurface = useCallback((kind) => {
         if (kind !== "agents")
@@ -728,7 +771,7 @@ export function Layout({ children, extensions, agentPageHref, }) {
         });
     }, [chatFirstSurfaceTabsStore, persistChatFirstPane]);
     const resolveChatFirstOpenApp = useCallback((detail) => {
-        if (chatFirstAppsQuery.isLoading) {
+        if (chatFirstAppsQuery.isLoading || chatFirstGrantedAppsQuery.isLoading) {
             pendingChatFirstOpenAppRef.current = detail;
             return;
         }
@@ -750,10 +793,9 @@ export function Layout({ children, extensions, agentPageHref, }) {
         chatFirstAppRegistrations,
         chatFirstAppsQuery.isError,
         chatFirstAppsQuery.isLoading,
+        chatFirstGrantedAppsQuery.isLoading,
         openChatFirstPane,
     ]);
-    const sidebarBeforeAppRef = useRef(null);
-    const sidebarAutoCollapsedRef = useRef(false);
     const chatHomeHandoffActive = useAgentChatHomeHandoff({
         storageKey: "dispatch",
         activePath: localPathname,
@@ -805,7 +847,7 @@ export function Layout({ children, extensions, agentPageHref, }) {
         });
     }, []);
     useEffect(() => {
-        if (!chatFirstMode || !isChatRoute) {
+        if (!chatFirstMode) {
             setChatFirstPane(null);
             closeChatFirstSessionWatch();
             chatFirstSurfaceTabsStore.closeAll();
@@ -898,7 +940,7 @@ export function Layout({ children, extensions, agentPageHref, }) {
     useEffect(() => {
         const tabCount = chatFirstSurfaceTabs.tabs.length;
         const previousTabCount = previousChatFirstSurfaceTabCountRef.current;
-        if (!chatFirstMode || !isChatRoute) {
+        if (!chatFirstMode) {
             setChatFirstSurfacePanelOpen(false);
         }
         else if (tabCount > 0 &&
@@ -927,13 +969,17 @@ export function Layout({ children, extensions, agentPageHref, }) {
     }, [activeChatFirstSurfaceTab, chatFirstSessionWatch.target]);
     useEffect(() => {
         const pending = pendingChatFirstOpenAppRef.current;
-        if (!pending || chatFirstAppsQuery.isLoading)
+        if (!pending ||
+            chatFirstAppsQuery.isLoading ||
+            chatFirstGrantedAppsQuery.isLoading)
             return;
         resolveChatFirstOpenApp(pending);
     }, [
         chatFirstAppsQuery.data,
         chatFirstAppsQuery.isError,
         chatFirstAppsQuery.isLoading,
+        chatFirstGrantedAppsQuery.data,
+        chatFirstGrantedAppsQuery.isLoading,
         resolveChatFirstOpenApp,
     ]);
     useEffect(() => {
@@ -953,26 +999,6 @@ export function Layout({ children, extensions, agentPageHref, }) {
         chatFirstSurfaceTabsStore,
         isChatRoute,
     ]);
-    useEffect(() => {
-        if (isWorkspaceAppHostRoute) {
-            if (!sidebarAutoCollapsedRef.current) {
-                sidebarAutoCollapsedRef.current = true;
-                sidebarBeforeAppRef.current = sidebarCollapsed;
-            }
-            if (!sidebarCollapsed)
-                setSidebarCollapsed(true);
-            return;
-        }
-        if (!sidebarAutoCollapsedRef.current)
-            return;
-        sidebarAutoCollapsedRef.current = false;
-        const previousSidebarState = sidebarBeforeAppRef.current;
-        sidebarBeforeAppRef.current = null;
-        if (previousSidebarState !== null &&
-            previousSidebarState !== sidebarCollapsed) {
-            setSidebarCollapsed(previousSidebarState);
-        }
-    }, [isWorkspaceAppHostRoute, sidebarCollapsed]);
     useEffect(() => {
         if (typeof window === "undefined" || isWorkspaceAppHostRoute)
             return;
@@ -1036,8 +1062,14 @@ export function Layout({ children, extensions, agentPageHref, }) {
         if (tab.kind === "app") {
             if (tab.id !== chatFirstSurfaceTabs.activeTabId)
                 return null;
-            const app = tab.appId
-                ? (chatFirstWorkspaceApps.find((candidate) => candidate.id === tab.appId) ?? null)
+            const registration = tab.appId
+                ? (chatFirstAppRegistrations.find((candidate) => candidate.id === tab.appId) ?? null)
+                : null;
+            const app = registration
+                ? {
+                    id: registration.id,
+                    name: registration.name ?? registration.id,
+                }
                 : null;
             return (_jsx(ChatFirstAppPane, { app: app, status: chatFirstEmbedError
                     ? "error"
@@ -1081,7 +1113,7 @@ export function Layout({ children, extensions, agentPageHref, }) {
         chatFirstEmbedUrl,
         chatFirstSessionWatch.target,
         chatFirstSurfaceTabs.activeTabId,
-        chatFirstWorkspaceApps,
+        chatFirstAppRegistrations,
         closeChatFirstSurfaceTab,
         renderChatFirstWatchChat,
     ]);
@@ -1101,19 +1133,21 @@ export function Layout({ children, extensions, agentPageHref, }) {
         t("dispatch.sidebar.suggestionRouteSlack"),
         t("dispatch.sidebar.suggestionGrantKey"),
     ];
-    const appContent = (_jsxs("div", { className: "relative flex h-full min-w-0 flex-1 flex-col overflow-hidden", children: [showHeader ? _jsx(Header, { onOpenMobile: () => setMobileOpen(true) }) : null, _jsx(InvitationBanner, {}), isChatRoute && chatFirstMode ? (_jsx(ChatFirstSurfacePanelToggle, { open: chatFirstSurfacePanel.open, onToggle: chatFirstSurfacePanel.toggle, className: "absolute right-3 top-2 z-[4]" })) : null, isChatRoute && chatFirstMode && chatFirstNotice ? (_jsxs("div", { className: "dispatch-chat-first-notice", role: "status", "aria-live": "polite", children: [_jsx("span", { children: chatFirstNotice }), _jsx("button", { type: "button", onClick: () => setChatFirstNotice(null), "aria-label": "Dismiss app notice", children: "Dismiss" })] })) : null, _jsx("main", { className: cn("flex-1", isChatRoute || isWorkspaceAppHostRoute
+    const appContent = (_jsxs("div", { className: "relative flex h-full min-w-0 flex-1 flex-col overflow-hidden", children: [showHeader ? _jsx(Header, { onOpenMobile: () => setMobileOpen(true) }) : null, _jsx(InvitationBanner, {}), isChatRoute && chatFirstMode ? (_jsx(ChatFirstSurfacePanelToggle, { open: chatFirstSurfacePanel.open, onToggle: chatFirstSurfacePanel.toggle, className: "absolute right-3 top-2 z-[4]" })) : null, isChatRoute && chatFirstMode && chatFirstNotice ? (_jsxs("div", { className: "dispatch-chat-first-notice", role: "status", "aria-live": "polite", children: [_jsx("span", { children: chatFirstNotice }), _jsx("button", { type: "button", onClick: () => setChatFirstNotice(null), "aria-label": "Dismiss app notice", children: "Dismiss" })] })) : null, _jsx("main", { className: cn("flex-1", isChatRoute || isWorkspaceAppRoute
                     ? "min-h-0 overflow-hidden"
                     : "overflow-y-auto"), children: showHeader ? (_jsx("div", { className: "mx-auto max-w-7xl space-y-10 px-4 py-6 sm:px-6", children: children })) : (children) })] }));
-    const content = isChatRoute ? (_jsxs("div", { className: cn("agent-layout-main-surface flex min-w-0 flex-1 overflow-hidden", chatFirstMode && "dispatch-chat-first-surface"), children: [appContent, chatFirstMode && chatFirstSurfacePanel.open ? (_jsxs(ChatFirstSurfacePanel, { width: chatFirstSurfaceResize.width, onResizePointerDown: chatFirstSurfaceResize.onPointerDown, copy: chatFirstCopy, children: [_jsx(ChatFirstSurfaceTabs, { tabs: chatFirstSurfaceTabs.tabs, activeTabId: chatFirstSurfaceTabs.activeTabId, onActivate: activateChatFirstSurfaceTab, onClose: closeChatFirstSurfaceTab, onCloseOthers: (tab) => {
-                            activateChatFirstSurfaceTab(tab);
-                            chatFirstSurfaceTabsStore.closeOthers(tab.id);
-                        }, onCloseToRight: (tab) => {
-                            const targetIndex = chatFirstSurfaceTabs.tabs.findIndex((candidate) => candidate.id === tab.id);
-                            const activeIndex = chatFirstSurfaceTabs.tabs.findIndex((candidate) => candidate.id === chatFirstSurfaceTabs.activeTabId);
-                            if (activeIndex > targetIndex)
-                                activateChatFirstSurfaceTab(tab);
-                            chatFirstSurfaceTabsStore.closeToRight(tab.id);
-                        }, onCloseAll: closeAllChatFirstSurfaceTabs, onOpenSurface: openChatFirstSurface, copy: chatFirstCopy }), chatFirstSurfaceTabs.tabs.length > 0 ? (_jsx(ChatFirstSurfaceContent, { tabs: chatFirstSurfaceTabs.tabs, activeTabId: chatFirstSurfaceTabs.activeTabId, renderTab: renderChatFirstSurfaceTab })) : null] })) : null] })) : (_jsx(AgentSidebar, { position: "right", defaultOpen: false, agentPageHref: agentPageHref, chatViewTransition: true, storageKey: "dispatch", openOnChatRunning: chatHomeHandoffActive, onFullscreenRequest: openAskAgentFullscreen, emptyStateText: t("dispatch.sidebar.emptyAgentText"), suggestions: sidebarSuggestions, children: appContent }));
+    const chatFirstSurfaceTabsBar = activeChatFirstSurfaceTab?.kind === "app" ? null : (_jsx(ChatFirstSurfaceTabs, { tabs: chatFirstSurfaceTabs.tabs, activeTabId: chatFirstSurfaceTabs.activeTabId, onActivate: activateChatFirstSurfaceTab, onClose: closeChatFirstSurfaceTab, onCloseOthers: (tab) => {
+            activateChatFirstSurfaceTab(tab);
+            chatFirstSurfaceTabsStore.closeOthers(tab.id);
+        }, onCloseToRight: (tab) => {
+            const targetIndex = chatFirstSurfaceTabs.tabs.findIndex((candidate) => candidate.id === tab.id);
+            const activeIndex = chatFirstSurfaceTabs.tabs.findIndex((candidate) => candidate.id === chatFirstSurfaceTabs.activeTabId);
+            if (activeIndex > targetIndex)
+                activateChatFirstSurfaceTab(tab);
+            chatFirstSurfaceTabsStore.closeToRight(tab.id);
+        }, onCloseAll: closeAllChatFirstSurfaceTabs, onOpenSurface: openChatFirstSurface, copy: chatFirstCopy }));
+    const chatFirstSurfaceContent = chatFirstSurfaceTabs.tabs.length > 0 ? (_jsx(ChatFirstSurfaceContent, { tabs: chatFirstSurfaceTabs.tabs, activeTabId: chatFirstSurfaceTabs.activeTabId, renderTab: renderChatFirstSurfaceTab })) : null;
+    const content = isChatRoute ? (_jsx("div", { className: cn("agent-layout-main-surface flex min-w-0 flex-1 overflow-hidden", chatFirstMode && "dispatch-chat-first-surface"), children: chatFirstAppTakesMain ? (_jsx("div", { className: "flex min-w-0 flex-1 flex-col overflow-hidden", "data-dispatch-chat-first-main-app": true, children: chatFirstSurfaceContent })) : (_jsxs(_Fragment, { children: [appContent, chatFirstMode && chatFirstSurfacePanel.open ? (_jsxs(ChatFirstSurfacePanel, { width: chatFirstSurfaceResize.width, onResizePointerDown: chatFirstSurfaceResize.onPointerDown, copy: chatFirstCopy, children: [chatFirstSurfaceTabsBar, chatFirstSurfaceContent] })) : null] })) })) : isWorkspaceAppRoute ? (appContent) : (_jsx(AgentSidebar, { position: "right", defaultOpen: false, agentPageHref: agentPageHref, chatViewTransition: true, storageKey: "dispatch", openOnChatRunning: chatHomeHandoffActive, onFullscreenRequest: openAskAgentFullscreen, emptyStateText: t("dispatch.sidebar.emptyAgentText"), suggestions: sidebarSuggestions, children: appContent }));
     return (_jsx(DispatchExtensionsContext.Provider, { value: extensions, children: _jsx(HeaderActionsProvider, { children: _jsxs("div", { className: "agent-layout-shell flex h-screen w-full overflow-hidden bg-background", children: [_jsx("aside", { "data-collapsed": sidebarCollapsed ? "true" : "false", className: cn("agent-layout-left-drawer hidden shrink-0 flex-col border-e !border-e-sidebar-border bg-sidebar text-sidebar-foreground transition-[width] duration-200 ease-out lg:flex", sidebarCollapsed ? "w-14" : "w-56"), children: _jsx(NavContent, { extensions: extensions, chatFirstMode: chatFirstMode, chatFirstEmbedded: chatFirstEmbedded, collapsed: sidebarCollapsed, chatFirstAppLayout: chatFirstAppLayout, onChatFirstAppLayoutChange: persistChatFirstAppLayout, chatFirstApps: chatFirstAppItems, chatFirstAppsLoading: chatFirstAppsQuery.isLoading, chatFirstAppsError: chatFirstAppsQuery.isError
                                 ? chatFirstCopy("appsLoadError")
                                 : null, chatFirstActiveAppId: activeChatFirstSurfaceTab?.kind === "app"