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 +++++++++++++++++++++++++++---
 src/components/PostPreview/PostPreview.tsx |  1 +
 src/ts/types/articles.ts                   |  5 +++--
 src/utils/helpers/format.ts                |  2 ++
 4 files changed, 34 insertions(+), 5 deletions(-)

(limited to 'src')

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>
diff --git a/src/components/PostPreview/PostPreview.tsx b/src/components/PostPreview/PostPreview.tsx
index d89ddb5..3ea4c40 100644
--- a/src/components/PostPreview/PostPreview.tsx
+++ b/src/components/PostPreview/PostPreview.tsx
@@ -21,6 +21,7 @@ const PostPreview = ({
   const meta: ArticleMeta = {
     commentCount: post.commentCount ? post.commentCount : 0,
     dates: post.dates,
+    subjects: post.subjects,
     thematics: post.thematics,
   };
 
diff --git a/src/ts/types/articles.ts b/src/ts/types/articles.ts
index 44c1d79..01a4c38 100644
--- a/src/ts/types/articles.ts
+++ b/src/ts/types/articles.ts
@@ -28,6 +28,7 @@ export type ArticleMeta = {
   author?: ArticleAuthor;
   commentCount?: number;
   dates?: Dates;
+  subjects?: SubjectPreview[];
   thematics?: ThematicPreview[];
   website?: string;
 };
@@ -61,14 +62,14 @@ export type RawArticle = Pick<
 
 export type ArticlePreview = Pick<
   Article,
-  'commentCount' | 'dates' | 'id' | 'intro' | 'thematics' | 'title'
+  'commentCount' | 'dates' | 'id' | 'intro' | 'subjects' | 'thematics' | 'title'
 > & { featuredImage: Cover; slug: string };
 
 export type RawArticlePreview = Pick<
   Article,
   'commentCount' | 'id' | 'title'
 > & {
-  acfPosts: Pick<ACFPosts, 'postsInThematic'>;
+  acfPosts: ACFPosts;
   contentParts: Pick<ContentParts, 'beforeMore'>;
   date: string;
   featuredImage: RawCover;
diff --git a/src/utils/helpers/format.ts b/src/utils/helpers/format.ts
index 44536dd..e628369 100644
--- a/src/utils/helpers/format.ts
+++ b/src/utils/helpers/format.ts
@@ -37,6 +37,7 @@ export const getFormattedPostPreview = (rawPost: RawArticlePreview) => {
     update: modified,
   };
 
+  const subjects = acfPosts.postsInSubject ? acfPosts.postsInSubject : [];
   const thematics = acfPosts.postsInThematic ? acfPosts.postsInThematic : [];
 
   const formattedPost: ArticlePreview = {
@@ -46,6 +47,7 @@ export const getFormattedPostPreview = (rawPost: RawArticlePreview) => {
     id,
     intro: contentParts.beforeMore,
     slug,
+    subjects,
     thematics,
     title,
   };
-- 
cgit v1.2.3