fix: twitter title and description meta tags

gr-qft · Nov 28, 2022 · 48e7328 · 48e7328
1 parent cff0b60
commit 48e7328
Showing 1 changed file with 9 additions and 4 deletions.
diff --git a/components/docs/mdx-head.tsx b/components/docs/mdx-head.tsx
@@ -23,24 +23,29 @@ export default function MdxHead({ params, og }: MdxHeadProps) {
   const url = process.env.NEXT_PUBLIC_APP_URL
   let ogUrl = new URL(`${url}/og.jpg`)
 
+  const ogTitle = og?.heading || mdxDoc.title
+  const ogDescription = mdxDoc.description
+
   if (og?.type) {
     ogUrl = new URL(`${url}/api/og`)
-    ogUrl.searchParams.set("heading", og.heading || mdxDoc.title)
+    ogUrl.searchParams.set("heading", ogTitle)
     ogUrl.searchParams.set("type", og.type)
   }
 
   return (
     <>
       <title>{title}</title>
       <link rel="canonical" href={absoluteUrl(mdxDoc.slug)} />
-      <meta name="description" content={mdxDoc.description} />
+      <meta name="description" content={ogDescription} />
       <meta charSet="utf-8" />
       <meta name="viewport" content="width=device-width" />
       <meta property="og:type" content="website" />
-      <meta property="og:title" content={og.heading || mdxDoc.title} />
-      <meta property="og:description" content={mdxDoc.description} />
+      <meta property="og:title" content={ogTitle} />
+      <meta property="og:description" content={ogDescription} />
       <meta property="og:url" content={url} />
       <meta property="og:image" content={ogUrl.toString()} />
+      <meta property="twitter:title" content={ogTitle} />
+      <meta property="twitter:description" content={ogDescription} />
       <meta property="twitter:card" content="summary_large_image" />
       <meta property="twitter:url" content={url} />
       <meta property="twitter:image" content={ogUrl.toString()} />