Spaces:
Running
Running
File size: 2,199 Bytes
ba95018 | 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 65 66 67 68 69 70 71 72 73 | import { useTheme } from '../../context/ThemeContext';
import { useAuth } from '../../context/AuthContext';
import { Sun, Moon, Eye, Sparkles, LogOut, User, Menu, Settings } from 'lucide-react';
export default function Navbar({ onPreview, onGenerate, onToggleSidebar }) {
const { theme, toggleTheme } = useTheme();
const { user, logout } = useAuth();
return (
<header className="navbar" role="banner">
<div className="navbar__brand">
<button
className="navbar__hamburger"
onClick={onToggleSidebar}
title="Toggle sidebar"
aria-label="Toggle sidebar"
>
<Menu size={20} />
</button>
<div className="navbar__icon navbar__icon--desktop">
<Sparkles size={18} />
</div>
<h1 className="navbar__title">
OT <span className="navbar__title-accent">NoteBuilder</span>
</h1>
</div>
<div className="navbar__actions">
{/* User pill — hidden on small screens via CSS */}
<div className="navbar__user">
<User size={12} />
<span className="navbar__user-name">{user}</span>
</div>
<button
className="navbar__btn"
onClick={onPreview}
title="Preview filled template"
>
<Eye size={16} />
<span className="navbar__btn-label">Preview</span>
</button>
<button
className="navbar__btn navbar__btn--primary"
onClick={onGenerate}
title="Generate AI clinical note"
>
<Sparkles size={16} />
<span className="navbar__btn-label">Generate Note</span>
</button>
<button
className="theme-toggle"
onClick={toggleTheme}
title={theme === 'dark' ? 'Switch to light mode' : 'Switch to dark mode'}
aria-label="Toggle theme"
>
{theme === 'dark' ? <Sun size={16} /> : <Moon size={16} />}
</button>
<button
className="navbar__btn navbar__btn--logout"
onClick={logout}
title="Sign out"
>
<LogOut size={16} />
</button>
</div>
</header>
);
}
|