Files
hideyoshi-blog/src/ui/components/internal/header/desktop-header/base-desktop-header.tsx

43 lines
1.2 KiB
TypeScript

import ThemeToggle from '@/ui/components/internal/theme-toggle';
import Link from 'next/link';
export type HeaderLinksProps = {
links: Array<{
href: string;
label: string;
condition: boolean;
}>;
};
export type ProfileButtonProps = {
userButton: React.ReactNode;
};
export const BaseDesktopHeader = ({
links,
userButton,
}: HeaderLinksProps & ProfileButtonProps) => {
return (
<>
<div className='flex w-3/5 flex-row items-center justify-around align-middle'>
{links
.filter((link) => link.condition)
.map((link) => (
<Link
key={link.href}
href={link.href}
className='text-xl font-normal transition-colors hover:font-bold hover:text-primary'
>
{link.label}
</Link>
))}
</div>
<div className='flex items-center space-x-4'>
<ThemeToggle></ThemeToggle>
{userButton}
</div>
</>
);
};