From 70b4f633a6fbedb58c8b9134ac64ede854d489de Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Mon, 20 Nov 2023 12:27:46 +0100
Subject: refactor(components): replace PageLayout template with Page

* split pages in smaller components (it is both easier to maintain and
more readable, we avoid the use of fragments in pages directory)
* extract breadcrumbs from article tag (the navigation is not related
to the page contents)
* remove useReadingTime hook
* remove layout options except `isHome`
---
 src/components/templates/page/page-footer.tsx | 54 +++++++++++++++++++++++++++
 1 file changed, 54 insertions(+)
 create mode 100644 src/components/templates/page/page-footer.tsx

(limited to 'src/components/templates/page/page-footer.tsx')

diff --git a/src/components/templates/page/page-footer.tsx b/src/components/templates/page/page-footer.tsx
new file mode 100644
index 0000000..3bfece4
--- /dev/null
+++ b/src/components/templates/page/page-footer.tsx
@@ -0,0 +1,54 @@
+import NextImage from 'next/image';
+import { type ForwardRefRenderFunction, forwardRef } from 'react';
+import { useIntl } from 'react-intl';
+import type { PageLink } from '../../../types';
+import { Footer, type FooterProps, ButtonLink } from '../../atoms';
+import { MetaList, MetaItem } from '../../molecules';
+import styles from './page.module.scss';
+
+export type PageFooterProps = Omit<FooterProps, 'children'> & {
+  readMoreAbout: PageLink[];
+};
+
+const PageFooterWithRef: ForwardRefRenderFunction<
+  HTMLElement,
+  PageFooterProps
+> = ({ className = '', readMoreAbout, ...props }, ref) => {
+  const footerClass = `${styles.footer} ${className}`;
+  const intl = useIntl();
+  const metaLabel = intl.formatMessage({
+    defaultMessage: 'Read more posts about:',
+    description: 'PageFooter: the topics list label',
+    id: 'I6vhfk',
+  });
+
+  return (
+    <Footer {...props} className={footerClass} ref={ref}>
+      {readMoreAbout.length ? (
+        <MetaList>
+          <MetaItem
+            hasInlinedValues
+            label={metaLabel}
+            value={readMoreAbout.map((item) => {
+              return {
+                id: `${item.id}`,
+                value: (
+                  <ButtonLink className={styles.btn} to={item.url}>
+                    <>
+                      {item.logo ? (
+                        <NextImage {...item.logo} className={styles.logo} />
+                      ) : null}
+                      {item.name}
+                    </>
+                  </ButtonLink>
+                ),
+              };
+            })}
+          />
+        </MetaList>
+      ) : null}
+    </Footer>
+  );
+};
+
+export const PageFooter = forwardRef(PageFooterWithRef);
-- 
cgit v1.2.3