From 4f1181581e177dd80a76165a0f930ef4577f9c6a Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Wed, 22 Nov 2023 19:07:25 +0100
Subject: refactor(components): integrate sectioned page template into Page

* replace Section component by a generic one (other components should
be able to use it)
* add a PageSection component
* add `hasSections` prop to Page component
* remove sectioned-page template
---
 src/components/templates/page/page.tsx | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

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

diff --git a/src/components/templates/page/page.tsx b/src/components/templates/page/page.tsx
index f5f3ea5..b40c2f9 100644
--- a/src/components/templates/page/page.tsx
+++ b/src/components/templates/page/page.tsx
@@ -13,6 +13,12 @@ export type PageProps = HTMLAttributes<HTMLDivElement> & {
    * The breadcrumbs items.
    */
   breadcrumbs?: BreadcrumbsItem[];
+  /**
+   * Is it a regular page or a sectioned one?
+   *
+   * @default false
+   */
+  hasSections?: boolean;
   /**
    * Add an extra padding to the body when there are no footer/comments.
    *
@@ -25,13 +31,22 @@ export type PageProps = HTMLAttributes<HTMLDivElement> & {
 };
 
 const PageWithRef: ForwardRefRenderFunction<HTMLDivElement, PageProps> = (
-  { breadcrumbs, children, className = '', isBodyLastChild = false, ...props },
+  {
+    breadcrumbs,
+    children,
+    className = '',
+    hasSections = false,
+    isBodyLastChild = false,
+    ...props
+  },
   ref
 ) => {
   const wrapperClass = `${styles.wrapper} ${className}`;
-  const pageClass = `${styles.page} ${
-    styles[isBodyLastChild ? 'page--body-last' : '']
-  }`;
+  const pageClass = [
+    styles.page,
+    styles[hasSections ? 'page--full' : 'page--regular'],
+    styles[isBodyLastChild ? 'page--body-last' : ''],
+  ].join(' ');
   const intl = useIntl();
   const breadcrumbsLabel = intl.formatMessage({
     defaultMessage: 'Breadcrumbs',
-- 
cgit v1.2.3