Files
papers/site/src/components/Header.tsx
T
zeekay ca478225e8 feat: agent research papers + Zen creative AI + papers.hanzo.ai site
- Agent GRPO: training-free continuous learning for tool-using agents
- Federated Agents: federated agent intelligence
- Harness Hacking: agents that safely self-modify their harness
- Self-Improving Agents: telemetry-driven self-improvement
- Unified Harness: vertically integrated agent harness
- Zen creative AI: 3D, director, foley, medical, musician, reasoning,
  technical, translator, video, voice-clone, voyager, world models
- papers.hanzo.ai Next.js site
2026-03-01 18:40:58 -07:00

77 lines
2.4 KiB
TypeScript

'use client'
import { Moon, Sun } from 'lucide-react'
import { useTheme } from 'next-themes'
import type { SiteConfig } from '@/config/papers'
interface HeaderProps {
config: SiteConfig
}
export function Header({ config }: HeaderProps) {
const { theme, setTheme } = useTheme()
return (
<header className="border-b border-border/50 bg-background/80 backdrop-blur-sm sticky top-0 z-50">
<div className="max-w-7xl mx-auto px-6 py-4">
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<Logo />
<div>
<h1 className="text-lg font-semibold tracking-tight">{config.name}</h1>
<p className="text-xs text-muted-foreground">Research Papers</p>
</div>
</div>
<div className="flex items-center gap-4">
<nav className="hidden md:flex items-center gap-5 text-sm">
<a
href="https://proofs.hanzo.network"
className="text-muted-foreground hover:text-foreground transition-colors"
>
Formal Proofs
</a>
<a
href={config.website}
target="_blank"
rel="noopener noreferrer"
className="text-muted-foreground hover:text-foreground transition-colors"
>
Website
</a>
<a
href={config.github}
target="_blank"
rel="noopener noreferrer"
className="text-muted-foreground hover:text-foreground transition-colors"
>
GitHub
</a>
</nav>
<button
onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
className="p-2 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent transition-colors"
aria-label="Toggle theme"
>
<Sun className="h-4 w-4 hidden dark:block" />
<Moon className="h-4 w-4 block dark:hidden" />
</button>
</div>
</div>
</div>
</header>
)
}
function Logo() {
return (
<svg viewBox="0 0 24 24" className="w-7 h-7" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M4 4h6v16H4V4zm10 0h6v7h-6V4zm10 9v11h-6V13h6z"
fill="currentColor"
className="text-foreground"
/>
</svg>
)
}