<script lang="ts">
    import { baseURL, companyName } from "../../../../config"
    import { location } from "../../../store"
    export let article: boolean = false
    export let datePublished: Date | null
    export let lastUpdated: Date | null
    export let metaDescription: string | null
    export let pageTitle: string | null
    export let product: BKDFProduct
</script>

<svelte:head>
    <meta
        property="og:locale"
        content="{'de_DE'}"
    />
    <meta
        property="og:url"
        content="{$location.url}"
    />
    <meta
        property="og:type"
        content="{article ? 'article' : 'website'}"
    />
    <meta
        property="og:title"
        content="{pageTitle}"
    />
    <meta
        property="og:description"
        content="{metaDescription}"
    />
    {#if product}
        <meta
            property="og:image"
            content="{product.featuredImage?.url}"
        />
        <meta
            property="og:image:width"
            content="{String(product.featuredImage?.width)}"
        />
        <meta
            property="og:image:height"
            content="{String(product.featuredImage?.height)}"
        />
        <meta
            property="og:image:alt"
            content="{product.title}"
        />
        <!-- Twitter Card Tags for Product -->
        <meta
            name="twitter:card"
            content="summary_large_image"
        />
        <meta
            name="twitter:title"
            content="{pageTitle}"
        />
        <meta
            name="twitter:description"
            content="{metaDescription}"
        />
        <meta
            name="twitter:image"
            content="{product.featuredImage?.url}"
        />
        <meta
            name="twitter:image:alt"
            content="{product.title}"
        />
    {:else}
        <meta
            property="og:image"
            content="{baseURL}/api/_/assets/logo/logo-blue.svg"
        />
        <meta
            property="og:image:width"
            content="576"
        />
        <meta
            property="og:image:height"
            content="158"
        />
        <meta
            property="og:image:alt"
            content="BinKrassDuFass Logo"
        />

        <!-- Twitter Card Tags for Default -->
        <meta
            name="twitter:card"
            content="summary_large_image"
        />
        <meta
            name="twitter:title"
            content="{pageTitle}"
        />
        <meta
            name="twitter:description"
            content="{metaDescription}"
        />
        <meta
            name="twitter:image"
            content="{baseURL}/api/_/assets/logo/logo-blue.svg"
        />
        <meta
            name="twitter:image:alt"
            content="BinKrassDuFass Logo"
        />
    {/if}

    {#if article}
        <meta
            property="article:publisher"
            content="{companyName}"
        />
        <meta
            property="article:author"
            content="{companyName}"
        />
        <meta
            property="article:published_time"
            content="{datePublished?.toISOString()}"
        />
        <meta
            property="article:modified_time"
            content="{lastUpdated?.toISOString()}"
        />
    {/if}
</svelte:head>
