33 lines
1.3 KiB
TypeScript
33 lines
1.3 KiB
TypeScript
'use client';
|
|
|
|
import { titleCase } from '@/lib/utils';
|
|
import { useSelectedLayoutSegment } from 'next/navigation';
|
|
import Icon from '../Icon';
|
|
|
|
export default function Usernav({ isOpen, toggle }: { isOpen: boolean; toggle: () => void }) {
|
|
const segment = useSelectedLayoutSegment();
|
|
return (
|
|
<div className="z-50 flex w-full flex-row items-center justify-between border-b border-solid border-highlight-primary bg-secondary py-4 px-8">
|
|
<div className="flex flex-row items-center space-x-2 sm:space-x-0">
|
|
<div className="flex items-center">
|
|
<button onClick={toggle} className="block sm:hidden">
|
|
{isOpen ? <Icon name="close-line" /> : <Icon name="menu-2-line" />}
|
|
</button>
|
|
</div>
|
|
{segment && (
|
|
<div className="flex items-center justify-center text-highlight-secondary">
|
|
{titleCase(segment)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
<div className="flex flex-row items-center space-x-4">
|
|
<button className="flex items-center text-2xl text-error">
|
|
<Icon name="flag-line" />
|
|
</button>
|
|
<button className="flex items-center justify-center rounded-full border border-primary-400 bg-tertiary px-4 py-2">
|
|
T
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|