Files
kkpab-site/frontend/components/site-header.tsx
T

64 lines
1.9 KiB
TypeScript

"use client";
import Link from "next/link";
import { usePathname } from "next/navigation";
type Props = {
siteName: string;
tagline: string;
phone: string;
};
const navItems = [
{ label: "Главная", href: "/" },
{ label: "Услуги", href: "/services" },
{ label: "Специалисты", href: "/specialists" },
{ label: "Документы", href: "/documents" },
{ label: "Отзывы", href: "/reviews" },
];
export function SiteHeader({ siteName, tagline, phone }: Props) {
const pathname = usePathname();
const compactName = siteName
.replace("Консультационное клиническое ", "")
.replace("консультационное клиническое ", "");
return (
<header className="site-header">
<div className="container site-header__inner">
<Link href="/" className="brand">
<span className="brand__eyebrow">Ставрополь</span>
<span className="brand__name">{compactName || "Патологоанатомическое бюро"}</span>
<span className="brand__tag">{tagline}</span>
</Link>
<nav className="nav" aria-label="Основная навигация">
{navItems.map((item) => {
const isActive =
item.href === "/"
? pathname === "/"
: pathname === item.href || pathname.startsWith(`${item.href}/`);
return (
<Link
key={item.href}
href={item.href}
className={`nav__link${isActive ? " nav__link--active" : ""}`}
>
{item.label}
</Link>
);
})}
</nav>
<div className="header-actions">
<a className="phone-pill" href={`tel:${phone.replace(/[^\d+]/g, "")}`}>
{phone}
</a>
</div>
</div>
</header>
);
}