refactor(components): extract MetaItem from MetaList

* replace `items` prop on MetaList with `children` prop: it was too
restrictive and the global options was not really useful. It is better
too give control to the consumers.

1 files changed, 5 insertions, 10 deletions

diff --git a/src/components/templates/page/page-layout.tsx b/src/components/templates/page/page-layout.tsx
index db71e07..75d308e 100644
--- a/src/components/templates/page/page-layout.tsx
+++ b/src/components/templates/page/page-layout.tsx
@@ -12,12 +12,7 @@ import { sendComment } from '../../../services/graphql';
 import type { SendCommentInput } from '../../../types';
 import { useHeadingsTree } from '../../../utils/hooks';
 import { Heading, Sidebar } from '../../atoms';
-import {
-  PageFooter,
-  type PageFooterProps,
-  PageHeader,
-  type PageHeaderProps,
-} from '../../molecules';
+import { PageFooter, PageHeader, type PageHeaderProps } from '../../molecules';
 import {
   CommentForm,
   CommentsList,
@@ -61,11 +56,11 @@ export type PageLayoutProps = {
   /**
    * The footer metadata.
    */
-  footerMeta?: PageFooterProps['meta'];
+  footerMeta?: ReactNode;
   /**
    * The header metadata.
    */
-  headerMeta?: PageHeaderProps['meta'];
+  headerMeta?: ReactNode;
   /**
    * The page id.
    */
@@ -240,8 +235,8 @@ export const PageLayout: FC<PageLayoutProps> = ({
           {children}
         </div>
       )}
-      {footerMeta?.length ? (
-        <PageFooter meta={footerMeta} className={styles.footer} />
+      {footerMeta ? (
+        <PageFooter className={styles.footer}>{footerMeta}</PageFooter>
       ) : null}
       <Sidebar
         aria-label={intl.formatMessage({