---
import { Font } from 'astro:assets';
import type { ImageMetadata } from 'astro';
import { SEO_SUFFIX, SITE_TITLE } from '@/consts';
import '@/styles/globals.css';
import { PreferenceSync } from '@/components/docs/PreferenceSync';
import FilmGrain from '@/components/FilmGrain';
import ThemeInit from '@/components/ThemeInit.astro';
interface Props {
title: string | string[];
description: string;
image?: ImageMetadata;
canonical?: string;
suffix?: string;
}
const { canonical, suffix } = Astro.props;
const canonicalURL = canonical || new URL(Astro.url.pathname, Astro.site);
const { title, description, image } = Astro.props;
const seoSuffix = suffix ?? SEO_SUFFIX;
const pageTitle = Array.isArray(title) ? title.join(' | ') : title;
const fullTitle =
pageTitle === SITE_TITLE ? `${SITE_TITLE} | ${seoSuffix}` : `${pageTitle} | ${SITE_TITLE} | ${seoSuffix}`;
---
{/* Global Metadata */}
{/* Important stuff */}
{/* Preconnect to Mux for faster video/image loading */}
{/* Font preloads */}
{/* Canonical URL */}
{/* Primary Meta Tags */}
{fullTitle}
{/* Open Graph / Facebook */}
{image && }
{/* Twitter */}
{image && }
{/* Whatever else */}