---
import { SITE } from '@/consts'

interface Props {
  title?: string
  description?: string
}

const { title = SITE.title, description = SITE.description } = Astro.props
const image = new URL('/static/1200x630.png', Astro.site)
---

<title>{`${title} | ${SITE.title}`}</title>
<meta name="description" content={description} />
<link rel="canonical" href={SITE.href} />

<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:image" content={image} />
<meta property="og:image:alt" content={title} />
<meta property="og:type" content="website" />
<meta property="og:locale" content={SITE.locale} />
<meta property="og:site_name" content={SITE.title} />
<meta property="og:url" content={Astro.url} />

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