import React, { useEffect, useState } from 'react';
import { Octagon, UserRound } from 'lucide-react';
import BrandFace from './BrandFace'; import StatusPill from './StatusPill'; import AssistantPanel from './AssistantPanel'; import { useScanner } from '@/context/ScannerContext';
export default function AppHeader(){const {status}=useScanner();const [assistant,setAssistant]=useState(false);const [now,setNow]=useState(new Date());useEffect(()=>{const t=setInterval(()=>setNow(new Date()),1000);return()=>clearInterval(t)},[]);return <><header className="fixed inset-x-0 top-0 z-40 flex h-16 items-center gap-3 border-b border-white/10 bg-[#09090b]/95 px-3 backdrop-blur-xl md:px-5"><BrandFace onClick={()=>setAssistant(true)}/><div className="min-w-0"><h1 className="truncate text-sm font-bold tracking-[.14em] text-white">SHiRE SCANFORGE</h1><p className="hidden text-[10px] uppercase tracking-wider text-zinc-500 sm:block">Kinect 3D Scanner for 3D Printing</p></div><div className="ml-auto hidden gap-2 md:flex"><StatusPill label="Kinect" state={status==='ready'?status:'offline'}/><StatusPill label="Bridge" state={status}/></div><div className="hidden text-right xl:block"><p className="text-xs text-zinc-500">Current project</p><p className="text-sm">No project selected</p></div><time className="hidden font-mono text-xs text-zinc-400 sm:block">{now.toLocaleTimeString([], {hour:'2-digit',minute:'2-digit'})}</time><button aria-label="User profile" className="rounded-full border border-white/10 bg-white/5 p-2 text-zinc-400"><UserRound size={17}/></button>{status==='scanning'&&<button className="flex items-center gap-2 rounded-xl bg-red-600 px-3 py-2 text-xs font-bold"><Octagon size={16}/>STOP SCAN</button>}</header><AssistantPanel open={assistant} onClose={()=>setAssistant(false)}/></>}