---
/* Head metadata: title, description, canonical, hreflang, OpenGraph, JSON-LD (SEO_SPEC). */
import type { Locale } from '@i18n/locales';
import { HTML_LANG, OG_LOCALE, otherLocale } from '@i18n/locales';
import { pathFor, type PageId } from '@i18n/slugMap';
import { absUrl, alternates, ogImagePath, buildJsonLd } from '@lib/seo';

interface Props {
  locale: Locale;
  pageId: PageId;
  title: string;
  description: string;
  ogType?: 'website' | 'profile' | 'article';
  jsonLdOpts?: {
    projectName?: string;
    projectType?: 'SoftwareApplication' | 'SoftwareSourceCode';
  };
}
const { locale, pageId, title, description, ogType = 'website', jsonLdOpts } = Astro.props;

const origin = Astro.site?.href ?? 'https://cesnimda.co.uk';
const canonical = absUrl(pathFor(pageId, locale), origin);
const alts = alternates(pageId, origin);
const ogImage = absUrl(ogImagePath(pageId, locale), origin);
const jsonLd = buildJsonLd(pageId, locale, origin, jsonLdOpts);
---

<title>{title}</title>
<meta name="description" content={description} />
<link rel="canonical" href={canonical} />

{alts.map((a) => <link rel="alternate" hreflang={a.hreflang} href={a.href} />)}

<meta property="og:type" content={ogType} />
<meta property="og:site_name" content="Connor Babbington" />
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:url" content={canonical} />
<meta property="og:locale" content={OG_LOCALE[locale]} />
<meta property="og:locale:alternate" content={OG_LOCALE[otherLocale(locale)]} />
<meta property="og:image" content={ogImage} />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={description} />
<meta name="twitter:image" content={ogImage} />

<meta name="robots" content="index,follow,max-image-preview:large" />
<meta http-equiv="content-language" content={HTML_LANG[locale]} />

{
  jsonLd.map((obj) => (
    <script type="application/ld+json" set:html={JSON.stringify(obj)} />
  ))
}
