buildmymcpserver/apps/web/app/(dashboard)/layout.tsx
Marco Sadjadi 414903f16d feat(marketplace): dashboard nav link + My-templates filter
The logged-in user can now reach the marketplace and filter to their own
templates.

Dashboard nav:
- Added 'Marketplace' item (Overview · Servers · Marketplace · Audit · Settings).

/templates page — login-aware:
- Detects session via /v1/auth/me. Logged-in users get a 'Dashboard' + '+ New
  server' header instead of 'Home' + 'Start building'.
- New [All templates | My templates] scope toggle, shown only when logged in.
- 'My templates' loads GET /v1/templates/mine and shows EVERY status the user
  owns (public / hidden / draft / takedown) with a colored status badge on each
  card — so a template you unshared doesn't appear to have vanished.
- Sort tabs (trending/top/newest) hide in 'mine' scope — meaningless for a
  handful of own templates. Category filter + search still apply (client-side).
- Takedown cards link to the source server's Publish tab instead of the detail
  route (which 410s); everything else opens the detail page.

Backend:
- GET /v1/templates/mine (requireAuth) — all own templates, any status,
  registered before /:slug so the static route always wins the match.
- GET /v1/templates/:slug — now does an optional session check: the OWNER can
  view their own hidden/draft template (so a 'My templates' card click never
  dead-ends in a 404). takedown stays 410 for everyone, owner included — that's
  an admin decision, not the owner's to reverse.

Detail page:
- Fork CTA is gated on status === 'public'. For a non-public template the owner
  sees an amber 'not forkable — re-share from the Publish tab' notice plus a
  'Manage in server' link, instead of a Fork button that would fail silently.

Verified:
- GET /v1/templates/mine → marco's 1 template; 401 without auth
- Owner GET of a hidden template → 200 status:hidden; anon → 404
- Dashboard nav shows Marketplace (screenshot)
- /templates 'My templates' toggle → only own template, public badge, sort tabs
  hidden (screenshot)
2026-05-20 17:18:58 +02:00

62 lines
2.0 KiB
TypeScript

import Link from 'next/link';
import { Logo } from '@/components/logo';
import { LayoutGrid, Server, Settings, FileClock, Package } from 'lucide-react';
export default function DashboardLayout({ children }: { children: React.ReactNode }) {
return (
<div className="flex min-h-screen flex-col">
<header className="sticky top-0 z-50 border-b border-[--color-border] bg-[--color-bg]/85 backdrop-blur-md">
<div className="mx-auto flex h-12 max-w-7xl items-center justify-between px-6">
<div className="flex items-center gap-6">
<Logo />
<nav className="flex items-center gap-1">
<NavLink href="/dashboard" icon={<LayoutGrid size={13} />}>
Overview
</NavLink>
<NavLink href="/servers" icon={<Server size={13} />}>
Servers
</NavLink>
<NavLink href="/templates" icon={<Package size={13} />}>
Marketplace
</NavLink>
<NavLink href="/audit" icon={<FileClock size={13} />}>
Audit
</NavLink>
<NavLink href="/settings" icon={<Settings size={13} />}>
Settings
</NavLink>
</nav>
</div>
<Link
href="/servers/new"
className="inline-flex h-7 items-center gap-1.5 rounded-md bg-[--color-accent] px-2.5 text-[12px] font-medium text-white transition-colors duration-200 hover:bg-[#5557e8]"
>
+ New server
</Link>
</div>
</header>
<main className="flex-1 bg-[--color-bg]">{children}</main>
</div>
);
}
function NavLink({
href,
children,
icon,
}: {
href: string;
children: React.ReactNode;
icon: React.ReactNode;
}) {
return (
<Link
href={href}
className="inline-flex h-7 items-center gap-1.5 rounded-md px-2 text-[12.5px] text-[--color-fg-muted] transition-colors hover:bg-[--color-bg-subtle] hover:text-[--color-fg]"
>
{icon}
{children}
</Link>
);
}