aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/molecules/buttons/back-to-top.tsx
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2022-04-16 16:08:49 +0200
committerArmand Philippot <git@armandphilippot.com>2022-04-16 16:41:30 +0200
commit5a6e4eea16047083e2de0e91a1b3ed9be8d6eb68 (patch)
treeea0c5390aca73907aade5321f30cb7bf8d3ab1cb /src/components/molecules/buttons/back-to-top.tsx
parentdaffe6e8b9e2021ffb9d006482143bc4db985f02 (diff)
refactor: support React 18
I replaced the deprecated VFC type with FC type and made all children explicits. Formatjs is still not compatible with React 18 so I need to skip type checking when comitting. There are some type errors because of IntlProvider in Storybook stories.
Diffstat (limited to 'src/components/molecules/buttons/back-to-top.tsx')
-rw-r--r--src/components/molecules/buttons/back-to-top.tsx14
1 files changed, 6 insertions, 8 deletions
diff --git a/src/components/molecules/buttons/back-to-top.tsx b/src/components/molecules/buttons/back-to-top.tsx
index 8a52231..bd1925a 100644
--- a/src/components/molecules/buttons/back-to-top.tsx
+++ b/src/components/molecules/buttons/back-to-top.tsx
@@ -1,18 +1,16 @@
-import ButtonLink from '@components/atoms/buttons/button-link';
+import ButtonLink, {
+ type ButtonLinkProps,
+} from '@components/atoms/buttons/button-link';
import Arrow from '@components/atoms/icons/arrow';
-import { VFC } from 'react';
+import { FC } from 'react';
import { useIntl } from 'react-intl';
import styles from './back-to-top.module.scss';
-export type BackToTopProps = {
+export type BackToTopProps = Pick<ButtonLinkProps, 'target'> & {
/**
* Set additional classnames to the button wrapper.
*/
className?: string;
- /**
- * An element id (without hashtag) to use as anchor.
- */
- target: string;
};
/**
@@ -20,7 +18,7 @@ export type BackToTopProps = {
*
* Render a back to top link.
*/
-const BackToTop: VFC<BackToTopProps> = ({ className = '', target }) => {
+const BackToTop: FC<BackToTopProps> = ({ className = '', target }) => {
const intl = useIntl();
const linkName = intl.formatMessage({
defaultMessage: 'Back to top',