alezmad/claudemesh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web): show authenticated user in marketing header

Browse Source 
Header now checks session and shows avatar + name + Dashboard link
when logged in, instead of always showing Sign in / Start free.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Alejandro Gutiérrez
2026-04-13 08:55:33 +01:00
parent a365fef170
commit 0f46c787a7
1 changed files with 45 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
apps/web/src/modules/marketing/layout/header/header.tsx
View File

@@ -1,5 +1,7 @@
import Link from "next/link";
import { getSession } from "~/lib/auth/server";
const NAV = [
{ label: "Docs", href: "https://github.com/alezmad/claudemesh-cli#readme" },
{ label: "Blog", href: "/blog" },
@@ -9,7 +11,9 @@ const NAV = [
const OSS_REPO_URL = "https://github.com/alezmad/claudemesh-cli";
export const Header = () => {
export const Header = async () => {
const { user } = await getSession();
return (
<header
className="sticky top-0 z-40 w-full border-b border-[var(--cm-border)] bg-[var(--cm-bg)]/85 backdrop-blur-md"
@@ -81,19 +85,46 @@ export const Header = () => {
<path d="M12 .3a12 12 0 00-3.8 23.4c.6.1.8-.3.8-.6v-2.2c-3.3.7-4-1.4-4-1.4-.5-1.4-1.3-1.8-1.3-1.8-1.1-.7.1-.7.1-.7 1.2.1 1.8 1.2 1.8 1.2 1 1.8 2.8 1.3 3.5 1 .1-.8.4-1.3.7-1.6-2.7-.3-5.5-1.3-5.5-6a4.7 4.7 0 011.3-3.3c-.2-.3-.6-1.6.1-3.3 0 0 1-.3 3.3 1.2a11.5 11.5 0 016 0c2.3-1.5 3.3-1.2 3.3-1.2.7 1.7.3 3 .1 3.3a4.7 4.7 0 011.3 3.3c0 4.7-2.8 5.7-5.5 6 .4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6A12 12 0 0012 .3" />
</svg>
</a>
<Link
href="/auth/login"
className="hidden rounded-[var(--cm-radius-xs)] px-3 py-2 text-[14px] text-[var(--cm-fg-secondary)] transition-colors hover:text-[var(--cm-fg)] md:inline-flex"
>
Sign in
</Link>
<Link
href="/auth/register"
className="inline-flex items-center gap-1.5 rounded-[var(--cm-radius-xs)] bg-[var(--cm-clay)] px-4 py-2 text-[14px] font-medium text-[var(--cm-fg)] transition-colors hover:bg-[var(--cm-clay-hover)]"
>
Start free
<span className="hidden sm:inline">→</span>
</Link>
{user ? (
<>
<Link
href="/dashboard"
className="hidden rounded-[var(--cm-radius-xs)] px-3 py-2 text-[14px] text-[var(--cm-fg-secondary)] transition-colors hover:text-[var(--cm-fg)] md:inline-flex"
>
Dashboard
</Link>
<Link
href="/dashboard"
className="inline-flex items-center gap-2 rounded-[var(--cm-radius-xs)] bg-[var(--cm-bg-elevated)] px-3 py-2 text-[14px] text-[var(--cm-fg)] transition-colors hover:bg-[var(--cm-clay)]/20"
>
<span
className="flex h-6 w-6 items-center justify-center rounded-full bg-[var(--cm-clay)] text-[11px] font-semibold text-[var(--cm-fg)]"
>
{(user.name ?? user.email ?? "U").charAt(0).toUpperCase()}
</span>
<span className="hidden md:inline">
{user.name ?? user.email}
</span>
</Link>
</>
) : (
<>
<Link
href="/auth/login"
className="hidden rounded-[var(--cm-radius-xs)] px-3 py-2 text-[14px] text-[var(--cm-fg-secondary)] transition-colors hover:text-[var(--cm-fg)] md:inline-flex"
>
Sign in
</Link>
<Link
href="/auth/register"
className="inline-flex items-center gap-1.5 rounded-[var(--cm-radius-xs)] bg-[var(--cm-clay)] px-4 py-2 text-[14px] font-medium text-[var(--cm-fg)] transition-colors hover:bg-[var(--cm-clay-hover)]"
>
Start free
<span className="hidden sm:inline">→</span>
</Link>
</>
)}
</div>
</div>
</header>