aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/organisms/layout
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2022-05-15 16:36:58 +0200
committerArmand Philippot <git@armandphilippot.com>2022-05-15 16:36:58 +0200
commit235fe67d770f83131c9ec10b99012319440db690 (patch)
tree3b96e2c8a5877fe15a9cfa6bff46130fa7a04a65 /src/components/organisms/layout
parentfe2252ced2bb895e26179640553b5a6c02957d54 (diff)
chore: add Search page
Diffstat (limited to 'src/components/organisms/layout')
-rw-r--r--src/components/organisms/layout/header.stories.tsx9
-rw-r--r--src/components/organisms/layout/header.test.tsx12
-rw-r--r--src/components/organisms/layout/header.tsx21
3 files changed, 20 insertions, 22 deletions
diff --git a/src/components/organisms/layout/header.stories.tsx b/src/components/organisms/layout/header.stories.tsx
index c58c344..98d6377 100644
--- a/src/components/organisms/layout/header.stories.tsx
+++ b/src/components/organisms/layout/header.stories.tsx
@@ -1,5 +1,4 @@
import { ComponentMeta, ComponentStory } from '@storybook/react';
-import { IntlProvider } from 'react-intl';
import HeaderComponent from './header';
/**
@@ -10,6 +9,7 @@ export default {
component: HeaderComponent,
args: {
isHome: false,
+ searchPage: '#',
withLink: false,
},
argTypes: {
@@ -95,13 +95,6 @@ export default {
},
},
},
- decorators: [
- (Story) => (
- <IntlProvider locale="en">
- <Story />
- </IntlProvider>
- ),
- ],
parameters: {
layout: 'fullscreen',
},
diff --git a/src/components/organisms/layout/header.test.tsx b/src/components/organisms/layout/header.test.tsx
index 05baaec..a9896f8 100644
--- a/src/components/organisms/layout/header.test.tsx
+++ b/src/components/organisms/layout/header.test.tsx
@@ -14,14 +14,22 @@ const title = 'Assumenda quis quod';
describe('Header', () => {
it('renders the website title', () => {
- render(<Header title={title} photo={photo} nav={nav} isHome={true} />);
+ render(
+ <Header
+ searchPage="#"
+ title={title}
+ photo={photo}
+ nav={nav}
+ isHome={true}
+ />
+ );
expect(
screen.getByRole('heading', { level: 1, name: title })
).toBeInTheDocument();
});
it('renders the main nav', () => {
- render(<Header title={title} photo={photo} nav={nav} />);
+ render(<Header searchPage="#" title={title} photo={photo} nav={nav} />);
expect(screen.getByRole('navigation')).toBeInTheDocument();
});
});
diff --git a/src/components/organisms/layout/header.tsx b/src/components/organisms/layout/header.tsx
index f6ebc9c..18ebb31 100644
--- a/src/components/organisms/layout/header.tsx
+++ b/src/components/organisms/layout/header.tsx
@@ -5,28 +5,25 @@ import { FC } from 'react';
import Toolbar, { type ToolbarProps } from '../toolbar/toolbar';
import styles from './header.module.scss';
-export type HeaderProps = BrandingProps & {
- /**
- * Set additional classnames to the header element.
- */
- className?: string;
- /**
- * The main nav items.
- */
- nav: ToolbarProps['nav'];
-};
+export type HeaderProps = BrandingProps &
+ Pick<ToolbarProps, 'nav' | 'searchPage'> & {
+ /**
+ * Set additional classnames to the header element.
+ */
+ className?: string;
+ };
/**
* Header component
*
* Render the website header.
*/
-const Header: FC<HeaderProps> = ({ className, nav, ...props }) => {
+const Header: FC<HeaderProps> = ({ className, nav, searchPage, ...props }) => {
return (
<header className={`${styles.wrapper} ${className}`}>
<div className={styles.body}>
<Branding {...props} />
- <Toolbar nav={nav} className={styles.toolbar} />
+ <Toolbar nav={nav} searchPage={searchPage} className={styles.toolbar} />
</div>
</header>
);