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.test.tsx | 31 +++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)

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

diff --git a/src/components/templates/page/page.test.tsx b/src/components/templates/page/page.test.tsx
index 21c5a86..fb06cb1 100644
--- a/src/components/templates/page/page.test.tsx
+++ b/src/components/templates/page/page.test.tsx
@@ -3,6 +3,8 @@ import { render, screen as rtlScreen } from '../../../../tests/utils';
 import type { BreadcrumbsItem } from '../../organisms';
 import { Page } from './page';
 import { PageBody } from './page-body';
+import { PageSection } from './page-section';
+import { Heading } from 'src/components/atoms';
 
 describe('Page', () => {
   it('renders its children', () => {
@@ -46,4 +48,33 @@ describe('Page', () => {
 
     expect(rtlScreen.getByText(body)).toHaveClass('page--body-last');
   });
+
+  it('can render a sectioned page', () => {
+    const sections = [
+      {
+        heading: 'excepturi ex dolorum',
+        contents:
+          'Id eius voluptas rerum nemo ullam omnis provident deserunt. Expedita sit ut consequatur deleniti. Maiores nam. Necessitatibus pariatur et qui dolor quia labore.',
+      },
+      {
+        heading: 'rerum corporis et',
+        contents:
+          'Vel maxime doloremque quo laborum debitis. Ab perferendis animi dolores et ut voluptatem. Tempore aut doloremque sunt enim aut sint. Quae iure saepe consectetur. Ex animi ut. Nobis aliquid iste accusantium nesciunt ab voluptas illum.',
+      },
+    ];
+
+    render(
+      <Page hasSections>
+        {sections.map((section) => (
+          <PageSection aria-label={section.heading} key={section.heading}>
+            <Heading level={2}>{section.heading}</Heading>
+            <p>{section.contents}</p>
+          </PageSection>
+        ))}
+      </Page>
+    );
+
+    expect(rtlScreen.getAllByRole('region')).toHaveLength(sections.length);
+    expect(rtlScreen.getByRole('article')).toHaveClass('page--full');
+  });
 });
-- 
cgit v1.2.3