diff options
Diffstat (limited to 'src/components/Buttons/ButtonToolbar')
| -rw-r--r-- | src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx | 27 |
1 files changed, 24 insertions, 3 deletions
diff --git a/src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx b/src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx index 246ad80..e9f6079 100644 --- a/src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx +++ b/src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx @@ -1,6 +1,6 @@ import { CloseIcon, CogIcon, SearchIcon } from '@components/Icons'; -import { t } from '@lingui/macro'; import { ForwardedRef, forwardRef, SetStateAction } from 'react'; +import { useIntl } from 'react-intl'; import styles from '../Buttons.module.scss'; type ButtonType = 'search' | 'settings'; @@ -17,6 +17,7 @@ const ButtonToolbar = ( }, ref: ForwardedRef<HTMLButtonElement> ) => { + const intl = useIntl(); const ButtonIcon = () => (type === 'search' ? <SearchIcon /> : <CogIcon />); const btnClasses = isActivated ? `${styles.toolbar} ${styles['toolbar--activated']}` @@ -38,9 +39,29 @@ const ButtonToolbar = ( </span> </span> {isActivated ? ( - <span className="screen-reader-text">{t`Close ${type}`}</span> + <span className="screen-reader-text"> + {intl.formatMessage( + { + defaultMessage: 'Close {type}', + description: 'ButtonToolbar: Close button', + }, + { + type, + } + )} + </span> ) : ( - <span className="screen-reader-text">{t`Open ${type}`}</span> + <span className="screen-reader-text"> + {intl.formatMessage( + { + defaultMessage: 'Open {type}', + description: 'ButtonToolbar: Open button', + }, + { + type, + } + )} + </span> )} </button> ); |
