From 39f3c050b1418443b0691416805bb3a9e81eaf13 Mon Sep 17 00:00:00 2001
From: Kamil Kisiela <kamil.kisiela@gmail.com>
Date: Thu, 5 Dec 2024 18:22:08 +0100
Subject: [PATCH] Fix duplicated og:title

---
 src/components/tools-and-libraries.tsx | 19 +++++++++++++------
 theme.config.tsx                       | 14 +++++++++++---
 2 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/src/components/tools-and-libraries.tsx b/src/components/tools-and-libraries.tsx
index d0fcc44600..9013850106 100644
--- a/src/components/tools-and-libraries.tsx
+++ b/src/components/tools-and-libraries.tsx
@@ -168,16 +168,23 @@ export function CodePage({ allTags, data }: CodePageProps) {
 
   const [sort, setSort] = useState("popularity")
 
+  let description = `A collection of tools and libraries for GraphQL`
+  let title = "Tools and Libraries | GraphQL"
+  if (selectedTagsAsString) {
+    description += ` related to ${selectedTagsAsString}`
+    title = `${selectedTagsAsString} | ${title}`
+  }
+
   return (
     <>
       <NextHead>
-        <title>
-          {selectedTagsAsString ? selectedTagsAsString + " | " : ""}Tools and
-          Libraries | GraphQL
-        </title>
+        <title>{title}</title>
+        <meta property="og:title" content={title} key="meta-og-title" />
+        <meta name="description" content={description} key="meta-description" />
         <meta
-          name="description"
-          content={`A collection of tools and libraries for GraphQL${selectedTagsAsString ? ` related to ${selectedTagsAsString}` : ""}`}
+          property="og:description"
+          content={description}
+          key="meta-og-description"
         />
       </NextHead>
       <div className="container py-10 md:py-20">
diff --git a/theme.config.tsx b/theme.config.tsx
index 94bc9847f8..34acef9ad7 100644
--- a/theme.config.tsx
+++ b/theme.config.tsx
@@ -179,11 +179,19 @@ export default {
     return (
       <>
         <title>{title}</title>
-        <meta property="og:title" content={title} />
+        <meta property="og:title" content={title} key="meta-og-title" />
         {description && (
           <>
-            <meta name="description" content={description} />
-            <meta property="og:description" content={description} />
+            <meta
+              name="description"
+              content={description}
+              key="meta-description"
+            />
+            <meta
+              property="og:description"
+              content={description}
+              key="meta-og-description"
+            />
           </>
         )}
         {canonical && <link rel="canonical" href={canonical} />}