import Link from "next/link";
import { Category, SiteConfig } from "@/lib/types";

type HeaderProps = {
  site: SiteConfig;
  categories: Category[];
};

export function Header({ site, categories }: HeaderProps) {
  return (
    <>
      <div className="top-strip">
        <div className="container">
          <span>{new Intl.DateTimeFormat("es-PY", { dateStyle: "full" }).format(new Date())}</span>
          <span>Newsletter | RSS | Anuncie con nosotros</span>
        </div>
      </div>
      <header className="site-header">
        <div className="container">
          <div className="brand-row">
            <Link className="brand" href="/">
              <span className="brand-mark">C</span>
              <span>
                <span className="brand-name">{site.name}</span>
                <span className="brand-tagline">{site.tagline}</span>
              </span>
            </Link>
            <Link className="button primary" href="/anuncie">
              Anuncie
            </Link>
          </div>
          <nav className="nav" aria-label="Secciones">
            <Link href="/">Portada</Link>
            {categories.map((category) => (
              <Link key={category.slug} href={`/seccion/${category.slug}`}>
                {category.name}
              </Link>
            ))}
            <Link href="/rss.xml">RSS</Link>
          </nav>
        </div>
      </header>
    </>
  );
}