import Link from "next/link";

const nav = [
  ["/", "总览"],
  ["/execution", "实盘策略"],
  ["/strategies", "策略库"],
  ["/friction", "实盘摩擦"],
  ["/news", "财经快讯"],
  ["/vault", "成果档案"],
];

export function SiteHeader() {
  return (
    <header className="site-header">
      <Link href="/" className="wordmark" aria-label="Quant Atlas 首页">
        <span className="wordmark-mark">Q</span>
        <span><b>QUANT ATLAS</b><small>www.quant-atlas</small></span>
      </Link>
      <nav aria-label="主导航">
        {nav.map(([href, label]) => <Link href={href} key={href}>{label}</Link>)}
      </nav>
      <div className="live-chip"><i /> CN SHADOW · 3 SLEEVES</div>
    </header>
  );
}

export function PageShell({ children }: { children: React.ReactNode }) {
  return <><SiteHeader /><main className="page-shell">{children}</main><footer className="site-footer"><span>QUANT ATLAS / RESEARCH SYSTEM</span><span>模拟研究，不构成投资建议</span></footer></>;
}

export function Breadcrumb({ items }: { items: { label: string; href?: string }[] }) {
  return <div className="breadcrumbs">{items.map((item, index) => <span key={item.label}>{index > 0 && " / "}{item.href ? <Link href={item.href}>{item.label}</Link> : item.label}</span>)}</div>;
}