diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx index c04c5bedd..b55909c65 100644 --- a/src/components/layout/Header.tsx +++ b/src/components/layout/Header.tsx @@ -1,8 +1,10 @@ /** * Header Component - * Top navigation bar with page title + * Top navigation bar with page title and page-specific controls. + * On the Chat page, shows session selector, refresh, thinking toggle, and new session. */ import { useLocation } from 'react-router-dom'; +import { ChatToolbar } from '@/pages/Chat/ChatToolbar'; // Page titles mapping const pageTitles: Record = { @@ -16,13 +18,15 @@ const pageTitles: Record = { export function Header() { const location = useLocation(); - - // Get current page title const currentTitle = pageTitles[location.pathname] || 'ClawX'; - + const isChatPage = location.pathname === '/chat'; + return ( -
+

{currentTitle}

+ + {/* Chat-specific controls */} + {isChatPage && }
); } diff --git a/src/pages/Chat/ChatToolbar.tsx b/src/pages/Chat/ChatToolbar.tsx index 82f6beb9c..f88867aac 100644 --- a/src/pages/Chat/ChatToolbar.tsx +++ b/src/pages/Chat/ChatToolbar.tsx @@ -1,8 +1,9 @@ /** * Chat Toolbar - * Session selector, refresh, and thinking toggle controls. + * Session selector, new session, refresh, and thinking toggle. + * Rendered in the Header when on the Chat page. */ -import { RefreshCw, Brain, ChevronDown } from 'lucide-react'; +import { RefreshCw, Brain, ChevronDown, Plus } from 'lucide-react'; import { Button } from '@/components/ui/button'; import { useChatStore } from '@/stores/chat'; import { cn } from '@/lib/utils'; @@ -11,6 +12,7 @@ export function ChatToolbar() { const sessions = useChatStore((s) => s.sessions); const currentSessionKey = useChatStore((s) => s.currentSessionKey); const switchSession = useChatStore((s) => s.switchSession); + const newSession = useChatStore((s) => s.newSession); const refresh = useChatStore((s) => s.refresh); const loading = useChatStore((s) => s.loading); const showThinking = useChatStore((s) => s.showThinking); @@ -51,6 +53,17 @@ export function ChatToolbar() { + {/* New Session */} + + {/* Refresh */}