diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-05-10 17:38:07 +0200 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-05-13 15:46:01 +0200 |
| commit | 9c8921db92d16b07ffc2a63ff3c80c4dcdd9ff9d (patch) | |
| tree | 52e87fa8e758ec51cfbf7aa200982e0a6f5ab1ca /src/components/organisms/widgets | |
| parent | 0d59a6d2995b4119865271ed1908ede0bb96497c (diff) | |
chore: add Project single pages
Diffstat (limited to 'src/components/organisms/widgets')
| -rw-r--r-- | src/components/organisms/widgets/links-list-widget.tsx | 2 | ||||
| -rw-r--r-- | src/components/organisms/widgets/sharing.stories.tsx | 25 | ||||
| -rw-r--r-- | src/components/organisms/widgets/sharing.test.tsx | 10 | ||||
| -rw-r--r-- | src/components/organisms/widgets/sharing.tsx | 25 |
4 files changed, 34 insertions, 28 deletions
diff --git a/src/components/organisms/widgets/links-list-widget.tsx b/src/components/organisms/widgets/links-list-widget.tsx index 37a20fc..3f291e3 100644 --- a/src/components/organisms/widgets/links-list-widget.tsx +++ b/src/components/organisms/widgets/links-list-widget.tsx @@ -4,7 +4,7 @@ import List, { type ListItem, } from '@components/atoms/lists/list'; import Widget, { type WidgetProps } from '@components/molecules/layout/widget'; -import { slugify } from '@utils/helpers/slugify'; +import { slugify } from '@utils/helpers/strings'; import { FC } from 'react'; import styles from './links-list-widget.module.scss'; diff --git a/src/components/organisms/widgets/sharing.stories.tsx b/src/components/organisms/widgets/sharing.stories.tsx index c3c3488..47213b6 100644 --- a/src/components/organisms/widgets/sharing.stories.tsx +++ b/src/components/organisms/widgets/sharing.stories.tsx @@ -22,9 +22,13 @@ export default { type: null, }, description: 'Default widget state (expanded or collapsed).', + table: { + category: 'Options', + defaultValue: { summary: true }, + }, type: { name: 'boolean', - required: true, + required: false, }, }, level: { @@ -34,9 +38,13 @@ export default { max: 6, }, description: 'The heading level.', + table: { + category: 'Options', + defaultValue: { summary: 2 }, + }, type: { name: 'number', - required: true, + required: false, }, }, media: { @@ -49,16 +57,6 @@ export default { required: true, }, }, - title: { - control: { - type: 'text', - }, - description: 'The widget title.', - type: { - name: 'string', - required: true, - }, - }, }, decorators: [ (Story) => ( @@ -78,14 +76,11 @@ const Template: ComponentStory<typeof SharingWidget> = (args) => ( */ export const Sharing = Template.bind({}); Sharing.args = { - expanded: true, data: { excerpt: 'Alias similique eius ducimus laudantium aspernatur. Est rem ut eum temporibus sit reprehenderit aut non molestias. Vel dolorem expedita labore quo inventore aliquid nihil nam. Possimus nobis enim quas corporis eos.', title: 'Accusantium totam nostrum', url: 'https://www.example.test', }, - level: 2, media: ['diaspora', 'facebook', 'linkedin', 'twitter', 'email'], - title: 'Sharing', }; diff --git a/src/components/organisms/widgets/sharing.test.tsx b/src/components/organisms/widgets/sharing.test.tsx index 265dbe1..48da49e 100644 --- a/src/components/organisms/widgets/sharing.test.tsx +++ b/src/components/organisms/widgets/sharing.test.tsx @@ -9,15 +9,7 @@ const postData: SharingData = { describe('Sharing', () => { it('renders a sharing widget', () => { - render( - <Sharing - data={postData} - media={['facebook', 'twitter']} - expanded={true} - title="Sharing" - level={2} - /> - ); + render(<Sharing data={postData} media={['facebook', 'twitter']} />); expect( screen.getByRole('link', { name: 'Share on facebook' }) ).toBeInTheDocument(); diff --git a/src/components/organisms/widgets/sharing.tsx b/src/components/organisms/widgets/sharing.tsx index 05a3f73..85dadb0 100644 --- a/src/components/organisms/widgets/sharing.tsx +++ b/src/components/organisms/widgets/sharing.tsx @@ -21,12 +21,20 @@ export type SharingData = { url: string; }; -export type SharingProps = Pick<WidgetProps, 'expanded' | 'level' | 'title'> & { +export type SharingProps = { /** * The page data to share. */ data: SharingData; /** + * The widget default state. + */ + expanded?: WidgetProps['expanded']; + /** + * The HTML heading level. + */ + level?: WidgetProps['level']; + /** * A list of active and ordered sharing medium. */ media: SharingMedium[]; @@ -37,8 +45,19 @@ export type SharingProps = Pick<WidgetProps, 'expanded' | 'level' | 'title'> & { * * Render a list of sharing links inside a widget. */ -const Sharing: FC<SharingProps> = ({ data, media, ...props }) => { +const Sharing: FC<SharingProps> = ({ + data, + media, + expanded = true, + level = 2, + ...props +}) => { const intl = useIntl(); + const widgetTitle = intl.formatMessage({ + defaultMessage: 'Share', + id: 'q3U6uI', + description: 'Sharing: widget title', + }); /** * Build the Diaspora sharing url with provided data. @@ -181,7 +200,7 @@ const Sharing: FC<SharingProps> = ({ data, media, ...props }) => { }; return ( - <Widget {...props}> + <Widget expanded={expanded} level={level} title={widgetTitle} {...props}> <ul className={styles.list}>{getItems()}</ul> </Widget> ); |
