Page title & meta description for webshop product

src/lib/components/PageMeta.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   export let title: string;
-  export let description: string;
+  export let description: string | undefined;
 </script>
 
 <svelte:head>

src/routes/shop/ProductTile.svelte

@@ -21,7 +21,7 @@
     </div>
 
     {#if !large}
-    <p class="subtext">{product?.subtext}</p>
+      <p class="subtext">{product?.subtext}</p>
     {/if}
   </div>
 </a>

src/routes/shop/[id]/+page.svelte

@@ -4,6 +4,7 @@
   import QuantitySelect from '$lib/components/QuantitySelect.svelte';
   import SizesSection from './SizesSection.svelte';
   import Button from '$lib/components/Button.svelte';
+  import PageMeta from '$lib/components/PageMeta.svelte';
   import type { PageData } from './$types';
   import type { IProduct, IVariation } from '$lib/interfaces/IProduct';
 
@@ -33,14 +34,14 @@
   let cooldownInputs = false;
   let quantity = 1;
   let selectedVariation: IVariation | undefined = defaultVariation();
+  let pageTitle = `Nettbutikk - ${product.name}`;
 
   $: addProductButtonText = cooldownInputs
     ? `${quantity} produkt${quantity > 1 ? 'er' : ''} lagt til`
     : `Legg til ${quantity} i handlekurven`;
-
-  onMount(() => document.head.appendChild(generateProductJsonLd(product)))
 </script>
 
+<PageMeta title="{pageTitle}" description="{product.description}" />
 <div class="product-container">
   <ProductTile product="{product}" large="{true}" />
 

src/routes/warehouse/WarehouseProductList.svelte

@@ -29,7 +29,7 @@
 
         <td class="name-and-price">
           <p><a href="/warehouse/{product.product_no}">{product.name}</a></p>
-          <p>{product?.variations?.length} variation(s)</p>
+          <p>{product?.variation_count} variation(s)</p>
         </td>
 
         <td class="stock-column">{product?.sum_stock}</td>