update how metadata works

cesque · Mar 5, 2024 · 12bb77c · 12bb77c
1 parent 815f5a1
commit 12bb77c
Show file tree

Hide file tree

Showing 9 changed files with 32 additions and 62 deletions.
diff --git a/app/[slug]/head.js b/app/[slug]/head.js
diff --git a/app/[slug]/layout.js b/app/[slug]/layout.js
@@ -1,3 +1,9 @@
+import { getMetadata } from '@/utils/getMetadata'
+export async function generateMetadata({ params: { slug }}) {
+    return getMetadata(slug, 'article')
+}
+
+
 export default function Layout({ children }) {
     return <>
         { children }

diff --git a/app/head.js b/app/head.js
diff --git a/app/layout.js b/app/layout.js
@@ -1,5 +1,9 @@
 import '@/styles/globals.scss'
 
+import { getMetadata } from '@/utils/getMetadata'
+
+export const metadata = getMetadata(null, 'website')
+
 export default function Layout({ children }) {
     return <html>
         <body>

diff --git a/app/~/[slug]/head.js b/app/~/[slug]/head.js
diff --git a/app/~/[slug]/layout.js b/app/~/[slug]/layout.js
@@ -1,3 +1,7 @@
+import { getMetadata } from '@/utils/getMetadata'
+
+export const metadata = getMetadata(null, 'website')
+
 export default function Layout({ children }) {
     return <>
         { children }

diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/favicon.svg b/public/favicon.svg
diff --git a/utils/getMetadata.js b/utils/getMetadata.js
@@ -7,37 +7,26 @@ export function getMetadata(title, type) {
 
     let url = process.env.VERCEL_URL ? `https://${ process.env.VERCEL_URL }` : `http://localhost:3000`
 
-    let meta = {
-        og: {
+    return {
+        title: pageTitle,
+        description: description,
+        icons: {
+            icon: '/favicon.svg',
+        },
+        openGraph: {
             title: pageTitle,
+            description: description,
             type: type,
-            image: `${ url }/api/og?${ imageParams.toString() }`,
-            'image:width': 1000,
-            'image:height': 500,
-            description: description  
+            images: [{
+                url: `${ url }/api/og?${ imageParams.toString() }`,
+                width: 1000,
+                height: 500,
+            }],
         },
         twitter: {
             card: 'summary_large_image',
             site: '@cesque',
-        }
+        },
+        themeColor: '#000000',
     }
-
-    return <> 
-        <meta name="viewport" content="width=device-width, initial-scale=1" />
-        <meta name="theme-color" content="#000000" />
-        { 
-            Object.keys(meta).map(section => {
-                return Object.keys(meta[section]).map(name => {
-                    let content = meta[section][name]
-                    let nameText = `${section}:${name}` 
-
-                    if(section == 'og') {
-                        return <meta property={ nameText } content={ content } />
-                    } else {
-                        return <meta name={ nameText } content={ content } />
-                    }
-                })
-            }).flat()
-        }
-    </>
 }