Files
Salon/frontend/src/layouts/MainLayout.jsx
T

46 lines
1.3 KiB
React

import { Outlet, Link } from "react-router-dom";
import { useTranslation } from "react-i18next";
import LocaleSwitch from "../components/LocaleSwitch";
import { useAuth } from "../contexts/AuthContext";
export default function MainLayout() {
const { t } = useTranslation();
const { isAuthenticated, logout } = useAuth();
return (
<div className="page">
<header className="main-header">
<nav className="main-nav">
<Link to="/" className="nav-brand">
{t("nav.home")}
</Link>
<Link to="/book" className="nav-link">
{t("nav.book")}
</Link>
<Link to="/pay" className="nav-link">
{t("nav.pay")}
</Link>
<Link to="/profile" className="nav-link">
{t("nav.profile")}
</Link>
<Link to="/bookings" className="nav-link">
{t("nav.bookings")}
</Link>
{isAuthenticated ? (
<button type="button" className="nav-link nav-logout" onClick={logout}>
{t("nav.logout")}
</button>
) : (
<Link to="/login" className="nav-link">
{t("nav.login")}
</Link>
)}
</nav>
<LocaleSwitch />
</header>
<main>
<Outlet />
</main>
</div>
);
}