diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-04-08 19:41:40 +0200 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-04-08 19:41:40 +0200 |
| commit | a5df28fad0dae266a857ae110c43b3cb8b23c996 (patch) | |
| tree | a32ea390e90697dc51c3ccb9018de9da2ee4fac3 /src/components/molecules/buttons/back-to-top.tsx | |
| parent | 5c75a302c2203cb3ebf31233121026b4775662cf (diff) | |
refactor: use a consistent classname prop and avoid children prop
I was using the FunctionComponent type for some component that do not
use children. So I change the type to VoidFunctionComponent to avoid
mistakes.
I also rename all the "classes" or "additionalClasses" props to
"className" to keep consistency between each components.
Diffstat (limited to 'src/components/molecules/buttons/back-to-top.tsx')
| -rw-r--r-- | src/components/molecules/buttons/back-to-top.tsx | 12 |
1 files changed, 6 insertions, 6 deletions
diff --git a/src/components/molecules/buttons/back-to-top.tsx b/src/components/molecules/buttons/back-to-top.tsx index f25d3e9..56c5247 100644 --- a/src/components/molecules/buttons/back-to-top.tsx +++ b/src/components/molecules/buttons/back-to-top.tsx @@ -1,14 +1,14 @@ import ButtonLink from '@components/atoms/buttons/button-link'; import Arrow from '@components/atoms/icons/arrow'; -import { FC } from 'react'; +import { VFC } from 'react'; import { useIntl } from 'react-intl'; import styles from './back-to-top.module.scss'; -type BackToTopProps = { +export type BackToTopProps = { /** - * Add additional classes to the button wrapper. + * Set additional classnames to the button wrapper. */ - additionalClasses?: string; + className?: string; /** * An element id (without hashtag) to use as anchor. */ @@ -20,7 +20,7 @@ type BackToTopProps = { * * Render a back to top link. */ -const BackToTop: FC<BackToTopProps> = ({ additionalClasses, target }) => { +const BackToTop: VFC<BackToTopProps> = ({ className = '', target }) => { const intl = useIntl(); const linkName = intl.formatMessage({ defaultMessage: 'Back to top', @@ -29,7 +29,7 @@ const BackToTop: FC<BackToTopProps> = ({ additionalClasses, target }) => { }); return ( - <div className={`${styles.wrapper} ${additionalClasses}`}> + <div className={`${styles.wrapper} ${className}`}> <ButtonLink shape="square" target={`#${target}`} aria-label={linkName}> <Arrow direction="top" /> </ButtonLink> |
