71 lines
1.9 KiB
JavaScript
71 lines
1.9 KiB
JavaScript
import React from 'react';
|
|
import { Outlet, NavLink, useNavigate } from 'react-router-dom';
|
|
import { useAuth } from '../hooks/useAuth';
|
|
import { LogOut, Home, Server, Settings } from 'lucide-react';
|
|
|
|
function Layout() {
|
|
const { user, logout, isAuthenticated } = useAuth();
|
|
const navigate = useNavigate();
|
|
|
|
React.useEffect(() => {
|
|
if (!isAuthenticated) {
|
|
navigate('/login');
|
|
}
|
|
}, [isAuthenticated, navigate]);
|
|
|
|
const handleLogout = () => {
|
|
logout();
|
|
navigate('/login');
|
|
};
|
|
|
|
if (!isAuthenticated) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="flex">
|
|
<aside className="sidebar">
|
|
<div className="mb-4">
|
|
<h2 className="text-xl font-bold text-white mb-2">🎭 Skrzynka Impostora</h2>
|
|
<p className="text-gray-300 text-sm">Panel administratora</p>
|
|
</div>
|
|
|
|
<nav className="mb-8">
|
|
<NavLink to="/dashboard" className="nav-link">
|
|
<Home size={16} className="inline mr-2" />
|
|
Dashboard
|
|
</NavLink>
|
|
<NavLink to="/servers" className="nav-link">
|
|
<Server size={16} className="inline mr-2" />
|
|
Serwery
|
|
</NavLink>
|
|
</nav>
|
|
|
|
<div className="mt-auto">
|
|
<div className="border-t border-gray-600 pt-4">
|
|
<div className="text-sm text-gray-300 mb-2">
|
|
Zalogowany jako:
|
|
</div>
|
|
<div className="text-white font-medium mb-4">
|
|
{user?.username}#{user?.discriminator}
|
|
</div>
|
|
<button
|
|
onClick={handleLogout}
|
|
className="discord-button secondary w-full flex items-center justify-center"
|
|
>
|
|
<LogOut size={16} className="mr-2" />
|
|
Wyloguj
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<main className="main-content">
|
|
<Outlet />
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Layout;
|