SEO and language tests

app/[locale]/[[...slug]]/page.tsx

@@ -1,14 +1,16 @@
-// 'use client';
- 
 import getQueryFromSlug from 'helpers/getQueryFromSlug';
 import { docQuery } from 'lib/sanity/queries';
 import { client } from 'lib/sanity/sanity.client';
+import type { Metadata } from 'next';
 import { groq } from 'next-sanity';
 import CategoryPage from './category-page';
 import HomePage from './home-page';
 import ProductPage from './product-page';
 import SinglePage from './single-page';
 
+/**
+ * Get paths for each page.
+ */
 export async function generateStaticParams() {
   const paths = await client.fetch(groq`${docQuery}`, {
     next: { revalidate: 10 },
@@ -43,6 +45,45 @@ function filterDataToSingleItem(data: any, preview = false) {
   return data[0]
 }
 
+/**
+ * Generate metadata for each page.
+ */
+export async function generateMetadata({ params }: {params: { slug: string[], locale: string }}): Promise<Metadata> {
+  const { slug, locale } = params
+
+  const { query = '', queryParams } = getQueryFromSlug(slug, locale)
+
+  const pageData = await client.fetch(query, queryParams)
+
+  const data = filterDataToSingleItem(pageData, false)
+
+  const { seo, title } = data
+
+  return {
+    title: seo?.title ? seo?.title : title,
+    description: seo?.description
+      ? seo.description
+      : 'Webb och digitalbyrå från Göteborg',
+    openGraph: {
+      images: [
+        {
+          url: seo?.image?.asset?.url
+            ? seo.image.asset.url
+            : '/og-image.jpg',
+          width: 1200,
+          height: 630,
+          alt: seo?.coverImage?.alt
+            ? seo.coverImage.alt
+            : 'Kodamera AB',
+        },
+      ],
+    },
+  }
+}
+
+/**
+ * Render pages depending on type.
+ */
 export default async function Page({
   params,
 }: {

app/[locale]/layout.tsx

@@ -6,13 +6,29 @@ import { notFound } from 'next/navigation';
 import { ReactNode } from 'react';
 import './globals.css';
 
-const { TWITTER_CREATOR, TWITTER_SITE, SITE_NAME } = process.env;
+const SITE_NAME = "KM Storefront"
+const SITE_DESCRIPTION = "Webb och digitalbyrå från Göteborg"
+const TWITTER_CREATOR = "@kodamera.se"
+const TWITTER_SITE = "https://kodamera.se"
+const OG_IMAGE_URL = "/og-image.jpg"
+const OG_IMAGE_ALT = "Kodamera"
 
 export const metadata = {
   title: {
     default: SITE_NAME,
     template: `%s | ${SITE_NAME}`
   },
+  description: SITE_DESCRIPTION,
+  openGraph: {
+    images: [
+      {
+        url: OG_IMAGE_URL,
+        width: 1200,
+        height: 630,
+        alt: OG_IMAGE_ALT
+      },
+    ],
+  },
   robots: {
     follow: true,
     index: true
@@ -34,7 +50,7 @@ const inter = Inter({
 });
  
 export function generateStaticParams() {
-  return [{locale: 'sv'}, {locale: 'en'}, {locale: 'nn'}];
+  return [{locale: 'sv'}, {locale: 'en'}];
 }
 
 interface LocaleLayoutProps {
@@ -46,6 +62,7 @@ interface LocaleLayoutProps {
  
 export default async function LocaleLayout({children, params: {locale}}: LocaleLayoutProps) {
   let messages;
+  
   try {
     messages = (await import(`../../messages/${locale}.json`)).default;
   } catch (error) {