diff --git a/frontend/src/components/pilot/ChatTabStrip.tsx b/frontend/src/components/pilot/ChatTabStrip.tsx new file mode 100644 index 00000000..7d610e25 --- /dev/null +++ b/frontend/src/components/pilot/ChatTabStrip.tsx @@ -0,0 +1,79 @@ +/** + * ChatTabStrip — two-tab strip at the top of the chat region: + * [Chat] [Script Builder ●] + * + * Visibility is controlled by the parent (AssistantChatPage) — this + * component renders whenever it's mounted. The parent decides whether + * to mount it based on fix state. + * + * Tab switching uses onChange; the parent toggles display:none on the + * tab contents so state is preserved across switches. + */ +import { cn } from '@/lib/utils' + +export type ChatTab = 'chat' | 'script_builder' + +export interface ChatTabStripProps { + active: ChatTab + onChange: (tab: ChatTab) => void + /** When true, shows the amber indicator dot on the Script Builder tab. */ + scriptBuilderHasProgress?: boolean +} + +export function ChatTabStrip({ + active, onChange, scriptBuilderHasProgress, +}: ChatTabStripProps) { + return ( +
+ onChange('chat')} + /> + onChange('script_builder')} + indicator={scriptBuilderHasProgress} + /> +
+ ) +} + +function TabButton({ + label, active, onClick, indicator, +}: { + label: string + active: boolean + onClick: () => void + indicator?: boolean +}) { + return ( + + ) +} + +export default ChatTabStrip