diff --git a/src/components/Action/ActionBegin/ActionBegin.tsx b/src/components/Action/ActionBegin/ActionBegin.tsx
index f66e40a5433aba395d8c6f5d96d05510c6f9afb9..aecee0d258f75d1f1895793e99668a949b427c97 100644
--- a/src/components/Action/ActionBegin/ActionBegin.tsx
+++ b/src/components/Action/ActionBegin/ActionBegin.tsx
@@ -92,8 +92,7 @@ const ActionBegin = ({
</div>
<div className="action-duration text-18">
{t('action.duration', {
- // eslint-disable-next-line camelcase
- smart_count: currentAction.actionDuration,
+ smartCount: currentAction.actionDuration,
})}
</div>
<div className="action-text text-18-bold">
diff --git a/src/components/Action/ActionModal/ActionModal.tsx b/src/components/Action/ActionModal/ActionModal.tsx
index 65cf21142faac8539622bf19607153a918336914..e681a46a8db1df94f24cc6dbcc44fcad94132574 100644
--- a/src/components/Action/ActionModal/ActionModal.tsx
+++ b/src/components/Action/ActionModal/ActionModal.tsx
@@ -58,8 +58,7 @@ const ActionModal = ({
<Icon icon={chronoMini} size={75} />
<div className="action-title text-16-normal">
{t('action.duration', {
- // eslint-disable-next-line camelcase
- smart_count: action.actionDuration,
+ smartCount: action.actionDuration,
})}
</div>
<div className="action-text text-16-normal">{action.longName}</div>
diff --git a/src/components/Action/ActionOnGoing/ActionOnGoing.tsx b/src/components/Action/ActionOnGoing/ActionOnGoing.tsx
index 383616089247da9775173c395b735c8647abf91a..5e869ec44ac786f1566741342d72d6b0f2030141 100644
--- a/src/components/Action/ActionOnGoing/ActionOnGoing.tsx
+++ b/src/components/Action/ActionOnGoing/ActionOnGoing.tsx
@@ -71,8 +71,7 @@ const ActionOnGoing = ({ userAction }: { userAction: UserAction }) => {
<>
<div className="duration text-18-normal">
{t('action.duration', {
- // eslint-disable-next-line camelcase
- smart_count: userAction.ecogesture.actionDuration,
+ smartCount: userAction.ecogesture.actionDuration,
})}
</div>
<div className="description text-18-bold">
diff --git a/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx b/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
index 195e7f24f9c9537997d36dad777a5c52013b6a59..a8a9cdabfa4fc152bedeab2e7ced23787002af60 100644
--- a/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
+++ b/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
@@ -49,7 +49,7 @@ const FluidPerformanceIndicator = ({
<div className="fpi-value">
<span className="fpi-load">{displayedValue}</span>
<span className="fpi-unit">
- {t('FLUID.' + FluidType[fluidType] + '.UNIT')}
+ {t(`FLUID.${FluidType[fluidType]}.UNIT`)}
</span>
</div>
{performanceIndicator?.percentageVariation === null && (
diff --git a/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx b/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx
index 37dccf55427acae66bc6e36844d26acf75f96062..9df2ac11c72bd24ce31897f69ceb9987795fc420 100644
--- a/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx
+++ b/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx
@@ -71,7 +71,7 @@ const TotalAnalysisChart = ({
>
<div className="text-36-bold">
{formatNumberValues(0)}
- <span className="euro-unit">{`${t('FLUID.MULTIFLUID.UNIT')}`}</span>
+ <span className="euro-unit">{t('FLUID.MULTIFLUID.UNIT')}</span>
</div>
<div className={`text-20-bold no_data`}>{t('analysis.no_data')}</div>
</PieChart>
@@ -99,9 +99,7 @@ const TotalAnalysisChart = ({
>
<div className="text-36-bold">
{formatNumberValues(totalLoadValue)}
- <span className="euro-unit">{`${t(
- 'FLUID.MULTIFLUID.UNIT'
- )}`}</span>
+ <span className="euro-unit">{t('FLUID.MULTIFLUID.UNIT')}</span>
</div>
<div className="text-16-normal date">
{t('analysis_pie.month') +
@@ -138,7 +136,7 @@ const TotalAnalysisChart = ({
size={38}
/>
<div className="text-16-normal">
- {t('FLUID.' + FluidType[index] + '.LABEL')}
+ {t(`FLUID.${FluidType[index]}.LABEL`)}
</div>
</div>
))}
diff --git a/src/components/Charts/AxisRight.tsx b/src/components/Charts/AxisRight.tsx
index 656eb8e822e5e06705d1726b959a54b119c252dd..d7257ec00b3f5989849258748324968c858a8e12 100644
--- a/src/components/Charts/AxisRight.tsx
+++ b/src/components/Charts/AxisRight.tsx
@@ -39,13 +39,11 @@ const AxisRight = ({
.tickFormat(d =>
Number(d) >= 1000 && fluidStyle !== 'MULTIFLUID'
? typeof d === 'number'
- ? `${d / 1000} ${t('FLUID.' + fluidStyle + '.MEGAUNIT')}`
- : `${d.valueOf() / 1000} ${t(
- 'FLUID.' + fluidStyle + '.MEGAUNIT'
- )}`
+ ? `${d / 1000} ${t(`FLUID.${fluidStyle}.MEGAUNIT`)}`
+ : `${d.valueOf() / 1000} ${t(`FLUID.${fluidStyle}.MEGAUNIT`)}`
: d === 0
? `${d}`
- : `${d} ${t('FLUID.' + fluidStyle + '.UNIT')}`
+ : `${d} ${t(`FLUID.${fluidStyle}.UNIT`)}`
)
)
selectAll('.tick text').attr('class', 'chart-ticks-y-text')
diff --git a/src/components/Connection/EPGLConnect/EpglBill.tsx b/src/components/Connection/EPGLConnect/EpglBill.tsx
index f39634b2c9cd96c81e6aec0452fe7f456c53c981..23f5c6177fb56a46dc0958b5dd8d4c694eccfd6d 100644
--- a/src/components/Connection/EPGLConnect/EpglBill.tsx
+++ b/src/components/Connection/EPGLConnect/EpglBill.tsx
@@ -7,7 +7,6 @@ import React from 'react'
import { setShowOfflineData } from 'store/chart/chart.slice'
import { useAppDispatch } from 'store/hooks'
import { openConnectionModal } from 'store/modal/modal.slice'
-import { decoreText } from 'utils/decoreText'
import '../connection.scss'
const EpglBill = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
@@ -21,9 +20,10 @@ const EpglBill = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
</p>
<StyledIcon icon={WaterBillIcon} size={180} />
- <p className={'connection-form-subtitle eglgrandlyon text-16-regular'}>
- {decoreText(t('auth.eglgrandlyon.bill'))}
- </p>
+ <p
+ className={'connection-form-subtitle eglgrandlyon text-16-regular'}
+ dangerouslySetInnerHTML={{ __html: t('auth.eglgrandlyon.bill') }}
+ />
<div className="connection-form-button">
<Button
diff --git a/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx b/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx
index da3470403761e67b33116bacc67042933aae7b3a..054e74e51c9c8c2c1ece0c1b96056e5e12b7c46f 100644
--- a/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx
+++ b/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx
@@ -107,8 +107,8 @@ const FormLogin = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
? 'form-control form-input'
: 'form-control form-input --error'
}
- aria-label={t('auth.' + konnectorSlug + '.connect_form.login')}
- placeholder={t('auth.' + konnectorSlug + '.connect_form.login')}
+ aria-label={t(`auth.${konnectorSlug}.connect_form.login`)}
+ placeholder={t(`auth.${konnectorSlug}.connect_form.login`)}
name="login"
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
changeLogin(e.target.value)
@@ -126,8 +126,8 @@ const FormLogin = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
? 'form-control form-input'
: 'form-control form-input --error'
}
- aria-label={t('auth.' + konnectorSlug + '.connect_form.password')}
- placeholder={t('auth.' + konnectorSlug + '.connect_form.password')}
+ aria-label={t(`auth.${konnectorSlug}.connect_form.password`)}
+ placeholder={t(`auth.${konnectorSlug}.connect_form.password`)}
name="password"
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
changePassword(e.target.value)
@@ -160,7 +160,7 @@ const FormLogin = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
{icon && <StyledIcon icon={icon} size={80} />}
</div>
<div className="connection-form-connect-button-text text-18-bold">
- <div>{t('auth.' + konnectorSlug + '.connect_form.label')}</div>
+ <div>{t(`auth.${konnectorSlug}.connect_form.label`)}</div>
</div>
</div>
</Button>
diff --git a/src/components/Connection/GRDFConnect/GrdfBill.tsx b/src/components/Connection/GRDFConnect/GrdfBill.tsx
index d547388ff58e8ad7be18c06f32157ec135c6f2d1..40c1dd0af27e666c1df30ff3bcdbf99a6e14051b 100644
--- a/src/components/Connection/GRDFConnect/GrdfBill.tsx
+++ b/src/components/Connection/GRDFConnect/GrdfBill.tsx
@@ -7,7 +7,6 @@ import React from 'react'
import { setShowOfflineData } from 'store/chart/chart.slice'
import { useAppDispatch } from 'store/hooks'
import { openConnectionModal } from 'store/modal/modal.slice'
-import { decoreText } from 'utils/decoreText'
import '../connection.scss'
const GrdfBill = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
@@ -20,9 +19,10 @@ const GrdfBill = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
{t('auth.grdfgrandlyon.no_account.title')}
</p>
<StyledIcon icon={GasBillIcon} size={180} />
- <p className={'connection-form-subtitle grdfgrandlyon text-16-regular'}>
- {decoreText(t('auth.grdfgrandlyon.bill'))}
- </p>
+ <p
+ className={'connection-form-subtitle grdfgrandlyon text-16-regular'}
+ dangerouslySetInnerHTML={{ __html: t('auth.grdfgrandlyon.bill') }}
+ />
<div className="connection-form-button">
<Button
diff --git a/src/components/Connection/PartnerConnectModal/Steps/EpglCreateAccount.tsx b/src/components/Connection/PartnerConnectModal/Steps/EpglCreateAccount.tsx
index 7c362975af1fda45504b97594457f8946271681c..83bd2c6eaece03529ea5c74087093e5515440df9 100644
--- a/src/components/Connection/PartnerConnectModal/Steps/EpglCreateAccount.tsx
+++ b/src/components/Connection/PartnerConnectModal/Steps/EpglCreateAccount.tsx
@@ -2,7 +2,6 @@ import EglIcon from 'assets/icons/visu/onboarding/egl.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './stepDetail.scss'
const EpglCreateAccount = () => {
@@ -12,9 +11,12 @@ const EpglCreateAccount = () => {
<div className="step-detail-info">
<StyledIcon className="info-icon" icon={EglIcon} size={220} />
<div className="info-content text-18-normal">
- <div className="info-content-text">
- {decoreText(t('auth.eglgrandlyon.step2.info1'))}
- </div>
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.eglgrandlyon.step2.info1'),
+ }}
+ />
</div>
</div>
)
diff --git a/src/components/Connection/PartnerConnectModal/Steps/EpglDoYouHaveAccount.tsx b/src/components/Connection/PartnerConnectModal/Steps/EpglDoYouHaveAccount.tsx
index db1e1a186bee9c727d05fff097b1c3a8d844794b..58c6c40de06d7880c0f56204b2971df405c1cc6e 100644
--- a/src/components/Connection/PartnerConnectModal/Steps/EpglDoYouHaveAccount.tsx
+++ b/src/components/Connection/PartnerConnectModal/Steps/EpglDoYouHaveAccount.tsx
@@ -2,7 +2,6 @@ import BrowserEgl from 'assets/icons/visu/onboarding/browser_egl.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './stepDetail.scss'
const EpglDoYouHaveAccount = () => {
@@ -12,12 +11,18 @@ const EpglDoYouHaveAccount = () => {
<div className="step-detail-info">
<StyledIcon className="info-icon" icon={BrowserEgl} size={150} />
<div className="info-content text-18-normal">
- <div className="info-content-text">
- {decoreText(t('auth.eglgrandlyon.step1.info1'))}
- </div>
- <div className="info-content-text">
- {decoreText(t('auth.eglgrandlyon.step1.info2'))}
- </div>
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.eglgrandlyon.step1.info1'),
+ }}
+ />
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.eglgrandlyon.step1.info2'),
+ }}
+ />
</div>
</div>
)
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx
index 1751a430928764263e04c595b5e4944a15c48f8d..3d945808cb5b30cf220bb8fd02b769b2f066be11 100644
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx
+++ b/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx
@@ -2,7 +2,6 @@ import GrdfIcon from 'assets/icons/visu/onboarding/grdf.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './stepDetail.scss'
const GrdfCreateAccount = () => {
@@ -12,9 +11,12 @@ const GrdfCreateAccount = () => {
<div className="step-detail-info">
<Icon className="info-icon" icon={GrdfIcon} size={220} />
<div className="info-content text-18-normal">
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step2.info1'))}
- </div>
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step2.info1'),
+ }}
+ />
</div>
</div>
)
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx
index 680d15184fc472155fee743138f14edf90a1fc9c..aadcc4ee4c5a5657d1bfb933eacb2c3b3f616445 100644
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx
+++ b/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx
@@ -2,7 +2,6 @@ import BrowserGrdf from 'assets/icons/visu/onboarding/browser_grdf.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './stepDetail.scss'
const GrdfDoYouHaveAccount = () => {
@@ -12,16 +11,24 @@ const GrdfDoYouHaveAccount = () => {
<div className="step-detail-info">
<Icon className="info-icon" icon={BrowserGrdf} size={150} />
<div className="info-content text-18-normal">
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step1.info1'))}
- {decoreText(t('auth.grdfgrandlyon.step1.info2'))}
- </div>
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step1.info3'))}
- </div>
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step1.info4'))}
- </div>
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step1.info1'),
+ }}
+ />
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step1.info2'),
+ }}
+ />
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step1.info3'),
+ }}
+ />
</div>
</div>
)
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx
index 79e5bcbc547c74f55440b5bce613390307bb6569..64bebd7590a0caeeb1a2bf0c09018abed3a6712d 100644
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx
+++ b/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx
@@ -2,7 +2,6 @@ import GrdfConsent from 'assets/icons/visu/onboarding/grdf_consent.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './stepDetail.scss'
const GrdfGiveConsent = () => {
@@ -12,15 +11,24 @@ const GrdfGiveConsent = () => {
<div className="step-detail-info">
<Icon className="info-icon" icon={GrdfConsent} size={220} />
<div className="info-content text-18-normal">
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step3.info1'))}
- </div>
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step3.info2'))}
- </div>
- <div className="info-content-text">
- {decoreText(t('auth.grdfgrandlyon.step3.info3'))}
- </div>
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step3.info1'),
+ }}
+ />
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step3.info2'),
+ }}
+ />
+ <div
+ className="info-content-text"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.step3.info3'),
+ }}
+ />
</div>
</div>
)
diff --git a/src/components/Connection/SGEConnect/SgeInit.tsx b/src/components/Connection/SGEConnect/SgeInit.tsx
index 6294b8d3a47f8131069d98bcfe0df35237103b72..57b6bf02f7fccf597bac917ece67475c6d676841 100644
--- a/src/components/Connection/SGEConnect/SgeInit.tsx
+++ b/src/components/Connection/SGEConnect/SgeInit.tsx
@@ -12,7 +12,6 @@ import {
updateSgeStore,
} from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { decoreText } from 'utils/decoreText'
const SgeInit = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
const { t } = useI18n()
@@ -46,9 +45,8 @@ const SgeInit = ({ fluidStatus }: { fluidStatus: FluidStatus }) => {
<StyledIcon icon={ElectricityBillIcon} size={180} />
<p
className={`connection-form-subtitle ${konnectorSlug} text-16-regular`}
- >
- {decoreText(t('auth.' + `${konnectorSlug}` + '.bill'))}
- </p>
+ dangerouslySetInnerHTML={{ __html: t(`auth.${konnectorSlug}.bill`) }}
+ />
<div className="connection-form-button">
<Button
diff --git a/src/components/Connection/SGEConnect/StepConsent.tsx b/src/components/Connection/SGEConnect/StepConsent.tsx
index 2dec320d88d03c2aa88a79e2710872bbc6300dde..c8dc887a81d7c938d9d26ea228109240375686d8 100644
--- a/src/components/Connection/SGEConnect/StepConsent.tsx
+++ b/src/components/Connection/SGEConnect/StepConsent.tsx
@@ -2,7 +2,6 @@ import classNames from 'classnames'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { SgeStore } from 'models'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import { SGEKeysForm } from './SgeConnectView'
interface StepConsentProps {
@@ -40,7 +39,11 @@ const StepConsent = ({ sgeState, onChange }: StepConsentProps) => {
}
checked={sgeState.dataConsent}
/>
- <span>{decoreText(t('auth.enedissgegrandlyon.consentCheck1'))}</span>
+ <span
+ dangerouslySetInnerHTML={{
+ __html: t('auth.enedissgegrandlyon.consentCheck1'),
+ }}
+ />
</label>
<label
className={classNames('checkbox', {
@@ -56,7 +59,11 @@ const StepConsent = ({ sgeState, onChange }: StepConsentProps) => {
}
checked={sgeState.pdlConfirm}
/>
- {decoreText(t('auth.enedissgegrandlyon.consentCheck2'))}
+ <span
+ dangerouslySetInnerHTML={{
+ __html: t('auth.enedissgegrandlyon.consentCheck2'),
+ }}
+ />
</label>
</div>
)
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap
index 83745b2d942937a2c53d419c8039e6f8213db030..1f9dee3a2b4609e028abfe60780d5583f9a32169 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap
@@ -80,9 +80,12 @@ exports[`SgeInit component should be rendered correctly 1`] = `
</StyledIcon>
<p
className="connection-form-subtitle enedissgegrandlyon text-16-regular"
- >
- auth.enedissgegrandlyon.bill
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "auth.enedissgegrandlyon.bill",
+ }
+ }
+ />
<div
className="connection-form-button"
>
diff --git a/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
index f5fd68d492c79666b431eae5ce7719273b7005d1..d474fdf8d8147abb417524d5915fac4afaab15fe 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
@@ -69,9 +69,13 @@ exports[`StepConsent component should be rendered correctly 1`] = `
onChange={[Function]}
type="checkbox"
/>
- <span>
- auth.enedissgegrandlyon.consentCheck1
- </span>
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "auth.enedissgegrandlyon.consentCheck1",
+ }
+ }
+ />
</label>
<label
className="checkbox"
@@ -83,7 +87,13 @@ exports[`StepConsent component should be rendered correctly 1`] = `
onChange={[Function]}
type="checkbox"
/>
- auth.enedissgegrandlyon.consentCheck2
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "auth.enedissgegrandlyon.consentCheck2",
+ }
+ }
+ />
</label>
</div>
</StepConsent>
diff --git a/src/components/Connection/__snapshots__/Connection.spec.tsx.snap b/src/components/Connection/__snapshots__/Connection.spec.tsx.snap
index 731f690ea9508bb29eabd329fb39f5e21c35b182..16d66b146963068c23261f38b416e2e246b5e2ae 100644
--- a/src/components/Connection/__snapshots__/Connection.spec.tsx.snap
+++ b/src/components/Connection/__snapshots__/Connection.spec.tsx.snap
@@ -131,9 +131,12 @@ exports[`Connection component test should call EpglInit 1`] = `
</StyledIcon>
<p
className="connection-form-subtitle enedissgegrandlyon text-16-regular"
- >
- auth.enedissgegrandlyon.bill
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "auth.enedissgegrandlyon.bill",
+ }
+ }
+ />
<div
className="connection-form-button"
>
diff --git a/src/components/Consumption/FluidButtons/FluidButton.tsx b/src/components/Consumption/FluidButtons/FluidButton.tsx
index 43d9ea274fc4b74bdc50967cd2bbf29512c71553..f2d4db17c2273683d2eb5fcf08e65f0a292592fa 100644
--- a/src/components/Consumption/FluidButtons/FluidButton.tsx
+++ b/src/components/Consumption/FluidButtons/FluidButton.tsx
@@ -104,7 +104,7 @@ const FluidButton = ({ fluidType, isActive }: FluidButtonProps) => {
isActive && 'active'
} text-14-normal`}
>
- {t('FLUID.' + FluidType[fluidType] + '.LABEL')}
+ {t(`FLUID.${FluidType[fluidType]}.LABEL`)}
</div>
</div>
)
diff --git a/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx b/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx
index deff168d6d9167c8cee52068d1b86158ca5b34ed..df5dbd98817a75eb745bd54b9f43536fa42fd652 100644
--- a/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx
@@ -24,7 +24,7 @@ const DataloadSectionValue = ({
<>
{formatNumberValues(dataload.value)}
<span className={'text-18-normal euroUnit'}>
- {`${t('FLUID.' + FluidType[fluidType] + '.UNIT')}`}
+ {t(`FLUID.${FluidType[fluidType]}.UNIT`)}
</span>
{dataloadSectionType === DataloadSectionType.NO_COMPARE && (
<span
@@ -50,14 +50,14 @@ const DataloadSectionValue = ({
<>
{formatNumberValues(dataload.value, FluidType[fluidType])}
<span className="text-18-normal">
- {`${t('FLUID.' + FluidType[fluidType] + '.MEGAUNIT')}`}
+ {t(`FLUID.${FluidType[fluidType]}.MEGAUNIT`)}
</span>
</>
) : (
<>
{formatNumberValues(dataload.value)}
<span className={'text-18-normal'}>
- {`${t('FLUID.' + FluidType[fluidType] + '.UNIT')}`}
+ {t(`FLUID.${FluidType[fluidType]}.UNIT`)}
</span>
</>
)}
diff --git a/src/components/Duel/DuelOngoing/DuelOngoing.tsx b/src/components/Duel/DuelOngoing/DuelOngoing.tsx
index a80cc5a2bab25cfc4116a587b15e975073af550d..dc8073ada3b6b20a648693155d83922dac95a69d 100644
--- a/src/components/Duel/DuelOngoing/DuelOngoing.tsx
+++ b/src/components/Duel/DuelOngoing/DuelOngoing.tsx
@@ -148,14 +148,12 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
<div className="duel-goal text-18-normal">
{t('duel.goal1', {
durationInDays,
- // eslint-disable-next-line camelcase
- smart_count: durationInDays,
+ smartCount: durationInDays,
})}
<span> </span>
{t('duel.goal2', {
title,
- // eslint-disable-next-line camelcase
- smart_count: title,
+ smartCount: title,
})}
</div>
)}
diff --git a/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx b/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx
index df8091f2e2c13c8b7c3f7b2099372fe8df3639a2..c5da4d74ed98df664d3aa769f0033eb33fcd92ff 100644
--- a/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx
+++ b/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx
@@ -67,11 +67,10 @@ const DuelUnlocked = ({ userChallenge }: { userChallenge: UserChallenge }) => {
{userChallenge.duel.title}
</div>
<div className="duel-average-info text-18-normal">
- {`${t('duel.average_info', {
+ {t('duel.average_info', {
average,
- // eslint-disable-next-line camelcase
- smart_count: average,
- })}`}
+ smartCount: average,
+ })}
</div>
<div className="button-start">
<Button
diff --git a/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.tsx b/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.tsx
index f404b7108857c32943c918fb91d47c3596253aa2..8482b95431ccfe35c6f2b587264b975c1e542c29 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.tsx
@@ -23,8 +23,7 @@ const EcogestureSelectionRestart = ({
<div className="content">
<div className="title text-21-bold">
{t('ecogesture_selection.title', {
- // eslint-disable-next-line camelcase
- smart_count: listLength,
+ smartCount: listLength,
})}
</div>
<StyledIcon icon={icon} size={120} />
diff --git a/src/components/Konnector/KonnectorModal.tsx b/src/components/Konnector/KonnectorModal.tsx
index 766ad2952593fdd72cb9482cfaa4398613338d02..fdd22881962d887260c0a473cbde569fdad3d08a 100644
--- a/src/components/Konnector/KonnectorModal.tsx
+++ b/src/components/Konnector/KonnectorModal.tsx
@@ -208,6 +208,7 @@ const KonnectorModal = ({
)}
{showCommonErrors && (
<div
+ className="commonErrorsList"
dangerouslySetInnerHTML={{
__html: t(
'konnector_modal.show_common_error_list'
diff --git a/src/components/Konnector/konnectorModal.scss b/src/components/Konnector/konnectorModal.scss
index f6fd4967003b641af2010af18788b5308d4f5726..e650b7c1eb45b084e5830f4cb7ec640617110f83 100644
--- a/src/components/Konnector/konnectorModal.scss
+++ b/src/components/Konnector/konnectorModal.scss
@@ -84,6 +84,25 @@
cursor: pointer;
margin: 1rem auto 0.5rem;
}
+ .commonErrorsList {
+ text-align: left;
+ span {
+ font-weight: 700;
+ &.gold {
+ color: $gold-shadow;
+ }
+ }
+ .center {
+ text-align: center;
+ font-weight: 700;
+ }
+ p {
+ text-align: center;
+ font-style: italic;
+ font-weight: 400;
+ font-size: 0.9rem;
+ }
+ }
}
}
}
diff --git a/src/components/Options/ExportData/ExportData.tsx b/src/components/Options/ExportData/ExportData.tsx
index 313e7c0a0e4a51210a137fa5afd24987047eb49b..22bedc378d83a9adf6960c751bcc7a5c371d9c1e 100644
--- a/src/components/Options/ExportData/ExportData.tsx
+++ b/src/components/Options/ExportData/ExportData.tsx
@@ -82,11 +82,11 @@ const ExportData = () => {
<input
type={'checkbox'}
value={fluidType}
- name={t('FLUID.' + FluidType[fluidType] + '.LABEL')}
+ name={t(`FLUID.${FluidType[fluidType]}.LABEL`)}
onChange={() => handleChange(fluidType)}
checked={answer.includes(fluidType)}
/>
- {t('FLUID.' + FluidType[fluidType] + '.LABEL')}
+ {t(`FLUID.${FluidType[fluidType]}.LABEL`)}
</label>
))
diff --git a/src/components/Options/ExportData/Modals/exportLoadingModal.tsx b/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
index 9f42e475a363c764ccba7e7d44bd2e57969e34ae..edf47eb38f806d115074d1dac52c5dbbbee382cf 100644
--- a/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
+++ b/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
@@ -70,7 +70,7 @@ const ExportLoadingModal = ({
dataRow[t('export.year')] = dataload.date.year
dataRow[
`${t('export.consumption')} (${t(
- 'FLUID.' + FluidType[fluidType] + '.UNIT'
+ `FLUID.${FluidType[fluidType]}.UNIT`
)})`
] = dataload.value
if (fluidType === FluidType.ELECTRICITY) {
@@ -125,7 +125,7 @@ const ExportLoadingModal = ({
if (!dataLoad?.actualData) return null
const exportDataSheet: ExportDataSheet = {
- fluidName: t('FLUID.' + FluidType[fluidType] + '.LABEL'),
+ fluidName: t(`FLUID.${FluidType[fluidType]}.LABEL`),
data: [],
}
diff --git a/src/components/Options/GCU/GCUContent.tsx b/src/components/Options/GCU/GCUContent.tsx
index 1ecb3fcc6d3cc0eb9387d219dc1daa27add51278..e15457d091369bf4469a944c6b44d819f04422e1 100644
--- a/src/components/Options/GCU/GCUContent.tsx
+++ b/src/components/Options/GCU/GCUContent.tsx
@@ -1,6 +1,5 @@
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './gcuContent.scss'
const GCUContent = (): JSX.Element => {
@@ -39,7 +38,10 @@ const GCUContent = (): JSX.Element => {
{t('gcu.content.title4')}
</div>
<p className="text-14-normal">{t('gcu.content.part4_1')}</p>
- <p className="text-14-normal">{decoreText(t('gcu.content.part4_2'))}</p>
+ <p
+ className="text-14-normal"
+ dangerouslySetInnerHTML={{ __html: t('gcu.content.part4_2') }}
+ />
<div className="gcu-content-part-title text-15-normal">
{t('gcu.content.title5')}
</div>
@@ -69,7 +71,10 @@ const GCUContent = (): JSX.Element => {
{t('gcu.content.title8')}
</div>
<p className="text-14-normal">{t('gcu.content.part8_1')}</p>
- <p className="text-14-normal">{decoreText(t('gcu.content.part8_2'))}</p>
+ <p
+ className="text-14-normal"
+ dangerouslySetInnerHTML={{ __html: t('gcu.content.part8_2') }}
+ />
<div className="gcu-content-part-title text-15-normal">
{t('gcu.content.title9')}
</div>
@@ -87,7 +92,11 @@ const GCUContent = (): JSX.Element => {
</p>
<p className="text-14-normal">
<span className="text-14-bold">{t('gcu.content.part9_4_title')}</span>
- <span>{decoreText(t('gcu.content.part9_4_content'))}</span>
+ <span
+ dangerouslySetInnerHTML={{
+ __html: t('gcu.content.part9_4_content'),
+ }}
+ />
</p>
<p className="text-14-normal">
<span className="text-14-bold">{t('gcu.content.part9_5_title')}</span>
diff --git a/src/components/Options/GCU/__snapshots__/GCUContent.spec.tsx.snap b/src/components/Options/GCU/__snapshots__/GCUContent.spec.tsx.snap
index 007cca08c725d8850df473c4f4c49142a34f2de1..ea98b5c5bfe26e8e4f4db25366f0348c62902e85 100644
--- a/src/components/Options/GCU/__snapshots__/GCUContent.spec.tsx.snap
+++ b/src/components/Options/GCU/__snapshots__/GCUContent.spec.tsx.snap
@@ -107,9 +107,12 @@ exports[`GCUContent component should be rendered correctly 1`] = `
</p>
<p
className="text-14-normal"
- >
- gcu.content.part4_2
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part4_2",
+ }
+ }
+ />
<div
className="gcu-content-part-title text-15-normal"
>
@@ -205,9 +208,12 @@ exports[`GCUContent component should be rendered correctly 1`] = `
</p>
<p
className="text-14-normal"
- >
- gcu.content.part8_2
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part8_2",
+ }
+ }
+ />
<div
className="gcu-content-part-title text-15-normal"
>
@@ -257,19 +263,13 @@ exports[`GCUContent component should be rendered correctly 1`] = `
>
gcu.content.part9_4_title
</span>
- <span>
- <React.Fragment>
- test
- <a
- href="link.com"
- rel="noopener noreferrer"
- target="_blank"
- >
- link
- </a>
- fin test
- </React.Fragment>
- </span>
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "test <a href=\\"link.com\\">link</a>fin test",
+ }
+ }
+ />
</p>
<p
className="text-14-normal"
@@ -394,9 +394,12 @@ exports[`GCUContent component should display a link when translation contains <a
</p>
<p
className="text-14-normal"
- >
- gcu.content.part4_2
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part4_2",
+ }
+ }
+ />
<div
className="gcu-content-part-title text-15-normal"
>
@@ -492,9 +495,12 @@ exports[`GCUContent component should display a link when translation contains <a
</p>
<p
className="text-14-normal"
- >
- gcu.content.part8_2
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part8_2",
+ }
+ }
+ />
<div
className="gcu-content-part-title text-15-normal"
>
@@ -544,19 +550,13 @@ exports[`GCUContent component should display a link when translation contains <a
>
gcu.content.part9_4_title
</span>
- <span>
- <React.Fragment>
- test
- <a
- href="link.com"
- rel="noopener noreferrer"
- target="_blank"
- >
- link
- </a>
- fin test
- </React.Fragment>
- </span>
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "test <a href=\\"link.com\\">link</a>fin test",
+ }
+ }
+ />
</p>
<p
className="text-14-normal"
diff --git a/src/components/Options/LegalNotice/LegalNoticeContent.tsx b/src/components/Options/LegalNotice/LegalNoticeContent.tsx
index eba23d5b0b9e5b79016ca01453e24d9aa6298068..86b3c385fd6a79d691ba9f302801f2fcb8237514 100644
--- a/src/components/Options/LegalNotice/LegalNoticeContent.tsx
+++ b/src/components/Options/LegalNotice/LegalNoticeContent.tsx
@@ -1,6 +1,5 @@
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
-import { decoreText } from 'utils/decoreText'
import './legalNoticeView.scss'
const LegalNoticeContent = () => {
@@ -10,10 +9,13 @@ const LegalNoticeContent = () => {
<div className="legal-notice-root">
<div className="legal-notice-content">
<p className="version">{t('legal.version')}</p>
- <p>{decoreText(t('legal.site'))}</p>
+ <p dangerouslySetInnerHTML={{ __html: t('legal.site') }} />
<p>{t('legal.adress')}</p>
<p>{t('legal.phone')}</p>
- <p className="ln-contact">{decoreText(t('legal.mail'))}</p>
+ <p
+ className="ln-contact"
+ dangerouslySetInnerHTML={{ __html: t('legal.mail') }}
+ />
<div className="text-16-normal">
<div className="legal-notice-oneline">
<span className="text-14-normal">{t('legal.p1b')}</span>
@@ -56,7 +58,9 @@ const LegalNoticeContent = () => {
<li>{t('legal.part2-3-2')}</li>
<li>{t('legal.part2-3-3')}</li>
<li>{t('legal.part2-3-4')}</li>
- <li>{decoreText(t('legal.part2-3-5'))}</li>
+ <li
+ dangerouslySetInnerHTML={{ __html: t('legal.part2-3-5') }}
+ />
</ul>
</li>
<li>{t('legal.part2-4')}</li>
@@ -68,10 +72,10 @@ const LegalNoticeContent = () => {
<li>{t('legal.part2-6-2')}</li>
<li>{t('legal.part2-6-3')}</li>
</ul>
- <p>{decoreText(t('legal.part2-7'))}</p>
+ <p dangerouslySetInnerHTML={{ __html: t('legal.part2-7') }} />
<p>{t('legal.part2-8')}</p>
<p>{t('legal.part2-9')}</p>
- <p>{decoreText(t('legal.part2-10'))}</p>
+ <p dangerouslySetInnerHTML={{ __html: t('legal.part2-10') }} />
<p>{t('legal.part2-11')}</p>
</div>
<div className="legal-notice-part">
@@ -95,7 +99,7 @@ const LegalNoticeContent = () => {
<div className="legal-notice-part">
<h3>{t('legal.title7')}</h3>
<p>{t('legal.part7-1')}</p>
- <p>{decoreText(t('legal.part7-2'))}</p>
+ <p dangerouslySetInnerHTML={{ __html: t('legal.part7-2') }} />
<p>{t('legal.part7-3')}</p>
</div>
<div className="legal-notice-part">
diff --git a/src/components/Options/LegalNotice/__snapshots__/LegalNoticeContent.spec.tsx.snap b/src/components/Options/LegalNotice/__snapshots__/LegalNoticeContent.spec.tsx.snap
index 69a5b05402c63a1db03028dd805a630148bf4493..322cf9fb612ba9ab88be218725372d23a485eaba 100644
--- a/src/components/Options/LegalNotice/__snapshots__/LegalNoticeContent.spec.tsx.snap
+++ b/src/components/Options/LegalNotice/__snapshots__/LegalNoticeContent.spec.tsx.snap
@@ -13,9 +13,13 @@ exports[`LegalNoticeContent component should be rendered correctly 1`] = `
>
legal.version
</p>
- <p>
- legal.site
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.site",
+ }
+ }
+ />
<p>
legal.adress
</p>
@@ -24,9 +28,12 @@ exports[`LegalNoticeContent component should be rendered correctly 1`] = `
</p>
<p
className="ln-contact"
- >
- legal.mail
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.mail",
+ }
+ }
+ />
<div
className="text-16-normal"
>
@@ -132,9 +139,13 @@ exports[`LegalNoticeContent component should be rendered correctly 1`] = `
<li>
legal.part2-3-4
</li>
- <li>
- legal.part2-3-5
- </li>
+ <li
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part2-3-5",
+ }
+ }
+ />
</ul>
</li>
<li>
@@ -158,18 +169,26 @@ exports[`LegalNoticeContent component should be rendered correctly 1`] = `
legal.part2-6-3
</li>
</ul>
- <p>
- legal.part2-7
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part2-7",
+ }
+ }
+ />
<p>
legal.part2-8
</p>
<p>
legal.part2-9
</p>
- <p>
- legal.part2-10
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part2-10",
+ }
+ }
+ />
<p>
legal.part2-11
</p>
@@ -229,9 +248,13 @@ exports[`LegalNoticeContent component should be rendered correctly 1`] = `
<p>
legal.part7-1
</p>
- <p>
- legal.part7-2
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part7-2",
+ }
+ }
+ />
<p>
legal.part7-3
</p>
diff --git a/src/components/ReleaseNotesModal/ReleaseNotesModal.tsx b/src/components/ReleaseNotesModal/ReleaseNotesModal.tsx
index d775351c8e6e8b0891d487df0adaeac80e7bb19e..bd0b6cec8bbc2b8912c40e5300e6b37aaac37e25 100644
--- a/src/components/ReleaseNotesModal/ReleaseNotesModal.tsx
+++ b/src/components/ReleaseNotesModal/ReleaseNotesModal.tsx
@@ -3,7 +3,6 @@ import Dialog from '@material-ui/core/Dialog'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import { useAppSelector } from 'store/hooks'
-import { decoreText } from 'utils/decoreText'
import './ReleaseNotesModal.scss'
interface ReleaseNotesModalProps {
@@ -51,9 +50,10 @@ const ReleaseNotesModal = ({
<div className="release-note-message text-16-bold">
{note.title}
</div>
- <div className="release-note-description text-16-normal">
- {decoreText(note.description)}
- </div>
+ <div
+ className="release-note-description text-16-normal"
+ dangerouslySetInnerHTML={{ __html: note.description }}
+ />
</div>
))}
</div>
diff --git a/src/components/Terms/DataShareConsentContent.tsx b/src/components/Terms/DataShareConsentContent.tsx
index 8ea9515c07f4adc324f79c2cd529e92dea74a5b8..97e17a7abb99a7e0e5fc8b9bef177412afe13654 100644
--- a/src/components/Terms/DataShareConsentContent.tsx
+++ b/src/components/Terms/DataShareConsentContent.tsx
@@ -1,7 +1,6 @@
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import { useAppSelector } from 'store/hooks'
-import { decoreText } from 'utils/decoreText'
import './termsView.scss'
const DataShareConsentContent = () => {
@@ -29,14 +28,15 @@ const DataShareConsentContent = () => {
</ul>
<p className="text-14-normal">{t('dataShare.part4')}</p>
<p className="text-14-normal">{t('dataShare.part5')}</p>
- <p className="text-14-normal">{decoreText(t('dataShare.part6'))}</p>
+ <p className="text-14-normal">{t('dataShare.part6')}</p>
<p className="text-14-normal">{t('dataShare.part7')}</p>
<p className="text-14-normal">{t('dataShare.part8')}</p>
<span className="text-14-normal">{t('dataShare.part9')}</span>
<span className="text-14-normal">{t('dataShare.part10')}</span>
- <span className="text-14-normal">
- {decoreText(t('dataShare.link1'))}
- </span>
+ <span
+ className="text-14-normal"
+ dangerouslySetInnerHTML={{ __html: t('dataShare.link1') }}
+ />
</div>
</div>
)
diff --git a/src/components/Terms/TermsView.tsx b/src/components/Terms/TermsView.tsx
index 6e79eafa7c32b803f54581b88784e0ac15db7b35..cd192f210271c84cb4166cbc39bfd3caf157b934 100644
--- a/src/components/Terms/TermsView.tsx
+++ b/src/components/Terms/TermsView.tsx
@@ -7,7 +7,6 @@ import { useNavigate } from 'react-router-dom'
import TermsService from 'services/terms.service'
import { updateTermsStatus } from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { decoreText } from 'utils/decoreText'
import CGUModal from './CGUModal'
import DataShareConsentContent from './DataShareConsentContent'
import LegalNoticeModal from './LegalNoticeModal'
@@ -87,12 +86,14 @@ const TermsView = () => {
onChange={handleGCUValidate}
checked={GCUValidation}
/>
- <span>
- {decoreText(t('dataShare.validCGU'), () => toggleCGUModal())}
- {decoreText(t('dataShare.validLegal'), () =>
- toggleLegalNoticeModal()
- )}
- </span>
+ <span
+ onClick={() => toggleCGUModal()}
+ dangerouslySetInnerHTML={{ __html: t('dataShare.validCGU') }}
+ />
+ <span
+ onClick={() => toggleLegalNoticeModal()}
+ dangerouslySetInnerHTML={{ __html: t('dataShare.validLegal') }}
+ />
</label>
</div>
<div className="terms-footer">
diff --git a/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap b/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap
index f4c8c69d3d9466806c769c35f927478916bc178e..640e034ecfb9141db9aa27c259b0e319b3ea84e9 100644
--- a/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap
+++ b/src/components/Terms/__snapshots__/CGUModal.spec.tsx.snap
@@ -1164,9 +1164,12 @@ exports[`CGUModal component should be rendered correctly 1`] = `
</p>
<p
className="text-14-normal"
- >
- gcu.content.part4_2
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part4_2",
+ }
+ }
+ />
<div
className="gcu-content-part-title text-15-normal"
>
@@ -1262,9 +1265,12 @@ exports[`CGUModal component should be rendered correctly 1`] = `
</p>
<p
className="text-14-normal"
- >
- gcu.content.part8_2
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part8_2",
+ }
+ }
+ />
<div
className="gcu-content-part-title text-15-normal"
>
@@ -1314,9 +1320,13 @@ exports[`CGUModal component should be rendered correctly 1`] = `
>
gcu.content.part9_4_title
</span>
- <span>
- gcu.content.part9_4_content
- </span>
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "gcu.content.part9_4_content",
+ }
+ }
+ />
</p>
<p
className="text-14-normal"
diff --git a/src/components/Terms/__snapshots__/DataShareConsentContent.spec.tsx.snap b/src/components/Terms/__snapshots__/DataShareConsentContent.spec.tsx.snap
index 6355e73b82194c4e4bc3ac49991f1a4c4b01487e..e73f9fe284542df8c5d93672bea9a157f7f20820 100644
--- a/src/components/Terms/__snapshots__/DataShareConsentContent.spec.tsx.snap
+++ b/src/components/Terms/__snapshots__/DataShareConsentContent.spec.tsx.snap
@@ -96,9 +96,12 @@ exports[`DataShareConsentContent component should be rendered correctly with fir
</span>
<span
className="text-14-normal"
- >
- dataShare.link1
- </span>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "dataShare.link1",
+ }
+ }
+ />
</div>
</div>
</DataShareConsentContent>
@@ -206,9 +209,12 @@ exports[`DataShareConsentContent component should be rendered correctly without
</span>
<span
className="text-14-normal"
- >
- dataShare.link1
- </span>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "dataShare.link1",
+ }
+ }
+ />
</div>
</div>
</DataShareConsentContent>
diff --git a/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap b/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap
index 5f03163208a50ffa6f4672024a25a81e4b3c98f2..81580a001b627d3cc9f40fa6bd9941ffe8155734 100644
--- a/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap
+++ b/src/components/Terms/__snapshots__/LegalNoticeModal.spec.tsx.snap
@@ -1055,9 +1055,13 @@ exports[`LegalNoticeModal component should be rendered correctly 1`] = `
>
legal.version
</p>
- <p>
- legal.site
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.site",
+ }
+ }
+ />
<p>
legal.adress
</p>
@@ -1066,9 +1070,12 @@ exports[`LegalNoticeModal component should be rendered correctly 1`] = `
</p>
<p
className="ln-contact"
- >
- legal.mail
- </p>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.mail",
+ }
+ }
+ />
<div
className="text-16-normal"
>
@@ -1174,9 +1181,13 @@ exports[`LegalNoticeModal component should be rendered correctly 1`] = `
<li>
legal.part2-3-4
</li>
- <li>
- legal.part2-3-5
- </li>
+ <li
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part2-3-5",
+ }
+ }
+ />
</ul>
</li>
<li>
@@ -1200,18 +1211,26 @@ exports[`LegalNoticeModal component should be rendered correctly 1`] = `
legal.part2-6-3
</li>
</ul>
- <p>
- legal.part2-7
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part2-7",
+ }
+ }
+ />
<p>
legal.part2-8
</p>
<p>
legal.part2-9
</p>
- <p>
- legal.part2-10
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part2-10",
+ }
+ }
+ />
<p>
legal.part2-11
</p>
@@ -1271,9 +1290,13 @@ exports[`LegalNoticeModal component should be rendered correctly 1`] = `
<p>
legal.part7-1
</p>
- <p>
- legal.part7-2
- </p>
+ <p
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "legal.part7-2",
+ }
+ }
+ />
<p>
legal.part7-3
</p>
diff --git a/src/components/Terms/__snapshots__/TermsView.spec.tsx.snap b/src/components/Terms/__snapshots__/TermsView.spec.tsx.snap
index 5c505a9990fa805c946808d4fc2a52a395e6a6f4..375a00d43a5a2cc271c4ad24c4ccb82ea0f24d62 100644
--- a/src/components/Terms/__snapshots__/TermsView.spec.tsx.snap
+++ b/src/components/Terms/__snapshots__/TermsView.spec.tsx.snap
@@ -108,9 +108,12 @@ exports[`TermsView component should be rendered correctly 1`] = `
</span>
<span
className="text-14-normal"
- >
- dataShare.link1
- </span>
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "dataShare.link1",
+ }
+ }
+ />
</div>
</div>
</DataShareConsentContent>
@@ -134,10 +137,22 @@ exports[`TermsView component should be rendered correctly 1`] = `
onChange={[Function]}
type="checkbox"
/>
- <span>
- dataShare.validCGU
- dataShare.validLegal
- </span>
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "dataShare.validCGU",
+ }
+ }
+ onClick={[Function]}
+ />
+ <span
+ dangerouslySetInnerHTML={
+ Object {
+ "__html": "dataShare.validLegal",
+ }
+ }
+ onClick={[Function]}
+ />
</label>
</div>
<div
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 5492929d27e320615ae17d5ab89134619970679e..d48b636110ecb638ec8203369d77b15f43850523 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -60,7 +60,7 @@
}
},
"action": {
- "duration": "Durée : %{smart_count} jours",
+ "duration": "Durée : %{smartCount} jours",
"result": "Résultat",
"finished": "Défi terminé !",
"details": "Détail de l'astuce",
@@ -187,10 +187,9 @@
"subtitle1": "Plus qu’à donner votre accord pour connecter votre compteur de gaz et Ecolyo\u00a0!"
},
"step1": {
- "info1": "Un <span>compte chez GRDF</span> est nécessaire pour vous connecter au gaz",
- "info2": " <span>quelque soit votre fournisseur de gaz</span>.",
- "info3": "<p>GRDF est le gestionnaire de réseau. C'est lui qui est responsable de votre compteur Gazpar et de la collecte des données de consommation.</p>",
- "info4": "Possédez-vous un <span>compte GRDF</span>\u00a0?"
+ "info1": "Un <span>compte chez GRDF</span> est nécessaire pour vous connecter au gaz <span>quelque soit votre fournisseur de gaz</span>.",
+ "info2": "<p>GRDF est le gestionnaire de réseau. C'est lui qui est responsable de votre compteur Gazpar et de la collecte des données de consommation.</p>",
+ "info3": "Possédez-vous un <span>compte GRDF</span>\u00a0?"
},
"step2": {
"info1": "Une fois votre compte créé, <span>n'oubliez pas de revenir sur Ecolyo</span> pour finaliser la connexion."
@@ -556,7 +555,7 @@
},
"ecogesture_selection": {
"header": "Sélection des astuces",
- "title": "Vous avez parcouru un groupe de %{smart_count} astuces",
+ "title": "Vous avez parcouru un groupe de %{smartCount} astuces",
"text": "Voulez-vous continuer sur votre lancée ou remettre cette sélection à plus tard\u00a0?",
"title_final": "Félicitations !",
"text_final_1": "Vous avez terminé la sélection des astuces adaptées à votre consommation.",
@@ -816,7 +815,7 @@
"button_understood": "J'ai compris",
"button_try_again": "Réessayer",
"show_common_error": "Voir les erreurs récurrentes",
- "show_common_error_list": "<span style=\"text-align:left; font-weight:700;\">Le problème peut provenir des cas suivants :</span> <ul style=\"text-align:left;\"><li>Vous avez un co-titulaire sur votre contrat. Veillez à bien entrer le nom du <span style=\"color:#E3B82A; font-weight:700;\">titulaire du contrat</span> et non le co-titulaire.</li><li> Votre nom comporte un tiret\u00a0? Tentez sans le tiret.</li><li> Entrez bien le nom de votre commune de résidence en entier (tirets et accents inclus)</li><li> Avez-vous bien entré le <span style=\"color:#E3B82A; font-weight:700;\">numéro de votre compteur</span> (PDL)\u00a0? Tout autre numéro (de contrat, de client) ne fonctionne pas.</li></ul><p style=\"text-align:center; font-style: italic; font-weight:400; font-size: 0.9rem;\">Si vous rencontrez toujours des difficultés, contactez notre service d'aide </p><div style=\"text-align:center; font-weight:700;\">Avez-vous pensez à vérifier ces informations\u00a0?</div>",
+ "show_common_error_list": "<span>Le problème peut provenir des cas suivants :</span><ul><li>Vous avez un co-titulaire sur votre contrat. Veillez à bien entrer le nom du <span class=\"gold\">titulaire du contrat</span> et non le co-titulaire.</li><li> Votre nom comporte un tiret\u00a0? Tentez sans le tiret.</li><li>Entrez bien le nom de votre commune de résidence en entier (tirets et accents inclus)</li><li>Avez-vous bien entré le <span class=\"gold\">numéro de votre compteur</span> (PDL)\u00a0? Tout autre numéro (de contrat, de client) ne fonctionne pas.</li></ul><p>Si vous rencontrez toujours des difficultés, contactez notre service d'aide </p><div class=\"center\">Avez-vous pensez à vérifier ces informations\u00a0?</div>",
"accessibility": {
"window_title": "Fenêtre d'attente de connexion",
"button_close": "Fermer la fenêtre"
diff --git a/src/utils/decoreText.spec.tsx b/src/utils/decoreText.spec.tsx
deleted file mode 100644
index b9c0f21500cfaf9647df2d292756fda4fb89497b..0000000000000000000000000000000000000000
--- a/src/utils/decoreText.spec.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from 'react'
-import { decoreText } from './decoreText'
-
-describe('decoreText utilis test', () => {
- it('should return text with span', () => {
- const text = 'text <span>with span</span> end of text'
- const result = decoreText(text)
-
- const expected: JSX.Element = (
- <>
- text <span>with span</span> end of text
- </>
- )
- expect(result).toStrictEqual(expected)
- })
-})
diff --git a/src/utils/decoreText.tsx b/src/utils/decoreText.tsx
deleted file mode 100644
index ebf8d62132f65a943e503a3f2538259c12219fa2..0000000000000000000000000000000000000000
--- a/src/utils/decoreText.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import React from 'react'
-
-export const decoreText = (line: string, action?: () => void) => {
- if (line.includes('<a href="')) {
- const indexRefStart = line.indexOf('<a href="')
- const indexRefEnd = line.indexOf('">')
- const indexEnd = line.indexOf('</a>')
- return (
- <>
- {line.substring(0, indexRefStart)}
- <a
- href={line.substring(indexRefStart + 9, indexRefEnd)}
- target="_blank"
- rel="noopener noreferrer"
- >
- {line.substring(indexRefEnd + 2, indexEnd)}
- </a>
- {line.substring(indexEnd + 4, line.length)}
- </>
- )
- } else if (line.includes('<p>')) {
- const indexStart = line.indexOf('<p>')
- const indexEnd = line.indexOf('</p>')
- return (
- <>
- {line.substring(0, indexStart)}
- <p>{line.substring(indexStart + 3, indexEnd)}</p>
- {line.substring(indexEnd + 4, line.length)}
- </>
- )
- } else if (line.includes('<span>')) {
- const indexStart = line.indexOf('<span>')
- const indexEnd = line.indexOf('</span>')
- return (
- <>
- {line.substring(0, indexStart)}
- <span>{line.substring(indexStart + 6, indexEnd)}</span>
- {line.substring(indexEnd + 7, line.length)}
- </>
- )
- } else if (line.includes('<span class="action">')) {
- const indexStart = line.indexOf('<span class="action">')
- const indexEnd = line.indexOf('</span>')
- return (
- <>
- {line.substring(0, indexStart)}
- <button className="action" onClick={action}>
- {line.substring(indexStart + 21, indexEnd)}
- </button>
- {line.substring(indexEnd + 7, line.length)}
- </>
- )
- } else {
- return line
- }
-}