From 42315639d14ead79b5fac04508df8be793bbbc0b Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Fri, 17 Dec 2021 23:03:12 +0100
Subject: chore: add title and meta desc to posts

---
 src/pages/article/[slug].tsx | 54 ++++++++++++++++++++++++++++----------------
 src/services/graphql/post.ts |  1 +
 2 files changed, 36 insertions(+), 19 deletions(-)

(limited to 'src')
diff --git a/src/pages/article/[slug].tsx b/src/pages/article/[slug].tsx
index 05da913..df5ae51 100644
--- a/src/pages/article/[slug].tsx
+++ b/src/pages/article/[slug].tsx
@@ -10,31 +10,47 @@ import { NextPageWithLayout } from '@ts/types/app';
 import { ArticleProps } from '@ts/types/articles';
 import { loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next';
+import Head from 'next/head';
 import { ParsedUrlQuery } from 'querystring';
 import { ReactElement } from 'react';
 
 const SingleArticle: NextPageWithLayout<ArticleProps> = ({ post }) => {
-  const { author, comments, content, date, intro, subjects, thematics, title } =
-    post;
+  const {
+    author,
+    comments,
+    content,
+    date,
+    intro,
+    seo,
+    subjects,
+    thematics,
+    title,
+  } = post;
 
   return (
-    <article>
-      <PostHeader
-        author={author}
-        date={date}
-        intro={intro}
-        title={title}
-        thematics={thematics}
-      />
-      <div dangerouslySetInnerHTML={{ __html: content }}></div>
-      <PostFooter subjects={subjects} />
-      <section>
-        <h2>{t`Comments`}</h2>
-        <CommentsList comments={comments} />
-        <h2>{t`Leave a comment`}</h2>
-        <CommentForm />
-      </section>
-    </article>
+    <>
+      <Head>
+        <title>{seo.title}</title>
+        <meta name="description" content={seo.metaDesc} />
+      </Head>
+      <article>
+        <PostHeader
+          author={author}
+          date={date}
+          intro={intro}
+          title={title}
+          thematics={thematics}
+        />
+        <div dangerouslySetInnerHTML={{ __html: content }}></div>
+        <PostFooter subjects={subjects} />
+        <section>
+          <h2>{t`Comments`}</h2>
+          <CommentsList comments={comments} />
+          <h2>{t`Leave a comment`}</h2>
+          <CommentForm />
+        </section>
+      </article>
+    </>
   );
 };
 
diff --git a/src/services/graphql/post.ts b/src/services/graphql/post.ts
index cc6232a..245bf7a 100644
--- a/src/services/graphql/post.ts
+++ b/src/services/graphql/post.ts
@@ -75,6 +75,7 @@ const fetchPostBySlug: FetchPostByReturn = async (slug: string) => {
         }
         modified
         seo {
+          title
           metaDesc
           opengraphAuthor
           opengraphDescription
-- 
cgit v1.2.3

