add shared navbar on /account, /chat, /bee

Three-link nav (Chat / Account / Bee) with active-route highlighting,
plus a t4t Gateway home link on the left. Replaces the bespoke header
on the chat page; account and bee gain the same top-of-page nav.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Felix FaerberandClaude Opus 4.7 committed 2026-05-28 09:29:20 +03:00
1 parent 86e0ab356a
commit 83760c4a9b
4 files changed
+64 -18

No files matched your search

+37
View File
@@ -0,0 +1,37 @@
import { NavLink } from 'react-router';
const ITEMS = [
{ to: '/chat', label: 'Chat' },
{ to: '/account', label: 'Account' },
{ to: '/bee', label: 'Bee' },
];
export function Nav() {
return (
<nav className='border-b border-neutral-200 bg-white'>
<div className='mx-auto flex max-w-3xl items-center justify-between px-6 py-3'>
<a href='/' className='text-sm font-semibold tracking-tight'>
t4t Gateway
</a>
<ul className='flex gap-1'>
{ITEMS.map((item) => (
<li key={item.to}>
<NavLink
to={item.to}
className={({ isActive }) =>
`inline-flex h-8 items-center rounded-md px-3 text-sm font-medium transition-colors ${
isActive
? 'bg-neutral-900 text-white'
: 'text-neutral-700 hover:bg-neutral-100'
}`
}
>
{item.label}
</NavLink>
</li>
))}
</ul>
</div>
</nav>
);
}