Felix KemmlerandClaude Haiku 4.5
b11dc41310
- Extract firstName/lastName from auth me() endpoint (already provided by backend) - Show first name in greeting, fallback to username if not set - Remove hardcoded 'Sabina & Malik' greeting Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
49 lines
1.0 KiB
React
49 lines
1.0 KiB
React
import { Bell, LogOut, UserCircle2 } from "lucide-react";
|
|
import { useAuth } from "../app/AuthContext";
|
|
|
|
export default function Header() {
|
|
const { user, logout } = useAuth();
|
|
const displayName = user?.firstName || user?.username || "Benutzer";
|
|
|
|
return (
|
|
<header className="header">
|
|
|
|
<div className="header-left">
|
|
|
|
<h1>Guten Morgen {displayName} ☀️</h1>
|
|
|
|
<p>
|
|
Schön, dass ihr heute wieder da seid.
|
|
</p>
|
|
|
|
</div>
|
|
|
|
<div className="header-right">
|
|
|
|
<button className="icon-button notification">
|
|
|
|
<Bell size={20} />
|
|
|
|
<span className="notification-dot">
|
|
3
|
|
</span>
|
|
|
|
</button>
|
|
|
|
<button className="icon-button">
|
|
<UserCircle2 size={24} />
|
|
</button>
|
|
|
|
{user?.username && (
|
|
<span className="header-username">{user.username}</span>
|
|
)}
|
|
|
|
<button className="icon-button" title="Abmelden" onClick={logout}>
|
|
<LogOut size={20} />
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</header>
|
|
);
|
|
} |