import { useState } from 'react'; import { Link, useNavigate } from 'react-router-dom'; import { useAuthStore } from '@/features/auth/store/authStore'; import { useUser } from '@/features/auth/hooks/useUser'; import { useUIStore } from '@/stores/ui'; import { useTranslation } from '@/hooks/useTranslation'; import { EmailVerificationBadge } from '@/features/auth/components/EmailVerificationBadge'; import { NotificationMenu } from '@/components/notifications/NotificationMenu'; import { GlobalSearchBar } from '@/components/search/GlobalSearchBar'; import { RateLimitIndicator } from '@/components/RateLimitIndicator'; import { Button } from '@/components/ui/button'; import { FocusTrap } from '@/components/ui/focus-trap'; import { Tooltip } from '@/components/ui/tooltip'; import { cn } from '@/lib/utils'; import { User, Settings, LogOut, Moon, Sun, Monitor, Search, Cpu, } from 'lucide-react'; import type { BaseComponentProps } from '../types'; /** * Props for Header component * FE-TYPE-013: Fully typed component props */ export interface HeaderProps extends BaseComponentProps { // No additional props needed - uses global stores } export function Header(_props: HeaderProps) { const [isUserMenuOpen, setIsUserMenuOpen] = useState(false); const { logout } = useAuthStore(); const { data: user } = useUser(); const { theme, setTheme } = useUIStore(); const { t } = useTranslation(); const navigate = useNavigate(); const handleLogout = async () => { await logout(); navigate('/login'); }; const toggleTheme = () => { const newTheme = theme === 'light' ? 'dark' : theme === 'dark' ? 'system' : 'light'; setTheme(newTheme); }; const getThemeIcon = () => { switch (theme) { case 'light': return ; case 'dark': return ; default: return ; } }; return (

VezaOS

Core Network v2.4
{/* HUD System Status */}
Uplink Status
Connected
Node ID VZ-{user?.id?.slice(0, 4)}
{/* Global Search integrated */}
{/* Quick Stats Overlay - Styled specifically */}
Active_Stream_OK
{/* User Profile HUD */}
{isUserMenuOpen && ( setIsUserMenuOpen(false)} >
User_Registry
{user?.email}
{user && !user.is_verified && (
)}
setIsUserMenuOpen(false)} className="flex items-center gap-4 px-4 py-2 text-sm text-kodo-secondary hover:text-white hover:bg-white/5 rounded-xl transition-all group focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-kodo-steel focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void" > System.Profile setIsUserMenuOpen(false)} className="flex items-center gap-4 px-4 py-2 text-sm text-kodo-secondary hover:text-white hover:bg-white/5 rounded-xl transition-all group focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-kodo-steel focus-visible:ring-offset-2 focus-visible:ring-offset-kodo-void" > Global.Settings
)}
); }