<script lang="ts">
  import { _ } from "svelte-i18n";
  import { env } from "$env/dynamic/public";

  interface Props {
    title: string;
    description: string | null | undefined;
    image?: string;
  }

  let {
    title,
    description,
    image = `${env.PUBLIC_URL || "http://localhost:3000"}/img/kamasutra.jpg`,
  }: Props = $props();
</script>

<svelte:head>
  <title>{$_("head.title", { values: { title } })}</title>
  <meta name="description" content={description} />
  <meta property="og:title" content={$_("head.title", { values: { title } })} />
  <meta property="og:description" content={description} />
  <meta property="og:image" content={image} />
</svelte:head>
