refactor: split posts meta into smaller components

1 files changed, 42 insertions, 0 deletions

diff --git a/src/components/MetaItems/Thematics/Thematics.tsx b/src/components/MetaItems/Thematics/Thematics.tsx
new file mode 100644
index 0000000..a127715
--- /dev/null
+++ b/src/components/MetaItems/Thematics/Thematics.tsx
@@ -0,0 +1,42 @@
+import { MetaKind } from '@ts/types/app';
+import { ThematicPreview } from '@ts/types/taxonomies';
+import Link from 'next/link';
+import { useIntl } from 'react-intl';
+import { MetaItem } from '..';
+
+const Thematics = ({
+  list,
+  kind,
+}: {
+  list: ThematicPreview[];
+  kind: MetaKind;
+}) => {
+  const intl = useIntl();
+
+  const getThematics = () => {
+    return list.map((thematic) => {
+      return (
+        <Link key={thematic.databaseId} href={`/thematique/${thematic.slug}`}>
+          <a>{thematic.title}</a>
+        </Link>
+      );
+    });
+  };
+
+  return (
+    <MetaItem
+      title={intl.formatMessage(
+        {
+          defaultMessage:
+            '{thematicsCount, plural, =0 {Thematics:} one {Thematic:} other {Thematics:}}',
+          description: 'Thematics: thematics list meta label',
+        },
+        { thematicsCount: list.length }
+      )}
+      values={getThematics()}
+      kind={kind}
+    />
+  );
+};
+
+export default Thematics;