53 lines
1.7 KiB
TypeScript
53 lines
1.7 KiB
TypeScript
'use client';
|
|
import { findNavByUrl } from '@/config/navs';
|
|
import {
|
|
Breadcrumb,
|
|
BreadcrumbItem,
|
|
BreadcrumbLink,
|
|
BreadcrumbList,
|
|
BreadcrumbPage,
|
|
BreadcrumbSeparator,
|
|
} from '@workspace/airo-ui/components/breadcrumb';
|
|
import { SidebarTrigger } from '@workspace/airo-ui/components/sidebar';
|
|
import { useTranslations } from 'next-intl';
|
|
import { usePathname } from 'next/navigation';
|
|
import { Fragment, useMemo } from 'react';
|
|
|
|
export function Header() {
|
|
const t = useTranslations('menu');
|
|
const pathname = usePathname();
|
|
const items = useMemo(() => findNavByUrl(pathname), [pathname]);
|
|
return (
|
|
<header className='flex h-[84px] w-full items-center justify-between gap-2 sm:hidden'>
|
|
<SidebarTrigger />
|
|
|
|
<Breadcrumb>
|
|
<BreadcrumbList className={'text-[36px] font-semibold'}>
|
|
{items.map((item, index) => {
|
|
return (
|
|
<Fragment key={item?.title}>
|
|
{index !== items.length - 1 && (
|
|
<BreadcrumbItem>
|
|
<BreadcrumbLink
|
|
href={item?.url || '/dashboard'}
|
|
className={'font-semibold text-[#0F2C53]'}
|
|
>
|
|
{t(item?.title)}
|
|
</BreadcrumbLink>
|
|
</BreadcrumbItem>
|
|
)}
|
|
{index < items.length - 1 && <BreadcrumbSeparator />}
|
|
{index === items.length - 1 && (
|
|
<BreadcrumbPage className={'font-semibold text-[#0F2C53]'}>
|
|
{t(item?.title)}
|
|
</BreadcrumbPage>
|
|
)}
|
|
</Fragment>
|
|
);
|
|
})}
|
|
</BreadcrumbList>
|
|
</Breadcrumb>
|
|
</header>
|
|
);
|
|
}
|