From dce71f92a0e32ba5f4d486f23d5e63cde235f49c Mon Sep 17 00:00:00 2001
From: Bastien DUMONT <bdumont@grandlyon.com>
Date: Tue, 29 Nov 2022 12:29:45 +0000
Subject: [PATCH] feat: new feedback system (SAU)
---
app.config.environment.alpha.js | 6 +
app.config.environment.dev.js | 6 +
app.config.environment.prod.js | 4 +
jest.config.js | 4 +
src/assets/icons/ico/ecolyo.svg | 27 +
src/assets/icons/visu/challenge/ecolyo.svg | 6 -
.../Challenge/ChallengeCardLast.spec.tsx | 29 +-
.../Challenge/ChallengeCardLast.tsx | 19 +-
.../SgeConnectView.spec.tsx.snap | 14 +-
src/components/FAQ/FAQContent.spec.tsx | 50 -
src/components/FAQ/FAQContent.tsx | 96 --
src/components/FAQ/FAQData.spec.tsx | 35 -
src/components/FAQ/FAQData.tsx | 369 -----
src/components/FAQ/FAQLink.tsx | 48 -
src/components/FAQ/FAQView.spec.tsx | 23 -
src/components/FAQ/FAQView.tsx | 27 -
.../__snapshots__/FAQContent.spec.tsx.snap | 1194 -----------------
.../FAQ/__snapshots__/FAQView.spec.tsx.snap | 20 -
src/components/FAQ/faqContent.scss | 45 -
src/components/FAQ/faqLink.scss | 51 -
.../Feedback/FeedbackModal.spec.tsx | 121 +-
src/components/Feedback/FeedbackModal.tsx | 322 +----
src/components/Feedback/feedbackModal.scss | 146 +-
src/components/Header/CozyBar.tsx | 17 +-
.../Options/{ => HelpLink}/HelpLink.scss | 0
.../Options/{ => HelpLink}/HelpLink.tsx | 17 +-
.../{ => MatomoOptOut}/MatomoOptOut.spec.tsx | 2 +-
.../{ => MatomoOptOut}/MatomoOptOut.tsx | 4 +-
.../__snapshots__/MatomoOptOut.spec.tsx.snap | 0
.../{ => MatomoOptOut}/matomoOptOut.scss | 0
src/components/Options/OptionsView.tsx | 13 +-
.../ProfileTypeOptions.spec.tsx | 8 +-
.../ProfileTypeOptions.tsx | 0
.../profileTypeOptions.scss | 0
.../ReportOptions.spec.tsx | 4 +-
.../{ => ReportOptions}/ReportOptions.tsx | 0
.../{ => ReportOptions}/reportOptions.scss | 0
.../{ => Unsubscribe}/UnSubscribe.spec.tsx | 2 +-
.../Options/{ => Unsubscribe}/UnSubscribe.tsx | 0
.../__snapshots__/UnSubscribe.spec.tsx.snap | 0
.../{ => Unsubscribe}/unSubscribe.scss | 0
.../__snapshots__/OptionsView.spec.tsx.snap | 2 +-
src/components/Routes/Routes.tsx | 4 +-
src/locales/fr.json | 36 +-
src/models/faq.model.ts | 9 -
src/models/index.ts | 1 -
tests/__mocks__/faq.mock.tsx | 52 -
47 files changed, 205 insertions(+), 2628 deletions(-)
create mode 100644 src/assets/icons/ico/ecolyo.svg
delete mode 100644 src/assets/icons/visu/challenge/ecolyo.svg
delete mode 100644 src/components/FAQ/FAQContent.spec.tsx
delete mode 100644 src/components/FAQ/FAQContent.tsx
delete mode 100644 src/components/FAQ/FAQData.spec.tsx
delete mode 100644 src/components/FAQ/FAQData.tsx
delete mode 100644 src/components/FAQ/FAQLink.tsx
delete mode 100644 src/components/FAQ/FAQView.spec.tsx
delete mode 100644 src/components/FAQ/FAQView.tsx
delete mode 100644 src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap
delete mode 100644 src/components/FAQ/__snapshots__/FAQView.spec.tsx.snap
delete mode 100644 src/components/FAQ/faqContent.scss
delete mode 100644 src/components/FAQ/faqLink.scss
rename src/components/Options/{ => HelpLink}/HelpLink.scss (100%)
rename src/components/Options/{ => HelpLink}/HelpLink.tsx (78%)
rename src/components/Options/{ => MatomoOptOut}/MatomoOptOut.spec.tsx (90%)
rename src/components/Options/{ => MatomoOptOut}/MatomoOptOut.tsx (91%)
rename src/components/Options/{ => MatomoOptOut}/__snapshots__/MatomoOptOut.spec.tsx.snap (100%)
rename src/components/Options/{ => MatomoOptOut}/matomoOptOut.scss (100%)
rename src/components/Options/{ => ProfileTypeOptions}/ProfileTypeOptions.spec.tsx (94%)
rename src/components/Options/{ => ProfileTypeOptions}/ProfileTypeOptions.tsx (100%)
rename src/components/Options/{ => ProfileTypeOptions}/profileTypeOptions.scss (100%)
rename src/components/Options/{ => ReportOptions}/ReportOptions.spec.tsx (93%)
rename src/components/Options/{ => ReportOptions}/ReportOptions.tsx (100%)
rename src/components/Options/{ => ReportOptions}/reportOptions.scss (100%)
rename src/components/Options/{ => Unsubscribe}/UnSubscribe.spec.tsx (97%)
rename src/components/Options/{ => Unsubscribe}/UnSubscribe.tsx (100%)
rename src/components/Options/{ => Unsubscribe}/__snapshots__/UnSubscribe.spec.tsx.snap (100%)
rename src/components/Options/{ => Unsubscribe}/unSubscribe.scss (100%)
delete mode 100644 src/models/faq.model.ts
delete mode 100644 tests/__mocks__/faq.mock.tsx
diff --git a/app.config.environment.alpha.js b/app.config.environment.alpha.js
index e0c4b0b3e..e680fd5fe 100644
--- a/app.config.environment.alpha.js
+++ b/app.config.environment.alpha.js
@@ -19,6 +19,12 @@ module.exports = {
__STACK_ASSETS__: target !== 'mobile',
__PIWIK_TRACKER_URL__: JSON.stringify('https://statweb.grandlyon.com/'),
__PIWIK_SITEID__: 117,
+ __SAU_LINK__: JSON.stringify(
+ 'https://portail-citoyen-sau.guichet-recette.grandlyon.com/ecolyo/'
+ ),
+ __SAU_IDEA_DIRECT_LINK__: JSON.stringify(
+ 'https://demarches-sau.guichet-recette.grandlyon.com/retour-ecolyo/ecolyo-une-idee/'
+ ),
}),
],
optimization: {
diff --git a/app.config.environment.dev.js b/app.config.environment.dev.js
index 31cbe4a8c..8895164f7 100644
--- a/app.config.environment.dev.js
+++ b/app.config.environment.dev.js
@@ -23,6 +23,12 @@ const stackProvidedLibsConfig = {
__STACK_ASSETS__: true,
__PIWIK_TRACKER_URL__: JSON.stringify('http://localhost:9800/'),
__PIWIK_SITEID__: 1,
+ __SAU_LINK__: JSON.stringify(
+ 'https://portail-citoyen-sau.guichet-recette.grandlyon.com/ecolyo/'
+ ),
+ __SAU_IDEA_DIRECT_LINK__: JSON.stringify(
+ 'https://demarches-sau.guichet-recette.grandlyon.com/retour-ecolyo/ecolyo-une-idee/'
+ ),
}),
],
module: {
diff --git a/app.config.environment.prod.js b/app.config.environment.prod.js
index 7dc15dbcf..b09cab9e8 100644
--- a/app.config.environment.prod.js
+++ b/app.config.environment.prod.js
@@ -19,6 +19,10 @@ module.exports = {
__STACK_ASSETS__: target !== 'mobile',
__PIWIK_TRACKER_URL__: JSON.stringify('https://statweb.grandlyon.com/'),
__PIWIK_SITEID__: 118,
+ __SAU_LINK__: JSON.stringify('https://support.grandlyon.com/ecolyo/'),
+ __SAU_IDEA_DIRECT_LINK__: JSON.stringify(
+ 'https://demarches-support.grandlyon.com/retour-ecolyo/ecolyo-une-idee/'
+ ),
}),
],
optimization: {
diff --git a/jest.config.js b/jest.config.js
index b6a027a5b..fa3e2586f 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -19,6 +19,10 @@ module.exports = {
__ALLOW_HTTP__: false,
__TARGET__: 'browser',
__PIWIK_TRACKER_URL__: 'http://localhost:9800/',
+ __SAU_LINK__:
+ 'https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/-/issues',
+ __SAU_IDEA_DIRECT_LINK__:
+ 'https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/-/issues',
cozy: {},
},
}
diff --git a/src/assets/icons/ico/ecolyo.svg b/src/assets/icons/ico/ecolyo.svg
new file mode 100644
index 000000000..edc5b46e6
--- /dev/null
+++ b/src/assets/icons/ico/ecolyo.svg
@@ -0,0 +1,27 @@
+<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M86.9716 175.419C88.8818 176.194 91.1182 176.194 93.0284 175.419C171.638 143.533 168.442 98.8702 164.224 33.4965C163.953 29.2929 160.566 25.9821 156.385 25.5909C133.876 23.4852 113.472 16.3639 94.3788 5.187C91.6752 3.60433 88.3248 3.60433 85.6212 5.187C66.5282 16.3639 46.1235 23.4852 23.6155 25.5909C19.4338 25.9821 16.0469 29.2929 15.7757 33.4965C11.5585 98.8702 8.36248 143.533 86.9716 175.419Z" fill="url(#paint0_radial_14017_3979)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M157.256 33.1897C159.459 67.3186 160.876 93.0814 153.021 114.571C145.536 135.047 128.867 153.163 90.0001 169.047C51.1334 153.163 34.4642 135.047 26.9796 114.571C19.1243 93.0814 20.5412 67.3186 22.744 33.1897C47.1919 30.6969 69.3788 22.9376 90.0001 11.0387C110.621 22.9376 132.808 30.6969 157.256 33.1897ZM93.1788 179.392C91.1738 180.203 88.8264 180.203 86.8214 179.392C4.63003 146.152 7.64008 99.6449 12.04 31.663L12.0914 30.8684C12.3761 26.4693 15.931 23.0045 20.3203 22.5951C43.9456 20.3915 65.3632 12.9389 85.4039 1.24221C88.2417 -0.41407 91.7585 -0.41407 94.5963 1.24221C114.637 12.9389 136.055 20.3915 159.68 22.5951C164.069 23.0045 167.624 26.4693 167.909 30.8684L167.96 31.663C172.36 99.6449 175.37 146.152 93.1788 179.392Z" fill="#FFC600"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M157.256 33.1897C159.459 67.3186 160.876 93.0814 153.021 114.571C145.536 135.047 128.867 153.163 90.0001 169.047C51.1334 153.163 34.4642 135.047 26.9796 114.571C19.1243 93.0814 20.5412 67.3186 22.744 33.1897C47.1919 30.6969 69.3788 22.9376 90.0001 11.0387C110.621 22.9376 132.808 30.6969 157.256 33.1897ZM93.1788 179.392C91.1738 180.203 88.8264 180.203 86.8214 179.392C4.63003 146.152 7.64008 99.6449 12.04 31.663L12.0914 30.8684C12.3761 26.4693 15.931 23.0045 20.3203 22.5951C43.9456 20.3915 65.3632 12.9389 85.4039 1.24221C88.2417 -0.41407 91.7585 -0.41407 94.5963 1.24221C114.637 12.9389 136.055 20.3915 159.68 22.5951C164.069 23.0045 167.624 26.4693 167.909 30.8684L167.96 31.663C172.36 99.6449 175.37 146.152 93.1788 179.392Z" fill="url(#paint1_linear_14017_3979)" fill-opacity="0.75"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M90.002 180C91.0892 180 92.1763 179.797 93.178 179.392C175.369 146.152 172.359 99.6449 167.959 31.6631L167.908 30.8684C167.623 26.4693 164.068 23.0045 159.679 22.5951C136.054 20.3915 114.636 12.9389 94.5955 1.24221C93.1774 0.414524 91.5897 0.000453903 90.002 0V11.0402C110.623 22.9382 132.809 30.697 157.255 33.1897C159.458 67.3186 160.875 93.0814 153.02 114.571C145.535 135.047 128.867 153.163 90.002 169.046V180Z" fill="#DB8300"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M90.002 180C91.0892 180 92.1763 179.797 93.178 179.392C175.369 146.152 172.359 99.6449 167.959 31.6631L167.908 30.8684C167.623 26.4693 164.068 23.0045 159.679 22.5951C136.054 20.3915 114.636 12.9389 94.5955 1.24221C93.1774 0.414524 91.5897 0.000453903 90.002 0V11.0402C110.623 22.9382 132.809 30.697 157.255 33.1897C159.458 67.3186 160.875 93.0814 153.02 114.571C145.535 135.047 128.867 153.163 90.002 169.046V180Z" fill="url(#paint2_linear_14017_3979)" fill-opacity="0.75"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M56 57.5462C56 53.3785 59.3786 50 63.5462 50C67.7139 50 71.0924 53.3785 71.0924 57.5462V110.416C71.0924 111.581 70.148 112.526 68.983 112.526H58.1094C56.9444 112.526 56 111.581 56 110.416V57.5462ZM82.9505 84.5012C82.9505 80.3336 86.329 76.955 90.4967 76.955C94.6643 76.955 98.0429 80.3336 98.0429 84.5012V110.421C98.0429 111.586 97.0985 112.53 95.9335 112.53H85.0599C83.8949 112.53 82.9505 111.586 82.9505 110.421V84.5012ZM117.452 66.1721C113.285 66.1721 109.906 69.5507 109.906 73.7183V110.418C109.906 111.583 110.85 112.527 112.015 112.527H122.889C124.054 112.527 124.998 111.583 124.998 110.418V73.7183C124.998 69.5507 121.62 66.1721 117.452 66.1721Z" fill="#FFC600"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M56 57.5462C56 53.3785 59.3786 50 63.5462 50C67.7139 50 71.0924 53.3785 71.0924 57.5462V110.416C71.0924 111.581 70.148 112.526 68.983 112.526H58.1094C56.9444 112.526 56 111.581 56 110.416V57.5462ZM82.9505 84.5012C82.9505 80.3336 86.329 76.955 90.4967 76.955C94.6643 76.955 98.0429 80.3336 98.0429 84.5012V110.421C98.0429 111.586 97.0985 112.53 95.9335 112.53H85.0599C83.8949 112.53 82.9505 111.586 82.9505 110.421V84.5012ZM117.452 66.1721C113.285 66.1721 109.906 69.5507 109.906 73.7183V110.418C109.906 111.583 110.85 112.527 112.015 112.527H122.889C124.054 112.527 124.998 111.583 124.998 110.418V73.7183C124.998 69.5507 121.62 66.1721 117.452 66.1721Z" fill="url(#paint3_linear_14017_3979)"/>
+<defs>
+<radialGradient id="paint0_radial_14017_3979" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(51.4865 24.6859) rotate(72.6265) scale(128.981 134.594)">
+<stop stop-color="#2B2D37"/>
+<stop offset="1" stop-color="#15161B"/>
+</radialGradient>
+<linearGradient id="paint1_linear_14017_3979" x1="86.7661" y1="174.186" x2="29.0927" y2="21.109" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CB6E00"/>
+<stop offset="1" stop-color="#FFC600" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_14017_3979" x1="139.589" y1="174.725" x2="89.9987" y2="9.79094" gradientUnits="userSpaceOnUse">
+<stop stop-color="#793A00"/>
+<stop offset="1" stop-color="#DB8300" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint3_linear_14017_3979" x1="124.998" y1="110.374" x2="59.2341" y2="50.0002" gradientUnits="userSpaceOnUse">
+<stop stop-color="#DB8300"/>
+<stop offset="1" stop-color="#FFC600"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/assets/icons/visu/challenge/ecolyo.svg b/src/assets/icons/visu/challenge/ecolyo.svg
deleted file mode 100644
index 504f722c6..000000000
--- a/src/assets/icons/visu/challenge/ecolyo.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-<svg width="62" height="62" viewBox="0 0 62 62" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M30.9999 58.3539C57.4593 48.0072 55.4028 33.2974 54.0319 11.3573C45.532 10.9834 37.9918 8.36552 30.9999 4.00244C24.0081 8.36552 16.4679 10.9834 7.96801 11.3573C6.59706 33.2974 4.54064 48.0072 30.9999 58.3539Z" fill="#1B1C22"/>
-<path d="M31 0L29.2075 1.11858C22.6524 5.20911 15.6717 7.61771 7.81931 7.96319L4.77457 8.09716L4.58414 11.1446C4.52759 12.0496 4.46881 12.95 4.41037 13.8451C3.78152 23.4778 3.1917 32.5124 5.83816 40.2978C8.88926 49.2736 15.9673 56.1216 29.7672 61.5179L31 62V58.3535C5.57809 48.4124 6.4797 34.4437 7.80541 13.9043C7.85951 13.0662 7.91431 12.2171 7.96806 11.3569C16.4679 10.9829 24.0082 8.36507 31 4.00199V0Z" fill="#FFC600"/>
-<path d="M31 0L32.7925 1.11858C39.3476 5.20911 46.3283 7.61771 54.1807 7.96319L57.2254 8.09716L57.4159 11.1446C57.4724 12.0496 57.5312 12.95 57.5896 13.8451C58.2185 23.4778 58.8083 32.5124 56.1618 40.2978C53.1107 49.2736 46.0327 56.1216 32.2328 61.5179L31 62V58.3535C56.4219 48.4124 55.5203 34.4437 54.1946 13.9043C54.1405 13.0662 54.0857 12.2171 54.0319 11.3569C45.5321 10.9829 37.9918 8.36507 31 4.00199V0Z" fill="#DB8300"/>
-<path d="M22.639 21.3672H23.8419C24.3222 21.3672 24.783 21.5561 25.1226 21.8925C25.4623 22.2289 25.6532 22.6851 25.6532 23.1608V41.3684H20.8277V23.1608C20.8277 22.6851 21.0185 22.2289 21.3582 21.8925C21.6979 21.5561 22.1586 21.3672 22.639 21.3672ZM30.9965 30.2331H32.1993C32.6797 30.2331 33.1404 30.4221 33.4801 30.7585C33.8198 31.0948 34.0107 31.5511 34.0107 32.0268V41.3684H29.1852V32.0268C29.1852 31.5511 29.376 31.0948 29.7157 30.7585C30.0554 30.4221 30.5161 30.2331 30.9965 30.2331ZM39.8521 26.8035H41.055C41.5353 26.8035 41.9961 26.9925 42.3358 27.3288C42.6754 27.6652 42.8663 28.1214 42.8663 28.5971V41.3684H38.0408V28.5971C38.0408 28.1214 38.2316 27.6652 38.5713 27.3288C38.911 26.9925 39.3717 26.8035 39.8521 26.8035Z" fill="#FFC600"/>
-</svg>
diff --git a/src/components/Challenge/ChallengeCardLast.spec.tsx b/src/components/Challenge/ChallengeCardLast.spec.tsx
index 68b0c6814..0a304978c 100644
--- a/src/components/Challenge/ChallengeCardLast.spec.tsx
+++ b/src/components/Challenge/ChallengeCardLast.spec.tsx
@@ -5,6 +5,9 @@ import { Provider } from 'react-redux'
import configureStore from 'redux-mock-store'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+// Value coming from jest.config
+declare let __SAU_IDEA_DIRECT_LINK__: string
+
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
useI18n: jest.fn(() => {
@@ -18,12 +21,13 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
const mockStore = configureStore([])
describe('ChallengeCardLast component', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ },
+ })
+
it('should be rendered correctly', () => {
- const store = mockStore({
- ecolyo: {
- global: globalStateData,
- },
- })
const wrapper = mount(
<Provider store={store}>
<ChallengeCardLast />
@@ -31,4 +35,19 @@ describe('ChallengeCardLast component', () => {
)
expect(wrapper).toMatchSnapshot()
})
+
+ it('should open SAU new idea link', () => {
+ global.open = jest.fn()
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <ChallengeCardLast />
+ </Provider>
+ )
+ wrapper.find('.btn_lastCard').first().simulate('click')
+ expect(window.open).toBeCalledTimes(1)
+ expect(global.open).toHaveBeenCalledWith(
+ `${__SAU_IDEA_DIRECT_LINK__}?version=0.0.0`
+ )
+ })
})
diff --git a/src/components/Challenge/ChallengeCardLast.tsx b/src/components/Challenge/ChallengeCardLast.tsx
index 2de19074e..252ad7ec0 100644
--- a/src/components/Challenge/ChallengeCardLast.tsx
+++ b/src/components/Challenge/ChallengeCardLast.tsx
@@ -1,18 +1,21 @@
+import { Button } from '@material-ui/core'
+import ecolyoIcon from 'assets/icons/ico/ecolyo.svg'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import { useClient } from 'cozy-client'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import './challengeCardLast.scss'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import ecolyoIcon from 'assets/icons/visu/challenge/ecolyo.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import { Button } from '@material-ui/core'
-import { updateModalIsFeedbacksOpen } from 'store/modal/modal.actions'
-import { useDispatch } from 'react-redux'
+
+declare let __SAU_IDEA_DIRECT_LINK__: string
const ChallengeCardLast: React.FC = () => {
const { t } = useI18n()
- const dispatch = useDispatch()
+ const client = useClient()
const handleClickFeedbacks = (): void => {
- dispatch(updateModalIsFeedbacksOpen(true))
+ window.open(
+ `${__SAU_IDEA_DIRECT_LINK__}?version=${client.appMetadata.version}`
+ )
}
return (
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
index 62c7251fe..4875200e3 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
@@ -188,7 +188,7 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
className="cv-button"
icon="test-file-stub"
onClick={[Function]}
- sized={40}
+ sized={22}
>
<WithStyles(WithStyles(ForwardRef(IconButton)))
aria-label="header.accessibility.button_open_feedbacks"
@@ -270,27 +270,27 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
>
<StyledIcon
icon="test-file-stub"
- size={40}
+ size={22}
>
<Icon
aria-hidden={true}
icon="test-file-stub"
- size={40}
+ size={22}
spin={false}
>
<Component
aria-hidden={true}
className="styles__icon___23x3R"
- height={40}
+ height={22}
style={Object {}}
- width={40}
+ width={22}
>
<svg
aria-hidden={true}
className="styles__icon___23x3R"
- height={40}
+ height={22}
style={Object {}}
- width={40}
+ width={22}
>
<use
xlinkHref="#test-file-stub"
diff --git a/src/components/FAQ/FAQContent.spec.tsx b/src/components/FAQ/FAQContent.spec.tsx
deleted file mode 100644
index 56c711d0d..000000000
--- a/src/components/FAQ/FAQContent.spec.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import React from 'react'
-import { mount } from 'enzyme'
-import toJson from 'enzyme-to-json'
-import FAQContent from 'components/FAQ/FAQContent'
-import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
-import { faqData } from '../../../tests/__mocks__/faq.mock'
-import mockClient from '../../../tests/__mocks__/client'
-import { act } from 'react-dom/test-utils'
-
-jest.mock('cozy-ui/transpiled/react/I18n', () => {
- return {
- useI18n: jest.fn(() => {
- return {
- t: (str: string) => str,
- }
- }),
- }
-})
-
-jest.mock('cozy-client', () => ({
- ...jest.requireActual('cozy-client'),
- useClient: () => mockClient,
-}))
-
-const mockFAQData = jest.fn()
-jest.mock('components/FAQ/FAQData', () => {
- return () => mockFAQData()
-})
-
-describe('FAQContent', () => {
- beforeEach(() => {
- mockFAQData.mockClear()
- })
-
- it('should render a loader', () => {
- mockFAQData.mockResolvedValue([])
- const wrapper = mount(<FAQContent />)
- expect(wrapper.find(StyledSpinner).exists()).toBeTruthy()
- })
-
- it('should render the full FAQ', async () => {
- mockFAQData.mockResolvedValue(faqData)
- const wrapper = mount(<FAQContent />)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve, 0))
- wrapper.update()
- })
- expect(toJson(wrapper)).toMatchSnapshot()
- })
-})
diff --git a/src/components/FAQ/FAQContent.tsx b/src/components/FAQ/FAQContent.tsx
deleted file mode 100644
index e510abed5..000000000
--- a/src/components/FAQ/FAQContent.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import './faqContent.scss'
-import { useClient } from 'cozy-client'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import FaqData from 'components/FAQ/FAQData'
-import {
- Accordion,
- AccordionSummary,
- AccordionDetails,
-} from '@material-ui/core'
-import ChevronOffIcon from 'assets/icons/ico/chevron-off.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import { FAQSection } from 'models'
-import { FluidType } from 'enum/fluid.enum'
-import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
-
-const FAQContent: React.FC = () => {
- const { t } = useI18n()
- const client = useClient()
- const [expanded, setExpanded] = useState<string | false>(false)
- const [faqData, setFaqData] = useState<FAQSection[]>([])
-
- const handleChange =
- (panel: string) => (event: React.ChangeEvent<{}>, isExpanded: boolean) => {
- event.preventDefault()
- setExpanded(isExpanded ? panel : false)
- }
-
- useEffect(() => {
- let subscribed = true
- async function loadFaqData() {
- const data: FAQSection[] = await FaqData(client)
- if (subscribed && data.length > 0) {
- setFaqData(data)
- }
- }
- loadFaqData()
- return () => {
- subscribed = false
- }
- }, [client])
-
- if (faqData.length <= 0) {
- return (
- <div className="faq-spinner">
- <StyledSpinner size="5rem" fluidType={FluidType.MULTIFLUID} />
- </div>
- )
- }
-
- return (
- <div className="faq-view-root">
- <div className="faq-view-content">
- {faqData.map((faq, index) => {
- return (
- <div key={index} className="faq-section">
- <div className="text-16-normal-uppercase">{faq.section}</div>
- {faq.questions.map((question, index2) => {
- return (
- <Accordion
- key={index2}
- expanded={expanded === `panel${index}_${index2}`}
- onChange={handleChange(`panel${index}_${index2}`)}
- classes={{
- root: 'expansion-panel-root',
- }}
- >
- <AccordionSummary
- aria-label={t('faq.accessibility.button_toggle_detail')}
- expandIcon={<StyledIcon icon={ChevronOffIcon} />}
- classes={{
- root: 'expansion-panel-summary small bold-text',
- content: 'expansion-panel-content',
- }}
- >
- {question.summary}
- </AccordionSummary>
- <AccordionDetails
- classes={{
- root: 'expansion-panel-details',
- }}
- >
- {question.details}
- </AccordionDetails>
- </Accordion>
- )
- })}
- </div>
- )
- })}
- </div>
- </div>
- )
-}
-
-export default FAQContent
diff --git a/src/components/FAQ/FAQData.spec.tsx b/src/components/FAQ/FAQData.spec.tsx
deleted file mode 100644
index dcdd2188d..000000000
--- a/src/components/FAQ/FAQData.spec.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import mockClient from '../../../tests/__mocks__/client'
-import FaqData from 'components/FAQ/FAQData'
-import { allLastFluidPrices } from '../../../tests/__mocks__/fluidPrice.mock'
-import { FAQSection } from 'models'
-
-jest.mock('cozy-ui/transpiled/react/I18n', () => {
- return {
- useI18n: jest.fn(() => {
- return {
- t: (str: string) => str,
- }
- }),
- }
-})
-
-const mockGetAllLastPrices = jest.fn()
-jest.mock('services/fluidsPrices.service', () => {
- return jest.fn(() => {
- return {
- getAllLastPrices: mockGetAllLastPrices,
- }
- })
-})
-
-describe('FAQData', () => {
- beforeEach(() => {
- mockGetAllLastPrices.mockClear()
- })
-
- it('should return', async () => {
- mockGetAllLastPrices.mockResolvedValue(allLastFluidPrices)
- const result: FAQSection[] = await FaqData(mockClient)
- expect(result.length).toBe(3)
- })
-})
diff --git a/src/components/FAQ/FAQData.tsx b/src/components/FAQ/FAQData.tsx
deleted file mode 100644
index 53a91fb12..000000000
--- a/src/components/FAQ/FAQData.tsx
+++ /dev/null
@@ -1,369 +0,0 @@
-/* eslint-disable react/no-unescaped-entities */
-import React from 'react'
-import { Client } from 'cozy-client'
-import { FluidType } from 'enum/fluid.enum'
-import { DateTime } from 'luxon'
-import { FAQSection, FluidPrice } from 'models'
-import FluidPricesService from 'services/fluidsPrices.service'
-
-const FaqData = async (client: Client): Promise<FAQSection[]> => {
- const fluidsPricesService = new FluidPricesService(client)
- const fluidPrices: FluidPrice[] = await fluidsPricesService.getAllLastPrices()
- return [
- {
- section: 'Mes données',
- questions: [
- {
- summary: 'Comment accéder à mes données électricité ?',
- details: (
- <div>
- Rendez-vous dans la partie Options du service et cliquer sur le
- bouton "Se connecter à l'électricité". Suivez la procédure (en
- vous créant un compte Enedis si nécessaire). Une fois votre
- consentement donné, vos données de consommation seront récupérées.
- </div>
- ),
- },
- {
- summary: 'Comment accéder à mes données gaz ?',
- details: (
- <div>
- Rendez-vous dans la partie Options du service et cliquez sur le
- bouton "Se connecter au gaz". Suivez la procédure (en vous créant
- un compte GRDF si nécessaire). Une fois votre consentement donné,
- vos données de consommation seront récupérées.
- </div>
- ),
- },
- {
- summary: 'Comment accéder à mes données eau ?',
- details: (
- <div>
- Rendez-vous dans la partie Options du service et cliquez sur "Se
- connecter à l'eau". Entrez vos identifiants Eau du Grand Lyon. Vos
- données seront ainsi récupérées.
- </div>
- ),
- },
- {
- summary: "Mes données ne s'affichent pas. Que se passe-t-il ?",
- details: (
- <div>
- <p>
- En fonctionnement normal, vos données électricité arrivent à J+1
- (le lendemain), vos données eau et gaz arrivent quant à elles 3
- jours après (à J+3).
- </p>
- <p>Plusieurs raisons peuvent expliquer l'absence de données :</p>
- <p>
- - Le lien entre Ecolyo et le fournisseur de données est rompu.
- Une mise à jour de ce lien (en bas de la page) peut parfois
- résoudre ce problème.
- </p>
- <p>
- - Si la mise à jour a été effectuée mais que la donnée
- n'apparaît toujours pas, le souci vient du fournisseur de
- données (Enedis pour l'électricité, GRDF pour le gaz, Eau du
- Grand Lyon pour l'eau). Cela peut être un problème de
- transmission de données entre le compte et le système de données
- du partenaire, ou un problème sur votre compteur. Dans ce cas,
- le mieux est de contacter directement Enedis, GRDF ou Eau du
- Grand Lyon pour tenter de régler le problème avec eux.
- </p>
- </div>
- ),
- },
- {
- summary:
- 'Pourquoi dois-je avoir un compte Enedis, GRDF ou Eau du Grand Lyon ?',
- details: (
- <div>
- Nous avons fait le choix de passer par les gestionnaires de
- réseaux (Enedis pour l'électricité, GRDF pour le gaz et Eau du
- Grand Lyon pour l'eau). Ils sont en effet responsables de votre
- compteur, de la collecte des données et du partage de celles-ci.
- Ils ont les données brutes, ces mêmes données qui sont consolidées
- pour votre fournisseur d'énergie ou d'eau, celui-là même qui vous
- facture. Pour récupérer vos données, et afin que vous et vous seul
- y ait accès, il vous faut créer un compte chez ces gestionnaires
- de réseaux. Ce process n'est à réaliser que lors de première
- connexion.
- </div>
- ),
- },
- {
- summary:
- "Si je n'en ai pas, est-ce possible d'avoir des compteurs communicants (Linky, Gazpar, Téléo ?)",
- details: (
- <div>
- <p>
- - Linky, le compteur électricité est déployé sur 95% de notre
- territoire métropolitain. Si vous n'êtes pas encore équipé, vous
- pouvez contacter Enedis au 0 970 831 970 (prix d'un appel local)
- entre 8h et 17h pour convenir d'un rendez-vous.
- </p>
- <p>
- - Concernant Gazpar le compteur gaz, s'il n'est pas encore
- installé chez vous, vous pouvez vous renseigner sur le planning
- de déploiement du compteur à cette adresse :{' '}
- <a href="https://monespace.grdf.fr/compteur-gazpar-et-ma-commune">
- https://monespace.grdf.fr/compteur-gazpar-et-ma-commune.
- </a>
- </p>
- <p>
- - Concernant Téléo, le compteur eau, si vous êtes en eau
- individualisé. En principe, vous devriez déjà avoir Téléo chez
- vous. Si vous êtes abonné et que vous n'êtes pas encore équipé,
- contactez le service client d'eau du Grand Lyon par téléphone au
- 09 69 39 69 99 (numéro cristal non surtaxé) pour obtenir
- l'installation d'un compteur communicant Téléo.
- </p>
- </div>
- ),
- },
- {
- summary: 'Qui a accès à mes données de consommation?',
- details: (
- <div>
- <p>
- Vos données privées de consommation d’énergie et d’eau sont
- récupérées, sauvegardées et stockées dans votre cloud personnel
- à votre initiative sans visibilité de la Métropole de Lyon sur
- leur contenu. Il en est de même pour les données privées de
- composition du logement et du foyer, fournies par vos soins.
- Elles restent également sans visibilité de la Métropole de Lyon
- sur leur contenu.
- </p>
- <p>
- Dans le cadre de l’évaluation et de l’amélioration du service,
- des données d’utilisation anonymisées sont cependant remontées Ã
- des fins d’exploitation statistiques. La récupération de ces
- statistiques anonymisées nous permettra de s’assurer du bon
- fonctionnement technique de la connexion à vos données de
- consommation ainsi que d’évaluer l’impact global en termes de
- baisse des consommations énergétiques de notre service (Plus
- d’informations sur la manière dont votre anonymat est bien
- préservé dans ce processus{' '}
- <a href=" https://ecolyo.com/cloud_statistiques.html">ici</a>
- ).
- </p>
- </div>
- ),
- },
- {
- summary:
- 'Comment supprimer mon consentement au partage de mes données (électricité ou gaz) ?',
- details: (
- <div>
- <p>
- Dans un premier temps, vous pouvez supprimer le connecteur
- électricité, gaz ou eau dans la page Options du service afin de
- stopper le transfert de vos données vers notre service. Pour
- supprimer totalement votre consentement vous devez ensuite :
- </p>
- <p>
- - pour l'électricité : contacter directement
- dataconnect@enedis.fr pour leur indiquer votre souhait de
- supprimer le consentement de partage des données avec notre
- service.
- </p>
- <p>
- - pour le gaz, rendez-vous dans votre espace GRDF (
- <a href="https://monespace.grdf.fr/">
- https://monespace.grdf.fr/
- </a>
- ) dans partie "Suivi des consommations" puis "Données
- consultées". Vous pouvez alors supprimer le consentement donné Ã
- notre service.
- </p>
- </div>
- ),
- },
- ],
- },
- {
- section: 'Contenu du service',
- questions: [
- {
- summary:
- 'Pourquoi les prix affichés sont-ils différents de ceux indiqués sur ma facture ?',
- details: (
- <div>
- <p>
- Le prix de votre électricité ou de votre gaz dépend de l'offre
- choisie auprès de votre fournisseur. N’ayant pas accès à cette
- information, Ecolyo affiche un prix moyen par fluide.
- </p>
- <p>Tarifs moyens retenus :</p>
- <p>
- - pour l'électricité, 1 kWh ={' '}
- {fluidPrices[FluidType.ELECTRICITY].price}€ TTC (il correspond
- au tarif réglementé d’EDF au{' '}
- {DateTime.fromISO(fluidPrices[FluidType.ELECTRICITY].startDate)
- .setZone('utc', {
- keepLocalTime: true,
- })
- .toLocaleString()}{' '}
- pour une puissance souscrite de 3 ou 6 kVA et hors offre heure
- pleine/heure creuse)
- </p>
- <p>
- - pour le gaz, 1 kWh = {fluidPrices[FluidType.GAS].price}€ TTC
- (tarif réglementé de vente au{' '}
- {DateTime.fromISO(fluidPrices[FluidType.GAS].startDate)
- .setZone('utc', {
- keepLocalTime: true,
- })
- .toLocaleString()}{' '}
- pour un consommateur soutirant moins de 6 MWh par an)
- </p>
- <p>
- - pour l'eau, 1 litre d’eau ={' '}
- {fluidPrices[FluidType.WATER].price}€ TTC (prix constaté au{' '}
- {DateTime.fromISO(fluidPrices[FluidType.WATER].startDate)
- .setZone('utc', {
- keepLocalTime: true,
- })
- .toLocaleString()}{' '}
- pour un abonnement et une consommation de 120 m3/an sur la
- Métropole de Lyon)
- </p>
- <p>
- Le coût de votre abonnement n'est pas pris en compte dans
- Ecolyo.
- </p>
- </div>
- ),
- },
- {
- summary:
- 'Est-ce la météo est prise en compte dans les données affichées ?',
- details: (
- <div>
- La météo n'est pour l'instant pas prise en compte dans les données
- présentées. Nous réfléchissons à termes à une intégration des
- données de température extérieure. En effet, celles-ci influent
- fortement sur les comportements et donc les consommations aussi
- bien d'énergie en hiver que d'eau en été. Affaire à suivre pour
- notre service !
- </div>
- ),
- },
- {
- summary: 'Quelle est la source des astuces ?',
- details: (
- <div>
- Les astuces présentées dans le service sont issues de guides
- préparés par le CLER - Réseau pour la transition énergétique ainsi
- que par l'ADEME (l'Agence de l'environnement et de la maîtrise de
- l'énergie). La source principale est le guide des 100 écogestes
- (version 2020-2021) produit par le CLER dans le cadre du programme
- DECLIC.
- </div>
- ),
- },
- {
- summary: "Qu'est-ce qu'un kWh ?",
- details: (
- <div>
- Le kWh est l'unité de mesure correspondant à l'énergie consommée
- pendant une heure par un appareil d'une puissance de 1000 watts (1
- kW). Avec 1 kWh, il est possible de … regarder la télévision
- pendant 3 à 5h (selon le modèle de télé), cuire un poulet au four
- thermostat 6 pendant 1h, vous servir d'un ordinateur au bureau
- pendant une demi-journée...
- </div>
- ),
- },
- {
- summary:
- 'Pourquoi dois-je renseigner mon profil dans le service ? Comment le modifier ? ',
- details: (
- <div>
- Renseigner votre profil c'est profiter à la fois d'une comparaison
- de vos consommations avec les consommation d'un foyer vous
- ressemblant (allez jetez un Å“il dans la partie Analyse) mais aussi
- avoir accès à un tri personnalisé des astuces dans la partie
- Astuces du service.
- </div>
- ),
- },
- {
- summary: 'Comment sont choisis les astuces personnalisées ?',
- details: (
- <div>
- Les astuces personnalisées sont aujourd'hui choisies en fonction
- des compteurs individuels que vous possédez (communicants ou non).
- Elles vous permettent d'agir sur ces consommations. D'autres modes
- de tri, davantage personnalisables seront proposés à l'avenir.
- </div>
- ),
- },
- ],
- },
- {
- section: 'Autres infos',
- questions: [
- {
- summary: "Comment accéder plus facilement au service à l'avenir ?",
- details: (
- <div>
- <p>
- Pour retrouver facilement l'accès à Ecolyo à l'avenir, il suffit
- de vous créer un raccourci :
- </p>
- <p>
- - Sur mobile APPLE : Pour créer un raccourci sur votre écran
- d'accueil, ouvrez Ecolyo dans Safari et cliquez sur Partager
- (carré avec une flèche pointant vers le haut), en descendant
- dans le menu cliquez sur "Sur l'écran d'accueil" puis ajouter.
- Un raccourci d'Ecolyo sera alors présent (il ressemblera à une
- application comme une autre).
- </p>
- <p>
- - Sur mobile ANDROID : Une fois sur la page web du service,
- appuyez sur les trois petits points du menu en haut à droite.
- Sélectionnez "Ajouter à l'écran d'accueil". Nommez la page et
- appuyez sur "Ajouter". Un raccourci vers la page web est apparu
- sur l'écran d'accueil de votre smartphone.
- </p>
- <p>
- - Sur ordinateur : ajoutez classiquement Ecolyo dans les Favoris
- de votre navigateur préféré. Cela sera plus facile par la suite
- de retrouver notre service.
- </p>
- <p>
- Si un jour vous avez totalement perdu l'adresse d'accès à votre
- service, vous pouvez le retrouver en cliquant tout en bas sur le
- bouton "Accéder à mon cloud personnel" du site web Ecolyo.com
- </p>
- </div>
- ),
- },
- {
- summary:
- "Pour accéder à Ecolyo, j'ai dû me créer un cloud personnel Grand Lyon. Qu'est-ce ?",
- details: (
- <div>
- Souvent le cloud personnel est réduit à un simple espace de
- stockage de documents mais il est bien plus que ça. C'est un
- espace individuel et sécurisé. Vous seul pouvez y accéder,
- personne d'autre. Dans le cloud vous avez deux types de services:
- les premiers sont des services qui vous permettent de récupérer
- vos données et les stocker dans cet espace. Vous avez aussi des
- services qui vous permettent de valoriser vos données pour
- qu'elles aient plus de sens pour vous (c'est le cas d'Ecolyo!). Si
- vous souhaitez en savoir plus sur votre cloud personnel cliquez{' '}
- <a href="https://support.grandlyon.com/clouds-personnels-grand-lyon/">
- ici
- </a>
- .
- </div>
- ),
- },
- ],
- },
- ]
-}
-
-export default FaqData
diff --git a/src/components/FAQ/FAQLink.tsx b/src/components/FAQ/FAQLink.tsx
deleted file mode 100644
index dbb62aa0a..000000000
--- a/src/components/FAQ/FAQLink.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import React, { useCallback } from 'react'
-import './faqLink.scss'
-import Link from '@material-ui/core/Link'
-import { Link as RouterLink } from 'react-router-dom'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import QuestionMarkIcon from 'assets/icons/ico/questionMark.svg'
-import { useClient } from 'cozy-client'
-import { UsageEventType } from 'enum/usageEvent.enum'
-import UsageEventService from 'services/usageEvent.service'
-
-const FAQLink: React.FC = () => {
- const { t } = useI18n()
- const client = useClient()
- const emitNavEvent = useCallback(async () => {
- await UsageEventService.addEvent(client, {
- type: UsageEventType.NAVIGATION_EVENT,
- target: 'faq',
- })
- }, [client])
- return (
- <div className="faq-root">
- <div className="faq-content">
- <div className="faq-header text-16-normal-uppercase">
- {t('faq.title_faq')}
- </div>
- <Link className="faq-card-link" component={RouterLink} to="options/FAQ">
- <div className="card" onClick={emitNavEvent}>
- <div className="faq-card">
- <div className="faq-card-content">
- <StyledIcon
- className="faq-card-content-icon"
- icon={QuestionMarkIcon}
- size={42}
- />
- <div className="faq-card-content-title">
- {t('faq.read_faq')}
- </div>
- </div>
- </div>
- </div>
- </Link>
- </div>
- </div>
- )
-}
-
-export default FAQLink
diff --git a/src/components/FAQ/FAQView.spec.tsx b/src/components/FAQ/FAQView.spec.tsx
deleted file mode 100644
index 74f74ef60..000000000
--- a/src/components/FAQ/FAQView.spec.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react'
-import { shallow } from 'enzyme'
-import FAQView from 'components/FAQ/FAQView'
-
-jest.mock('cozy-ui/transpiled/react/I18n', () => {
- return {
- useI18n: jest.fn(() => {
- return {
- t: (str: string) => str,
- }
- }),
- }
-})
-jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
-jest.mock('components/Header/Header', () => 'mock-header')
-jest.mock('components/Content/Content', () => 'mock-content')
-
-describe('FAQView component', () => {
- it('should render only the parent component', () => {
- const component = shallow(<FAQView />).getElement()
- expect(component).toMatchSnapshot()
- })
-})
diff --git a/src/components/FAQ/FAQView.tsx b/src/components/FAQ/FAQView.tsx
deleted file mode 100644
index 69240dfb1..000000000
--- a/src/components/FAQ/FAQView.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, { useState } from 'react'
-import CozyBar from 'components/Header/CozyBar'
-import Header from 'components/Header/Header'
-import Content from 'components/Content/Content'
-import FAQContent from 'components/FAQ/FAQContent'
-
-const FAQView: React.FC = () => {
- const [headerHeight, setHeaderHeight] = useState<number>(0)
- const defineHeaderHeight = (height: number) => {
- setHeaderHeight(height)
- }
- return (
- <React.Fragment>
- <CozyBar titleKey={'common.title_faq'} displayBackArrow={true} />
- <Header
- setHeaderHeight={defineHeaderHeight}
- desktopTitleKey={'common.title_faq'}
- displayBackArrow={true}
- ></Header>
- <Content height={headerHeight}>
- <FAQContent />
- </Content>
- </React.Fragment>
- )
-}
-
-export default FAQView
diff --git a/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap b/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap
deleted file mode 100644
index 2a395d05d..000000000
--- a/src/components/FAQ/__snapshots__/FAQContent.spec.tsx.snap
+++ /dev/null
@@ -1,1194 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`FAQContent should render the full FAQ 1`] = `
-<FAQContent>
- <div
- className="faq-view-root"
- >
- <div
- className="faq-view-content"
- >
- <div
- className="faq-section"
- key="0"
- >
- <div
- className="text-16-normal-uppercase"
- >
- Mes données
- </div>
- <WithStyles(ForwardRef(Accordion))
- classes={
- Object {
- "root": "expansion-panel-root",
- }
- }
- expanded={false}
- key="0"
- onChange={[Function]}
- >
- <ForwardRef(Accordion)
- classes={
- Object {
- "disabled": "Mui-disabled",
- "expanded": "Mui-expanded",
- "root": "MuiAccordion-root expansion-panel-root",
- "rounded": "MuiAccordion-rounded",
- }
- }
- expanded={false}
- onChange={[Function]}
- >
- <WithStyles(ForwardRef(Paper))
- className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
- square={false}
- >
- <ForwardRef(Paper)
- className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
- classes={
- Object {
- "elevation0": "MuiPaper-elevation0",
- "elevation1": "MuiPaper-elevation1",
- "elevation10": "MuiPaper-elevation10",
- "elevation11": "MuiPaper-elevation11",
- "elevation12": "MuiPaper-elevation12",
- "elevation13": "MuiPaper-elevation13",
- "elevation14": "MuiPaper-elevation14",
- "elevation15": "MuiPaper-elevation15",
- "elevation16": "MuiPaper-elevation16",
- "elevation17": "MuiPaper-elevation17",
- "elevation18": "MuiPaper-elevation18",
- "elevation19": "MuiPaper-elevation19",
- "elevation2": "MuiPaper-elevation2",
- "elevation20": "MuiPaper-elevation20",
- "elevation21": "MuiPaper-elevation21",
- "elevation22": "MuiPaper-elevation22",
- "elevation23": "MuiPaper-elevation23",
- "elevation24": "MuiPaper-elevation24",
- "elevation3": "MuiPaper-elevation3",
- "elevation4": "MuiPaper-elevation4",
- "elevation5": "MuiPaper-elevation5",
- "elevation6": "MuiPaper-elevation6",
- "elevation7": "MuiPaper-elevation7",
- "elevation8": "MuiPaper-elevation8",
- "elevation9": "MuiPaper-elevation9",
- "outlined": "MuiPaper-outlined",
- "root": "MuiPaper-root",
- "rounded": "MuiPaper-rounded",
- }
- }
- square={false}
- >
- <div
- className="MuiPaper-root MuiAccordion-root expansion-panel-root MuiAccordion-rounded MuiPaper-elevation1 MuiPaper-rounded"
- >
- <WithStyles(ForwardRef(AccordionSummary))
- aria-label="faq.accessibility.button_toggle_detail"
- classes={
- Object {
- "content": "expansion-panel-content",
- "root": "expansion-panel-summary small bold-text",
- }
- }
- expandIcon={
- <StyledIcon
- icon="test-file-stub"
- />
- }
- key=".0"
- >
- <ForwardRef(AccordionSummary)
- aria-label="faq.accessibility.button_toggle_detail"
- classes={
- Object {
- "content": "MuiAccordionSummary-content expansion-panel-content",
- "disabled": "Mui-disabled",
- "expandIcon": "MuiAccordionSummary-expandIcon",
- "expanded": "Mui-expanded",
- "focusVisible": "Mui-focusVisible",
- "focused": "Mui-focused",
- "root": "MuiAccordionSummary-root expansion-panel-summary small bold-text",
- }
- }
- expandIcon={
- <StyledIcon
- icon="test-file-stub"
- />
- }
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
- component="div"
- disableRipple={true}
- disabled={false}
- focusRipple={false}
- focusVisibleClassName="Mui-focusVisible Mui-focused"
- onClick={[Function]}
- >
- <ForwardRef(ButtonBase)
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="div"
- disableRipple={true}
- disabled={false}
- focusRipple={false}
- focusVisibleClassName="Mui-focusVisible Mui-focused"
- onClick={[Function]}
- >
- <div
- aria-disabled={false}
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiButtonBase-root MuiAccordionSummary-root expansion-panel-summary small bold-text"
- onBlur={[Function]}
- onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- role="button"
- tabIndex={0}
- >
- <div
- className="MuiAccordionSummary-content expansion-panel-content"
- >
- Comment accéder à mes données électricité ?
- </div>
- <WithStyles(ForwardRef(IconButton))
- aria-hidden={true}
- className="MuiAccordionSummary-expandIcon"
- component="div"
- edge="end"
- role={null}
- tabIndex={null}
- >
- <ForwardRef(IconButton)
- aria-hidden={true}
- className="MuiAccordionSummary-expandIcon"
- classes={
- Object {
- "colorInherit": "MuiIconButton-colorInherit",
- "colorPrimary": "MuiIconButton-colorPrimary",
- "colorSecondary": "MuiIconButton-colorSecondary",
- "disabled": "Mui-disabled",
- "edgeEnd": "MuiIconButton-edgeEnd",
- "edgeStart": "MuiIconButton-edgeStart",
- "label": "MuiIconButton-label",
- "root": "MuiIconButton-root",
- "sizeSmall": "MuiIconButton-sizeSmall",
- }
- }
- component="div"
- edge="end"
- role={null}
- tabIndex={null}
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-hidden={true}
- centerRipple={true}
- className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- component="div"
- disabled={false}
- focusRipple={true}
- role={null}
- tabIndex={null}
- >
- <ForwardRef(ButtonBase)
- aria-hidden={true}
- centerRipple={true}
- className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="div"
- disabled={false}
- focusRipple={true}
- role={null}
- tabIndex={null}
- >
- <div
- aria-disabled={false}
- aria-hidden={true}
- className="MuiButtonBase-root MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- onBlur={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- role={null}
- tabIndex={null}
- >
- <span
- className="MuiIconButton-label"
- >
- <StyledIcon
- icon="test-file-stub"
- >
- <Icon
- aria-hidden={true}
- icon="test-file-stub"
- size={16}
- spin={false}
- >
- <Component
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={16}
- style={Object {}}
- width={16}
- >
- <svg
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={16}
- style={Object {}}
- width={16}
- >
- <use
- xlinkHref="#test-file-stub"
- />
- </svg>
- </Component>
- </Icon>
- </StyledIcon>
- </span>
- <WithStyles(memo)
- center={true}
- >
- <ForwardRef(TouchRipple)
- center={true}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
- >
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </div>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(IconButton)>
- </WithStyles(ForwardRef(IconButton))>
- </div>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(AccordionSummary)>
- </WithStyles(ForwardRef(AccordionSummary))>
- <WithStyles(ForwardRef(Collapse))
- in={false}
- timeout="auto"
- >
- <ForwardRef(Collapse)
- classes={
- Object {
- "entered": "MuiCollapse-entered",
- "hidden": "MuiCollapse-hidden",
- "root": "MuiCollapse-root",
- "wrapper": "MuiCollapse-wrapper",
- "wrapperInner": "MuiCollapse-wrapperInner",
- }
- }
- in={false}
- timeout="auto"
- >
- <Transition
- addEndListener={[Function]}
- appear={false}
- enter={true}
- exit={true}
- in={false}
- mountOnEnter={false}
- onEnter={[Function]}
- onEntered={[Function]}
- onEntering={[Function]}
- onExit={[Function]}
- onExited={[Function]}
- onExiting={[Function]}
- timeout={null}
- unmountOnExit={false}
- >
- <div
- className="MuiCollapse-root MuiCollapse-hidden"
- style={
- Object {
- "minHeight": "0px",
- }
- }
- >
- <div
- className="MuiCollapse-wrapper"
- >
- <div
- className="MuiCollapse-wrapperInner"
- >
- <div
- role="region"
- >
- <WithStyles(ForwardRef(AccordionDetails))
- classes={
- Object {
- "root": "expansion-panel-details",
- }
- }
- key=".1"
- >
- <ForwardRef(AccordionDetails)
- classes={
- Object {
- "root": "MuiAccordionDetails-root expansion-panel-details",
- }
- }
- >
- <div
- className="MuiAccordionDetails-root expansion-panel-details"
- >
- <div>
- Rendez-vous dans la partie Options du service et cliquer sur le bouton "Se connecter à l\\'électricité". Suivez la procédure (en vous créant un compte Enedis si nécessaire). Une fois votre consentement donné, vos données de consommation seront récupérées.
- </div>
- </div>
- </ForwardRef(AccordionDetails)>
- </WithStyles(ForwardRef(AccordionDetails))>
- </div>
- </div>
- </div>
- </div>
- </Transition>
- </ForwardRef(Collapse)>
- </WithStyles(ForwardRef(Collapse))>
- </div>
- </ForwardRef(Paper)>
- </WithStyles(ForwardRef(Paper))>
- </ForwardRef(Accordion)>
- </WithStyles(ForwardRef(Accordion))>
- <WithStyles(ForwardRef(Accordion))
- classes={
- Object {
- "root": "expansion-panel-root",
- }
- }
- expanded={false}
- key="1"
- onChange={[Function]}
- >
- <ForwardRef(Accordion)
- classes={
- Object {
- "disabled": "Mui-disabled",
- "expanded": "Mui-expanded",
- "root": "MuiAccordion-root expansion-panel-root",
- "rounded": "MuiAccordion-rounded",
- }
- }
- expanded={false}
- onChange={[Function]}
- >
- <WithStyles(ForwardRef(Paper))
- className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
- square={false}
- >
- <ForwardRef(Paper)
- className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
- classes={
- Object {
- "elevation0": "MuiPaper-elevation0",
- "elevation1": "MuiPaper-elevation1",
- "elevation10": "MuiPaper-elevation10",
- "elevation11": "MuiPaper-elevation11",
- "elevation12": "MuiPaper-elevation12",
- "elevation13": "MuiPaper-elevation13",
- "elevation14": "MuiPaper-elevation14",
- "elevation15": "MuiPaper-elevation15",
- "elevation16": "MuiPaper-elevation16",
- "elevation17": "MuiPaper-elevation17",
- "elevation18": "MuiPaper-elevation18",
- "elevation19": "MuiPaper-elevation19",
- "elevation2": "MuiPaper-elevation2",
- "elevation20": "MuiPaper-elevation20",
- "elevation21": "MuiPaper-elevation21",
- "elevation22": "MuiPaper-elevation22",
- "elevation23": "MuiPaper-elevation23",
- "elevation24": "MuiPaper-elevation24",
- "elevation3": "MuiPaper-elevation3",
- "elevation4": "MuiPaper-elevation4",
- "elevation5": "MuiPaper-elevation5",
- "elevation6": "MuiPaper-elevation6",
- "elevation7": "MuiPaper-elevation7",
- "elevation8": "MuiPaper-elevation8",
- "elevation9": "MuiPaper-elevation9",
- "outlined": "MuiPaper-outlined",
- "root": "MuiPaper-root",
- "rounded": "MuiPaper-rounded",
- }
- }
- square={false}
- >
- <div
- className="MuiPaper-root MuiAccordion-root expansion-panel-root MuiAccordion-rounded MuiPaper-elevation1 MuiPaper-rounded"
- >
- <WithStyles(ForwardRef(AccordionSummary))
- aria-label="faq.accessibility.button_toggle_detail"
- classes={
- Object {
- "content": "expansion-panel-content",
- "root": "expansion-panel-summary small bold-text",
- }
- }
- expandIcon={
- <StyledIcon
- icon="test-file-stub"
- />
- }
- key=".0"
- >
- <ForwardRef(AccordionSummary)
- aria-label="faq.accessibility.button_toggle_detail"
- classes={
- Object {
- "content": "MuiAccordionSummary-content expansion-panel-content",
- "disabled": "Mui-disabled",
- "expandIcon": "MuiAccordionSummary-expandIcon",
- "expanded": "Mui-expanded",
- "focusVisible": "Mui-focusVisible",
- "focused": "Mui-focused",
- "root": "MuiAccordionSummary-root expansion-panel-summary small bold-text",
- }
- }
- expandIcon={
- <StyledIcon
- icon="test-file-stub"
- />
- }
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
- component="div"
- disableRipple={true}
- disabled={false}
- focusRipple={false}
- focusVisibleClassName="Mui-focusVisible Mui-focused"
- onClick={[Function]}
- >
- <ForwardRef(ButtonBase)
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="div"
- disableRipple={true}
- disabled={false}
- focusRipple={false}
- focusVisibleClassName="Mui-focusVisible Mui-focused"
- onClick={[Function]}
- >
- <div
- aria-disabled={false}
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiButtonBase-root MuiAccordionSummary-root expansion-panel-summary small bold-text"
- onBlur={[Function]}
- onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- role="button"
- tabIndex={0}
- >
- <div
- className="MuiAccordionSummary-content expansion-panel-content"
- >
- Comment accéder à mes données gaz ?
- </div>
- <WithStyles(ForwardRef(IconButton))
- aria-hidden={true}
- className="MuiAccordionSummary-expandIcon"
- component="div"
- edge="end"
- role={null}
- tabIndex={null}
- >
- <ForwardRef(IconButton)
- aria-hidden={true}
- className="MuiAccordionSummary-expandIcon"
- classes={
- Object {
- "colorInherit": "MuiIconButton-colorInherit",
- "colorPrimary": "MuiIconButton-colorPrimary",
- "colorSecondary": "MuiIconButton-colorSecondary",
- "disabled": "Mui-disabled",
- "edgeEnd": "MuiIconButton-edgeEnd",
- "edgeStart": "MuiIconButton-edgeStart",
- "label": "MuiIconButton-label",
- "root": "MuiIconButton-root",
- "sizeSmall": "MuiIconButton-sizeSmall",
- }
- }
- component="div"
- edge="end"
- role={null}
- tabIndex={null}
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-hidden={true}
- centerRipple={true}
- className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- component="div"
- disabled={false}
- focusRipple={true}
- role={null}
- tabIndex={null}
- >
- <ForwardRef(ButtonBase)
- aria-hidden={true}
- centerRipple={true}
- className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="div"
- disabled={false}
- focusRipple={true}
- role={null}
- tabIndex={null}
- >
- <div
- aria-disabled={false}
- aria-hidden={true}
- className="MuiButtonBase-root MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- onBlur={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- role={null}
- tabIndex={null}
- >
- <span
- className="MuiIconButton-label"
- >
- <StyledIcon
- icon="test-file-stub"
- >
- <Icon
- aria-hidden={true}
- icon="test-file-stub"
- size={16}
- spin={false}
- >
- <Component
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={16}
- style={Object {}}
- width={16}
- >
- <svg
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={16}
- style={Object {}}
- width={16}
- >
- <use
- xlinkHref="#test-file-stub"
- />
- </svg>
- </Component>
- </Icon>
- </StyledIcon>
- </span>
- <WithStyles(memo)
- center={true}
- >
- <ForwardRef(TouchRipple)
- center={true}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
- >
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </div>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(IconButton)>
- </WithStyles(ForwardRef(IconButton))>
- </div>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(AccordionSummary)>
- </WithStyles(ForwardRef(AccordionSummary))>
- <WithStyles(ForwardRef(Collapse))
- in={false}
- timeout="auto"
- >
- <ForwardRef(Collapse)
- classes={
- Object {
- "entered": "MuiCollapse-entered",
- "hidden": "MuiCollapse-hidden",
- "root": "MuiCollapse-root",
- "wrapper": "MuiCollapse-wrapper",
- "wrapperInner": "MuiCollapse-wrapperInner",
- }
- }
- in={false}
- timeout="auto"
- >
- <Transition
- addEndListener={[Function]}
- appear={false}
- enter={true}
- exit={true}
- in={false}
- mountOnEnter={false}
- onEnter={[Function]}
- onEntered={[Function]}
- onEntering={[Function]}
- onExit={[Function]}
- onExited={[Function]}
- onExiting={[Function]}
- timeout={null}
- unmountOnExit={false}
- >
- <div
- className="MuiCollapse-root MuiCollapse-hidden"
- style={
- Object {
- "minHeight": "0px",
- }
- }
- >
- <div
- className="MuiCollapse-wrapper"
- >
- <div
- className="MuiCollapse-wrapperInner"
- >
- <div
- role="region"
- >
- <WithStyles(ForwardRef(AccordionDetails))
- classes={
- Object {
- "root": "expansion-panel-details",
- }
- }
- key=".1"
- >
- <ForwardRef(AccordionDetails)
- classes={
- Object {
- "root": "MuiAccordionDetails-root expansion-panel-details",
- }
- }
- >
- <div
- className="MuiAccordionDetails-root expansion-panel-details"
- >
- <div>
- Rendez-vous dans la partie Options du service et cliquez sur le bouton "Se connecter au gaz". Suivez la procédure (en vous créant un compte GRDF si nécessaire). Une fois votre consentement donné, vos données de consommation seront récupérées.',
- </div>
- </div>
- </ForwardRef(AccordionDetails)>
- </WithStyles(ForwardRef(AccordionDetails))>
- </div>
- </div>
- </div>
- </div>
- </Transition>
- </ForwardRef(Collapse)>
- </WithStyles(ForwardRef(Collapse))>
- </div>
- </ForwardRef(Paper)>
- </WithStyles(ForwardRef(Paper))>
- </ForwardRef(Accordion)>
- </WithStyles(ForwardRef(Accordion))>
- </div>
- <div
- className="faq-section"
- key="1"
- >
- <div
- className="text-16-normal-uppercase"
- >
- Contenu du service
- </div>
- <WithStyles(ForwardRef(Accordion))
- classes={
- Object {
- "root": "expansion-panel-root",
- }
- }
- expanded={false}
- key="0"
- onChange={[Function]}
- >
- <ForwardRef(Accordion)
- classes={
- Object {
- "disabled": "Mui-disabled",
- "expanded": "Mui-expanded",
- "root": "MuiAccordion-root expansion-panel-root",
- "rounded": "MuiAccordion-rounded",
- }
- }
- expanded={false}
- onChange={[Function]}
- >
- <WithStyles(ForwardRef(Paper))
- className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
- square={false}
- >
- <ForwardRef(Paper)
- className="MuiAccordion-root expansion-panel-root MuiAccordion-rounded"
- classes={
- Object {
- "elevation0": "MuiPaper-elevation0",
- "elevation1": "MuiPaper-elevation1",
- "elevation10": "MuiPaper-elevation10",
- "elevation11": "MuiPaper-elevation11",
- "elevation12": "MuiPaper-elevation12",
- "elevation13": "MuiPaper-elevation13",
- "elevation14": "MuiPaper-elevation14",
- "elevation15": "MuiPaper-elevation15",
- "elevation16": "MuiPaper-elevation16",
- "elevation17": "MuiPaper-elevation17",
- "elevation18": "MuiPaper-elevation18",
- "elevation19": "MuiPaper-elevation19",
- "elevation2": "MuiPaper-elevation2",
- "elevation20": "MuiPaper-elevation20",
- "elevation21": "MuiPaper-elevation21",
- "elevation22": "MuiPaper-elevation22",
- "elevation23": "MuiPaper-elevation23",
- "elevation24": "MuiPaper-elevation24",
- "elevation3": "MuiPaper-elevation3",
- "elevation4": "MuiPaper-elevation4",
- "elevation5": "MuiPaper-elevation5",
- "elevation6": "MuiPaper-elevation6",
- "elevation7": "MuiPaper-elevation7",
- "elevation8": "MuiPaper-elevation8",
- "elevation9": "MuiPaper-elevation9",
- "outlined": "MuiPaper-outlined",
- "root": "MuiPaper-root",
- "rounded": "MuiPaper-rounded",
- }
- }
- square={false}
- >
- <div
- className="MuiPaper-root MuiAccordion-root expansion-panel-root MuiAccordion-rounded MuiPaper-elevation1 MuiPaper-rounded"
- >
- <WithStyles(ForwardRef(AccordionSummary))
- aria-label="faq.accessibility.button_toggle_detail"
- classes={
- Object {
- "content": "expansion-panel-content",
- "root": "expansion-panel-summary small bold-text",
- }
- }
- expandIcon={
- <StyledIcon
- icon="test-file-stub"
- />
- }
- key=".0"
- >
- <ForwardRef(AccordionSummary)
- aria-label="faq.accessibility.button_toggle_detail"
- classes={
- Object {
- "content": "MuiAccordionSummary-content expansion-panel-content",
- "disabled": "Mui-disabled",
- "expandIcon": "MuiAccordionSummary-expandIcon",
- "expanded": "Mui-expanded",
- "focusVisible": "Mui-focusVisible",
- "focused": "Mui-focused",
- "root": "MuiAccordionSummary-root expansion-panel-summary small bold-text",
- }
- }
- expandIcon={
- <StyledIcon
- icon="test-file-stub"
- />
- }
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
- component="div"
- disableRipple={true}
- disabled={false}
- focusRipple={false}
- focusVisibleClassName="Mui-focusVisible Mui-focused"
- onClick={[Function]}
- >
- <ForwardRef(ButtonBase)
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiAccordionSummary-root expansion-panel-summary small bold-text"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="div"
- disableRipple={true}
- disabled={false}
- focusRipple={false}
- focusVisibleClassName="Mui-focusVisible Mui-focused"
- onClick={[Function]}
- >
- <div
- aria-disabled={false}
- aria-expanded={false}
- aria-label="faq.accessibility.button_toggle_detail"
- className="MuiButtonBase-root MuiAccordionSummary-root expansion-panel-summary small bold-text"
- onBlur={[Function]}
- onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- role="button"
- tabIndex={0}
- >
- <div
- className="MuiAccordionSummary-content expansion-panel-content"
- >
- Pourquoi les prix affichés sont-ils différents de ceux indiqués sur ma facture ?
- </div>
- <WithStyles(ForwardRef(IconButton))
- aria-hidden={true}
- className="MuiAccordionSummary-expandIcon"
- component="div"
- edge="end"
- role={null}
- tabIndex={null}
- >
- <ForwardRef(IconButton)
- aria-hidden={true}
- className="MuiAccordionSummary-expandIcon"
- classes={
- Object {
- "colorInherit": "MuiIconButton-colorInherit",
- "colorPrimary": "MuiIconButton-colorPrimary",
- "colorSecondary": "MuiIconButton-colorSecondary",
- "disabled": "Mui-disabled",
- "edgeEnd": "MuiIconButton-edgeEnd",
- "edgeStart": "MuiIconButton-edgeStart",
- "label": "MuiIconButton-label",
- "root": "MuiIconButton-root",
- "sizeSmall": "MuiIconButton-sizeSmall",
- }
- }
- component="div"
- edge="end"
- role={null}
- tabIndex={null}
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-hidden={true}
- centerRipple={true}
- className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- component="div"
- disabled={false}
- focusRipple={true}
- role={null}
- tabIndex={null}
- >
- <ForwardRef(ButtonBase)
- aria-hidden={true}
- centerRipple={true}
- className="MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="div"
- disabled={false}
- focusRipple={true}
- role={null}
- tabIndex={null}
- >
- <div
- aria-disabled={false}
- aria-hidden={true}
- className="MuiButtonBase-root MuiIconButton-root MuiAccordionSummary-expandIcon MuiIconButton-edgeEnd"
- onBlur={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- role={null}
- tabIndex={null}
- >
- <span
- className="MuiIconButton-label"
- >
- <StyledIcon
- icon="test-file-stub"
- >
- <Icon
- aria-hidden={true}
- icon="test-file-stub"
- size={16}
- spin={false}
- >
- <Component
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={16}
- style={Object {}}
- width={16}
- >
- <svg
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={16}
- style={Object {}}
- width={16}
- >
- <use
- xlinkHref="#test-file-stub"
- />
- </svg>
- </Component>
- </Icon>
- </StyledIcon>
- </span>
- <WithStyles(memo)
- center={true}
- >
- <ForwardRef(TouchRipple)
- center={true}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
- >
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </div>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(IconButton)>
- </WithStyles(ForwardRef(IconButton))>
- </div>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(AccordionSummary)>
- </WithStyles(ForwardRef(AccordionSummary))>
- <WithStyles(ForwardRef(Collapse))
- in={false}
- timeout="auto"
- >
- <ForwardRef(Collapse)
- classes={
- Object {
- "entered": "MuiCollapse-entered",
- "hidden": "MuiCollapse-hidden",
- "root": "MuiCollapse-root",
- "wrapper": "MuiCollapse-wrapper",
- "wrapperInner": "MuiCollapse-wrapperInner",
- }
- }
- in={false}
- timeout="auto"
- >
- <Transition
- addEndListener={[Function]}
- appear={false}
- enter={true}
- exit={true}
- in={false}
- mountOnEnter={false}
- onEnter={[Function]}
- onEntered={[Function]}
- onEntering={[Function]}
- onExit={[Function]}
- onExited={[Function]}
- onExiting={[Function]}
- timeout={null}
- unmountOnExit={false}
- >
- <div
- className="MuiCollapse-root MuiCollapse-hidden"
- style={
- Object {
- "minHeight": "0px",
- }
- }
- >
- <div
- className="MuiCollapse-wrapper"
- >
- <div
- className="MuiCollapse-wrapperInner"
- >
- <div
- role="region"
- >
- <WithStyles(ForwardRef(AccordionDetails))
- classes={
- Object {
- "root": "expansion-panel-details",
- }
- }
- key=".1"
- >
- <ForwardRef(AccordionDetails)
- classes={
- Object {
- "root": "MuiAccordionDetails-root expansion-panel-details",
- }
- }
- >
- <div
- className="MuiAccordionDetails-root expansion-panel-details"
- >
- <div>
- <p>
- Le prix de votre électricité ou de votre gaz dépend de l'offre choisie auprès de votre fournisseur. N’ayant pas accès à cette information, Ecolyo affiche un prix moyen par fluide.
- </p>
- <p>
- Tarifs moyens retenus :
- </p>
- </div>
- </div>
- </ForwardRef(AccordionDetails)>
- </WithStyles(ForwardRef(AccordionDetails))>
- </div>
- </div>
- </div>
- </div>
- </Transition>
- </ForwardRef(Collapse)>
- </WithStyles(ForwardRef(Collapse))>
- </div>
- </ForwardRef(Paper)>
- </WithStyles(ForwardRef(Paper))>
- </ForwardRef(Accordion)>
- </WithStyles(ForwardRef(Accordion))>
- </div>
- </div>
- </div>
-</FAQContent>
-`;
diff --git a/src/components/FAQ/__snapshots__/FAQView.spec.tsx.snap b/src/components/FAQ/__snapshots__/FAQView.spec.tsx.snap
deleted file mode 100644
index 285ef8a29..000000000
--- a/src/components/FAQ/__snapshots__/FAQView.spec.tsx.snap
+++ /dev/null
@@ -1,20 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`FAQView component should render only the parent component 1`] = `
-<React.Fragment>
- <mock-cozybar
- displayBackArrow={true}
- titleKey="common.title_faq"
- />
- <mock-header
- desktopTitleKey="common.title_faq"
- displayBackArrow={true}
- setHeaderHeight={[Function]}
- />
- <mock-content
- height={0}
- >
- <FAQContent />
- </mock-content>
-</React.Fragment>
-`;
diff --git a/src/components/FAQ/faqContent.scss b/src/components/FAQ/faqContent.scss
deleted file mode 100644
index c8cae5558..000000000
--- a/src/components/FAQ/faqContent.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-@import 'src/styles/base/color';
-@import 'src/styles/base/breakpoint';
-
-// FAQ
-.faq-view-root {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- margin: 1.5rem;
- .faq-view-content {
- width: 45.75rem;
- @media #{$large-phone} {
- width: 100%;
- }
- }
-}
-
-.faq-spinner {
- display: flex;
- align-items: center;
- justify-content: center;
- min-height: 100%;
- @media #{$large-phone} {
- min-height: inherit;
- }
-}
-
-.faq-section {
- color: $grey-bright;
- padding-top: 1rem;
- .expansion-panel-details {
- div {
- padding-bottom: 0.6rem;
- p {
- color: $grey-bright;
- margin-block-start: 0;
- margin-block-end: 0.6rem;
- }
- p:last-child {
- margin-block-end: 0rem;
- }
- }
- }
-}
diff --git a/src/components/FAQ/faqLink.scss b/src/components/FAQ/faqLink.scss
deleted file mode 100644
index 270865127..000000000
--- a/src/components/FAQ/faqLink.scss
+++ /dev/null
@@ -1,51 +0,0 @@
-@import 'src/styles/base/color';
-@import 'src/styles/base/breakpoint';
-
-// FAQContainer
-.faq-root {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- padding: 0 1.5rem;
- margin-top: 2rem;
- .faq-content {
- width: 45.75rem;
- a {
- color: $white;
- text-decoration: none;
- }
- @media #{$large-phone} {
- width: 100%;
- }
- .faq-header {
- margin-bottom: 1rem;
- color: $grey-bright;
- }
- }
-}
-
-.faq-card-link {
- color: $white;
-}
-.faq-card {
- display: flex;
- flex-direction: row;
- margin: -0.75rem 0;
- width: 100%;
- @media #{$large-phone} {
- width: 100%;
- }
- .faq-card-content {
- display: flex;
- flex-direction: row;
- .faq-card-content-icon {
- margin: 0.5rem 0;
- }
- .faq-card-content-title {
- margin: 0 1rem;
- align-self: center;
- text-decoration: none;
- }
- }
-}
diff --git a/src/components/Feedback/FeedbackModal.spec.tsx b/src/components/Feedback/FeedbackModal.spec.tsx
index 3a5a63748..93bbd7f61 100644
--- a/src/components/Feedback/FeedbackModal.spec.tsx
+++ b/src/components/Feedback/FeedbackModal.spec.tsx
@@ -1,17 +1,18 @@
import React from 'react'
+import { BrowserRouter } from 'react-router-dom'
import * as reactRedux from 'react-redux'
+import { Provider } from 'react-redux'
import { mount } from 'enzyme'
import FeedbackModal from 'components/Feedback/FeedbackModal'
-
-import Button from '@material-ui/core/Button'
import { userChallengeExplo1OnGoing } from '../../../tests/__mocks__/userChallengeData.mock'
-import { Provider } from 'react-redux'
import {
createMockStore,
mockInitialEcolyoState,
} from '../../../tests/__mocks__/store'
import { act } from 'react-dom/test-utils'
-import { BrowserRouter } from 'react-router-dom'
+
+// Value coming from jest.config
+declare let __SAU_LINK__: string
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -31,29 +32,18 @@ jest.mock('services/environment.service', () => {
})
})
-const mockSendMail = jest.fn()
-jest.mock('services/mail.service', () => {
- return jest.fn(() => {
- return {
- SendMail: mockSendMail,
- }
- })
-})
-
const handleFeedbackModalClose = jest.fn()
const mockUseSelector = jest.spyOn(reactRedux, 'useSelector')
const mockUseDispatch = jest.spyOn(reactRedux, 'useDispatch')
describe('FeedbackModal component', () => {
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
let store: any
beforeEach(() => {
store = createMockStore(mockInitialEcolyoState)
})
it('should render the component', () => {
mockUseDispatch.mockReturnValue(jest.fn())
- mockUseSelector.mockReturnValue(userChallengeExplo1OnGoing)
const component = mount(
<Provider store={store}>
<BrowserRouter>
@@ -68,83 +58,12 @@ describe('FeedbackModal component', () => {
})
})
describe('FeedbackModal functionnalities', () => {
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
let store: any
beforeEach(() => {
store = createMockStore(mockInitialEcolyoState)
})
- it('should should send an email to the support', () => {
- mockUseDispatch.mockReturnValue(jest.fn())
- mockUseSelector.mockReturnValue(userChallengeExplo1OnGoing)
-
- const wrapper = mount(
- <Provider store={store}>
- <BrowserRouter>
- <FeedbackModal
- open={true}
- handleCloseClick={handleFeedbackModalClose}
- />
- </BrowserRouter>
- </Provider>
- )
-
- const mockPlatform = 'platform'
- const mockVendor = 'vendor'
- const mockUserAgent = 'userAgent'
- Object.defineProperty(navigator, 'platform', { value: mockPlatform })
- Object.defineProperty(navigator, 'vendor', { value: mockVendor })
- Object.defineProperty(navigator, 'userAgent', { value: mockUserAgent })
- const expectedMailData = {
- mode: 'from',
- to: [
- {
- name: 'Support',
- email: 'ecolyo@grandlyon.com',
- },
- ],
- subject: '[Ecolyo] - Feedbacks - feedback.type_bug',
- attachments: [],
- parts: [
- {
- type: 'text/plain',
- body:
- 'Type: feedback.type_bug\n' +
- '\n' +
- 'Description:\n' +
- 'La description\n' +
- 'Ecolyo\n' +
- 'v0.0.0\n' +
- '\n' +
- 'Location: http://localhost/\n' +
- '\n' +
- 'Browser:\n' +
- 'On null\n' +
- 'From null\n' +
- 'null\n' +
- '\n' +
- 'Navigator:' +
- `\nOn ${mockPlatform}` +
- `\nFrom ${mockVendor}` +
- `\n${mockUserAgent}`,
- },
- ],
- }
-
- wrapper.find('div.fb-selector-item').first().simulate('click')
- wrapper.find('#idFeedbackDescription').simulate('change', {
- target: {
- value: 'La description',
- },
- })
- wrapper.find(Button).simulate('click')
-
- expect(mockSendMail).toHaveBeenCalledWith(
- expect.anything(),
- expectedMailData
- )
- })
- it('should close the modal and reset the inputs', async () => {
+ it('should close the modal', async () => {
mockUseDispatch.mockReturnValue(jest.fn())
mockUseSelector.mockReturnValue(userChallengeExplo1OnGoing)
const wrapper = mount(
@@ -161,18 +80,16 @@ describe('FeedbackModal functionnalities', () => {
await new Promise(resolve => setTimeout(resolve))
wrapper.update()
})
- wrapper.find('#idFeedbackDescription').simulate('change', {
- target: {
- value: 'La description',
- },
- })
+
wrapper.find('.modal-paper-close-button').first().simulate('click')
expect(handleFeedbackModalClose).toHaveBeenCalledTimes(1)
- setTimeout(() => {
- expect(wrapper.find('#idFeedbackDescription').prop('value')).toBe('')
- })
+ wrapper.find('.btn-secondary-positive').first().simulate('click')
+ expect(handleFeedbackModalClose).toHaveBeenCalledTimes(2)
})
- it('should upload the image', async () => {
+
+ it('should open the SAU link', () => {
+ global.open = jest.fn()
+
const wrapper = mount(
<Provider store={store}>
<BrowserRouter>
@@ -183,14 +100,8 @@ describe('FeedbackModal functionnalities', () => {
</BrowserRouter>
</Provider>
)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve))
- wrapper.update()
- })
- const file = new File([new ArrayBuffer(1)], 'file.jpg')
- const readAsDataURLSpy = jest.spyOn(FileReader.prototype, 'readAsDataURL')
- wrapper.find('#folder').simulate('change', { target: { files: [file] } })
- expect(readAsDataURLSpy).toBeCalledWith(file)
- expect(wrapper.find('.removeUploaded').first().simulate('click'))
+ wrapper.find('.btn-highlight').first().simulate('click')
+ expect(window.open).toBeCalledTimes(1)
+ expect(global.open).toHaveBeenCalledWith(`${__SAU_LINK__}?version=0.0.0`)
})
})
diff --git a/src/components/Feedback/FeedbackModal.tsx b/src/components/Feedback/FeedbackModal.tsx
index 9dabd1b14..a7355a00f 100644
--- a/src/components/Feedback/FeedbackModal.tsx
+++ b/src/components/Feedback/FeedbackModal.tsx
@@ -1,33 +1,18 @@
-import React, { ChangeEvent, useState } from 'react'
+import React from 'react'
+import { Client, useClient } from 'cozy-client'
import { IuseI18n, useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
-import { Client, useClient } from 'cozy-client'
-import { detect } from 'detect-browser'
-
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import IconButton from '@material-ui/core/IconButton'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
-import StyledIconBorderedButton from 'components/CommonKit/IconButton/StyledIconBorderedButton'
-import BugOnIcon from 'assets/icons/visu/feedback/bug-on.svg'
-import BugOffIcon from 'assets/icons/visu/feedback/bug-off.svg'
-import IdeaOnIcon from 'assets/icons/visu/feedback/idea-on.svg'
-import IdeaOffIcon from 'assets/icons/visu/feedback/idea-off.svg'
-import OtherOnIcon from 'assets/icons/visu/feedback/other-on.svg'
-import OtherOffIcon from 'assets/icons/visu/feedback/other-off.svg'
-import WarningIcon from 'assets/icons/ico/warning-yellow.svg'
import CloseIcon from 'assets/icons/ico/close.svg'
-import SuccessIcon from 'assets/icons/visu/data-ok.svg'
-import MailService from 'services/mail.service'
+import EcolyoIcon from 'assets/icons/ico/ecolyo.svg'
import './feedbackModal.scss'
import useExploration from 'components/Hooks/useExploration'
import { UserExplorationID } from 'enum/userExploration.enum'
-import EnvironmentService from 'services/environment.service'
-import Link from '@material-ui/core/Link'
-import { Link as RouterLink } from 'react-router-dom'
-const FEEDBACK_EMAIL = 'ecolyo@grandlyon.com'
-const browser = detect()
+declare let __SAU_LINK__: string
interface FeedbackModalProps {
open: boolean
@@ -40,162 +25,15 @@ const FeedbackModal: React.FC<FeedbackModalProps> = ({
}: FeedbackModalProps) => {
const { t }: IuseI18n = useI18n()
const client: Client = useClient()
- const [type, setType] = useState<string>('bug')
- const [description, setDescription] = useState<string>('')
- const [sending, setSending] = useState<boolean>(false)
- const [sent, setSent] = useState<boolean>(false)
- const [error, setError] = useState<string>('')
- const [textFile, setTextFile] = useState<string>()
- const [uploadedFile, setuploadedFile] = useState<File | null>(null)
-
const [, setValidExploration] = useExploration()
- const resetInputs = () => {
- setType('bug')
- setDescription('')
- setSent(false)
- setError('')
- }
const closeModal = () => {
- resetInputs()
handleCloseClick()
}
- const sendEmail = async () => {
- setSending(true)
- if (description === '') {
- setError(t('feedback.error_empty_description'))
- } else {
- setValidExploration(UserExplorationID.EXPLORATION005)
- const envInfo =
- `Ecolyo` +
- `\nv${client.appMetadata.version}` +
- `\n\nLocation: ${window.location}` +
- '\n\nBrowser:' +
- `\nOn ${browser && browser.os}` +
- `\nFrom ${browser && browser.name}` +
- `\n${browser && browser.version}` +
- '\n\nNavigator:' +
- `\nOn ${navigator.platform}` +
- `\nFrom ${navigator.vendor}` +
- `\n${navigator.userAgent}`
-
- const mailContent =
- 'Type: ' +
- t('feedback.type_' + type) +
- '\n\nDescription:\n' +
- description +
- '\n' +
- envInfo
-
- const subjectEnv = new EnvironmentService().isProduction()
- ? '[Ecolyo]'
- : '[Ecolyo - alpha]'
-
- const mailData = {
- mode: 'from',
- to: [{ name: 'Support', email: FEEDBACK_EMAIL }],
- subject: subjectEnv + ' - Feedbacks - ' + t('feedback.type_' + type),
- parts: [{ type: 'text/plain', body: mailContent }],
- attachments:
- uploadedFile && textFile
- ? [{ filename: uploadedFile.name, content: textFile }]
- : [],
- }
- try {
- const mailService = new MailService()
- mailService.SendMail(client, mailData)
- } catch (e) {
- // eslint-disable-next-line no-console
- console.error(e)
- setError(t('feedback.error_sending'))
- }
- }
- setSending(false)
- setSent(true)
- setuploadedFile(null)
- }
-
- const validResult = () => {
- setSent(false)
- setError('')
- if (error === '') {
- resetInputs()
- closeModal()
- }
- }
-
- const getOnIcon = (_type: string) => {
- switch (_type) {
- case 'bug':
- return BugOnIcon
- case 'idea':
- return IdeaOnIcon
- case 'other':
- return OtherOnIcon
- default:
- return BugOnIcon
- }
- }
- const getOffIcon = (_type: string) => {
- switch (_type) {
- case 'bug':
- return BugOffIcon
- case 'idea':
- return IdeaOffIcon
- case 'other':
- return OtherOffIcon
- default:
- return BugOffIcon
- }
- }
-
- const selectorItem = (itemType: string) => {
- const selected = type === itemType
- return (
- <div className="fb-selector-item">
- <StyledIconBorderedButton
- aria-label={t('feedback.accessibility.select_type_' + itemType)}
- icon={selected ? getOnIcon(itemType) : getOffIcon(itemType)}
- selected={selected}
- autoFocus={selected}
- size={36}
- onClick={() => setType(itemType)}
- >
- <div
- className={
- selected
- ? 'fb-selector-item-selectedlabel text-10-bold'
- : 'fb-selector-item-label text-10-normal'
- }
- >
- {t('feedback.type_' + itemType)}
- </div>
- </StyledIconBorderedButton>
- </div>
- )
- }
- const readFileAsDataURL = async (file: File): Promise<string> => {
- return new Promise(resolve => {
- const reader = new FileReader()
- reader.onloadend = () => {
- if (reader.result) {
- resolve(reader.result as string)
- }
- }
- reader.readAsDataURL(file)
- })
- }
- const getDocument = async (
- e: ChangeEvent<HTMLInputElement>
- ): Promise<void> => {
- const { files } = e.target
- const file = files ? files[0] : null
- if (file) {
- setuploadedFile(file)
- const base64File: string = await readFileAsDataURL(file)
- setTextFile(base64File.split(',')[1])
- }
+ const goToSAU = () => {
+ setValidExploration(UserExplorationID.EXPLORATION005)
+ window.open(`${__SAU_LINK__}?version=${client.appMetadata.version}`)
}
return (
@@ -222,127 +60,31 @@ const FeedbackModal: React.FC<FeedbackModalProps> = ({
<Icon icon={CloseIcon} size={16} />
</IconButton>
<div className="fb-root">
- {sent ? (
- <>
- <div className="fb-content">
- {error === '' ? (
- <div className="fb-content-success">
- <div className="fb-icon">
- <StyledIcon icon={SuccessIcon} size={48} />
- </div>
- <div>{t('feedback.success_sending')}</div>
- </div>
- ) : (
- <div className="fb-content-error">
- <div className="fb-icon">
- <StyledIcon icon={WarningIcon} size={48} />
- </div>
- <div>{t('feedback.warning')}</div>
- <div>{error}</div>
- </div>
- )}
- <Button
- aria-label={t('feedback.accessibility.button_ok')}
- onClick={validResult}
- variant={'contained'}
- classes={{
- root: 'btn-highlight',
- label: 'text-16-bold',
- }}
- >
- {t('feedback.ok')}
- </Button>
- </div>
- </>
- ) : (
- <>
- <div id="title" className="fb-header text-18-bold">
- {t('feedback.title')}
- </div>
- <form className="fb-content">
- <label htmlFor="feedbackType" className="fb-label text-16-bold">
- {t('feedback.type')}
- </label>
- <fieldset id="feedbackType" className="fb-selector">
- {selectorItem('bug')}
- {selectorItem('idea')}
- {selectorItem('other')}
- </fieldset>
-
- <span id="suggestFaq" className="fb-label text-16-bold">
- {t('feedback.suggest_faq')}
- <Link
- component={RouterLink}
- to="options/FAQ"
- onClick={closeModal}
- >
- <span className="styledLink">FAQ</span>
- </Link>
- ?
- </span>
- <label
- htmlFor="idFeedbackDescription"
- className="fb-label text-16-bold"
- >
- {t('feedback.description')}
- </label>
- <textarea
- id="idFeedbackDescription"
- className="fb-form fb-textarea"
- placeholder={t('feedback.description_placeholder')}
- name="description"
- onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>
- setDescription(e.target.value)
- }
- value={description}
- ></textarea>
- <div className="validate_row">
- {!uploadedFile ? (
- <>
- <input
- type="file"
- id="folder"
- accept="image/*"
- onChange={(e): Promise<void> => getDocument(e)}
- className="input-file"
- hidden
- />
- <label htmlFor="folder" className="upload-label">
- {t('feedback.upload')}
- </label>
- </>
- ) : (
- <>
- <span className="fb-label text-16-bold">
- {t('feedback.imageLabel')}
- </span>
- <div className="fileName">
- <span>{uploadedFile.name.substring(0, 3)}..</span>
- <IconButton
- onClick={() => setuploadedFile(null)}
- className="removeUploaded"
- >
- <Icon icon={CloseIcon} size={12} />
- </IconButton>
- </div>
- </>
- )}
- <Button
- aria-label={t('feedback.accessibility.button_send')}
- onClick={sendEmail}
- disabled={sending}
- classes={{
- root: 'btn-highlight',
- label: 'text-16-bold',
- }}
- type="submit"
- >
- {t('feedback.send')}
- </Button>
- </div>
- </form>
- </>
- )}
+ <StyledIcon icon={EcolyoIcon} size={80} />
+ <p className="title">{t('feedback.title')}</p>
+ <p className="subtitle">{t('feedback.subtitle')}</p>
+ <div className="actions">
+ <Button
+ aria-label={t('feedback.later')}
+ onClick={closeModal}
+ classes={{
+ root: 'btn-secondary-positive',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('feedback.later')}
+ </Button>
+ <Button
+ aria-label={t('feedback.lets_go')}
+ onClick={goToSAU}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('feedback.lets_go')}
+ </Button>
+ </div>
</div>
</Dialog>
)
diff --git a/src/components/Feedback/feedbackModal.scss b/src/components/Feedback/feedbackModal.scss
index e8af88519..dae85d4ca 100644
--- a/src/components/Feedback/feedbackModal.scss
+++ b/src/components/Feedback/feedbackModal.scss
@@ -1,133 +1,35 @@
@import 'src/styles/base/color';
-@import '../../styles/base/mixins';
.fb-root {
overflow-y: auto;
min-width: 70%;
- margin: 1rem 0;
- .fb-header {
- color: $gold-shadow;
- padding: 0.5rem 0.5rem 0rem 0.5rem;
- display: flex;
- justify-content: center;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+
+ p {
+ text-align: center;
}
- .fb-content {
- padding: 1rem 0.5rem 1.5rem 0.5rem;
- display: flex;
- flex-direction: column;
- .fb-content-success {
- color: $grey-bright;
- display: flex;
- flex-direction: column;
- align-items: center;
- text-align: center;
- }
- .fb-content-error {
- color: $grey-bright;
- display: flex;
- flex-direction: column;
- align-items: center;
- text-align: center;
- }
- .fb-icon {
- display: flex;
- justify-content: center;
- margin: 0 0 1.5rem 0;
- }
- .fb-label {
- margin: 0.5rem 0 0 0;
- }
- .fb-selector {
- margin: 0.5rem 0;
- display: flex;
- flex-direction: row;
- align-content: space-around;
- justify-content: space-around;
- padding: 0;
- border: none;
- .fb-selector-item {
- height: 3.125rem;
- width: 3.125rem;
- .fb-selector-item-label {
- color: $grey-bright;
- }
- .fb-selector-item-selectedlabel {
- color: $white;
- }
- }
- }
- .fb-form {
- margin: 0.5rem 0;
- border: 1px solid $grey-dark;
- border-radius: 4px;
- color: $grey-bright;
- background: rgba(0, 0, 0, 0.3);
- padding: 0 1rem;
- outline: none;
- }
- .fb-form:focus {
- border: 1px solid $gold-shadow;
- }
- .fb-textarea {
- height: 8.725rem;
- padding: 0.5rem 1rem;
- resize: none;
- }
- .fb-input {
- height: 2rem;
- }
- button.btn-highlight {
- max-width: 9.375rem;
- align-self: center;
- width: 38%;
- padding-top: 0.5rem;
- padding-bottom: 0.6rem;
- margin: 0 !important;
- }
+ .title {
+ color: $gold-light;
+ font-weight: 700;
+ padding: 0.5rem;
}
-}
-.upload-label {
- appearance: none;
- padding: 0.5rem;
- text-align: center;
- max-width: 180px;
- width: 50% !important;
- @include button(
- transparent,
- rgba($grey-bright, 0.7),
- 1px solid $grey-dark,
- transparent
- );
- background-color: rgba($grey-dark, 0.2);
- margin: 0.8rem auto;
- transition: all 300ms ease;
- &:hover {
- opacity: 0.7;
+
+ .subtitle {
+ color: $grey-bright;
+ margin: 1rem 0 2rem;
}
-}
-.styledLink {
- color: $gold-light;
- text-decoration: underline;
-}
-.fileName {
- display: flex;
- justify-content: space-between;
- padding: 0 0.5rem;
- color: $grey-bright;
- border: solid 1px $grey-dark;
- border-radius: 3px;
- margin: 0.5rem 0;
- align-items: center;
-}
-.validate_row {
- display: flex;
- justify-content: space-evenly;
-}
-#accessibility-title {
- display: none;
-}
-#suggestFaq {
- margin-bottom: 1rem;
+ .actions {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ gap: 16px;
+ button {
+ margin-top: 0;
+ max-width: 150px;
+ }
+ }
}
diff --git a/src/components/Header/CozyBar.tsx b/src/components/Header/CozyBar.tsx
index 81c19f8d3..33b4c8d74 100644
--- a/src/components/Header/CozyBar.tsx
+++ b/src/components/Header/CozyBar.tsx
@@ -1,14 +1,13 @@
-import React, { useCallback } from 'react'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { useSelector, useDispatch } from 'react-redux'
-import { AppStore } from 'store'
-import { updateModalIsFeedbacksOpen } from 'store/modal/modal.actions'
-import { useHistory } from 'react-router-dom'
-
-import { ScreenType } from 'enum/screen.enum'
import BackArrowIcon from 'assets/icons/ico/back-arrow.svg'
import FeedbackIcon from 'assets/icons/ico/feedback.svg'
import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { ScreenType } from 'enum/screen.enum'
+import React, { useCallback } from 'react'
+import { useDispatch, useSelector } from 'react-redux'
+import { useHistory } from 'react-router-dom'
+import { AppStore } from 'store'
+import { updateModalIsFeedbacksOpen } from 'store/modal/modal.actions'
interface CozyBarProps {
titleKey?: string
@@ -67,7 +66,7 @@ const CozyBar = ({
aria-label={t('header.accessibility.button_open_feedbacks')}
className="cv-button"
icon={FeedbackIcon}
- sized={40}
+ sized={22}
onClick={handleClickFeedbacks}
/>
</BarRight>
diff --git a/src/components/Options/HelpLink.scss b/src/components/Options/HelpLink/HelpLink.scss
similarity index 100%
rename from src/components/Options/HelpLink.scss
rename to src/components/Options/HelpLink/HelpLink.scss
diff --git a/src/components/Options/HelpLink.tsx b/src/components/Options/HelpLink/HelpLink.tsx
similarity index 78%
rename from src/components/Options/HelpLink.tsx
rename to src/components/Options/HelpLink/HelpLink.tsx
index f0f9d36c3..7311138ae 100644
--- a/src/components/Options/HelpLink.tsx
+++ b/src/components/Options/HelpLink/HelpLink.tsx
@@ -1,14 +1,21 @@
-import React from 'react'
-import './HelpLink.scss'
import Link from '@material-ui/core/Link'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import QuestionMarkIcon from 'assets/icons/ico/questionMark.svg'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import React from 'react'
+import { useDispatch } from 'react-redux'
+import { updateModalIsFeedbacksOpen } from 'store/modal/modal.actions'
+import './HelpLink.scss'
const HelpLink: React.FC = () => {
const { t } = useI18n()
+ const dispatch = useDispatch()
+
return (
- <div className="help-root">
+ <div
+ className="help-root"
+ onClick={() => dispatch(updateModalIsFeedbacksOpen(true))}
+ >
<div className="help-content">
<div className="help-header text-16-normal-uppercase">
{t('help.title_help')}
diff --git a/src/components/Options/MatomoOptOut.spec.tsx b/src/components/Options/MatomoOptOut/MatomoOptOut.spec.tsx
similarity index 90%
rename from src/components/Options/MatomoOptOut.spec.tsx
rename to src/components/Options/MatomoOptOut/MatomoOptOut.spec.tsx
index 11ca22001..69296c020 100644
--- a/src/components/Options/MatomoOptOut.spec.tsx
+++ b/src/components/Options/MatomoOptOut/MatomoOptOut.spec.tsx
@@ -1,6 +1,6 @@
import React from 'react'
import { shallow } from 'enzyme'
-import { MatomoOptOut } from './MatomoOptOut'
+import MatomoOptOut from './MatomoOptOut'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
diff --git a/src/components/Options/MatomoOptOut.tsx b/src/components/Options/MatomoOptOut/MatomoOptOut.tsx
similarity index 91%
rename from src/components/Options/MatomoOptOut.tsx
rename to src/components/Options/MatomoOptOut/MatomoOptOut.tsx
index 69e16ae49..c638d3eda 100644
--- a/src/components/Options/MatomoOptOut.tsx
+++ b/src/components/Options/MatomoOptOut/MatomoOptOut.tsx
@@ -4,7 +4,7 @@ import './matomoOptOut.scss'
declare let __PIWIK_TRACKER_URL__: string
-export const MatomoOptOut: React.FC = () => {
+const MatomoOptOut: React.FC = () => {
const { t } = useI18n()
const baseUrl = __PIWIK_TRACKER_URL__
@@ -22,3 +22,5 @@ export const MatomoOptOut: React.FC = () => {
</div>
)
}
+
+export default MatomoOptOut
diff --git a/src/components/Options/__snapshots__/MatomoOptOut.spec.tsx.snap b/src/components/Options/MatomoOptOut/__snapshots__/MatomoOptOut.spec.tsx.snap
similarity index 100%
rename from src/components/Options/__snapshots__/MatomoOptOut.spec.tsx.snap
rename to src/components/Options/MatomoOptOut/__snapshots__/MatomoOptOut.spec.tsx.snap
diff --git a/src/components/Options/matomoOptOut.scss b/src/components/Options/MatomoOptOut/matomoOptOut.scss
similarity index 100%
rename from src/components/Options/matomoOptOut.scss
rename to src/components/Options/MatomoOptOut/matomoOptOut.scss
diff --git a/src/components/Options/OptionsView.tsx b/src/components/Options/OptionsView.tsx
index 086a22ccf..b6e54afdc 100644
--- a/src/components/Options/OptionsView.tsx
+++ b/src/components/Options/OptionsView.tsx
@@ -1,17 +1,16 @@
import logos from 'assets/png/logos.png'
import Content from 'components/Content/Content'
-import FAQLink from 'components/FAQ/FAQLink'
import GCULink from 'components/GCU/GCULink'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import LegalNoticeLink from 'components/LegalNotice/LegalNoticeLink'
import ExportOptions from 'components/Options/exportOptions'
-import ReportOptions from 'components/Options/ReportOptions'
import Version from 'components/Version/Version'
import React, { useState } from 'react'
-// import HelpLink from './HelpLink'
-import { MatomoOptOut } from './MatomoOptOut'
-import ProfileTypeOptions from './ProfileTypeOptions'
+import HelpLink from './HelpLink/HelpLink'
+import MatomoOptOut from './MatomoOptOut/MatomoOptOut'
+import ProfileTypeOptions from './ProfileTypeOptions/ProfileTypeOptions'
+import ReportOptions from './ReportOptions/ReportOptions'
const OptionsView: React.FC = () => {
const [headerHeight, setHeaderHeight] = useState<number>(0)
@@ -29,9 +28,7 @@ const OptionsView: React.FC = () => {
<ProfileTypeOptions />
<ExportOptions />
<ReportOptions />
- <FAQLink />
- {/* Waiting for SAU to be ready to enable button. When it's ready, remove FAQ & CGU */}
- {/* <HelpLink /> */}
+ <HelpLink />
<LegalNoticeLink />
<GCULink />
<MatomoOptOut />
diff --git a/src/components/Options/ProfileTypeOptions.spec.tsx b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx
similarity index 94%
rename from src/components/Options/ProfileTypeOptions.spec.tsx
rename to src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx
index e9e76356b..fed0a9870 100644
--- a/src/components/Options/ProfileTypeOptions.spec.tsx
+++ b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx
@@ -2,9 +2,9 @@ import React from 'react'
import { mount } from 'enzyme'
import { Provider } from 'react-redux'
import configureStore from 'redux-mock-store'
-import ProfileTypeOptions from 'components/Options/ProfileTypeOptions'
-import { profileData } from '../../../tests/__mocks__/profile.mock'
-import { mockProfileType } from '../../../tests/__mocks__/profileType.mock'
+import ProfileTypeOptions from 'components/Options/ProfileTypeOptions/ProfileTypeOptions'
+import { profileData } from '../../../../tests/__mocks__/profile.mock'
+import { mockProfileType } from '../../../../tests/__mocks__/profileType.mock'
import StyledCard from 'components/CommonKit/Card/StyledCard'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import profileIcon from 'assets/icons/ico/profile.svg'
@@ -14,7 +14,7 @@ import {
IndividualOrCollective,
ThreeChoicesAnswer,
} from 'enum/profileType.enum'
-import { mockInitialChallengeState } from '../../../tests/__mocks__/store'
+import { mockInitialChallengeState } from '../../../../tests/__mocks__/store'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
diff --git a/src/components/Options/ProfileTypeOptions.tsx b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.tsx
similarity index 100%
rename from src/components/Options/ProfileTypeOptions.tsx
rename to src/components/Options/ProfileTypeOptions/ProfileTypeOptions.tsx
diff --git a/src/components/Options/profileTypeOptions.scss b/src/components/Options/ProfileTypeOptions/profileTypeOptions.scss
similarity index 100%
rename from src/components/Options/profileTypeOptions.scss
rename to src/components/Options/ProfileTypeOptions/profileTypeOptions.scss
diff --git a/src/components/Options/ReportOptions.spec.tsx b/src/components/Options/ReportOptions/ReportOptions.spec.tsx
similarity index 93%
rename from src/components/Options/ReportOptions.spec.tsx
rename to src/components/Options/ReportOptions/ReportOptions.spec.tsx
index f97b6ddad..a31d03958 100644
--- a/src/components/Options/ReportOptions.spec.tsx
+++ b/src/components/Options/ReportOptions/ReportOptions.spec.tsx
@@ -1,11 +1,11 @@
import React from 'react'
import { mount } from 'enzyme'
import { Provider } from 'react-redux'
-import ReportOptions from 'components/Options/ReportOptions'
+import ReportOptions from 'components/Options/ReportOptions/ReportOptions'
import {
createMockStore,
mockInitialEcolyoState,
-} from '../../../tests/__mocks__/store'
+} from '../../../../tests/__mocks__/store'
import * as profileActions from 'store/profile/profile.actions'
import { Button } from '@material-ui/core'
import StyledSwitch from 'components/CommonKit/Switch/StyledSwitch'
diff --git a/src/components/Options/ReportOptions.tsx b/src/components/Options/ReportOptions/ReportOptions.tsx
similarity index 100%
rename from src/components/Options/ReportOptions.tsx
rename to src/components/Options/ReportOptions/ReportOptions.tsx
diff --git a/src/components/Options/reportOptions.scss b/src/components/Options/ReportOptions/reportOptions.scss
similarity index 100%
rename from src/components/Options/reportOptions.scss
rename to src/components/Options/ReportOptions/reportOptions.scss
diff --git a/src/components/Options/UnSubscribe.spec.tsx b/src/components/Options/Unsubscribe/UnSubscribe.spec.tsx
similarity index 97%
rename from src/components/Options/UnSubscribe.spec.tsx
rename to src/components/Options/Unsubscribe/UnSubscribe.spec.tsx
index bd7b90d46..2bc1f6460 100644
--- a/src/components/Options/UnSubscribe.spec.tsx
+++ b/src/components/Options/Unsubscribe/UnSubscribe.spec.tsx
@@ -5,7 +5,7 @@ import { Provider } from 'react-redux'
import {
createMockStore,
mockInitialEcolyoState,
-} from '../../../tests/__mocks__/store'
+} from '../../../../tests/__mocks__/store'
import * as profileActions from 'store/profile/profile.actions'
import UnSubscribe from './UnSubscribe'
import { Button } from '@material-ui/core'
diff --git a/src/components/Options/UnSubscribe.tsx b/src/components/Options/Unsubscribe/UnSubscribe.tsx
similarity index 100%
rename from src/components/Options/UnSubscribe.tsx
rename to src/components/Options/Unsubscribe/UnSubscribe.tsx
diff --git a/src/components/Options/__snapshots__/UnSubscribe.spec.tsx.snap b/src/components/Options/Unsubscribe/__snapshots__/UnSubscribe.spec.tsx.snap
similarity index 100%
rename from src/components/Options/__snapshots__/UnSubscribe.spec.tsx.snap
rename to src/components/Options/Unsubscribe/__snapshots__/UnSubscribe.spec.tsx.snap
diff --git a/src/components/Options/unSubscribe.scss b/src/components/Options/Unsubscribe/unSubscribe.scss
similarity index 100%
rename from src/components/Options/unSubscribe.scss
rename to src/components/Options/Unsubscribe/unSubscribe.scss
diff --git a/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap b/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
index 8889596f2..1fcb358c2 100644
--- a/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
+++ b/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
@@ -15,7 +15,7 @@ exports[`OptionsView component should be rendered correctly 1`] = `
<ProfileTypeOptions />
<ExportOptions />
<ReportOptions />
- <FAQLink />
+ <HelpLink />
<LegalNoticeLink />
<GCULink />
<MatomoOptOut />
diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx
index de8fee76c..849967efe 100644
--- a/src/components/Routes/Routes.tsx
+++ b/src/components/Routes/Routes.tsx
@@ -6,7 +6,7 @@ import DuelView from 'components/Duel/DuelView'
import QuizView from 'components/Quiz/QuizView'
import ExplorationView from 'components/Exploration/ExplorationView'
import ActionView from 'components/Action/ActionView'
-import UnSubscribe from 'components/Options/UnSubscribe'
+import UnSubscribe from 'components/Options/Unsubscribe/UnSubscribe'
import TermsView from 'components/Terms/TermsView'
import { TermsStatus } from 'models'
import EcogestureFormView from 'components/EcogestureForm/EcogestureFormView'
@@ -22,7 +22,6 @@ const SingleEcogesture = lazy(
() => import('components/Ecogesture/SingleEcogesture')
)
const OptionsView = lazy(() => import('components/Options/OptionsView'))
-const FAQView = lazy(() => import('components/FAQ/FAQView'))
const LegalNoticeView = lazy(
() => import('components/LegalNotice/LegalNoticeView')
)
@@ -72,7 +71,6 @@ const Routes: React.FC<RouteProps> = ({ termsStatus }: RouteProps) => {
<Route path="/ecogesture/:id" component={SingleEcogesture} />
<Route path={`/ecogestures`} component={EcogestureView} />
<Route path={`/ecogestures`} component={EcogestureView} />
- <Route path={'/options/FAQ'} component={FAQView} />
<Route path={`/options/legalnotice`} component={LegalNoticeView} />
<Route path={`/options/gcu`} component={GCUView} />
<Route path={'/options/:connectParam'} exact component={OptionsView} />
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 5391b63c5..c8096fac2 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -12,7 +12,6 @@
"title_options": "Options",
"title_analysis": "Analyse",
"title_profiletype": "Ajuster mon profil",
- "title_faq": "FAQ",
"title_legal_notice": "Mentions légales",
"title_gcu": "CGU",
"title_sge_connect": "Connexion à l'électricité",
@@ -572,41 +571,18 @@
"back": "Retour",
"no_ecogesture": "Oups ! Nous n'avons pas trouvé l'astuce demandée."
},
- "faq": {
- "title_faq": "Foire aux questions",
- "read_faq": "Lire la FAQ",
- "accessibility": {
- "button_toggle_detail": "Afficher ou masquer le détail de la question"
- }
- },
+
"help": {
"title_help": "Besoin d'aide ?",
"read_help": "Accéder au Service d'Assistance Utilisateur"
},
"feedback": {
- "title": "Partagez-nous vos retours",
- "type": "Motif du retour :",
- "suggest_faq": "Avez-vous pensé à consulter la ",
- "description": "Description :",
- "description_placeholder": "Vos remarques",
- "send": "Envoyer",
- "ok": "Ok",
- "type_bug": "Bug",
- "type_idea": "Idée",
- "type_other": "Autre",
- "success_sending": "Nous vous remercions pour votre retour.",
- "warning": "Attention !",
- "error_empty_description": "Le champ de description est vide.",
- "error_sending": "Erreur lors de l'envoi, veuillez essayer ultérieurement.",
- "upload": "Joindre une image",
- "imageLabel": "Image :",
+ "title": "Vous allez contacter le Service Assistance Utilisateur du Grand Lyon.",
+ "subtitle": "Pas de panique, c'est bien l'équipe Ecolyo qui traitera votre demande !",
+ "later": "Plus tard",
+ "lets_go": "J'y vais",
"accessibility": {
"window_title": "Fenêtre de partage de retours",
- "select_type_bug": "Sélectionner le motif bug",
- "select_type_idea": "Sélectionner le motif idée",
- "select_type_other": "Sélectionner le motif autre",
- "button_send": "Envoyer le retour",
- "button_ok": "Valider",
"button_close": "Fermer la fenêtre de partage de retours"
}
},
@@ -683,7 +659,7 @@
"part6_3_list3": "De l’évolution de vos consommations, des nouveautés et de la qualité du service via une lettre mensuelle. Vous pouvez à tout moment vous désinscrire de cette lettre via la page Options du service.",
"part6_4": "Par ailleurs, et dans le cadre de l’évaluation et de l’amélioration du service, des données d’utilisation anonymisées seront remontées à des fins d’exploitation statistiques. La récupération de ces statistiques anonymisées nous permettra de s’assurer du bon fonctionnement technique de la connexion à vos données de consommation ainsi que d’évaluer l’impact global en termes de baisse des consommations énergétiques de notre service. Parmi ces statistiques, des mesures d’audience de la fréquentation des différentes pages du service sont réalisées. Vous pouvez, via la page Options, à tout instant, décider de vous opposer à la récupération de ces données d’utilisation.",
"title8": "Encore des questions ?",
- "part8_1": "N’hésitez pas à consulter la FAQ présente dans le service (page Options) ou à nous contacter via le formulaire de contact (la petite bulle jaune) présente sur l’ensemble des pages.",
+ "part8_1": "N’hésitez pas à nous contacter via le formulaire de contact (la petite bulle) présente sur l’ensemble des pages.",
"part8_2": "Dernière option, contactez-nous directement à <a href=\"mailto:ecolyo@grandlyon.com\">ecolyo(at)grandlyon.com</a>.",
"title9": "LEXIQUE",
"part9_1_title": "Cloud personnel Grand Lyon : ",
diff --git a/src/models/faq.model.ts b/src/models/faq.model.ts
deleted file mode 100644
index f44da78b3..000000000
--- a/src/models/faq.model.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export interface FAQQuestion {
- summary: string
- details: JSX.Element
-}
-
-export interface FAQSection {
- section: string
- questions: FAQQuestion[]
-}
diff --git a/src/models/index.ts b/src/models/index.ts
index 6fb7176aa..67e0a9bf8 100644
--- a/src/models/index.ts
+++ b/src/models/index.ts
@@ -9,7 +9,6 @@ export * from './dataload.model'
export * from './duel.model'
export * from './ecogesture.model'
export * from './exploration.model'
-export * from './faq.model'
export * from './fluid.model'
export * from './fluidPrice.model'
export * from './global.model'
diff --git a/tests/__mocks__/faq.mock.tsx b/tests/__mocks__/faq.mock.tsx
deleted file mode 100644
index 145c90a29..000000000
--- a/tests/__mocks__/faq.mock.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-/* eslint-disable react/no-unescaped-entities */
-import { FAQSection } from 'models'
-import React from 'react'
-
-export const faqData: FAQSection[] = [
- {
- section: 'Mes données',
- questions: [
- {
- summary: 'Comment accéder à mes données électricité ?',
- details: (
- <div>
- Rendez-vous dans la partie Options du service et cliquer sur le
- bouton "Se connecter à l\'électricité". Suivez la procédure (en vous
- créant un compte Enedis si nécessaire). Une fois votre consentement
- donné, vos données de consommation seront récupérées.
- </div>
- ),
- },
- {
- summary: 'Comment accéder à mes données gaz ?',
- details: (
- <div>
- Rendez-vous dans la partie Options du service et cliquez sur le
- bouton "Se connecter au gaz". Suivez la procédure (en vous créant un
- compte GRDF si nécessaire). Une fois votre consentement donné, vos
- données de consommation seront récupérées.',
- </div>
- ),
- },
- ],
- },
- {
- section: 'Contenu du service',
- questions: [
- {
- summary:
- 'Pourquoi les prix affichés sont-ils différents de ceux indiqués sur ma facture ?',
- details: (
- <div>
- <p>
- Le prix de votre électricité ou de votre gaz dépend de l'offre
- choisie auprès de votre fournisseur. N’ayant pas accès à cette
- information, Ecolyo affiche un prix moyen par fluide.
- </p>
- <p>Tarifs moyens retenus :</p>
- </div>
- ),
- },
- ],
- },
-]
--
GitLab