@nextclaw/ui 0.25.4 → 0.26.1

package/src/features/chat/features/session/components/chat-sidebar-project-groups.tsx

@@ -1,4 +1,5 @@
 import { useMemo, useState, type ReactNode } from "react";
+import { SIDEBAR_ITEM_SURFACE_CLASS, SIDEBAR_ITEM_ACTIVE_SURFACE_CLASS } from "@/app/components/layout/sidebar-rail.styles";
 import { Link, useLocation, useNavigate } from "react-router-dom";
 import {
   AlarmClock,
@@ -12,7 +13,6 @@ import {
   Plus,
 } from "lucide-react";
 import { usePresenter } from "@/features/chat/components/providers/chat-presenter.provider";
-import { ChatSessionTypeMenu } from "@/features/chat/features/session-type/components/chat-session-type-menu";
 import { Popover, PopoverTrigger } from "@/shared/components/ui/popover";
 import { ChatPopoverContent } from "@/features/chat/components/chat-popover-content";
 import { IconActionButton } from "@/shared/components/ui/actions/icon-action-button";
@@ -68,7 +68,6 @@ export function ChatSidebarProjectGroups(props: ChatSidebarProjectGroupsProps) {
   const collapsedProjectRoots = useChatSessionListStore(
     (state) => state.snapshot.collapsedProjectRoots,
   );
-  const [openProjectRoot, setOpenProjectRoot] = useState<string | null>(null);
   const [openProjectMenuRoot, setOpenProjectMenuRoot] = useState<string | null>(
     null,
   );
@@ -80,7 +79,6 @@ export function ChatSidebarProjectGroups(props: ChatSidebarProjectGroupsProps) {
       ),
     [defaultSessionType, sessionTypeOptions],
   );
-  const supportsSessionTypeChoice = sessionTypeOptions.length > 1;
   const removeProject = async (group: ChatSidebarProjectGroup) => {
     if (!group.projectId) return;
     setOpenProjectMenuRoot(null);
@@ -119,8 +117,9 @@ export function ChatSidebarProjectGroups(props: ChatSidebarProjectGroupsProps) {
           <div key={group.projectRoot}>
             <div
               className={cn(
-                "group/project relative h-8 rounded-lg px-1 text-muted-foreground transition-colors hover:bg-gray-200/60 hover:text-gray-900",
-                isSelected && "bg-gray-200/60 text-gray-900",
+                "group/project relative h-8 px-1",
+                SIDEBAR_ITEM_SURFACE_CLASS,
+                isSelected && SIDEBAR_ITEM_ACTIVE_SURFACE_CLASS,
               )}
             >
               <ChatSidebarContextCard
@@ -213,37 +212,6 @@ export function ChatSidebarProjectGroups(props: ChatSidebarProjectGroupsProps) {
                 data-project-actions
                 className="pointer-events-none absolute right-2 top-1/2 flex -translate-y-1/2 items-center opacity-0 transition-opacity group-hover/project:pointer-events-auto group-hover/project:opacity-100 focus-within:pointer-events-auto focus-within:opacity-100"
               >
-                {supportsSessionTypeChoice ? (
-                  <Popover
-                    open={openProjectRoot === group.projectRoot}
-                    onOpenChange={(nextOpen) => {
-                      setOpenProjectRoot(nextOpen ? group.projectRoot : null);
-                    }}
-                  >
-                    <PopoverTrigger asChild>
-                      <IconActionButton
-                        icon={<Plus className="h-3.5 w-3.5" />}
-                        label={actionLabel}
-                      />
-                    </PopoverTrigger>
-                    <ChatPopoverContent
-                      align="end"
-                      className="w-56 rounded-2xl border border-border bg-popover p-1.5 text-popover-foreground shadow-[0_24px_60px_-28px_rgba(15,23,42,0.38)]"
-                    >
-                      <ChatSessionTypeMenu
-                        options={sessionTypeOptions}
-                        selectedSessionType={preferredSessionType}
-                        onSelect={(sessionType) => {
-                          presenter.chatSessionListManager.createSession({
-                            projectRoot: group.projectRoot,
-                            sessionType,
-                          });
-                          setOpenProjectRoot(null);
-                        }}
-                      />
-                    </ChatPopoverContent>
-                  </Popover>
-                ) : (
                   <IconActionButton
                     icon={<Plus className="h-3.5 w-3.5" />}
                     label={actionLabel}
@@ -254,7 +222,6 @@ export function ChatSidebarProjectGroups(props: ChatSidebarProjectGroupsProps) {
                       })
                     }
                   />
-                )}
                 <IconActionButton
                   icon={
                     <Pin

package/src/features/chat/features/session/components/chat-sidebar-session-entry.tsx

@@ -11,6 +11,7 @@ import type { ChatSessionTypeOption } from "@/features/chat/features/session-typ
 import { t } from "@/shared/lib/i18n";
 
 export function ChatSidebarSessionEntry(props: {
+  variant?: 'desktop' | 'mobile';
   item: NcpSessionListItemView;
   selectedSessionKey: string | null;
   optimisticReadAtBySessionKey: Record<string, string>;
@@ -74,6 +75,7 @@ export function ChatSidebarSessionEntry(props: {
 
   return (
     <ChatSidebarSessionItem
+      variant={props.variant}
       sessionKey={session.key}
       active={active}
       showUnreadDot={shouldShowUnreadSessionIndicator({

package/src/features/chat/features/session/components/chat-sidebar-session-item.tsx

@@ -1,4 +1,6 @@
 import { AgentAvatar } from "@/shared/components/common/agent-avatar";
+import { SIDEBAR_ITEM_SURFACE_CLASS, SIDEBAR_ITEM_ACTIVE_SURFACE_CLASS } from "@/app/components/layout/sidebar-rail.styles";
+import { ChatMobileSessionRow } from './chat-mobile-session-row';
 import { SessionContextIconNode } from "@/features/chat/features/session/components/session-context-icon";
 import { SessionRunBadge } from "@/features/chat/features/session/components/session-run-badge";
 import { ChatSessionMoreActionsMenu } from "@/features/chat/features/session/components/session-header/chat-session-more-actions-menu";
@@ -21,7 +23,8 @@ import {
 import { ChatSidebarContextCard } from "@/features/chat/features/session/components/chat-sidebar-context-card";
 import { ChatSessionHeaderMenuItem } from "@/features/chat/features/session/components/session-header/chat-session-header-menu-item";
 
-type ChatSidebarSessionItemProps = {
+export type ChatSidebarSessionItemProps = {
+  variant?: 'desktop' | 'mobile';
   sessionKey: string;
   active: boolean;
   showUnreadDot: boolean;
@@ -264,6 +267,7 @@ function ChatSidebarSessionDisplayView({
         />
         <ChatSessionMoreActionsMenu
           sessionKey={sessionKey}
+          sessionTitle={title}
           triggerSize="sm"
           triggerTone="strong"
         >
@@ -279,7 +283,8 @@ function ChatSidebarSessionDisplayView({
   );
 }
 
-export function ChatSidebarSessionItem({
+export function ChatSidebarSessionItem(props: ChatSidebarSessionItemProps) {
+  const {
   sessionKey,
   active,
   showUnreadDot,
@@ -305,17 +310,22 @@ export function ChatSidebarSessionItem({
   onCancel,
   onTogglePinned,
   onDelete,
-}: ChatSidebarSessionItemProps) {
+  variant,
+  } = props;
   return (
     <div
       className={cn(
-        "w-full rounded-lg px-2.5 py-2 text-left text-[13px] transition-colors",
-        active
+        variant === 'mobile'
+          ? 'w-full border-b border-border/50 bg-background text-left'
+          : cn("w-full px-3 py-2 text-left text-[13px]", SIDEBAR_ITEM_SURFACE_CLASS, active && SIDEBAR_ITEM_ACTIVE_SURFACE_CLASS),
+        variant === 'mobile' && (active
           ? "bg-background/90 font-medium text-foreground"
-          : "text-foreground/80 hover:bg-background/65 hover:text-foreground",
+          : "text-foreground/80 hover:bg-background/65 hover:text-foreground"),
+        active && "font-medium",
       )}
     >
       {isEditing ? (
+        <div className={variant === 'mobile' ? 'p-4' : undefined}>
         <ChatSidebarSessionEditingView
           sessionKey={sessionKey}
           draftLabel={draftLabel}
@@ -324,7 +334,8 @@ export function ChatSidebarSessionItem({
           onSave={onSave}
           onCancel={onCancel}
         />
-      ) : (
+        </div>
+      ) : variant === 'mobile' ? <ChatMobileSessionRow {...props} /> : (
         <ChatSidebarSessionDisplayView
           sessionKey={sessionKey}
           active={active}

package/src/features/chat/features/session/components/chat-sidebar-session-list.tsx

@@ -12,6 +12,7 @@ import { t } from "@/shared/lib/i18n";
 type SessionTypeOption = ChatSessionTypeOption;
 
 type ChatSidebarSessionListProps = {
+  variant?: 'desktop' | 'mobile';
   isLoading: boolean;
   isProjectFirstView: boolean;
   groups: ChatSidebarDateGroup[];
@@ -32,6 +33,7 @@ function ChatSidebarEmptyState({ label }: { label: string }) {
 }
 
 export function ChatSidebarSessionList({
+  variant = 'desktop',
   defaultSessionType,
   groups,
   isLoading,
@@ -68,13 +70,13 @@ export function ChatSidebarSessionList({
   }
 
   return (
-    <div className="space-y-2">
+    <div className={variant === 'mobile' ? undefined : 'space-y-2'}>
       {groups.map((group) => (
         <div key={group.label}>
-          <div className="px-2 pb-1 pt-0.5 text-[11px] font-medium uppercase tracking-wider text-muted-foreground/65">
+          <div className={variant === 'mobile' ? 'px-4 py-1 text-[11px] text-muted-foreground' : 'px-2 pb-1 pt-0.5 text-[11px] font-medium uppercase tracking-wider text-muted-foreground/65'}>
             {group.label}
           </div>
-          <div className="space-y-0.5">
+          <div className={variant === 'mobile' ? undefined : 'space-y-0.5'}>
             {group.items.map(renderSessionItem)}
           </div>
         </div>

package/src/features/chat/features/session/components/session-header/__tests__/chat-session-header-actions.test.tsx

@@ -192,7 +192,7 @@ describe('ChatSessionHeaderActions', () => {
     expect(screen.getByRole('button', { name: 'Open session workspace' }).className).toContain('w-7');
   });
 
-  it('places the workspace toggle at the far right of the visible header actions', () => {
+  it('places more actions at the far right of the visible header actions', () => {
     render(
       <ChatSessionHeaderActions
         sessionKey="session-actions"
@@ -208,7 +208,7 @@ describe('ChatSessionHeaderActions', () => {
     const menuButton = screen.getByRole('button', { name: 'More actions' });
     const workspaceButton = screen.getByRole('button', { name: 'Open session workspace' });
 
-    expect(menuButton.compareDocumentPosition(workspaceButton)).toBe(
+    expect(workspaceButton.compareDocumentPosition(menuButton)).toBe(
       Node.DOCUMENT_POSITION_FOLLOWING,
     );
   });
@@ -237,3 +237,11 @@ describe('ChatSessionHeaderActions', () => {
     expect(mocks.onToggleWorkspace).toHaveBeenCalledTimes(1);
   });
 });
+
+vi.mock("react-router-dom", async (importOriginal) => ({ ...(await importOriginal<object>()), useNavigate: () => vi.fn(), useLocation: () => ({ pathname: '/chat', search: '' }) }));
+vi.mock("@/features/panel-apps/hooks/use-panel-apps", () => ({ usePanelApps: () => ({ data: { entries: [] } }), useUpdatePanelAppPreferences: () => ({ mutate: vi.fn() }) }));
+vi.mock("@/app/components/app-presenter-provider", async () => {
+  const { PageResourceManager } = await import("@/features/right-panel-resources/managers/page-resource.manager");
+  const app = { docBrowserManager: { openTarget: vi.fn() }, chatComposerIntentManager: { requestUiResourceReference: vi.fn() } };
+  return { useAppPresenter: () => ({ ...app, pageResourceManager: new PageResourceManager(app as never) }) };
+});

package/src/features/chat/features/session/components/session-header/chat-session-header-actions.tsx

@@ -12,6 +12,7 @@ const SESSION_HEADER_ACTION_GROUP_CLASS = 'flex shrink-0 items-center gap-1.5';
 
 type ChatSessionHeaderActionsProps = {
   sessionKey: string | null;
+  sessionTitle?: string;
   canDeleteSession: boolean;
   isDeletePending: boolean;
   currentPath?: string | null;
@@ -24,6 +25,7 @@ type ChatSessionHeaderActionsProps = {
 
 export function ChatSessionHeaderActions({
   sessionKey,
+  sessionTitle,
   canDeleteSession,
   isDeletePending,
   currentPath,
@@ -59,9 +61,27 @@ export function ChatSessionHeaderActions({
 
   return (
     <div className={SESSION_HEADER_ACTION_GROUP_CLASS}>
+      <IconActionButton
+        icon={
+          isWorkspaceOpen ? (
+            <PanelRightClose className="h-4 w-4" />
+          ) : (
+            <PanelRightOpen className="h-4 w-4" />
+          )
+        }
+        label={t(
+          isWorkspaceOpen
+            ? 'chatSessionCloseWorkspace'
+            : 'chatSessionOpenWorkspace',
+        )}
+        aria-pressed={isWorkspaceOpen}
+        onClick={onToggleWorkspace}
+        disabled={isBusy}
+      />
       {sessionKey ? (
         <ChatSessionMoreActionsMenu
           sessionKey={sessionKey}
+          sessionTitle={sessionTitle}
           disabled={isBusy}
         >
           <ChatSessionHeaderMenuItem
@@ -85,23 +105,6 @@ export function ChatSessionHeaderActions({
           />
         </ChatSessionMoreActionsMenu>
       ) : null}
-      <IconActionButton
-        icon={
-          isWorkspaceOpen ? (
-            <PanelRightClose className="h-4 w-4" />
-          ) : (
-            <PanelRightOpen className="h-4 w-4" />
-          )
-        }
-        label={t(
-          isWorkspaceOpen
-            ? 'chatSessionCloseWorkspace'
-            : 'chatSessionOpenWorkspace',
-        )}
-        aria-pressed={isWorkspaceOpen}
-        onClick={onToggleWorkspace}
-        disabled={isBusy}
-      />
 
       {sessionKey ? (
         <>

package/src/features/chat/features/session/components/session-header/chat-session-header-menu-item.tsx

@@ -20,15 +20,15 @@ export function ChatSessionHeaderMenuItem({
     <button
       type="button"
       className={cn(
-        'flex w-full items-center gap-2 rounded-xl px-3 py-2 text-left text-sm transition-colors disabled:cursor-not-allowed disabled:opacity-50',
+        'flex h-8 w-full items-center gap-2 rounded-lg px-2.5 text-left text-[13px] font-medium outline-none transition-colors disabled:cursor-not-allowed disabled:opacity-50',
         destructive
-          ? 'text-destructive hover:bg-destructive/10'
-          : 'text-muted-foreground hover:bg-[var(--interaction-hover)] hover:text-accent-foreground'
+          ? 'text-destructive hover:bg-destructive/10 focus-visible:bg-destructive/10'
+          : 'text-foreground hover:bg-muted focus-visible:bg-muted'
       )}
       onClick={onClick}
       disabled={disabled}
     >
-      <Icon className="h-4 w-4 shrink-0" />
+      <Icon className={cn("h-4 w-4 shrink-0", !destructive && "text-muted-foreground")} />
       <span>{label}</span>
     </button>
   );

package/src/features/chat/features/session/components/session-header/chat-session-more-actions-menu.tsx

@@ -1,4 +1,7 @@
-import { useState, type ReactNode } from 'react';
+import { PageResourceActionItems } from '@/features/right-panel-resources';
+import { pageResourceFromTarget } from '@/features/right-panel-resources';
+import { buildSessionPanelUrl } from '@/features/chat/features/session/utils/chat-session-route.utils';
+import { Children, isValidElement, useState, type ReactNode } from 'react';
 import { copyText } from '@nextclaw/agent-chat-ui';
 import { Copy, MoreVertical } from 'lucide-react';
 import { toast } from 'sonner';
@@ -14,6 +17,7 @@ import { ChatSessionHeaderMenuItem } from './chat-session-header-menu-item';
 
 type ChatSessionMoreActionsMenuProps = {
   sessionKey: string;
+  sessionTitle?: string;
   children?: ReactNode;
   disabled?: boolean;
   triggerSize?: IconActionButtonSize;
@@ -30,6 +34,7 @@ export async function copySessionId(sessionKey: string) {
 
 export function ChatSessionMoreActionsMenu({
   sessionKey,
+  sessionTitle,
   children,
   disabled = false,
   triggerSize = 'md',
@@ -37,6 +42,9 @@ export function ChatSessionMoreActionsMenu({
   className,
 }: ChatSessionMoreActionsMenuProps) {
   const [isOpen, setIsOpen] = useState(false);
+  const menuItems = Children.toArray(children);
+  const isDestructive = (item: ReactNode) => isValidElement<{ destructive?: boolean }>(item) && item.props.destructive;
+  const destructiveItems = menuItems.filter(isDestructive);
 
   const handleCopySessionId = () => {
     setIsOpen(false);
@@ -49,7 +57,6 @@ export function ChatSessionMoreActionsMenu({
         <IconActionButton
           icon={<MoreVertical className="h-4 w-4" />}
           label={t('chatSessionMoreActions')}
-          tooltip={false}
           size={triggerSize}
           tone={triggerTone}
           className={className}
@@ -57,16 +64,22 @@ export function ChatSessionMoreActionsMenu({
           onClick={(event) => event.stopPropagation()}
         />
       </PopoverTrigger>
-      <ChatPopoverContent align="end" className="w-56 p-2">
-        <div className="space-y-1" onClick={() => setIsOpen(false)}>
+      <ChatPopoverContent align="end" variant="menu">
+        <div onClick={() => setIsOpen(false)}>
+          {menuItems.filter((item) => !isDestructive(item))}
           <ChatSessionHeaderMenuItem
             icon={Copy}
             label={t('chatSessionCopyId')}
             onClick={handleCopySessionId}
             disabled={disabled}
           />
-          {children}
         </div>
+        <div className="my-1 h-px bg-border" />
+          <PageResourceActionItems page={pageResourceFromTarget({ kind: 'chat-session', title: sessionTitle || t('chatFloatingConversation'), url: buildSessionPanelUrl(sessionKey), resourceUri: buildSessionPanelUrl(sessionKey), historyPolicy: 'none' })} onSelect={() => setIsOpen(false)} />
+        {destructiveItems.length > 0 ? <>
+          <div className="my-1 h-px bg-border" />
+          <div onClick={() => setIsOpen(false)}>{destructiveItems}</div>
+        </> : null}
       </ChatPopoverContent>
     </Popover>
   );

package/src/features/chat/features/session/utils/chat-session-route.utils.ts

@@ -1,4 +1,16 @@
 const SESSION_ROUTE_PREFIX = 'sid_';
+export const CHAT_SESSION_PANEL_KIND = 'chat-session';
+const SESSION_PANEL_PREFIX = 'nextclaw://chat-session/';
+
+export function buildSessionPanelUrl(sessionKey: string): string {
+  return SESSION_PANEL_PREFIX + encodeSessionRouteId(sessionKey);
+}
+
+export function parseSessionKeyFromPanelUrl(url: string): string | null {
+  return url.startsWith(SESSION_PANEL_PREFIX)
+    ? decodeSessionRouteId(url.slice(SESSION_PANEL_PREFIX.length))
+    : null;
+}
 export const CHAT_DRAFT_SESSION_PATH = '/chat/draft';
 const DRAFT_SESSION_ROUTE_ID = CHAT_DRAFT_SESSION_PATH.slice('/chat/'.length);
 

package/src/features/chat/features/workspace/components/__tests__/chat-session-child-sessions.test.tsx

@@ -65,6 +65,26 @@ it('keeps existing child sessions selectable beside the create action', async ()
   expect(mocks.selectChildSessionDetail).toHaveBeenCalledWith('child-1');
 });
 
+it('shows a spinner only for child sessions that are running', () => {
+  render(
+    <ChatSessionChildSessions
+      childSessionTabs={[
+        createChildSession(),
+        {
+          ...createChildSession(),
+          sessionKey: 'child-2',
+          title: 'Running branch',
+          runStatus: 'running',
+        },
+      ]}
+      sessionKey="parent-1"
+    />,
+  );
+
+  expect(screen.getAllByLabelText('Running')).toHaveLength(1);
+  expect(screen.getByRole('button', { name: /Running branch.*Running/ })).toBeTruthy();
+});
+
 it('copies a child session ID from its own more-actions menu', async () => {
   const user = userEvent.setup();
   render(<ChatSessionChildSessions childSessionTabs={[createChildSession()]} sessionKey="parent-1" />);
@@ -75,3 +95,11 @@ it('copies a child session ID from its own more-actions menu', async () => {
   expect(mocks.copyText).toHaveBeenCalledWith('child-1');
   expect(mocks.selectChildSessionDetail).not.toHaveBeenCalled();
 });
+
+vi.mock("react-router-dom", async (importOriginal) => ({ ...(await importOriginal<object>()), useNavigate: () => vi.fn(), useLocation: () => ({ pathname: '/chat', search: '' }) }));
+vi.mock("@/features/panel-apps/hooks/use-panel-apps", () => ({ usePanelApps: () => ({ data: { entries: [] } }), useUpdatePanelAppPreferences: () => ({ mutate: vi.fn() }) }));
+vi.mock("@/app/components/app-presenter-provider", async () => {
+  const { PageResourceManager } = await import("@/features/right-panel-resources/managers/page-resource.manager");
+  const app = { docBrowserManager: { openTarget: vi.fn() }, chatComposerIntentManager: { requestUiResourceReference: vi.fn() } };
+  return { useAppPresenter: () => ({ ...app, pageResourceManager: new PageResourceManager(app as never) }) };
+});

package/src/features/chat/features/workspace/components/__tests__/chat-session-workspace-file-preview.test.tsx

@@ -534,6 +534,15 @@ describe("ChatSessionWorkspaceFilePreview Office rendering", () => {
 });
 
 describe("ChatSessionWorkspaceFilePreview text rendering", () => {
+  it("renders an immutable object snapshot without reading a same-named local file", () => {
+    serverPathReadMock.mockReturnValue({ data: null, isLoading: false });
+    serverPathBrowseMock.mockReturnValue({ data: null, isLoading: false });
+    renderWorkspaceFilePreview({ file: { path: "snapshot.md", rawText: "# Resource snapshot", previewViewer: "rendered" } });
+    expect(screen.getByTestId("markdown-preview").textContent).toBe("# Resource snapshot");
+    expect(serverPathReadMock).toHaveBeenCalledWith(expect.objectContaining({ enabled: false }));
+    expect(serverPathBrowseMock).toHaveBeenCalledWith(expect.objectContaining({ enabled: false }));
+  });
+
   it("renders preview files inside a full-height workspace code surface", () => {
     mockTextRead();
     renderWorkspaceFilePreview();

package/src/features/chat/features/workspace/components/__tests__/chat-session-workspace-panel-content.test.tsx

@@ -205,7 +205,9 @@ beforeEach(() => {
   });
 });
 
-function createChildTab(): ResolvedChildSessionTab {
+function createChildTab(
+  overrides: Partial<ResolvedChildSessionTab> = {},
+): ResolvedChildSessionTab {
   return {
     sessionKey: 'child-1',
     parentSessionKey: 'parent-1',
@@ -219,6 +221,7 @@ function createChildTab(): ResolvedChildSessionTab {
     preferredModel: 'minimax/MiniMax-M3',
     projectName: 'nextbot',
     projectRoot: '/Users/peiwang/Projects/nextbot',
+    ...overrides,
   };
 }
 
@@ -252,7 +255,7 @@ it('shows child session content without a redundant metadata header', () => {
 
 it('shows all session workspace entries in the overview', async () => {
   const user = userEvent.setup();
-  const childTab = createChildTab();
+  const childTab = createChildTab({ runStatus: 'running' });
 
   render(
     <ChatSessionWorkspacePanelContent
@@ -277,6 +280,7 @@ it('shows all session workspace entries in the overview', async () => {
   const projectFilesButton = screen.getByRole('button', { name: /Project files/ });
 
   expect((childSessionsButton as HTMLButtonElement).disabled).toBe(false);
+  expect(within(childSessionsButton).getByLabelText('Running')).toBeTruthy();
   expect((cronJobsButton as HTMLButtonElement).disabled).toBe(false);
   expect(projectFilesButton.compareDocumentPosition(screen.getByText('Token usage')) & Node.DOCUMENT_POSITION_FOLLOWING)
     .toBeTruthy();

package/src/features/chat/features/workspace/components/__tests__/chat-session-workspace-panel.test.tsx

@@ -1,4 +1,18 @@
-import { render, screen } from "@testing-library/react";
+import { getPresenter } from '@/app/presenters/app.presenter';
+import { buildSessionPath } from '@/features/chat/features/session/utils/chat-session-route.utils';
+import { AppPresenterProvider } from '@/app/components/app-presenter-provider';
+import type { ReactElement } from 'react';
+import { MemoryRouter } from 'react-router-dom';
+
+vi.mock('@/features/panel-apps/hooks/use-panel-apps', () => ({
+  usePanelApps: () => ({ data: { entries: [] } }),
+  useUpdatePanelAppPreferences: () => ({ mutate: vi.fn(), isPending: false }),
+}));
+function render(ui: ReactElement) {
+  return renderUi(<AppPresenterProvider><MemoryRouter initialEntries={[buildSessionPath('session-1')]}>{ui}</MemoryRouter></AppPresenterProvider>);
+}
+import { useWorkbenchSurfaceStore } from '@/shared/components/workbench/stores/workbench-surface.store';
+import { render as renderUi, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import { ChatSessionWorkspacePanel } from "@/features/chat/features/workspace/components/chat-session-workspace-panel";
@@ -91,7 +105,9 @@ function renderPanel(displayMode: "docked" | "overlay" = "docked") {
 
 describe("ChatSessionWorkspacePanel", () => {
   beforeEach(() => {
+    useWorkbenchSurfaceStore.setState({ surfaces: {} });
     vi.clearAllMocks();
+    vi.spyOn(getPresenter().chatComposerIntentManager, 'requestFileReference').mockImplementation(mocks.requestFileReference);
   });
 
   it("refreshes the active workspace file from the top action bar", async () => {
@@ -130,23 +146,46 @@ describe("ChatSessionWorkspacePanel", () => {
             onSelect: vi.fn(),
           },
         ]}
-        onClose={vi.fn()}
         onGoBack={vi.fn()}
         onGoForward={vi.fn()}
       />,
     );
 
-    await user.click(screen.getByRole("button", { name: "More actions" }));
+    await user.click(screen.getByRole("button", { name: "Page actions: Child session" }));
 
     expect(screen.getByRole("menuitem", { name: "Copy session ID" })).toBeTruthy();
   });
 
+  it("shows the running spinner on workspace tabs", () => {
+    render(
+      <WorkspaceTabsBar
+        canGoBack={false}
+        canGoForward={false}
+        tabs={[
+          {
+            key: "child-sessions",
+            kind: "child-sessions",
+            title: "Child sessions",
+            tooltip: "Child sessions",
+            active: true,
+            runStatus: "running",
+            onSelect: vi.fn(),
+          },
+        ]}
+        onGoBack={vi.fn()}
+        onGoForward={vi.fn()}
+      />,
+    );
+
+    expect(screen.getByLabelText("Running")).toBeTruthy();
+  });
+
   it("adds an opened project file to the active chat from its action menu", async () => {
     const user = userEvent.setup();
     renderPanel();
 
     await user.click(
-      screen.getByRole("button", { name: "File actions" }),
+      screen.getByRole("button", { name: "Page actions: Preview: README.md" }),
     );
     await user.click(screen.getByRole("menuitem", { name: "Add to chat" }));
 
@@ -166,17 +205,17 @@ describe("ChatSessionWorkspacePanel", () => {
     expect(panel.getAttribute("data-theme-surface")).toBe("workspace-panel");
 
     await user.click(
-      screen.getByRole("button", { name: "Maximize workspace panel" }),
+      screen.getByRole("button", { name: "Maximize" }),
     );
 
-    expect(panel.className).toContain("absolute");
-    expect(panel.className).not.toContain("fixed");
+    expect(panel.style.position).toBe("fixed");
+    expect(panel.style.position).toBe("fixed");
     expect(
       screen.queryByTestId("resizable-right-panel-handle"),
     ).toBeNull();
 
     await user.click(
-      screen.getByRole("button", { name: "Restore workspace panel" }),
+      screen.getByRole("button", { name: "Restore size" }),
     );
 
     expect(panel.className).not.toContain("absolute");
@@ -187,10 +226,8 @@ describe("ChatSessionWorkspacePanel", () => {
     renderPanel("overlay");
 
     expect(
-      screen.queryByRole("button", { name: "Maximize workspace panel" }),
+      screen.queryByRole("button", { name: "Maximize" }),
     ).toBeNull();
-    expect(screen.getByTestId("chat-session-workspace-panel").className).toContain(
-      "fixed",
-    );
+    expect(screen.getByTestId("chat-session-workspace-panel").style.position).toBe("fixed");
   });
 });