---
import "../styles/global.css";

const { title, description, ogImage, articleDate } = Astro.props;
import { siteConfig } from "src/site.config";

const siteTitle = `${title}@breadone`;
// const canonicalURL = new URL(Astro.url.pathname, Astro.site);
const socialImageURL = new URL(ogImage ? ogImage : "/icon.png", Astro.url).href;
---

<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no" />

<link rel="icon" href="/favicon.ico" sizes="any" />

<!-- Primary Meta Tags -->
<title>{siteTitle}</title>
<meta name="title" content={siteTitle} />
<meta name="description" content={description} />
<meta name="author" content={siteConfig.author} />

<!-- Theme Colour -->
<meta name="theme-color" content={siteConfig.themeColorLight} />

<!-- Open Graph -->
<meta property="og:type" content={articleDate ? "article" : "website"} />
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<!-- <meta property="og:url" content={canonicalURL} /> -->
<meta property="og:site_name" content={siteConfig.title} />
<meta property="og:locale" content={siteConfig.ogLocale} />
<meta property="og:image" content={socialImageURL} />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
{
	articleDate && (
		<>
			<meta property="article:author" content={siteConfig.author} />
			<meta property="article:published_time" content={articleDate} />
		</>
	)
}

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<!-- <meta property="twitter:url" content={canonicalURL} /> -->
<meta property="twitter:title" content={title} />
<meta property="twitter:description" content={description} />
<meta property="twitter:image" content={socialImageURL} />

<!-- RSS auto-discovery -->
<!-- <link rel="alternate" type="application/rss+xml" title={siteConfig.title} href="/rss.xml" /> -->
