import Link from "next/link";
import { getNavigationMenu } from "@/services/navigation.service";

const fallbackNavItems = [
  { title: "首页", href: "/" },
  { title: "产品", href: "/products" },
  { title: "解决方案", href: "/solutions" },
  { title: "案例", href: "/cases" },
  { title: "博客", href: "/blog" },
];

export default async function Header() {
  // 优先使用后台配置的主导航（apps.core.NavigationMenu，name="main"），
  // 未配置或接口不可用时回退到静态导航项，保证构建/渲染始终可用。
  const menu = await getNavigationMenu("main");
  const navItems = menu?.items.length
    ? menu.items.map((item) => ({
        title: item.label,
        href: item.url,
        newTab: item.open_in_new_tab,
      }))
    : fallbackNavItems.map((item) => ({ ...item, newTab: false }));

  return (
    <header className="sticky top-0 z-50 border-b border-slate-100 bg-white/80 backdrop-blur">
      <div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-6">
        <Link href="/" className="text-xl font-bold text-primary">
          企业官网
        </Link>
        <nav className="flex gap-8">
          {navItems.map((item) => (
            <Link
              key={item.href}
              href={item.href}
              className="text-slate-700"
              target={item.newTab ? "_blank" : undefined}
              rel={item.newTab ? "noreferrer" : undefined}
            >
              {item.title}
            </Link>
          ))}
        </nav>
      </div>
    </header>
  );
}