From 812a8fad8cd703d3e501d03b280b8e5749f4ae57 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Tue, 11 Jan 2022 12:54:24 +0100 Subject: chore(widget): add a related topics widget --- .../Widget/RelatedTopics/RelatedTopics.tsx | 29 ++++++++++++++++++++++ .../Widget/ThematicsList/ThematicsList.module.scss | 7 ------ .../Widget/ThematicsList/ThematicsList.tsx | 2 +- .../Widget/TopicsList/TopicsList.module.scss | 7 ------ src/components/Widget/TopicsList/TopicsList.tsx | 2 +- src/components/Widget/Widget.module.scss | 7 ++++++ src/components/Widget/index.tsx | 2 ++ 7 files changed, 40 insertions(+), 16 deletions(-) create mode 100644 src/components/Widget/RelatedTopics/RelatedTopics.tsx delete mode 100644 src/components/Widget/ThematicsList/ThematicsList.module.scss delete mode 100644 src/components/Widget/TopicsList/TopicsList.module.scss create mode 100644 src/components/Widget/Widget.module.scss (limited to 'src') diff --git a/src/components/Widget/RelatedTopics/RelatedTopics.tsx b/src/components/Widget/RelatedTopics/RelatedTopics.tsx new file mode 100644 index 0000000..ad8f5ef --- /dev/null +++ b/src/components/Widget/RelatedTopics/RelatedTopics.tsx @@ -0,0 +1,29 @@ +import { t } from '@lingui/macro'; +import { SubjectPreview } from '@ts/types/taxonomies'; +import Link from 'next/link'; +import styles from '../Widget.module.scss'; + +const RelatedTopics = ({ topics }: { topics: SubjectPreview[] }) => { + const sortedSubjects = [...topics].sort((a, b) => + a.title.localeCompare(b.title) + ); + + const subjects = sortedSubjects.map((subject) => { + return ( +
  • + + {subject.title} + +
  • + ); + }); + + return ( +
    +

    {t`Related topics`}

    + +
    + ); +}; + +export default RelatedTopics; diff --git a/src/components/Widget/ThematicsList/ThematicsList.module.scss b/src/components/Widget/ThematicsList/ThematicsList.module.scss deleted file mode 100644 index 5f37c7a..0000000 --- a/src/components/Widget/ThematicsList/ThematicsList.module.scss +++ /dev/null @@ -1,7 +0,0 @@ -.title { - margin: 0; -} - -.list { - margin: var(--spacing-sm) 0; -} diff --git a/src/components/Widget/ThematicsList/ThematicsList.tsx b/src/components/Widget/ThematicsList/ThematicsList.tsx index 0dc0916..f120978 100644 --- a/src/components/Widget/ThematicsList/ThematicsList.tsx +++ b/src/components/Widget/ThematicsList/ThematicsList.tsx @@ -3,7 +3,7 @@ import { getAllThematics } from '@services/graphql/queries'; import Link from 'next/link'; import { useRouter } from 'next/router'; import useSWR from 'swr'; -import styles from './ThematicsList.module.scss'; +import styles from '../Widget.module.scss'; const ThematicsList = ({ title }: { title: string }) => { const router = useRouter(); diff --git a/src/components/Widget/TopicsList/TopicsList.module.scss b/src/components/Widget/TopicsList/TopicsList.module.scss deleted file mode 100644 index 5f37c7a..0000000 --- a/src/components/Widget/TopicsList/TopicsList.module.scss +++ /dev/null @@ -1,7 +0,0 @@ -.title { - margin: 0; -} - -.list { - margin: var(--spacing-sm) 0; -} diff --git a/src/components/Widget/TopicsList/TopicsList.tsx b/src/components/Widget/TopicsList/TopicsList.tsx index fabd40d..179d129 100644 --- a/src/components/Widget/TopicsList/TopicsList.tsx +++ b/src/components/Widget/TopicsList/TopicsList.tsx @@ -2,7 +2,7 @@ import { t } from '@lingui/macro'; import { getAllSubjects } from '@services/graphql/queries'; import Link from 'next/link'; import useSWR from 'swr'; -import styles from './TopicsList.module.scss'; +import styles from '../Widget.module.scss'; const TopicsList = () => { const { data, error } = useSWR('/api/subjects', getAllSubjects); diff --git a/src/components/Widget/Widget.module.scss b/src/components/Widget/Widget.module.scss new file mode 100644 index 0000000..5f37c7a --- /dev/null +++ b/src/components/Widget/Widget.module.scss @@ -0,0 +1,7 @@ +.title { + margin: 0; +} + +.list { + margin: var(--spacing-sm) 0; +} diff --git a/src/components/Widget/index.tsx b/src/components/Widget/index.tsx index 9a9aea8..a90fdca 100644 --- a/src/components/Widget/index.tsx +++ b/src/components/Widget/index.tsx @@ -1,5 +1,6 @@ import CVPreview from './CVPreview/CVPreview'; import RecentPosts from './RecentPosts/RecentPosts'; +import RelatedTopics from './RelatedTopics/RelatedTopics'; import Sharing from './Sharing/Sharing'; import SocialMedia from './SocialMedia/SocialMedia'; import ThematicsList from './ThematicsList/ThematicsList'; @@ -8,6 +9,7 @@ import TopicsList from './TopicsList/TopicsList'; export { CVPreview, RecentPosts, + RelatedTopics, Sharing, SocialMedia, ThematicsList, -- cgit v1.2.3