From 9b8eced56f5e029bc92ad59b47cb9fd146b5e1d2 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Tue, 11 Jan 2022 12:26:30 +0100
Subject: chore(meta): display subjects instead of thematics on Thematic pages

---
 src/components/PostMeta/PostMeta.tsx | 31 ++++++++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

(limited to 'src/components/PostMeta/PostMeta.tsx')

diff --git a/src/components/PostMeta/PostMeta.tsx b/src/components/PostMeta/PostMeta.tsx
index 6d40048..ece355a 100644
--- a/src/components/PostMeta/PostMeta.tsx
+++ b/src/components/PostMeta/PostMeta.tsx
@@ -13,14 +13,31 @@ const PostMeta = ({
   meta: ArticleMeta;
   mode?: PostMetaMode;
 }) => {
-  const { author, commentCount, dates, thematics, website } = meta;
-  const { locale } = useRouter();
+  const { author, commentCount, dates, subjects, thematics, website } = meta;
+  const { asPath, locale } = useRouter();
+  const isThematic = () => asPath.includes('/thematique/');
+
   const dateOptions: Intl.DateTimeFormatOptions = {
     day: 'numeric',
     month: 'long',
     year: 'numeric',
   };
 
+  const getSubjects = () => {
+    return (
+      subjects &&
+      subjects.map((subject) => {
+        return (
+          <dd key={subject.id} className={styles.description}>
+            <Link href={`/sujet/${subject.slug}`}>
+              <a>{subject.title}</a>
+            </Link>
+          </dd>
+        );
+      })
+    );
+  };
+
   const getThematics = () => {
     return (
       thematics &&
@@ -76,7 +93,7 @@ const PostMeta = ({
           </dd>
         </div>
       )}
-      {thematics && thematics.length > 0 && (
+      {!isThematic() && thematics && thematics.length > 0 && (
         <div className={styles.item}>
           <dt className={styles.term}>
             {thematics.length > 1 ? t`Thematics` : t`Thematic`}
@@ -84,6 +101,14 @@ const PostMeta = ({
           {getThematics()}
         </div>
       )}
+      {isThematic() && subjects && subjects.length > 0 && (
+        <div className={styles.item}>
+          <dt className={styles.term}>
+            {subjects.length > 1 ? t`Subjects` : t`Subject`}
+          </dt>
+          {getSubjects()}
+        </div>
+      )}
       {website && (
         <div className={styles.item}>
           <dt className={styles.term}>{t`Website`}</dt>
-- 
cgit v1.2.3

