Fix developer site broken links

src/components/DocsHeader.tsx

@@ -17,6 +17,7 @@ type MegaMenuData = { columns: MegaColumn[]; variant?: 'columns' | 'vertical' }
 type MenuItem = { label: string; href: string; mega?: MegaMenuData }
 
 const DOCS_BASE_PATH = '/docs'
+const DEVELOPERS_BASE_PATH = '/developers'
 const TEMPO_AI_GUIDE_URL = `${DOCS_BASE_PATH}/guide/using-tempo-with-ai`
 const TEMPO_DOCS_SKILL_URL = `${TEMPO_AI_GUIDE_URL}#docs-skill`
 const TEMPO_PLUGIN_URL = `${TEMPO_AI_GUIDE_URL}#install-tempo-plugins`
@@ -25,10 +26,10 @@ const TEMPO_SDK_DOCS_URL = `${DOCS_BASE_PATH}/sdk`
 
 function featurePath(slug: string) {
   const featurePaths: Record<string, string> = {
-    transactions: '/build/tempo-transactions',
-    tokens: '/build/tip20-tokens',
+    transactions: `${DEVELOPERS_BASE_PATH}/build/tempo-transactions`,
+    tokens: `${DEVELOPERS_BASE_PATH}/build/tip20-tokens`,
   }
-  return featurePaths[slug] ?? '/build'
+  return featurePaths[slug] ?? DEVELOPERS_BASE_PATH
 }
 
 function isExternal(href: string) {
@@ -358,10 +359,10 @@ const developersMenu: MegaMenuData = {
 }
 
 const menu: MenuItem[] = [
-  { label: 'Build', href: '/#protocol', mega: protocolMenu },
+  { label: 'Build', href: `${DEVELOPERS_BASE_PATH}#protocol`, mega: protocolMenu },
   { label: 'Resources', href: `${DOCS_BASE_PATH}/guide`, mega: developersMenu },
-  { label: 'Performance', href: '/performance' },
-  { label: 'Blog', href: '/blog' },
+  { label: 'Performance', href: `${DEVELOPERS_BASE_PATH}/performance` },
+  { label: 'Blog', href: `${DEVELOPERS_BASE_PATH}/blog` },
   { label: 'Docs', href: DOCS_BASE_PATH },
 ]
 

src/marketing/app/_components/BlogSection.tsx

@@ -1,4 +1,5 @@
 import Link from 'next/link'
+import { developersPath } from '../_lib/developersPaths'
 import FeaturedVisual from '../blog/_components/FeaturedVisual'
 import { formatDate } from '../blog/_lib/categories'
 import { getAllPosts, getFeaturedPost } from '../blog/_lib/posts'
@@ -24,7 +25,7 @@ export default function BlogSection() {
 
       <Reveal className="mt-16">
         <Link
-          href={`/blog/${featured.slug}`}
+          href={developersPath(`/blog/${featured.slug}`)}
           className="group grid border border-line transition-colors hover:bg-surface-block lg:grid-cols-2"
         >
           <div className="relative h-[200px] overflow-hidden border-line border-b lg:order-2 lg:h-auto lg:min-h-[280px] lg:border-b-0 lg:border-l">
@@ -51,7 +52,7 @@ export default function BlogSection() {
             <li key={post.slug}>
               <Reveal delay={i * 50}>
                 <Link
-                  href={`/blog/${post.slug}`}
+                  href={developersPath(`/blog/${post.slug}`)}
                   className="group flex flex-col gap-2 border-line border-b px-5 py-5 transition-colors hover:bg-surface-block lg:flex-row lg:items-center lg:justify-between lg:gap-12 lg:px-8"
                 >
                   <span className="font-sans text-[16px] text-foreground tracking-[0] transition-colors">
@@ -69,7 +70,7 @@ export default function BlogSection() {
         </ul>
         <Reveal>
           <Link
-            href="/blog"
+            href={developersPath('/blog')}
             className="flex items-center justify-center border-line border-b px-5 py-5 font-sans text-[16px] text-foreground tracking-[0] transition-colors hover:bg-surface-block lg:px-8"
           >
             View all blogs

src/marketing/app/_components/Footer.tsx

@@ -1,6 +1,7 @@
 import Link from 'next/link'
 import SimpleIconsGithub from '~icons/simple-icons/github'
 import SimpleIconsX from '~icons/simple-icons/x'
+import { developersPath } from '../_lib/developersPaths'
 import { featurePath } from '../_lib/featurePaths'
 import { TEMPO_SDK_DOCS_URL } from '../_lib/links'
 import EdgeMarkers from './EdgeMarkers'
@@ -72,21 +73,21 @@ const columns: FooterColumn[] = [
     links: [
       {
         label: 'Tempo Docs skill',
-        href: '/docs/guide/using-tempo-with-ai#docs-skill',
+        href: `${developersPath('/docs/guide/using-tempo-with-ai')}#docs-skill`,
       },
-      { label: 'Tempo MCP server', href: 'https://mcp.tempo.xyz' },
+      { label: 'Tempo MCP server', href: developersPath('/docs/guide/using-tempo-with-ai') },
       {
         label: 'Setup docs',
-        href: '/docs/guide/using-tempo-with-ai',
+        href: developersPath('/docs/guide/using-tempo-with-ai'),
       },
     ],
   },
   {
     header: 'Resources',
     links: [
-      { label: 'Blog', href: '/blog' },
-      { label: 'Performance', href: '/performance' },
-      { label: 'Open source', href: '/#open-source' },
+      { label: 'Blog', href: developersPath('/blog') },
+      { label: 'Performance', href: developersPath('/performance') },
+      { label: 'Open source', href: `${developersPath('/')}#open-source` },
       { label: 'Contact', href: CONTACT_URL },
     ],
   },

src/marketing/app/_components/Header.tsx

@@ -7,6 +7,7 @@ import Link from 'next/link'
 import { usePathname } from 'next/navigation'
 import { type ReactNode, useEffect, useLayoutEffect, useRef, useState } from 'react'
 import { AmpLogo, ClaudeLogo, CodexLogo } from '../../../components/AgentLogos'
+import { developersPath } from '../_lib/developersPaths'
 import { featurePath } from '../_lib/featurePaths'
 import { TEMPO_SDK_DOCS_URL } from '../_lib/links'
 import ArrowUpRight from './ArrowUpRight'
@@ -123,7 +124,7 @@ const developersMenu: MegaMenuData = {
   ],
 }
 
-const TEMPO_AI_GUIDE_URL = '/docs/guide/using-tempo-with-ai'
+const TEMPO_AI_GUIDE_URL = developersPath('/docs/guide/using-tempo-with-ai')
 const TEMPO_DOCS_SKILL_URL = `${TEMPO_AI_GUIDE_URL}#docs-skill`
 const TEMPO_PLUGIN_URL = `${TEMPO_AI_GUIDE_URL}#install-tempo-plugins`
 const TEMPO_MCP_URL = 'https://mcp.tempo.xyz'
@@ -169,10 +170,10 @@ function ActiveSquare({ activeKey }: { activeKey: string }) {
 }
 
 const menu: MenuItem[] = [
-  { label: 'Build', href: '/#protocol', mega: protocolMenu },
-  { label: 'Resources', href: '/docs', mega: developersMenu },
-  { label: 'Performance', href: '/performance' },
-  { label: 'Blog', href: '/blog' },
+  { label: 'Build', href: `${developersPath('/')}#protocol`, mega: protocolMenu },
+  { label: 'Resources', href: developersPath('/docs'), mega: developersMenu },
+  { label: 'Performance', href: developersPath('/performance') },
+  { label: 'Blog', href: developersPath('/blog') },
   { label: 'Docs', href: TEMPO_DOCS_URL },
 ]
 

src/marketing/app/_components/Hero.tsx

@@ -1,4 +1,5 @@
 import Link from 'next/link'
+import { developersPath } from '../_lib/developersPaths'
 import { featurePath } from '../_lib/featurePaths'
 import ArrowUpRight from './ArrowUpRight'
 import Button from './Button'
@@ -41,7 +42,7 @@ const HERO_PATHS = [
   {
     title: 'Performance at scale',
     desc: 'Throughput that pushes the frontier, with predictably low fees at scale.',
-    href: '/performance',
+    href: developersPath('/performance'),
   },
 ] as const
 

src/marketing/app/_components/PerfSection.tsx

@@ -3,6 +3,7 @@
 
 import Link from 'next/link'
 import type { ReactNode } from 'react'
+import { developersPath } from '../_lib/developersPaths'
 import { linePath } from '../performance/_lib/chart'
 import type { PerfRun } from '../performance/_lib/runs'
 import ArrowUpRight from './ArrowUpRight'
@@ -12,7 +13,7 @@ import { PALETTE } from './palette'
 import Reveal from './Reveal'
 import type { Stat } from './stats'
 
-const PERFORMANCE_PAGE = '/performance'
+const PERFORMANCE_PAGE = developersPath('/performance')
 
 // Sparkline points in a fixed 0–100 viewBox (8% vertical padding). Rendered
 // with preserveAspectRatio="none" + non-scaling strokes, so the same path

src/marketing/app/_lib/developersPaths.ts

@@ -0,0 +1,6 @@
+export const DEVELOPERS_BASE_PATH = '/developers'
+
+export function developersPath(path: string): string {
+  if (path === '/') return DEVELOPERS_BASE_PATH
+  return `${DEVELOPERS_BASE_PATH}${path.startsWith('/') ? path : `/${path}`}`
+}

src/marketing/app/_lib/featurePaths.ts

@@ -1,8 +1,10 @@
+import { developersPath } from './developersPaths'
+
 const featurePaths: Record<string, string> = {
-  transactions: '/build/tempo-transactions',
-  tokens: '/build/tip20-tokens',
+  transactions: developersPath('/build/tempo-transactions'),
+  tokens: developersPath('/build/tip20-tokens'),
 }
 
 export function featurePath(slug: string): string {
-  return featurePaths[slug] ?? '/build'
+  return featurePaths[slug] ?? developersPath('/build')
 }

src/marketing/app/blog/[slug]/page.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link'
 import Footer from '../../_components/Footer'
 import Header from '../../_components/Header'
 import Reveal from '../../_components/Reveal'
+import { developersPath } from '../../_lib/developersPaths'
 import { categoryBySlug, formatDate, isNew } from '../_lib/categories'
 import { getPost } from '../_lib/posts'
 
@@ -18,7 +19,7 @@ export default function BlogPostPage({ params }: { params: { slug: string } }) {
               Post not found
             </h1>
             <Link
-              href="/blog"
+              href={developersPath('/blog')}
               className="font-mono text-[12px] text-foreground/40 uppercase tracking-[0.02em] transition-colors hover:text-foreground"
             >
               ← Blog
@@ -38,7 +39,7 @@ export default function BlogPostPage({ params }: { params: { slug: string } }) {
         <article className="mx-auto w-full max-w-[760px] px-5 pt-14 lg:pt-20">
           <Reveal>
             <Link
-              href="/blog"
+              href={developersPath('/blog')}
               className="font-mono text-[12px] text-foreground/40 uppercase tracking-[0.02em] transition-colors hover:text-foreground"
             >
               ← Blog

src/marketing/app/blog/_components/PostExplorer.tsx

@@ -3,6 +3,7 @@
 import Link from 'next/link'
 import { useState } from 'react'
 import Reveal from '../../_components/Reveal'
+import { developersPath } from '../../_lib/developersPaths'
 import { categories, categoryBySlug, isNew, type PostMeta } from '../_lib/categories'
 
 const filters = [{ slug: 'all' as const, label: 'All' }, ...categories]
@@ -43,7 +44,7 @@ export default function PostExplorer({ posts }: { posts: PostMeta[] }) {
           <li key={post.slug}>
             <Reveal delay={Math.min(i, 6) * 40}>
               <Link
-                href={`/blog/${post.slug}`}
+                href={developersPath(`/blog/${post.slug}`)}
                 className="group flex flex-col gap-2.5 border-line border-b px-5 py-6 transition-colors hover:bg-surface-block lg:px-8"
               >
                 <span className="flex flex-wrap items-center gap-3">

src/marketing/app/blog/page.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link'
 import Footer from '../_components/Footer'
 import Header from '../_components/Header'
 import Reveal from '../_components/Reveal'
+import { developersPath } from '../_lib/developersPaths'
 import FeaturedVisual from './_components/FeaturedVisual'
 import PostExplorer from './_components/PostExplorer'
 import { formatDate, isNew } from './_lib/categories'
@@ -26,7 +27,7 @@ export default function BlogPage() {
 
         <Reveal className="px-5 pt-10 lg:px-8">
           <Link
-            href={`/blog/${featured.slug}`}
+            href={developersPath(`/blog/${featured.slug}`)}
             className="group grid border border-line transition-colors hover:bg-surface-block lg:grid-cols-2"
           >
             <div className="relative h-[220px] overflow-hidden border-line border-b lg:order-2 lg:h-auto lg:min-h-[320px] lg:border-b-0 lg:border-l">