Spaces:
Running
Running
File size: 2,104 Bytes
e2ce418 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
import React from 'react';
import { Menu, Moon, Sun, ChevronRight, Brain, Zap } from 'lucide-react';
interface HeaderProps {
toggleSidebar: () => void;
toggleDarkMode: () => void;
darkMode: boolean;
aiState: {
quantumState: number[];
chaosState: number[];
activePerspectives: string[];
ethicalScore: number;
processingPower: number;
};
}
const Header: React.FC<HeaderProps> = ({
toggleSidebar,
toggleDarkMode,
darkMode,
aiState
}) => {
return (
<header className={`h-16 flex items-center justify-between px-4 border-b transition-colors duration-300 ${darkMode ? 'bg-gray-800 border-gray-700' : 'bg-white border-gray-200'}`}>
<div className="flex items-center">
<button
onClick={toggleSidebar}
className={`p-2 rounded-md ${darkMode ? 'hover:bg-gray-700' : 'hover:bg-gray-100'}`}
>
<Menu size={20} />
</button>
<div className="ml-4 flex items-center">
<Brain className="text-purple-600" size={24} />
<h1 className="ml-2 text-xl font-bold">Codette AI</h1>
<span className={`ml-2 px-2 py-0.5 text-xs rounded-full ${darkMode ? 'bg-purple-900 text-purple-200' : 'bg-purple-100 text-purple-800'}`}>
v2.0
</span>
</div>
</div>
<div className="flex items-center space-x-4">
<div className={`hidden md:flex items-center py-1 px-3 rounded-full text-sm ${
darkMode ? 'bg-blue-900 text-blue-200' : 'bg-blue-100 text-blue-800'
}`}>
<Zap size={14} className="mr-1" />
<span className="font-medium">Quantum State:</span>
<span className="ml-1 font-mono">
[{aiState.quantumState.map(v => v.toFixed(1)).join(', ')}]
</span>
</div>
<button
onClick={toggleDarkMode}
className={`p-2 rounded-md ${darkMode ? 'hover:bg-gray-700' : 'hover:bg-gray-100'}`}
>
{darkMode ? <Sun size={20} /> : <Moon size={20} />}
</button>
</div>
</header>
);
};
export default Header; |