53 lines
1.7 KiB
TypeScript
53 lines
1.7 KiB
TypeScript
"use client";
|
|
import { usePathname } from "next/navigation";
|
|
import { useState } from "react";
|
|
import { UserHeaderSection } from "~/components/navbar/login-button";
|
|
import { MainNav } from "~/components/navbar/main-nav";
|
|
import { MobileNav } from "~/components/navbar/mobile-nav";
|
|
import { RicercaCommand } from "~/components/navbar/ricerca_command";
|
|
import { LangToggle } from "./lang-toggle";
|
|
import { ThemeSwitch } from "./theme-toggle";
|
|
|
|
export function SiteHeader() {
|
|
const pathname = usePathname();
|
|
const [openSidebar, setOpenSidebar] = useState(false);
|
|
const [openUserMenu, setOpenUserMenu] = useState(false);
|
|
const [openUserMenuSidebar, setOpenUserMenuSidebar] = useState(false);
|
|
|
|
const handleOpenMenu = (status: boolean) => {
|
|
setOpenUserMenu(status);
|
|
};
|
|
|
|
const handleOpenSidebar = (status: boolean) => {
|
|
setOpenSidebar(status);
|
|
};
|
|
return (
|
|
<header className="sticky top-0 z-50 w-full border-muted border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
|
<div className="mx-auto flex h-14 w-full items-center pr-3 pl-4 md:pr-4 md:pl-8">
|
|
<MainNav />
|
|
<MobileNav
|
|
open={openSidebar}
|
|
pathname={pathname}
|
|
setOpen={setOpenSidebar}
|
|
setUserOpen={setOpenUserMenuSidebar}
|
|
userOpen={openUserMenuSidebar}
|
|
/>
|
|
|
|
<div className="float-end flex flex-1 items-center justify-end gap-2.5">
|
|
<RicercaCommand />
|
|
|
|
<div className="hidden w-fit items-center gap-2.5 md:flex">
|
|
<LangToggle />
|
|
<ThemeSwitch />
|
|
</div>
|
|
<UserHeaderSection
|
|
key={pathname}
|
|
open={openUserMenu}
|
|
setOpen={handleOpenMenu}
|
|
setSidebar={handleOpenSidebar}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|