feat(layout): add admin panel layout with sidebar and header
- Add Sidebar component with navigation items (dashboard, bookings, tournaments, pos, clients, memberships, reports, settings) - Add Header component with SiteSwitcher and user info/logout - Add SiteSwitcher component for SUPER_ADMIN multi-site selection - Add admin layout wrapper with AuthProvider - Add placeholder Dashboard page Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
40
apps/web/components/layout/header.tsx
Normal file
40
apps/web/components/layout/header.tsx
Normal file
@@ -0,0 +1,40 @@
|
||||
'use client';
|
||||
|
||||
import { useSession, signOut } from 'next-auth/react';
|
||||
import { LogOut } from 'lucide-react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { SiteSwitcher } from './site-switcher';
|
||||
|
||||
export function Header() {
|
||||
const { data: session } = useSession();
|
||||
|
||||
const handleLogout = () => {
|
||||
signOut({ callbackUrl: '/login' });
|
||||
};
|
||||
|
||||
const userRole = session?.user?.role || '';
|
||||
const displayRole = userRole
|
||||
.replace(/_/g, ' ')
|
||||
.toLowerCase()
|
||||
.replace(/\b\w/g, (l) => l.toUpperCase());
|
||||
|
||||
return (
|
||||
<header className="sticky top-0 z-30 flex h-16 items-center justify-between border-b border-primary-200 bg-white px-6 pl-64">
|
||||
<div className="ml-6">
|
||||
<SiteSwitcher />
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="text-right">
|
||||
<p className="text-sm font-medium text-primary-800">{session?.user?.name || 'Usuario'}</p>
|
||||
<p className="text-xs text-primary-500">{displayRole}</p>
|
||||
</div>
|
||||
<Button variant="ghost" size="icon" onClick={handleLogout} title="Cerrar sesión">
|
||||
<LogOut className="h-5 w-5" />
|
||||
</Button>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
|
||||
export default Header;
|
||||
Reference in New Issue
Block a user