fix: social tags

Author: thedaviddias

app/[lang]/[[...mdxPath]]/page.tsx

@@ -32,7 +32,7 @@ export async function generateMetadata({ params }): Promise<Metadata> {
     openGraph: {
       title,
       description,
-      type: 'article',
+      type: isHomepage ? 'website' : 'article',
       images: isPatternPage && patternName ? [{
         url: `/covers/patterns/${patternName}.png`,
         width: 800,
@@ -45,6 +45,18 @@ export async function generateMetadata({ params }): Promise<Metadata> {
         alt: description || title,
       }],
     },
+    twitter: {
+      card: 'summary_large_image',
+      site: '@thedaviddias',
+      creator: '@thedaviddias',
+      images: isPatternPage && patternName ? [{
+        url: `/covers/patterns/${patternName}.png`,
+        alt: `Example of ${patternName} pattern`,
+      }] : [{
+        url: ogImageUrl,
+        alt: description || title,
+      }],
+    },
     alternates: {
       canonical: `${baseUrl}/en/${path ? `${path}` : ''}`,
     },

app/[lang]/layout.tsx

@@ -30,7 +30,23 @@ const fontMono = FontMono({
   variable: "--font-mono",
 });
 
-export const metadata = metadataSEO
+export const metadata = {
+  ...metadataSEO,
+  openGraph: {
+    ...metadataSEO.openGraph,
+    type: 'website'
+  },
+  twitter: {
+    ...metadataSEO.twitter,
+    card: 'summary_large_image',
+    site: '@thedaviddias',
+    creator: '@thedaviddias',
+    images: [{
+      url: '/og/opengraph-image.png',
+      alt: 'UX Patterns for Developers - A collection of UX patterns for building effective UI components'
+    }]
+  }
+}
 
 export default async function RootLayout({ children, params }: {
   children: React.ReactNode

app/metadata.ts

@@ -36,7 +36,12 @@ export const metadataSEO: Metadata = {
   },
   twitter: {
     card: 'summary_large_image',
-    creator: '@thedaviddias'
+    creator: '@thedaviddias',
+    site: '@thedaviddias',
+    images: [{
+      url: '/og/opengraph-image.png',
+      alt: 'UX Patterns for Developers - A collection of UX patterns for building effective UI components'
+    }]
   },
   appleWebApp: {
     title: 'UX Patterns for Devs'