diff --git a/src/components/Duel/DuelError.tsx b/src/components/Duel/DuelError.tsx index 1482971266e6db8752a3c0eee1987626c6042b7f..d14ecfb0661d7b93339d31bef7287c87c59857ab 100644 --- a/src/components/Duel/DuelError.tsx +++ b/src/components/Duel/DuelError.tsx @@ -1,33 +1,34 @@ -import React, { useCallback } from 'react' -import { useI18n } from 'cozy-ui/transpiled/react/I18n' -import { useHistory } from 'react-router-dom' -import './duelError.scss' -import MuiButton from '@material-ui/core/Button' - -const DuelError: React.FC = () => { - const { t } = useI18n() - const history = useHistory() - - const goBack = useCallback(() => { - history.goBack() - }, [history]) - - return ( - <div className="duel-error-container"> - <div className="duel-error-message">{t('duel.global_error')}</div> - <div className="duel-error-button"> - <MuiButton - onClick={goBack} - classes={{ - root: 'btn-secondary-negative', - label: 'text-16-normal', - }} - > - {t('duel.error_go_back')} - </MuiButton> - </div> - </div> - ) -} - -export default DuelError +import React, { useCallback } from 'react' +import { useI18n } from 'cozy-ui/transpiled/react/I18n' +import { useHistory } from 'react-router-dom' +import './duelError.scss' +import Button from '@material-ui/core/Button' + +const DuelError: React.FC = () => { + const { t } = useI18n() + const history = useHistory() + + const goBack = useCallback(() => { + history.goBack() + }, [history]) + + return ( + <div className="duel-error-container"> + <div className="duel-error-message">{t('duel.global_error')}</div> + <div className="duel-error-button"> + <Button + aria-label={t('duel.accessibility.button_go_back')} + onClick={goBack} + classes={{ + root: 'btn-secondary-negative', + label: 'text-16-normal', + }} + > + {t('duel.button_go_back')} + </Button> + </div> + </div> + ) +} + +export default DuelError diff --git a/src/components/Duel/DuelUnlocked.spec.tsx b/src/components/Duel/DuelUnlocked.spec.tsx index 81269d0baaa114ae793c70ccaf923c1d0ae60b69..1e7f27255440996c7a5d7315bb677cfbfd21e6c0 100644 --- a/src/components/Duel/DuelUnlocked.spec.tsx +++ b/src/components/Duel/DuelUnlocked.spec.tsx @@ -6,7 +6,7 @@ import DuelUnlocked from 'components/Duel/DuelUnlocked' import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock' import { userChallengeData } from '../../../tests/__mocks__/userChallengeData.mock' import { formatNumberValues } from 'utils/utils' -import MuiButton from '@material-ui/core/Button' +import Button from '@material-ui/core/Button' import StyledIcon from 'components/CommonKit/Icon/StyledIcon' import { FluidType } from 'enum/fluid.enum' import { UserChallengeUpdateFlag } from 'enum/userChallenge.enum' @@ -79,7 +79,7 @@ describe('DuelUnlocked component', () => { ) wrapper .find('.button-start') - .find(MuiButton) + .find(Button) .simulate('click') expect(mockUserChallengeUpdateFlag).toHaveBeenCalledWith( userChallengeData[0], diff --git a/src/components/Duel/DuelUnlocked.tsx b/src/components/Duel/DuelUnlocked.tsx index b457c9e1030ade140d07cf60a1c6b648554a7818..83f236ce424b49bc8b5afdc2c771c604fd993da3 100644 --- a/src/components/Duel/DuelUnlocked.tsx +++ b/src/components/Duel/DuelUnlocked.tsx @@ -11,7 +11,7 @@ import { formatNumberValues, importIconbyId } from 'utils/utils' import defaultDuelIcon from 'assets/icons/visu/challenge/CHALLENGE0001.svg' import defaultIcon from 'assets/icons/visu/duel/default.svg' import StyledIcon from 'components/CommonKit/Icon/StyledIcon' -import MuiButton from '@material-ui/core/Button' +import Button from '@material-ui/core/Button' import { UserChallengeUpdateFlag } from 'enum/userChallenge.enum' interface DuelUnlockedProps { userChallenge: UserChallenge @@ -67,15 +67,16 @@ const DuelUnlocked: React.FC<DuelUnlockedProps> = ({ })}`} </div> <div className="button-start"> - <MuiButton + <Button + aria-label={t('duel.accessibility.button_start')} onClick={launchDuel} classes={{ root: 'btn-secondary-negative', label: 'text-16-normal', }} > - {t('duel.start_button')} - </MuiButton> + {t('duel.button_start')} + </Button> </div> </div> </> diff --git a/src/locales/fr.json b/src/locales/fr.json index b62103d88a2068578cca91823ce4f8620c3fd243..a4cd6cbda701c2ef73d9e094a9f11add4248921a 100644 --- a/src/locales/fr.json +++ b/src/locales/fr.json @@ -434,14 +434,18 @@ }, "duel": { "global_error": "Oups.. Une erreur est parvenue. Veuillez retourner à l'écran des défis", - "error_go_back": "Retour", + "button_go_back": "Retour", "average_info": "%{average} euros étant votre moyenne actuelle, relevez-vous le défi ?", - "start_button": "Allons-y !", + "button_start": "Allons-y !", "goal1": "Faites moins que votre moyenne actuelle sur %{durationInDays} jours", "goal2": "pour gagner le badge %{title}", "caption_average": "Votre moyenne à titre indicatif", "caption_consumption": "Votre consommation", - "caption_incoming": "Données à venir" + "caption_incoming": "Données à venir", + "accessibility": { + "button_go_back": "Retour", + "button_start": "Lancer le duel" + } }, "duel_result_modal": { "sucess": {