diff --git a/packages/dashboard/app/components/ChatView.css b/packages/dashboard/app/components/ChatView.css index 2421a04b4..7420cedaa 100644 --- a/packages/dashboard/app/components/ChatView.css +++ b/packages/dashboard/app/components/ChatView.css @@ -214,6 +214,11 @@ font-size: 15px; } +.chat-thread-header-new-chat { + margin-left: auto; + flex-shrink: 0; +} + /* Messages */ .chat-messages { flex: 1; @@ -1026,6 +1031,10 @@ flex-wrap: wrap; } + .chat-thread-header-new-chat { + display: none; + } + .chat-session-delete-btn { opacity: 1; } diff --git a/packages/dashboard/app/components/ChatView.tsx b/packages/dashboard/app/components/ChatView.tsx index 45ad5c8ed..d3f9df1b3 100644 --- a/packages/dashboard/app/components/ChatView.tsx +++ b/packages/dashboard/app/components/ChatView.tsx @@ -1686,6 +1686,16 @@ export function ChatView({ projectId, addToast }: ChatViewProps) { {threadHeaderTitle} {showThreadHeaderModelTag && {activeModelTag}} + {!isMobile && ( + + )} )} diff --git a/packages/dashboard/app/components/__tests__/ChatView.test.tsx b/packages/dashboard/app/components/__tests__/ChatView.test.tsx index f942da04e..2f9c0f6a5 100644 --- a/packages/dashboard/app/components/__tests__/ChatView.test.tsx +++ b/packages/dashboard/app/components/__tests__/ChatView.test.tsx @@ -2348,6 +2348,49 @@ describe("resizable sidebar", () => { }); }); +describe("thread header New Chat button", () => { + const activeSession = { id: "session-001", agentId: "agent-001", status: "active", title: "Test Chat", createdAt: "2026-04-08T00:00:00.000Z", updatedAt: "2026-04-08T00:00:00.000Z" }; + + it("renders New Chat button in thread header on desktop when session is active", () => { + const viewportSpy = mockViewportMode("desktop"); + setupMockChat({ activeSession }); + + render(); + + const btn = screen.getByTestId("chat-thread-new-chat-btn"); + expect(btn).toBeInTheDocument(); + expect(btn).toHaveTextContent("New Chat"); + expect(btn).toHaveClass("btn", "btn-sm", "btn-primary"); + + viewportSpy.mockRestore(); + }); + + it("clicking thread header New Chat button opens the NewChatDialog", () => { + const viewportSpy = mockViewportMode("desktop"); + setupMockChat({ activeSession }); + + render(); + + const btn = screen.getByTestId("chat-thread-new-chat-btn"); + fireEvent.click(btn); + + expect(screen.getByTestId("chat-new-dialog-mode-toggle")).toBeInTheDocument(); + + viewportSpy.mockRestore(); + }); + + it("does not render New Chat button in thread header on mobile", () => { + const viewportSpy = mockViewportMode("mobile"); + setupMockChat({ activeSession }); + + render(); + + expect(screen.queryByTestId("chat-thread-new-chat-btn")).toBeNull(); + + viewportSpy.mockRestore(); + }); +}); + describe("ChatView mobile behavior", () => { let savedVisualViewport: typeof window.visualViewport; let savedInnerHeight: number;