aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/Buttons/ButtonToolbar
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Buttons/ButtonToolbar')
-rw-r--r--src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx27
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>
);