refactor(components): merge HeadingButton and Widget components

The HeadingButton component was only used inside Widget component and
it is not very useful on its own so I merge the two components in a
new Collapsible component.

8 files changed, 103 insertions, 54 deletions

diff --git a/src/pages/404.tsx b/src/pages/404.tsx
index af95a36..ae6eac5 100644
--- a/src/pages/404.tsx
+++ b/src/pages/404.tsx
@@ -4,6 +4,7 @@ import type { ReactNode } from 'react';
 import { useIntl } from 'react-intl';
 import {
   getLayout,
+  Heading,
   Link,
   LinksListWidget,
   PageLayout,
@@ -98,24 +99,30 @@ const Error404Page: NextPageWithLayout<Error404PageProps> = ({
         breadcrumbSchema={breadcrumbSchema}
         widgets={[
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="thematics-list"
+            heading={
+              <Heading isFake level={3}>
+                {thematicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               thematicsList.map((thematic) =>
                 getPageLinkFromRawData(thematic, 'thematic')
               )
             )}
-            title={thematicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="thematics-list"
           />,
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="topics-list"
+            heading={
+              <Heading isFake level={3}>
+                {topicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               topicsList.map((topic) => getPageLinkFromRawData(topic, 'topic'))
             )}
-            title={topicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="topics-list"
           />,
         ]}
       >
diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx
index 7eef2f0..0241a5d 100644
--- a/src/pages/blog/index.tsx
+++ b/src/pages/blog/index.tsx
@@ -7,6 +7,7 @@ import { useCallback } from 'react';
 import { useIntl } from 'react-intl';
 import {
   getLayout,
+  Heading,
   LinksListWidget,
   Notice,
   PageLayout,
@@ -159,24 +160,30 @@ const BlogPage: NextPageWithLayout<BlogPageProps> = ({
         headerMeta={{ total: totalArticles }}
         widgets={[
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="thematics-list"
+            heading={
+              <Heading isFake level={3}>
+                {thematicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               thematicsList.map((thematic) =>
                 getPageLinkFromRawData(thematic, 'thematic')
               )
             )}
-            title={thematicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="thematics-list"
           />,
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="topics-list"
+            heading={
+              <Heading isFake level={3}>
+                {topicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               topicsList.map((topic) => getPageLinkFromRawData(topic, 'topic'))
             )}
-            title={topicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="topics-list"
           />,
         ]}
       >
diff --git a/src/pages/blog/page/[number].tsx b/src/pages/blog/page/[number].tsx
index b63fa9b..15d7245 100644
--- a/src/pages/blog/page/[number].tsx
+++ b/src/pages/blog/page/[number].tsx
@@ -7,6 +7,7 @@ import Script from 'next/script';
 import { useIntl } from 'react-intl';
 import {
   getLayout,
+  Heading,
   LinksListWidget,
   PageLayout,
   PostsList,
@@ -157,24 +158,30 @@ const BlogPage: NextPageWithLayout<BlogPageProps> = ({
         headerMeta={{ total: totalArticles }}
         widgets={[
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="thematics-list"
+            heading={
+              <Heading isFake level={3}>
+                {thematicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               thematicsList.map((thematic) =>
                 getPageLinkFromRawData(thematic, 'thematic')
               )
             )}
-            title={thematicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="thematics-list"
           />,
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="topics-list"
+            heading={
+              <Heading isFake level={3}>
+                {topicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               topicsList.map((topic) => getPageLinkFromRawData(topic, 'topic'))
             )}
-            title={topicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="topics-list"
           />,
         ]}
       >
diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx
index 519bcac..4e4e217 100644
--- a/src/pages/contact.tsx
+++ b/src/pages/contact.tsx
@@ -13,6 +13,7 @@ import {
   type NoticeKind,
   PageLayout,
   SocialMedia,
+  Heading,
 } from '../components';
 import { meta } from '../content/pages/contact.mdx';
 import { sendMail } from '../services/graphql';
@@ -83,10 +84,13 @@ const ContactPage: NextPageWithLayout = () => {
 
   const widgets = [
     <SocialMedia
+      heading={
+        <Heading isFake level={3}>
+          {socialMediaTitle}
+        </Heading>
+      }
       // eslint-disable-next-line react/jsx-no-literals -- Key allowed
       key="social-media"
-      title={socialMediaTitle}
-      level={2}
       media={[
         {
           icon: 'Github',
diff --git a/src/pages/cv.tsx b/src/pages/cv.tsx
index 84a1bb9..206c7f5 100644
--- a/src/pages/cv.tsx
+++ b/src/pages/cv.tsx
@@ -197,20 +197,25 @@ const CVPage: NextPageWithLayout = () => {
 
   const widgets = [
     <ImageWidget
-      // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-      key="image-widget"
-      expanded={true}
-      title={imageWidgetTitle}
-      level={2}
-      image={image}
       description={cvCaption}
+      heading={
+        <Heading isFake level={3}>
+          {imageWidgetTitle}
+        </Heading>
+      }
+      image={image}
       imageClassName={styles.image}
+      // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+      key="image-widget"
     />,
     <SocialMedia
+      heading={
+        <Heading isFake level={3}>
+          {socialMediaTitle}
+        </Heading>
+      }
       // eslint-disable-next-line react/jsx-no-literals -- Key allowed
       key="social-media"
-      title={socialMediaTitle}
-      level={2}
       media={[
         {
           icon: 'Github',
diff --git a/src/pages/recherche/index.tsx b/src/pages/recherche/index.tsx
index 54244b1..f47e40c 100644
--- a/src/pages/recherche/index.tsx
+++ b/src/pages/recherche/index.tsx
@@ -7,6 +7,7 @@ import { useCallback } from 'react';
 import { useIntl } from 'react-intl';
 import {
   getLayout,
+  Heading,
   LinksListWidget,
   Notice,
   PageLayout,
@@ -183,24 +184,30 @@ const SearchPage: NextPageWithLayout<SearchPageProps> = ({
         headerMeta={{ total: totalArticles }}
         widgets={[
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="thematics-list"
+            heading={
+              <Heading isFake level={3}>
+                {thematicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               thematicsList.map((thematic) =>
                 getPageLinkFromRawData(thematic, 'thematic')
               )
             )}
-            title={thematicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="thematics-list"
           />,
           <LinksListWidget
-            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
-            key="topics-list"
+            heading={
+              <Heading isFake level={3}>
+                {topicsListTitle}
+              </Heading>
+            }
             items={getLinksListItems(
               topicsList.map((topic) => getPageLinkFromRawData(topic, 'topic'))
             )}
-            title={topicsListTitle}
-            level={2}
+            // eslint-disable-next-line react/jsx-no-literals -- Key allowed
+            key="topics-list"
           />,
         ]}
       >
diff --git a/src/pages/sujet/[slug].tsx b/src/pages/sujet/[slug].tsx
index 94541b9..8e3100f 100644
--- a/src/pages/sujet/[slug].tsx
+++ b/src/pages/sujet/[slug].tsx
@@ -137,18 +137,24 @@ const TopicPage: NextPageWithLayout<TopicPageProps> = ({
           thematics
             ? [
                 <LinksListWidget
+                  heading={
+                    <Heading isFake level={3}>
+                      {thematicsListTitle}
+                    </Heading>
+                  }
+                  items={getLinksListItems(thematics)}
                   // eslint-disable-next-line react/jsx-no-literals -- Key allowed
                   key="related-thematics"
-                  items={getLinksListItems(thematics)}
-                  title={thematicsListTitle}
-                  level={2}
                 />,
                 <LinksListWidget
+                  heading={
+                    <Heading isFake level={3}>
+                      {topicsListTitle}
+                    </Heading>
+                  }
+                  items={getLinksListItems(topics)}
                   // eslint-disable-next-line react/jsx-no-literals -- Key allowed
                   key="topics"
-                  items={getLinksListItems(topics)}
-                  title={topicsListTitle}
-                  level={2}
                 />,
               ]
             : []
diff --git a/src/pages/thematique/[slug].tsx b/src/pages/thematique/[slug].tsx
index cf610c7..95b4780 100644
--- a/src/pages/thematique/[slug].tsx
+++ b/src/pages/thematique/[slug].tsx
@@ -119,18 +119,24 @@ const ThematicPage: NextPageWithLayout<ThematicPageProps> = ({
           topics
             ? [
                 <LinksListWidget
+                  heading={
+                    <Heading isFake level={3}>
+                      {thematicsListTitle}
+                    </Heading>
+                  }
+                  items={getLinksListItems(thematics)}
                   // eslint-disable-next-line react/jsx-no-literals -- Key allowed
                   key="thematics"
-                  items={getLinksListItems(thematics)}
-                  title={thematicsListTitle}
-                  level={2}
                 />,
                 <LinksListWidget
+                  heading={
+                    <Heading isFake level={3}>
+                      {topicsListTitle}
+                    </Heading>
+                  }
+                  items={getLinksListItems(topics)}
                   // eslint-disable-next-line react/jsx-no-literals -- Key allowed
                   key="related-topics"
-                  items={getLinksListItems(topics)}
-                  title={topicsListTitle}
-                  level={2}
                 />,
               ]
             : []