From 93d3b59c53f3c367655ca70ecfdcc3b8aaa7d11d Mon Sep 17 00:00:00 2001
From: Pierre Ecarlat <pecarlat@grandlyon.com>
Date: Thu, 11 Jul 2024 15:00:49 +0000
Subject: [PATCH] fix(a11y): Added aria roles to lists
---
.../Analysis/Comparison/Comparison.spec.tsx | 6 +-
.../Analysis/Comparison/Comparison.tsx | 6 +-
.../FluidPerformanceIndicator.spec.tsx | 4 +-
.../Comparison/FluidPerformanceIndicator.tsx | 11 +-
.../TemperatureComparisonModal.tsx | 13 +-
.../TemperatureComparisonModal.spec.tsx.snap | 2 +-
.../FluidPerformanceIndicator.spec.tsx.snap | 134 +++++++++++-------
.../Comparison/fluidPerformanceIndicator.scss | 20 +--
.../ElecHalfHourMonthlyAnalysis.tsx | 70 +++++----
.../ElecInfoModal.tsx | 12 +-
.../ElecHalfHourMonthlyAnalysis.spec.tsx.snap | 4 +-
.../__snapshots__/ElecInfoModal.spec.tsx.snap | 4 +-
.../elecHalfHourMonthlyAnalysis.scss | 4 +
.../MaxConsumptionCard/MaxConsumptionCard.tsx | 26 ++--
.../MaxConsumptionCard.spec.tsx.snap | 4 +-
.../ProfileComparatorRow.tsx | 7 +-
.../EpglConnectModal/EpglConnectModal.tsx | 13 +-
.../ExpiredConsentModal.tsx | 12 +-
.../ExpiredConsentModal.spec.tsx.snap | 2 +-
.../Connection/GRDFConnect/GrdfModalHint.tsx | 11 +-
.../Connection/SGEConnect/SgeModalHint.tsx | 11 +-
.../SgeConnectView.spec.tsx.snap | 14 +-
.../__snapshots__/SgeModalHint.spec.tsx.snap | 2 +-
.../DataloadSectionDetail.tsx | 6 +-
.../EstimatedConsumptionModal.tsx | 12 +-
.../ConsumptionVisualizer/NoDataModal.tsx | 12 +-
.../EstimatedConsumptionModal.spec.tsx.snap | 2 +-
.../__snapshots__/NoDataModal.spec.tsx.snap | 2 +-
.../CustomPopup/CustomPopupModal.tsx | 11 +-
.../CustomPopupModal.spec.tsx.snap | 2 +-
.../DateNavigator/DateNavigator.tsx | 25 ++--
.../__snapshots__/DateNavigator.spec.tsx.snap | 4 +-
.../__snapshots__/lastDuelModal.spec.tsx.snap | 3 +-
.../Duel/LastDuelModal/lastDuelModal.tsx | 12 +-
.../EcogestureCard/EcogestureCard.tsx | 1 +
.../EcogestureCard.spec.tsx.snap | 1 +
.../EcogestureInitModal.tsx | 13 +-
.../EcogestureInitModal.spec.tsx.snap | 2 +-
.../EcogestureList/EcogestureList.tsx | 2 +-
.../EcogestureList.spec.tsx.snap | 1 +
.../EcogestureModal/EcogestureModal.tsx | 11 +-
.../EcogestureResetModal.tsx | 12 +-
.../EcogestureResetModal.spec.tsx.snap | 2 +-
.../EcogestureLaunchFormModal.tsx | 13 +-
.../EcogestureLaunchFormModal.spec.tsx.snap | 2 +-
.../EcogestureSelectionModal.tsx | 13 +-
.../EcogestureSelectionModal.spec.tsx.snap | 2 +-
src/components/Feedback/FeedbackModal.tsx | 11 +-
.../__snapshots__/FeedbackModal.spec.tsx.snap | 2 +-
src/components/Header/Header.tsx | 22 ++-
.../Header/__snapshots__/Header.spec.tsx.snap | 4 +-
.../Konnector/KonnectorViewerList.tsx | 3 +-
.../KonnectorViewerList.spec.tsx.snap | 4 +
.../exportDoneModal.spec.tsx.snap | 4 +-
.../exportLoadingModal.spec.tsx.snap | 2 +-
.../exportStartModal.spec.tsx.snap | 2 +-
.../ExportData/Modals/exportDoneModal.tsx | 13 +-
.../ExportData/Modals/exportLoadingModal.tsx | 14 +-
.../ExportData/Modals/exportStartModal.tsx | 13 +-
.../PartnerIssue/PartnerIssueModal.tsx | 11 +-
.../PartnerIssueModal.spec.tsx.snap | 2 +-
.../Quiz/QuizQuestion/QuizQuestionContent.tsx | 3 +-
src/components/Terms/CGUModal.tsx | 13 +-
src/components/Terms/LegalNoticeModal.tsx | 13 +-
.../__snapshots__/CGUModal.spec.tsx.snap | 2 +-
.../LegalNoticeModal.spec.tsx.snap | 2 +-
src/components/WelcomeModal/WelcomeModal.tsx | 12 +-
.../__snapshots__/WelcomeModal.spec.tsx.snap | 2 +-
src/locales/fr.json | 21 +--
69 files changed, 382 insertions(+), 351 deletions(-)
diff --git a/src/components/Analysis/Comparison/Comparison.spec.tsx b/src/components/Analysis/Comparison/Comparison.spec.tsx
index 26c73803a..f1ebd36e9 100644
--- a/src/components/Analysis/Comparison/Comparison.spec.tsx
+++ b/src/components/Analysis/Comparison/Comparison.spec.tsx
@@ -72,10 +72,10 @@ describe('Comparison component', () => {
</Provider>
)
- const yearlyButton = await screen.findByRole('button', {
+ const yearlyButton = await screen.findByRole('tab', {
name: `analysis.compare.year_tab`,
})
- const monthlyButton = await screen.findByRole('button', {
+ const monthlyButton = await screen.findByRole('tab', {
name: `analysis.compare.month_tab`,
})
@@ -107,7 +107,7 @@ describe('Comparison component', () => {
</Provider>
)
- const indicators = await screen.findAllByRole('button', { name: /fluid/i })
+ const indicators = await screen.findAllByRole('listitem')
expect(indicators.length).toBe(mockFluidsWithData.length)
expect(
await screen.findByText('analysis.temperature_comparison.unit')
diff --git a/src/components/Analysis/Comparison/Comparison.tsx b/src/components/Analysis/Comparison/Comparison.tsx
index a81af240b..5e67322a7 100644
--- a/src/components/Analysis/Comparison/Comparison.tsx
+++ b/src/components/Analysis/Comparison/Comparison.tsx
@@ -100,14 +100,16 @@ const Comparison = ({
return (
<div className="comparison">
{!isLoading && (
- <div className="tabs">
+ <div role="tablist" className="tabs">
<Button
+ role="tab"
className={period === 'year' ? 'active' : ''}
onClick={() => dispatch(setPeriod('year'))}
>
{t(`analysis.compare.year_tab`)}
</Button>
<Button
+ role="tab"
className={period === 'month' ? 'active' : ''}
onClick={() => dispatch(setPeriod('month'))}
>
@@ -116,7 +118,7 @@ const Comparison = ({
</div>
)}
- <div className="performanceIndicators">
+ <div role="list" className="performanceIndicators">
{isLoading && (
<div
style={{
diff --git a/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx b/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx
index 13b53d72d..d25d9aa70 100644
--- a/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx
+++ b/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx
@@ -63,7 +63,7 @@ describe('FluidPerformanceIndicator component', () => {
).toHaveTextContent('+10,00 % / avril 2024')
await act(async () => {
- await userEvent.click(screen.getByRole('button'))
+ await userEvent.click(screen.getByRole('listitem'))
})
expect(mockedNavigate).toHaveBeenCalledWith('/consumption/electricity')
@@ -102,7 +102,7 @@ describe('FluidPerformanceIndicator component', () => {
)
await act(async () => {
- await userEvent.click(screen.getByRole('button'))
+ await userEvent.click(screen.getByRole('listitem'))
})
expect(mockedNavigate).toHaveBeenCalledWith('/consumption/water')
diff --git a/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx b/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
index b516ca00c..1e247c25e 100644
--- a/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
+++ b/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
@@ -1,9 +1,10 @@
-import React from 'react'
+import StyledCard from 'components/CommonKit/Card/StyledCard'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType, TimeStep } from 'enums'
import { DateTime } from 'luxon'
import { PerformanceIndicator } from 'models'
+import React from 'react'
import { useNavigate } from 'react-router-dom'
import { setCurrentTimeStep, setShowCompare } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
@@ -55,7 +56,11 @@ const FluidPerformanceIndicator = ({
}
return (
- <button className="fpi" onClick={() => handleFluidClick(fluidType)}>
+ <StyledCard
+ role="listitem"
+ className="fpi"
+ onClick={() => handleFluidClick(fluidType)}
+ >
<StyledIcon icon={iconType} size={50} />
<div
data-testid={`fluid-type-${FluidType[fluidType]}`}
@@ -100,7 +105,7 @@ const FluidPerformanceIndicator = ({
</>
)}
</div>
- </button>
+ </StyledCard>
)
}
diff --git a/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx b/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx
index 8af212cf8..9b090a5f5 100644
--- a/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx
+++ b/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx
@@ -1,7 +1,6 @@
-import { IconButton } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import { useAppSelector } from 'store/hooks'
@@ -30,13 +29,13 @@ const TemperatureComparisonModal = ({
}}
>
<div className="modal-start-root">
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ sized={18}
+ onClick={handleCloseClick}
aria-label={t('analysis.temperature_comparison.modal.close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} size={18} />
- </IconButton>
+ />
<div className="content">
<div className="text-20-bold subtitle">
{t('analysis.temperature_comparison.modal.title')}
diff --git a/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap b/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap
index ae3860876..28e9510e6 100644
--- a/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap
+++ b/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap
@@ -37,7 +37,7 @@ exports[`TemperatureComparisonModal component should be rendered correctly 1`] =
>
<button
aria-label="analysis.temperature_comparison.modal.close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Analysis/Comparison/__snapshots__/FluidPerformanceIndicator.spec.tsx.snap b/src/components/Analysis/Comparison/__snapshots__/FluidPerformanceIndicator.spec.tsx.snap
index e7da0ab89..cd33f838a 100644
--- a/src/components/Analysis/Comparison/__snapshots__/FluidPerformanceIndicator.spec.tsx.snap
+++ b/src/components/Analysis/Comparison/__snapshots__/FluidPerformanceIndicator.spec.tsx.snap
@@ -3,30 +3,43 @@
exports[`FluidPerformanceIndicator component should render "no data" message when value is not available 1`] = `
<div>
<button
- class="fpi"
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-5 fpi"
+ role="listitem"
+ tabindex="0"
+ type="button"
>
- <svg
- aria-hidden="true"
- class="styles__icon___23x3R"
- height="50"
- width="50"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
<div
- class="fpi-content"
- data-testid="fluid-type-WATER"
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-6"
>
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="50"
+ width="50"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
<div
- class="fpi-content-no-data"
+ class="fpi-content"
+ data-testid="fluid-type-WATER"
>
- <span>
- performance_indicator.fpi.no_data
- </span>
+ <div
+ class="fpi-content-no-data"
+ >
+ <span>
+ performance_indicator.fpi.no_data
+ </span>
+ </div>
</div>
</div>
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
</button>
</div>
`;
@@ -34,53 +47,66 @@ exports[`FluidPerformanceIndicator component should render "no data" message whe
exports[`FluidPerformanceIndicator component should render elec indicators correctly and navigate on click 1`] = `
<div>
<button
- class="fpi"
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 fpi"
+ role="listitem"
+ tabindex="0"
+ type="button"
>
- <svg
- aria-hidden="true"
- class="styles__icon___23x3R"
- height="50"
- width="50"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
<div
- class="fpi-content"
- data-testid="fluid-type-ELECTRICITY"
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
>
- <div
- class="fpi-value"
- data-testid="fluid-value-ELECTRICITY"
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="50"
+ width="50"
>
- <span
- class="fpi-load"
- >
- 100,00
- </span>
- <span
- class="fpi-unit"
- >
- FLUID.ELECTRICITY.UNIT
- </span>
- </div>
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
<div
- class="fpi-comparison"
- data-testid="fluid-comparison-ELECTRICITY"
+ class="fpi-content"
+ data-testid="fluid-type-ELECTRICITY"
>
- <span
- class="percent positive"
+ <div
+ class="fpi-value"
+ data-testid="fluid-value-ELECTRICITY"
>
- +10,00 %
- </span>
- <span
- class="fpi-comparison-date"
+ <span
+ class="fpi-load"
+ >
+ 100,00
+ </span>
+ <span
+ class="fpi-unit"
+ >
+ FLUID.ELECTRICITY.UNIT
+ </span>
+ </div>
+ <div
+ class="fpi-comparison"
+ data-testid="fluid-comparison-ELECTRICITY"
>
- / avril 2024
- </span>
+ <span
+ class="percent positive"
+ >
+ +10,00 %
+ </span>
+ <span
+ class="fpi-comparison-date"
+ >
+ / avril 2024
+ </span>
+ </div>
</div>
</div>
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
</button>
</div>
`;
diff --git a/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss b/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss
index bd93542a3..c89633852 100644
--- a/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss
+++ b/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss
@@ -26,36 +26,18 @@
}
//FluidPerformanceIndicator
-.fpi {
- display: flex;
- flex-direction: row;
+button.fpi {
border: 1px solid $grey-dark;
- border-radius: 4px;
- padding: 16px 22px;
- gap: 1rem;
- align-items: center;
box-shadow: 0px 4px 16px 0px $black-shadow;
transition: background-color 0.3s;
- background: linear-gradient(180deg, #323339 0%, #25262b 100%);
- cursor: pointer;
-
- &:hover {
- background: linear-gradient(
- 180deg,
- rgba(70, 71, 77, 0.7) 0%,
- rgba(57, 58, 63, 0.7) 100%
- );
- }
.fpi-content {
display: flex;
flex-direction: column;
gap: 4px;
- text-align: left;
.fpi-value {
display: flex;
flex-direction: row;
- gap: 4px;
align-items: flex-end;
.fpi-load {
font-size: 1.75rem;
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx
index df7940557..e0c7c02d7 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx
@@ -1,11 +1,11 @@
import { Button } from '@material-ui/core'
-import IconButton from '@material-ui/core/IconButton'
import LeftArrowIcon from 'assets/icons/ico/left-arrow.svg'
import MaxPowerIcon from 'assets/icons/ico/maxPower.svg'
import MinIcon from 'assets/icons/ico/minimum.svg'
import OffPeakHourIcon from 'assets/icons/ico/offPeakHour.svg'
import RightArrowIcon from 'assets/icons/ico/right-arrow.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import Loader from 'components/Loader/Loader'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -166,13 +166,13 @@ const ElecHalfHourMonthlyAnalysis = ({
{isHalfHourActivated && (
<>
<div className="navigator">
- <IconButton
- aria-label={t('consumption.accessibility.button_previous_value')}
+ <StyledIconButton
+ icon={LeftArrowIcon}
+ sized={24}
onClick={() => setIsWeekend(prev => !prev)}
+ aria-label={t('consumption.accessibility.button_previous_value')}
className="arrow-prev"
- >
- <StyledIcon icon={LeftArrowIcon} size={24} />
- </IconButton>
+ />
<div className="average text-18-normal">
<div className="text-1">{t('special_elec.average')}</div>
<div className="text-2 text-18-bold">
@@ -184,13 +184,13 @@ const ElecHalfHourMonthlyAnalysis = ({
</span>
</div>
</div>
- <IconButton
- aria-label={t('consumption.accessibility.button_next_value')}
+ <StyledIconButton
+ icon={RightArrowIcon}
+ sized={24}
onClick={() => setIsWeekend(prev => !prev)}
+ aria-label={t('consumption.accessibility.button_next_value')}
className="arrow-next"
- >
- <StyledIcon icon={RightArrowIcon} size={24} />
- </IconButton>
+ />
</div>
{isLoading && <Loader color="elec" />}
{!isLoading && (
@@ -246,30 +246,40 @@ const ElecHalfHourMonthlyAnalysis = ({
<div className="container consomin">
<StyledIcon icon={MinIcon} size={40} className="minIcon" />
<div className="text text-18-normal">
- <div>{t('special_elec.min')}</div>
- <div>{t('special_elec.percentage')}</div>
- <div>{t('special_elec.price')}</div>
- </div>
- <div className="value">
{enedisAnalysisValues.minimumLoad !== 0 &&
enedisAnalysisValues.minimumLoad !== null ? (
<>
- <div className="text-18-bold">
- {enedisAnalysisValues.minimumLoad.toFixed(1)}
- <span className="text-18-normal"> kWh</span>
+ <div className="row">
+ <div>{t('special_elec.min')}</div>
+ <div>
+ <span className="text-18-bold">
+ {enedisAnalysisValues.minimumLoad.toFixed(1)}
+ </span>
+ <span> kWh</span>
+ </div>
</div>
- <div className="text-18-bold">
- {facturePercentage?.toFixed(0) || '---'}
- <span className="text-18-normal"> %</span>
+ <div className="row">
+ <div>{t('special_elec.percentage')}</div>
+ <div>
+ <span className="text-18-bold">
+ {facturePercentage?.toFixed(0) || '---'}
+ </span>
+ <span> %</span>
+ </div>
</div>
- <div className="text-18-bold">
- {elecPrice?.price
- ? (
- enedisAnalysisValues.minimumLoad *
- elecPrice.price
- ).toFixed(1)
- : '---'}
- <span className="text-18-normal"> €</span>
+ <div className="row">
+ <div>{t('special_elec.price')}</div>
+ <div>
+ <span className="text-18-bold">
+ {elecPrice?.price
+ ? (
+ enedisAnalysisValues.minimumLoad *
+ elecPrice.price
+ ).toFixed(1)
+ : '---'}
+ </span>
+ <span> €</span>
+ </div>
</div>
</>
) : (
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx
index aacab412d..a1ce173d6 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx
@@ -1,7 +1,6 @@
-import { IconButton } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import {
@@ -41,13 +40,12 @@ const ElecInfoModal = ({
<div id="accessibility-title">
{t('elec_info_modal.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('elec_info_modal.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="elecInfoModal">
<div className="title text-18-bold">
{t('elec_info_modal.maxPowerTitle')}
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap
index fdd25bb41..3f664b184 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap
@@ -54,7 +54,7 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when
>
<button
aria-label="consumption.accessibility.button_previous_value"
- class="MuiButtonBase-root MuiIconButton-root arrow-prev"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 arrow-prev"
tabindex="0"
type="button"
>
@@ -95,7 +95,7 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when
</div>
<button
aria-label="consumption.accessibility.button_next_value"
- class="MuiButtonBase-root MuiIconButton-root arrow-next"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 arrow-next"
tabindex="0"
type="button"
>
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap
index 8de384b77..6d81eae0f 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`ElecInfoModal component should be rendered correctly with off-peak hour
</div>
<button
aria-label="elec_info_modal.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-2 modal-paper-close-button"
tabindex="0"
type="button"
>
@@ -143,7 +143,7 @@ exports[`ElecInfoModal component should be rendered correctly without off-peak h
</div>
<button
aria-label="elec_info_modal.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/elecHalfHourMonthlyAnalysis.scss b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/elecHalfHourMonthlyAnalysis.scss
index 3e0e4b36e..2eb6eab65 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/elecHalfHourMonthlyAnalysis.scss
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/elecHalfHourMonthlyAnalysis.scss
@@ -57,6 +57,10 @@
display: flex;
flex-direction: column;
justify-content: space-between;
+ width: 100%;
+ .row {
+ justify-content: space-between;
+ }
}
.value {
margin-left: auto;
diff --git a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx
index 7f6c5ac98..bfbc200d3 100644
--- a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx
+++ b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx
@@ -1,9 +1,9 @@
-import IconButton from '@material-ui/core/IconButton'
import GraphIcon from 'assets/icons/ico/graph-icon.svg'
import LeftArrowIcon from 'assets/icons/ico/left-arrow.svg'
import RightArrowIcon from 'assets/icons/ico/right-arrow.svg'
import BarChart from 'components/Charts/BarChart'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import DataloadSection from 'components/ConsumptionVisualizer/DataloadSection'
import { useChartResize } from 'components/Hooks/useChartResize'
import Loader from 'components/Loader/Loader'
@@ -101,25 +101,25 @@ const MaxConsumptionCard = ({
}
const buttonPrev = () => (
- <IconButton
- aria-label={t('consumption.accessibility.button_previous_value')}
+ <StyledIconButton
+ icon={LeftArrowIcon}
+ sized={24}
onClick={() => handleFluidChange(-1)}
- className="arrow-prev"
disabled={fluidsWithData.length <= 1}
- >
- <StyledIcon icon={LeftArrowIcon} size={24} />
- </IconButton>
+ aria-label={t('consumption.accessibility.button_previous_value')}
+ className="arrow-prev"
+ />
)
const buttonNext = () => (
- <IconButton
- aria-label={t('consumption.accessibility.button_next_value')}
+ <StyledIconButton
+ icon={RightArrowIcon}
+ sized={24}
onClick={() => handleFluidChange(1)}
- className="arrow-next"
disabled={fluidsWithData.length <= 1}
- >
- <StyledIcon icon={RightArrowIcon} size={24} />
- </IconButton>
+ aria-label={t('consumption.accessibility.button_next_value')}
+ className="arrow-next"
+ />
)
return (
diff --git a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap
index 149368eae..766c2a08e 100644
--- a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap
+++ b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap
@@ -25,7 +25,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
>
<button
aria-label="consumption.accessibility.button_previous_value"
- class="MuiButtonBase-root MuiIconButton-root arrow-prev"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 arrow-prev"
tabindex="0"
type="button"
>
@@ -54,7 +54,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
</div>
<button
aria-label="consumption.accessibility.button_next_value"
- class="MuiButtonBase-root MuiIconButton-root arrow-next"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 arrow-next"
tabindex="0"
type="button"
>
diff --git a/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx b/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx
index 12c6d9080..0ca7f23ce 100644
--- a/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx
+++ b/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx
@@ -100,7 +100,12 @@ const ProfileComparatorRow = ({
: t(`analysis.no_data`)
return (
- <div className={`analysisRow consumption-${FLUIDNAME.toLowerCase()}`}>
+ <div
+ aria-label={t(
+ `analysis.accessibility.comparison_${FLUIDNAME.toLowerCase()}`
+ )}
+ className={`analysisRow consumption-${FLUIDNAME.toLowerCase()}`}
+ >
<div className="user-graph">
<div
className={classNames('price text-15-bold', {
diff --git a/src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx b/src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx
index 24c1d3ea9..bd4ee0a34 100644
--- a/src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx
+++ b/src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx
@@ -1,6 +1,6 @@
-import { Button, Dialog, IconButton } from '@material-ui/core'
+import { Button, Dialog } from '@material-ui/core'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType } from 'enums'
import React, { useState } from 'react'
@@ -104,13 +104,12 @@ const EpglConnectModal = ({
paper: 'modal-paper',
}}
>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseModal}
aria-label={t('auth.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseModal}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="partners-connection-step-content">
{steps[currentStep].content}
</div>
diff --git a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx
index 9752a9936..45b2e4e74 100644
--- a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx
+++ b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx
@@ -1,9 +1,10 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import EnedisIcon from 'assets/icons/ico/consent-outdated-enedis.svg'
import GrdfIcon from 'assets/icons/ico/consent-outdated-grdf.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType } from 'enums'
import { AccountSgeData } from 'models'
@@ -76,13 +77,12 @@ const ExpiredConsentModal = ({
<div id="accessibility-title">
{t('consent_outdated.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={toggleModal}
aria-label={t('consent_outdated.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={toggleModal}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="expired-consent-modal">
<div className="icon-main">
<StyledIcon
diff --git a/src/components/Connection/ExpiredConsentModal/__snapshots__/ExpiredConsentModal.spec.tsx.snap b/src/components/Connection/ExpiredConsentModal/__snapshots__/ExpiredConsentModal.spec.tsx.snap
index 83702bba2..100fa6d1f 100644
--- a/src/components/Connection/ExpiredConsentModal/__snapshots__/ExpiredConsentModal.spec.tsx.snap
+++ b/src/components/Connection/ExpiredConsentModal/__snapshots__/ExpiredConsentModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`ExpiredConsentModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="consent_outdated.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Connection/GRDFConnect/GrdfModalHint.tsx b/src/components/Connection/GRDFConnect/GrdfModalHint.tsx
index 1c92e3150..9ec57a393 100644
--- a/src/components/Connection/GRDFConnect/GrdfModalHint.tsx
+++ b/src/components/Connection/GRDFConnect/GrdfModalHint.tsx
@@ -1,9 +1,9 @@
-import { IconButton } from '@material-ui/core'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import GasBill from 'assets/icons/visu/onboarding/gas_bill.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
@@ -30,13 +30,12 @@ const GrdfModalHint = ({
<div id="accessibility-title">
{t('challenge_no_fluid_modal.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="hintModal">
<h1 className="text-20-bold">
{t('auth.grdfgrandlyon.pceModal.title')}
diff --git a/src/components/Connection/SGEConnect/SgeModalHint.tsx b/src/components/Connection/SGEConnect/SgeModalHint.tsx
index 9ccb96aa5..01026bbfa 100644
--- a/src/components/Connection/SGEConnect/SgeModalHint.tsx
+++ b/src/components/Connection/SGEConnect/SgeModalHint.tsx
@@ -1,10 +1,10 @@
-import { IconButton } from '@material-ui/core'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
import Bill from 'assets/icons/ico/bill.svg'
import CloseIcon from 'assets/icons/ico/close.svg'
import Prm from 'assets/icons/ico/prm.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
@@ -30,13 +30,12 @@ const SgeModalHint = ({ open, handleCloseClick }: SgeModalHintProps) => {
<div id="accessibility-title">
{t('auth.enedissgegrandlyon.pdlModal.title_accessibility')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('auth.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="hintModal">
<h1 className="text-20-bold">
{t('auth.enedissgegrandlyon.pdlModal.title')}
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
index b21dc1e1f..9f0d7974e 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
@@ -25,7 +25,7 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
</div>
<button
aria-label="header.accessibility.button_open_feedbacks"
- class="MuiButtonBase-root MuiIconButton-root header-feedbacks-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 header-feedbacks-button"
tabindex="0"
type="button"
>
@@ -125,10 +125,10 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
/>
<fieldset
aria-hidden="true"
- class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ class="PrivateNotchedOutline-root-2 MuiOutlinedInput-notchedOutline"
>
<legend
- class="PrivateNotchedOutline-legendLabelled-3"
+ class="PrivateNotchedOutline-legendLabelled-4"
>
<span>
auth.enedissgegrandlyon.firstName
@@ -170,10 +170,10 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
/>
<fieldset
aria-hidden="true"
- class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ class="PrivateNotchedOutline-root-2 MuiOutlinedInput-notchedOutline"
>
<legend
- class="PrivateNotchedOutline-legendLabelled-3"
+ class="PrivateNotchedOutline-legendLabelled-4"
>
<span>
auth.enedissgegrandlyon.lastName
@@ -221,10 +221,10 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
/>
<fieldset
aria-hidden="true"
- class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ class="PrivateNotchedOutline-root-2 MuiOutlinedInput-notchedOutline"
>
<legend
- class="PrivateNotchedOutline-legendLabelled-3"
+ class="PrivateNotchedOutline-legendLabelled-4"
>
<span>
auth.enedissgegrandlyon.pdlLabel
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap
index 45adc444c..335b16222 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`SgeModalHint component should be rendered correctly 1`] = `
</div>
<button
aria-label="auth.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx b/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx
index 5b09024b1..8be010a5e 100644
--- a/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx
@@ -64,7 +64,11 @@ const DataloadSectionDetail = ({
return (
<NavLink
key={FluidType[index]}
- aria-label={t(`consumption_visualizer.cost_per_fluid.${index}`)}
+ aria-label={t(
+ `consumption_visualizer.cost_per_fluid.${FluidType[
+ index
+ ].toLowerCase()}`
+ )}
to={`/consumption/${FluidType[index].toLowerCase()}`}
className="dataloadvisualizer-euro-link"
>
diff --git a/src/components/ConsumptionVisualizer/EstimatedConsumptionModal.tsx b/src/components/ConsumptionVisualizer/EstimatedConsumptionModal.tsx
index 2069ea38c..faed95db0 100644
--- a/src/components/ConsumptionVisualizer/EstimatedConsumptionModal.tsx
+++ b/src/components/ConsumptionVisualizer/EstimatedConsumptionModal.tsx
@@ -1,7 +1,6 @@
-import { IconButton } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType } from 'enums'
@@ -53,13 +52,12 @@ const EstimatedConsumptionModal = ({
<div id="accessibility-title">
{t('consumption_visualizer.modal.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('consumption_visualizer.modal.close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="estimation-modal">
<div className="text-20-normal modal-title">
{t('consumption_visualizer.modal.title')}
diff --git a/src/components/ConsumptionVisualizer/NoDataModal.tsx b/src/components/ConsumptionVisualizer/NoDataModal.tsx
index ecc4ef5c7..18f23c2cc 100644
--- a/src/components/ConsumptionVisualizer/NoDataModal.tsx
+++ b/src/components/ConsumptionVisualizer/NoDataModal.tsx
@@ -1,8 +1,9 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import QuestionIcon from 'assets/icons/ico/questionMark.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './noDataModal.scss'
@@ -28,13 +29,12 @@ const NoDataModal = ({ open, handleCloseClick }: NoDataModalProps) => {
<div id="accessibility-title">
{t('consumption_visualizer.modal.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('consumption_visualizer.modal.close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="nodata-modal">
<div className="question-mark">
<StyledIcon icon={QuestionIcon} size={36} />
diff --git a/src/components/ConsumptionVisualizer/__snapshots__/EstimatedConsumptionModal.spec.tsx.snap b/src/components/ConsumptionVisualizer/__snapshots__/EstimatedConsumptionModal.spec.tsx.snap
index 6f79fffa9..9d4da4b3e 100644
--- a/src/components/ConsumptionVisualizer/__snapshots__/EstimatedConsumptionModal.spec.tsx.snap
+++ b/src/components/ConsumptionVisualizer/__snapshots__/EstimatedConsumptionModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`EstimatedConsumptionModal component should render correctly 1`] = `
</div>
<button
aria-label="consumption_visualizer.modal.close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/ConsumptionVisualizer/__snapshots__/NoDataModal.spec.tsx.snap b/src/components/ConsumptionVisualizer/__snapshots__/NoDataModal.spec.tsx.snap
index 753eef53c..0e55d2ee5 100644
--- a/src/components/ConsumptionVisualizer/__snapshots__/NoDataModal.spec.tsx.snap
+++ b/src/components/ConsumptionVisualizer/__snapshots__/NoDataModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`NoDataModal component should render correctly 1`] = `
</div>
<button
aria-label="consumption_visualizer.modal.close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/CustomPopup/CustomPopupModal.tsx b/src/components/CustomPopup/CustomPopupModal.tsx
index ff68a7c12..7d59a8cf6 100644
--- a/src/components/CustomPopup/CustomPopupModal.tsx
+++ b/src/components/CustomPopup/CustomPopupModal.tsx
@@ -1,9 +1,9 @@
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
-import IconButton from '@material-ui/core/IconButton'
import CloseIcon from 'assets/icons/ico/close.svg'
import DefaultIcon from 'assets/icons/visu/ecogesture/bullhorn.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { DateTime } from 'luxon'
import { CustomPopup } from 'models'
@@ -47,13 +47,12 @@ const CustomPopupModal = ({
}}
>
<div id="accessibility-title">{customPopup.title}</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="customPopupModal">
<StyledIcon icon={icon} size={100} role="img" ariaHidden={false} />
diff --git a/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap b/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap
index 8acb6fa60..e83cba2c0 100644
--- a/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap
+++ b/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`CustomPopupModal component should render correctly 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/DateNavigator/DateNavigator.tsx b/src/components/DateNavigator/DateNavigator.tsx
index f64619d37..1132e0b8f 100644
--- a/src/components/DateNavigator/DateNavigator.tsx
+++ b/src/components/DateNavigator/DateNavigator.tsx
@@ -1,8 +1,7 @@
-import IconButton from '@material-ui/core/IconButton'
import LeftArrowIcon from 'assets/icons/ico/left-arrow.svg'
import RightArrowIcon from 'assets/icons/ico/right-arrow.svg'
import classNames from 'classnames'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import DateNavigatorFormat from 'components/DateNavigator/DateNavigatorFormat'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { TimeStep } from 'enums'
@@ -37,31 +36,29 @@ const DateNavigator = ({
aria-label={t('consumption.accessibility.navigation_group')}
className="date-navigator"
>
- <IconButton
- disabled={disablePrev}
+ <StyledIconButton
+ icon={LeftArrowIcon}
onClick={handlePrevDate}
+ disabled={disablePrev}
+ aria-label={t('consumption.accessibility.button_previous_value')}
className={classNames('date-navigator-button', {
['disable']: disablePrev,
})}
- aria-label={t('consumption.accessibility.button_previous_value')}
- >
- <StyledIcon icon={LeftArrowIcon} />
- </IconButton>
+ />
<DateNavigatorFormat
timeStep={timeStep}
date={navigatorDate}
inline={inlineDateDisplay}
/>
- <IconButton
- disabled={disableNext}
+ <StyledIconButton
+ icon={RightArrowIcon}
onClick={handleNextDate}
+ disabled={disableNext}
+ aria-label={t('consumption.accessibility.button_next_value')}
className={classNames('date-navigator-button', {
['disable']: disableNext,
})}
- aria-label={t('consumption.accessibility.button_next_value')}
- >
- <StyledIcon icon={RightArrowIcon} />
- </IconButton>
+ />
</div>
)
}
diff --git a/src/components/DateNavigator/__snapshots__/DateNavigator.spec.tsx.snap b/src/components/DateNavigator/__snapshots__/DateNavigator.spec.tsx.snap
index c23b70fc7..9d6cbb26b 100644
--- a/src/components/DateNavigator/__snapshots__/DateNavigator.spec.tsx.snap
+++ b/src/components/DateNavigator/__snapshots__/DateNavigator.spec.tsx.snap
@@ -9,7 +9,7 @@ exports[`DateNavigator component should be rendered correctly 1`] = `
>
<button
aria-label="consumption.accessibility.button_previous_value"
- class="MuiButtonBase-root MuiIconButton-root date-navigator-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 date-navigator-button"
tabindex="0"
type="button"
>
@@ -38,7 +38,7 @@ exports[`DateNavigator component should be rendered correctly 1`] = `
/>
<button
aria-label="consumption.accessibility.button_next_value"
- class="MuiButtonBase-root MuiIconButton-root date-navigator-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 date-navigator-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Duel/LastDuelModal/__snapshots__/lastDuelModal.spec.tsx.snap b/src/components/Duel/LastDuelModal/__snapshots__/lastDuelModal.spec.tsx.snap
index 5afe82744..4897a8101 100644
--- a/src/components/Duel/LastDuelModal/__snapshots__/lastDuelModal.spec.tsx.snap
+++ b/src/components/Duel/LastDuelModal/__snapshots__/lastDuelModal.spec.tsx.snap
@@ -41,7 +41,8 @@ exports[`lastDuelModal component should render correctly 1`] = `
class="duel-last-modal-root"
>
<button
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ aria-label="last_duel_modal.close"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Duel/LastDuelModal/lastDuelModal.tsx b/src/components/Duel/LastDuelModal/lastDuelModal.tsx
index 6c1f64e30..7ff4c79ba 100644
--- a/src/components/Duel/LastDuelModal/lastDuelModal.tsx
+++ b/src/components/Duel/LastDuelModal/lastDuelModal.tsx
@@ -1,8 +1,8 @@
-import { IconButton } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import star from 'assets/icons/visu/duel/star.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './lastDuelModal.scss'
@@ -27,12 +27,12 @@ const LastDuelModal = ({ open, handleCloseClick }: LastDuelModalProps) => {
>
<div id="accessibility-title">{t('last_duel_modal.title')}</div>
<div className="duel-last-modal-root">
- <IconButton
- className="modal-paper-close-button"
+ <StyledIconButton
+ icon={CloseIcon}
onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ aria-label={t('last_duel_modal.close')}
+ className="modal-paper-close-button"
+ />
<StyledIcon className="icon" icon={star} size={48} />
<h1 className="text-28-bold">{t('last_duel_modal.title')}</h1>
<div>
diff --git a/src/components/Ecogesture/EcogestureCard/EcogestureCard.tsx b/src/components/Ecogesture/EcogestureCard/EcogestureCard.tsx
index 2ae4fb300..b2dfc8f5b 100644
--- a/src/components/Ecogesture/EcogestureCard/EcogestureCard.tsx
+++ b/src/components/Ecogesture/EcogestureCard/EcogestureCard.tsx
@@ -24,6 +24,7 @@ const EcogestureCard = ({ ecogesture }: { ecogesture: Ecogesture }) => {
return (
<StyledEcogestureCard
+ role="listitem"
onClick={() => navigate(`/ecogesture/${ecogesture.id}`)}
className="ecogesture-list-item"
>
diff --git a/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap b/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap
index 3096c7c18..3ab499759 100644
--- a/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap
@@ -4,6 +4,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = `
<div>
<button
class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 ecogesture-list-item"
+ role="listitem"
tabindex="0"
type="button"
>
diff --git a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx
index aa01d3e85..509ef939a 100644
--- a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx
+++ b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx
@@ -1,7 +1,7 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import { useNavigate } from 'react-router-dom'
@@ -40,13 +40,12 @@ const EcogestureInitModal = () => {
<div id="accessibility-title">
{t('feedback.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseEcogestureInitModal}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseEcogestureInitModal}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="eg-init-modal">
<div className="title text-20-bold">
{t('ecogesture.initModal.title')}
diff --git a/src/components/Ecogesture/EcogestureInitModal/__snapshots__/EcogestureInitModal.spec.tsx.snap b/src/components/Ecogesture/EcogestureInitModal/__snapshots__/EcogestureInitModal.spec.tsx.snap
index fe8934ae7..0a28b093d 100644
--- a/src/components/Ecogesture/EcogestureInitModal/__snapshots__/EcogestureInitModal.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureInitModal/__snapshots__/EcogestureInitModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`EcogestureInitModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Ecogesture/EcogestureList/EcogestureList.tsx b/src/components/Ecogesture/EcogestureList/EcogestureList.tsx
index f46cc200b..f54909828 100644
--- a/src/components/Ecogesture/EcogestureList/EcogestureList.tsx
+++ b/src/components/Ecogesture/EcogestureList/EcogestureList.tsx
@@ -153,7 +153,7 @@ const EcogestureList = ({
{displaySelection && continueSelection()}
</div>
- <div className="ecogesture-content">
+ <div role="list" className="ecogesture-content">
{renderEcogestureContent()}
{!displaySelection && openResetEcogestureModal && (
<Button onClick={openResetEcogestureModal} className="btnSecondary">
diff --git a/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap b/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap
index 3a8441cc4..46e1c2cfb 100644
--- a/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap
@@ -42,6 +42,7 @@ exports[`EcogesturesList component should be rendered correctly 1`] = `
</div>
<div
class="ecogesture-content"
+ role="list"
>
<mock-ecogesturecard
ecogesture="[object Object]"
diff --git a/src/components/Ecogesture/EcogestureModal/EcogestureModal.tsx b/src/components/Ecogesture/EcogestureModal/EcogestureModal.tsx
index 00b2f61e7..047f7d1c8 100644
--- a/src/components/Ecogesture/EcogestureModal/EcogestureModal.tsx
+++ b/src/components/Ecogesture/EcogestureModal/EcogestureModal.tsx
@@ -1,10 +1,10 @@
import { Collapse } from '@material-ui/core'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
-import IconButton from '@material-ui/core/IconButton'
import CloseIcon from 'assets/icons/ico/close.svg'
import defaultIcon from 'assets/icons/visu/ecogesture/default.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import useExploration from 'components/Hooks/useExploration'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { Ecogesture } from 'models'
@@ -65,13 +65,12 @@ const EcogestureModal = ({
? t('ecogesture_modal.accessibility.window_title_action')
: t('ecogesture_modal.accessibility.window_title_ecogesture')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('ecogesture_modal.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="em-header text-14-normal-uppercase">
{isAction
? t('ecogesture_modal.title_action')
diff --git a/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx b/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx
index 2ff0e0c33..b12843e71 100644
--- a/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx
+++ b/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx
@@ -1,8 +1,9 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import warningIcon from 'assets/icons/ico/warn-orange.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './ecogestureResetModal.scss'
@@ -32,13 +33,12 @@ const EcogestureResetModal = ({
<div id="accessibility-title">
{t('feedback.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={closeEcogestureResetModal}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={closeEcogestureResetModal}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="eg-reset-modal">
<StyledIcon icon={warningIcon} size={63} />
<div className="title text-20-bold">
diff --git a/src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap b/src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap
index c8abe7ced..ccaf95b8f 100644
--- a/src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`EcogestureResetModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx b/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx
index cc4ae8a4b..c71271c7e 100644
--- a/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx
@@ -1,7 +1,7 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './ecogestureLaunchFormModal.scss'
@@ -28,13 +28,12 @@ const EcogestureLaunchFormModal = ({
<div id="accessibility-title">
{t('feedback.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="eg-init-modal">
<div className="title text-20-bold">
{t('ecogesture.initModal.title')}
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap b/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
index 909100f52..5cf6f6fea 100644
--- a/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`EcogestureLaunchFormModal component should be rendered correctly 1`] =
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.tsx b/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.tsx
index 85820ef3e..e1b6ca29b 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.tsx
@@ -1,10 +1,10 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './ecogestureSelectionModal.scss'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
interface EcogestureSelectionModalProps {
open: boolean
@@ -30,13 +30,12 @@ const EcogestureSelectionModal = ({
<div id="accessibility-title">
{t('ecogesture_selection.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('ecogesture_selection.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="eg-selection-modal">
<div className="title text-20-bold">
{t('ecogesture_selection.selectionModal.title')}
diff --git a/src/components/EcogestureSelection/EcogestureSelectionModal/__snapshots__/EcogestureSelectionModal.spec.tsx.snap b/src/components/EcogestureSelection/EcogestureSelectionModal/__snapshots__/EcogestureSelectionModal.spec.tsx.snap
index 685a14d59..ae7263537 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionModal/__snapshots__/EcogestureSelectionModal.spec.tsx.snap
+++ b/src/components/EcogestureSelection/EcogestureSelectionModal/__snapshots__/EcogestureSelectionModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`EcogestureInitModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="ecogesture_selection.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Feedback/FeedbackModal.tsx b/src/components/Feedback/FeedbackModal.tsx
index efc91bcba..0889e0613 100644
--- a/src/components/Feedback/FeedbackModal.tsx
+++ b/src/components/Feedback/FeedbackModal.tsx
@@ -1,9 +1,9 @@
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
-import IconButton from '@material-ui/core/IconButton'
import CloseIcon from 'assets/icons/ico/close.svg'
import ecolyoIcon from 'assets/icons/ico/ecolyo.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import useExploration from 'components/Hooks/useExploration'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -44,13 +44,12 @@ const FeedbackModal = () => {
<div id="accessibility-title">
{t('feedback.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={closeModal}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={closeModal}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="fb-root">
<StyledIcon icon={ecolyoIcon} size={80} />
<p className="title">{t('feedback.title')}</p>
diff --git a/src/components/Feedback/__snapshots__/FeedbackModal.spec.tsx.snap b/src/components/Feedback/__snapshots__/FeedbackModal.spec.tsx.snap
index a567f2b41..465fa6a2f 100644
--- a/src/components/Feedback/__snapshots__/FeedbackModal.spec.tsx.snap
+++ b/src/components/Feedback/__snapshots__/FeedbackModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`FeedbackModal component should render the component 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index f13a42912..78943998d 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -1,7 +1,6 @@
-import IconButton from '@material-ui/core/IconButton'
import BackArrowIcon from 'assets/icons/ico/back-arrow.svg'
import FeedbackIcon from 'assets/icons/ico/feedback.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { ScreenType } from 'enums'
import React, { useCallback, useEffect, useRef } from 'react'
@@ -55,13 +54,12 @@ const Header = ({
<div className="header-content">
<div className="header-content-top">
{screenType !== ScreenType.MOBILE && displayBackArrow && (
- <IconButton
+ <StyledIconButton
+ icon={BackArrowIcon}
+ onClick={handleClickBack}
aria-label={t('header.accessibility.button_back')}
className="header-back-button"
- onClick={handleClickBack}
- >
- <StyledIcon icon={BackArrowIcon} />
- </IconButton>
+ />
)}
{desktopTitleKey && (
<div
@@ -78,13 +76,13 @@ const Header = ({
<span>{t(desktopTitleKey)}</span>
</div>
)}
- <IconButton
+ <StyledIconButton
+ icon={FeedbackIcon}
+ sized={40}
+ onClick={handleClickFeedbacks}
aria-label={t('header.accessibility.button_open_feedbacks')}
className="header-feedbacks-button"
- onClick={handleClickFeedbacks}
- >
- <StyledIcon icon={FeedbackIcon} size={40} />
- </IconButton>
+ />
</div>
{children}
</div>
diff --git a/src/components/Header/__snapshots__/Header.spec.tsx.snap b/src/components/Header/__snapshots__/Header.spec.tsx.snap
index 2b060bac4..10fd9d80a 100644
--- a/src/components/Header/__snapshots__/Header.spec.tsx.snap
+++ b/src/components/Header/__snapshots__/Header.spec.tsx.snap
@@ -21,7 +21,7 @@ exports[`Header component should be rendered correctly on desktop 1`] = `
</div>
<button
aria-label="header.accessibility.button_open_feedbacks"
- class="MuiButtonBase-root MuiIconButton-root header-feedbacks-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-2 header-feedbacks-button"
tabindex="0"
type="button"
>
@@ -74,7 +74,7 @@ exports[`Header component should be rendered correctly on mobile 1`] = `
</div>
<button
aria-label="header.accessibility.button_open_feedbacks"
- class="MuiButtonBase-root MuiIconButton-root header-feedbacks-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 header-feedbacks-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Konnector/KonnectorViewerList.tsx b/src/components/Konnector/KonnectorViewerList.tsx
index ca43a508d..2b184b5b7 100644
--- a/src/components/Konnector/KonnectorViewerList.tsx
+++ b/src/components/Konnector/KonnectorViewerList.tsx
@@ -20,9 +20,10 @@ const KonnectorViewerList = () => {
return (
<div className="konnector-section-root">
- <div className="konnectorsList">
+ <div role="list" className="konnectorsList">
{fluidStatus.map(fluidStatusItem => (
<StyledCard
+ role="listitem"
key={fluidStatusItem.fluidType}
className="connection-card"
onClick={() => goToFluid(fluidStatusItem.fluidType)}
diff --git a/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap b/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap
index 55983671a..f8732ace7 100644
--- a/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap
+++ b/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap
@@ -7,9 +7,11 @@ exports[`KonnectorViewerList component should be rendered correctly 1`] = `
>
<div
class="konnectorsList"
+ role="list"
>
<button
class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card electricity"
+ role="listitem"
tabindex="0"
type="button"
>
@@ -41,6 +43,7 @@ exports[`KonnectorViewerList component should be rendered correctly 1`] = `
</button>
<button
class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card water"
+ role="listitem"
tabindex="0"
type="button"
>
@@ -72,6 +75,7 @@ exports[`KonnectorViewerList component should be rendered correctly 1`] = `
</button>
<button
class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card gas"
+ role="listitem"
tabindex="0"
type="button"
>
diff --git a/src/components/Options/ExportData/Modals/__snapshots__/exportDoneModal.spec.tsx.snap b/src/components/Options/ExportData/Modals/__snapshots__/exportDoneModal.spec.tsx.snap
index a057c5370..afc4719f7 100644
--- a/src/components/Options/ExportData/Modals/__snapshots__/exportDoneModal.spec.tsx.snap
+++ b/src/components/Options/ExportData/Modals/__snapshots__/exportDoneModal.spec.tsx.snap
@@ -42,7 +42,7 @@ exports[`exportDoneModal component should be rendered correctly 1`] = `
>
<button
aria-label="export.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
@@ -158,7 +158,7 @@ exports[`exportDoneModal component should display error message 1`] = `
>
<button
aria-label="export.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-2 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Options/ExportData/Modals/__snapshots__/exportLoadingModal.spec.tsx.snap b/src/components/Options/ExportData/Modals/__snapshots__/exportLoadingModal.spec.tsx.snap
index bde82ab42..a3632b692 100644
--- a/src/components/Options/ExportData/Modals/__snapshots__/exportLoadingModal.spec.tsx.snap
+++ b/src/components/Options/ExportData/Modals/__snapshots__/exportLoadingModal.spec.tsx.snap
@@ -42,7 +42,7 @@ exports[`ExportLoadingModal component should be rendered correctly 1`] = `
>
<button
aria-label="export.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Options/ExportData/Modals/__snapshots__/exportStartModal.spec.tsx.snap b/src/components/Options/ExportData/Modals/__snapshots__/exportStartModal.spec.tsx.snap
index 4641758ad..d0917f71a 100644
--- a/src/components/Options/ExportData/Modals/__snapshots__/exportStartModal.spec.tsx.snap
+++ b/src/components/Options/ExportData/Modals/__snapshots__/exportStartModal.spec.tsx.snap
@@ -42,7 +42,7 @@ exports[`exportStartModal component should be rendered correctly 1`] = `
>
<button
aria-label="export.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Options/ExportData/Modals/exportDoneModal.tsx b/src/components/Options/ExportData/Modals/exportDoneModal.tsx
index 742fcc777..1d7fa8dd2 100644
--- a/src/components/Options/ExportData/Modals/exportDoneModal.tsx
+++ b/src/components/Options/ExportData/Modals/exportDoneModal.tsx
@@ -1,9 +1,10 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import exportDone from 'assets/icons/ico/exportDone.svg'
import warnCross from 'assets/icons/ico/warn-cross.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './exportDoneModal.scss'
@@ -36,13 +37,13 @@ const ExportDoneModal = ({
</div>
<div className="modal-done-root">
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ sized={18}
+ onClick={handleCloseClick}
aria-label={t('export.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} size={18} />
- </IconButton>
+ />
<div className="content">
<div className="icon-main">
diff --git a/src/components/Options/ExportData/Modals/exportLoadingModal.tsx b/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
index 4dda61aae..e8caa16c8 100644
--- a/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
+++ b/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
@@ -1,8 +1,8 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import * as Sentry from '@sentry/react'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import Loader from 'components/Loader/Loader'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -189,13 +189,13 @@ const ExportLoadingModal = ({
</div>
<div className="modal-loading-root">
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ sized={18}
+ onClick={handleCloseClick}
aria-label={t('export.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} size={18} />
- </IconButton>
+ />
<div className="content">
<div className="icon-main">
<Loader color="gold" />
diff --git a/src/components/Options/ExportData/Modals/exportStartModal.tsx b/src/components/Options/ExportData/Modals/exportStartModal.tsx
index 2210a5c7f..6412e8c7b 100644
--- a/src/components/Options/ExportData/Modals/exportStartModal.tsx
+++ b/src/components/Options/ExportData/Modals/exportStartModal.tsx
@@ -1,8 +1,9 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
import download from 'assets/icons/ico/download.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './exportStartModal.scss'
@@ -34,13 +35,13 @@ const ExportStartModal = ({
{t('export.modal_start.accessibility_title')}
</div>
<div className="modal-start-root">
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ sized={18}
+ onClick={handleCloseClick}
aria-label={t('export.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} size={18} />
- </IconButton>
+ />
<div className="content">
<div className="icon-main">
<StyledIcon icon={download} size={48} />
diff --git a/src/components/PartnerIssue/PartnerIssueModal.tsx b/src/components/PartnerIssue/PartnerIssueModal.tsx
index 6d26bd5e9..0bb7f96de 100644
--- a/src/components/PartnerIssue/PartnerIssueModal.tsx
+++ b/src/components/PartnerIssue/PartnerIssueModal.tsx
@@ -1,9 +1,9 @@
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
-import IconButton from '@material-ui/core/IconButton'
import CloseIcon from 'assets/icons/ico/close.svg'
import OrangeWarn from 'assets/icons/ico/warn-orange.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType } from 'enums'
import React from 'react'
@@ -50,13 +50,12 @@ const PartnerIssueModal = ({
<div id="accessibility-title">
{t('feedback.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={() => handleCloseClick(issuedFluid)}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={() => handleCloseClick(issuedFluid)}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="partnerIssueModal">
<StyledIcon icon={OrangeWarn} size={40} className="warn-icon" />
diff --git a/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap b/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap
index 2da3a3710..3f2d19fd5 100644
--- a/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap
+++ b/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`PartnerIssueModal component should render correctly 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx b/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx
index eb5992581..fd9b2c8f4 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx
@@ -86,9 +86,10 @@ const QuizQuestionContent = ({
<div className="quiz-container">
<div className="question-container">
<StyledIconButton
- className="btn-back"
icon={CloseIcon}
onClick={goBack}
+ aria-label={t('quiz.accessibility.window_quit')}
+ className="btn-back"
/>
<p className="index-question">{questionIndex + 1}/5</p>
<p className="question text-18-bold">
diff --git a/src/components/Terms/CGUModal.tsx b/src/components/Terms/CGUModal.tsx
index 2b481a416..5398cea05 100644
--- a/src/components/Terms/CGUModal.tsx
+++ b/src/components/Terms/CGUModal.tsx
@@ -1,11 +1,11 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import GCUContent from 'components/Options/GCU/GCUContent'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './termsView.scss'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
interface CGUModalProps {
open: boolean
@@ -26,13 +26,12 @@ const CGUModal = ({ open, handleCloseClick }: CGUModalProps) => {
<div id="accessibility-title">
{t('feedback.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<GCUContent />
<Button
aria-label={t('gcu_modal.accessibility.button_accept')}
diff --git a/src/components/Terms/LegalNoticeModal.tsx b/src/components/Terms/LegalNoticeModal.tsx
index 5b2796b86..10120ae93 100644
--- a/src/components/Terms/LegalNoticeModal.tsx
+++ b/src/components/Terms/LegalNoticeModal.tsx
@@ -1,7 +1,7 @@
-import { Button, IconButton } from '@material-ui/core'
+import { Button } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import LegalNoticeContent from 'components/Options/LegalNotice/LegalNoticeContent'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
@@ -28,13 +28,12 @@ const LegalNoticeModal = ({
}}
>
<div id="accessibility-title">{t('legal.title_legal')}</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={handleCloseClick}
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<LegalNoticeContent />
<Button
aria-label={t('gcu_modal.accessibility.button_accept')}
diff --git a/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap b/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap
index f69973105..3c7e8fbc6 100644
--- a/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap
+++ b/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`CGUModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap b/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap
index 12f39a089..ba890dd86 100644
--- a/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap
+++ b/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`LegalNoticeModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="feedback.accessibility.button_close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/components/WelcomeModal/WelcomeModal.tsx b/src/components/WelcomeModal/WelcomeModal.tsx
index c9ebab7cb..0b0a47a34 100644
--- a/src/components/WelcomeModal/WelcomeModal.tsx
+++ b/src/components/WelcomeModal/WelcomeModal.tsx
@@ -1,7 +1,8 @@
-import { Button, Dialog, IconButton } from '@material-ui/core'
+import { Button, Dialog } from '@material-ui/core'
import CloseIcon from 'assets/icons/ico/close.svg'
import PartnersConsentIcon from 'assets/icons/visu/onboarding/partners_consent.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import useUserInstanceSettings from 'components/Hooks/useUserInstanceSettings'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -79,13 +80,12 @@ const WelcomeModal = ({ open }: { open: boolean }) => {
<div id="accessibility-title">
{t('onboarding.welcomeModal.accessibility.window_title')}
</div>
- <IconButton
+ <StyledIconButton
+ icon={CloseIcon}
+ onClick={setWelcomeModalViewed}
aria-label={t('onboarding.welcomeModal.accessibility.button_valid')}
className="modal-paper-close-button"
- onClick={setWelcomeModalViewed}
- >
- <StyledIcon icon={CloseIcon} />
- </IconButton>
+ />
<div className="info">
<h1 className="info-header text-24-bold">
{t('onboarding.welcomeModal.title')}
diff --git a/src/components/WelcomeModal/__snapshots__/WelcomeModal.spec.tsx.snap b/src/components/WelcomeModal/__snapshots__/WelcomeModal.spec.tsx.snap
index 7f96a2ea5..ecd108864 100644
--- a/src/components/WelcomeModal/__snapshots__/WelcomeModal.spec.tsx.snap
+++ b/src/components/WelcomeModal/__snapshots__/WelcomeModal.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`WelcomeModal component should be rendered correctly 1`] = `
</div>
<button
aria-label="onboarding.welcomeModal.accessibility.button_valid"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 modal-paper-close-button"
tabindex="0"
type="button"
>
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 49c4b4199..205ca19d0 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -99,7 +99,11 @@
"approximative_description": "Pour comparer votre consommation avec un foyer similaire ou avec une conso idéale, veuillez détailler votre profil",
"no_data": "Pas de données",
"accessibility": {
- "button_go_to_profil": "Détailler mon profil"
+ "button_go_to_profil": "Détailler mon profil",
+ "comparison_multifluid": "Vos dépenses (tous fluides confondus) vs Dépenses moyennes",
+ "comparison_electricity": "Votre consommation d'électricité vs Consommation moyenne",
+ "comparison_water": "Votre consommation d'eau vs Consommation moyenne",
+ "comparison_gas": "Votre consommation de gaz vs Consommation moyenne"
},
"max_day": "Jour où vous avez le plus consommé",
"compare": {
@@ -152,8 +156,8 @@
},
"elec_info_modal": {
"accessibility": {
- "window_title": "electricity-info-modal",
- "button_close": "close-modal"
+ "window_title": "Information sur les statistiques Enedis",
+ "button_close": "Fermer la fenêtre d'information"
},
"maxPowerTitle": "Qu’est-ce que la puissance maximum\u00a0?",
"maxPowerDetails-1": "C’est la puissance maximum délivrée par tous les appareils fonctionnant au même moment dans votre logement.",
@@ -369,12 +373,9 @@
"data_empty": "Vide",
"estimated": "estimés",
"cost_per_fluid": {
- "elec": "Part de l'électricité",
+ "electricity": "Part de l'électricité",
"water": "Part de l'eau",
- "gas": "Part du gaz",
- "0": "Part de l'électricité",
- "1": "Part de l'eau",
- "2": "Part du gaz"
+ "gas": "Part du gaz"
},
"dataModal": {
"list_title": "3 raisons possibles :",
@@ -447,7 +448,8 @@
"title": "Félicitations !",
"subtitle": "Vous avez terminé tous les défis !",
"message1": "Nous travaillons actuellement à vous proposer de nouveaux défis.",
- "message2": "Vous pouvez donner votre avis sur ce que vous aimeriez en cliquant sur la bulle d'aide."
+ "message2": "Vous pouvez donner votre avis sur ce que vous aimeriez en cliquant sur la bulle d'aide.",
+ "close": "Fermer la fenêtre"
},
"duel_empty_value_modal": {
"title": "Oups !",
@@ -1240,6 +1242,7 @@
"next": "Suivant",
"consumption_question": "Question sur votre consommation",
"accessibility": {
+ "window_quit": "Quitter la fenêtre",
"window_title": "Fenêtre de résultat",
"button_end_quiz": "Terminer le quiz",
"button_go_back": "Retour",
--
GitLab