summaryrefslogtreecommitdiffstats
path: root/src/components/Settings/ReduceMotion
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Settings/ReduceMotion')
-rw-r--r--src/components/Settings/ReduceMotion/ReduceMotion.tsx18
1 files changed, 14 insertions, 4 deletions
diff --git a/src/components/Settings/ReduceMotion/ReduceMotion.tsx b/src/components/Settings/ReduceMotion/ReduceMotion.tsx
index 01f8b67..c7b5775 100644
--- a/src/components/Settings/ReduceMotion/ReduceMotion.tsx
+++ b/src/components/Settings/ReduceMotion/ReduceMotion.tsx
@@ -1,9 +1,10 @@
import { Toggle } from '@components/Form';
-import { t } from '@lingui/macro';
import { LocalStorage } from '@services/local-storage';
import { useEffect, useState } from 'react';
+import { useIntl } from 'react-intl';
const ReduceMotion = () => {
+ const intl = useIntl();
const [isDeactivated, setIsDeactivated] = useState<boolean>(false);
useEffect(() => {
@@ -23,9 +24,18 @@ const ReduceMotion = () => {
return (
<Toggle
id="reduced-motion"
- label={t`Animations:`}
- leftChoice={t`On`}
- rightChoice={t`Off`}
+ label={intl.formatMessage({
+ defaultMessage: 'Animations:',
+ description: 'ReduceMotion: toggle label',
+ })}
+ leftChoice={intl.formatMessage({
+ defaultMessage: 'On',
+ description: 'ReduceMotion: toggle on label',
+ })}
+ rightChoice={intl.formatMessage({
+ defaultMessage: 'Off',
+ description: 'ReduceMotion: toggle off label',
+ })}
value={isDeactivated}
changeHandler={updateState}
/>