diff --git a/.gitlab/merge_request_templates/[QA] Ecolyo.md b/.gitlab/merge_request_templates/[QA] Ecolyo.md
index b29f263bfca947400863a8d25bebd477580493bd..823451ecf3b71a6b4c972cd4cec38940a3f53b5a 100644
--- a/.gitlab/merge_request_templates/[QA] Ecolyo.md
+++ b/.gitlab/merge_request_templates/[QA] Ecolyo.md
@@ -29,17 +29,19 @@
- [ ] La profondeur de données va jusqu'à 1 an dans la conso pour les pas de temps journalier
- [ ] La profondeur de données à la 1/2h (elec) va jusqu'à 1 semaine
-**Le landememain**
- - [ ] La profondeur de données va jusqu'à 3 ans
+**Le lendemain**
+ - [ ] La profondeur de données va jusqu'à 3 ans pour l'élec et le gaz
+ - [ ] La profondeur de données va jusqu'à novembre 2022 pour l'eau (à cause du passage en régie)
- [ ] La profondeur de données à la 1/2h (elec) va jusqu'à 1 mois
6. **Analyse**
- [ ] La profondeur de données va jusqu'à 3 mois antérieur
- [ ] Les modules de l'analyse sont tous fonctionnels (à l'exception du special elec qui devra être déclenché par un service)
+ - [ ] Le module de comparaison des températures s'affiche dans la comparaison annuelle et mensuelle
7. **Page Astuces**
- - [ ] Chargement de la base des écogestes dans "Toutes"
- - [ ] Lancement du module du choix des écogestes Ok
+ - [ ] Chargement de la base des astuces dans "Toutes"
+ - [ ] Lancement du module du choix des astuces Ok
- [ ] Le profil raccourci est proposé si le profil complet n'est pas renseigné
8. **Page Options**
@@ -62,11 +64,15 @@
## Tests des nouvelles fonctionnalités
-- [ ] 📠_À mettre à jour selon les derniers développements_
+📠_À mettre à jour selon les derniers développements_
+
+- [ ] ...
## Migrations [Instance historique](https://ecolyo.ecolyodemo.cozy.self-data.alpha.grandlyon.com)
-- [ ] Si une migration était nécessaire, vérifier quand c'est possible qu'elle a bien eu lieu
+_Si une migration était nécessaire, vérifier quand c'est possible qu'elle a bien eu lieu_
+
+- [ ] ...
## Autres évolutions associées
diff --git a/.gitlab/merge_request_templates/default.md b/.gitlab/merge_request_templates/default.md
index 8b164c75d09c71ee45fb7e18edcc3d268c717c7f..694ccc6881c54e3bb0f0854f2a6c6d8f51d24ce3 100644
--- a/.gitlab/merge_request_templates/default.md
+++ b/.gitlab/merge_request_templates/default.md
@@ -1,9 +1,9 @@
# Related to #000
-| :triangular_flag_on_post: Give your MR title the same name that the desired squash commit. In doubt, check the conventional commit [doc][conventional-commits]. examples |
-| --- |
-| **feat(profile)**: add... |
-| **fix(annuaire)**: remove... |
+| :triangular_flag_on_post: Give your MR title the same name that the desired squash commit. Check the [conventional commit documentation][conventional-commits]. Examples : |
+| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| **feat(profile)**: add... |
+| **fix(annuaire)**: remove... |
## What does this MR do and why?
@@ -21,6 +21,8 @@ _List all steps to set up and validate the changes on local environment._
_To be completed by the chosen reviewer._
+Follow the [conventional comments][conventional-comments] for easier communication and intention !
+
<!---
Using checklists improves quality in software engineering and other jobs such as with surgeons and airline pilots.
More reading on checklists can be found in the "Checklist Manifesto": http://atulgawande.com/book/the-checklist-manifesto/
@@ -28,7 +30,18 @@ More reading on checklists can be found in the "Checklist Manifesto": http://atu
"It is common to misconceive how checklists function in complex lines of work. They are not comprehensive how-to guides, whether for building a skyscraper or getting a plane out of trouble. They are quick and simple tools aimed to buttress the skills of expert professionals." - Gawande, Atul. The Checklist Manifesto
--->
-### Quality [](https://sonarqube.forge.grandlyon.com/dashboard?id=ecolyo-mr) - [](https://sonarqube.forge.grandlyon.com/dashboard?id=ecolyo-mr)
+### Quality
+
+#### Bugs & smells summary
+
+_🔠Re-run Quality job to update_
+
+| Current MR | Dev |
+| ----------------------------------------- | ------------------------------------------- |
+| [![Bugs][bugs_mr]][dashboard_mr] | [![Bugs][bugs_dev]][dashboard_dev] |
+| [![Code Smells][smells_mr]][dashboard_mr] | [![Code Smells][smells_dev]][dashboard_dev] |
+
+#### Quality checklist
- For the code that this change impacts, I believe that the **automated tests validate functionality** that is **highly important to users**. If the existing automated tests do not cover this functionality, I have **added the necessary additional tests** or I have added an issue to describe the automation testing gap and linked it to this MR.
- I have made sure that the **sonar quality coverage is up to standards**.
@@ -55,4 +68,10 @@ More reading on checklists can be found in the "Checklist Manifesto": http://atu
- When featured on a self-data project release, I have made sure my **app version** in the manifest and package.json is **incremented** and any relative **changes to the permissions are clearly written and transmitted to Cozy**.
[conventional-commits]: https://www.conventionalcommits.org/en/v1.0.0/
-
+[conventional-comments]: https://conventionalcomments.org/
+[bugs_mr]: https://sonarqube.forge.grandlyon.com/api/project_badges/measure?project=ecolyo-mr&metric=bugs&token=3d678f5d0b1736ae2a81986f8bf3bcb32672231c
+[bugs_dev]: https://sonarqube.forge.grandlyon.com/api/project_badges/measure?project=ecolyo&metric=bugs&token=95187318baacb2c9aeab7c8f3046b4b66f08e9b1
+[smells_mr]: https://sonarqube.forge.grandlyon.com/api/project_badges/measure?project=ecolyo-mr&metric=code_smells&token=3d678f5d0b1736ae2a81986f8bf3bcb32672231c
+[smells_dev]: https://sonarqube.forge.grandlyon.com/api/project_badges/measure?project=ecolyo&metric=code_smells&token=95187318baacb2c9aeab7c8f3046b4b66f08e9b1
+[dashboard_mr]: https://sonarqube.forge.grandlyon.com/dashboard?id=ecolyo-mr
+[dashboard_dev]: https://sonarqube.forge.grandlyon.com/dashboard?id=ecolyo
diff --git a/.vscode/settings.json b/.vscode/settings.json
index dcb2207f4c2d3818afac11c4d71708ec949624ff..05e6af9250fc4b9fd60692e0446e043566a187b8 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -80,15 +80,18 @@
"eglgrandlyon",
"elec",
"élec",
+ "emas",
"enedis",
"Enedis",
"ENEDIS",
"enedissgegrandlyon",
+ "energical",
"Epgl",
"esnext",
"firstname",
"fluidchart",
"fluidchartslide",
+ "FLUIDNAME",
"fluidsprices",
"fluidtype",
"Folinge",
@@ -100,12 +103,14 @@
"grdfgrandlyon",
"Hypervitesse",
"késako",
+ "kmodal",
"Konnected",
"konnector",
"konnectors",
"l'ADEME",
"L’embouage",
"lastname",
+ "Lato",
"legalnotice",
"llle",
"Lugdunum",
@@ -124,6 +129,7 @@
"notif",
"numerique",
"oeufs",
+ "pefs",
"picto",
"Picto",
"PIV'EAU",
@@ -133,10 +139,10 @@
"PROFILETYPE",
"pseudonymisées",
"reduxjs",
- "Reinit",
"sendmail",
"SHARAPOWATT",
"shortcodes",
+ "Smartmeter",
"splashscreen",
"swipeable",
"Swipeable",
@@ -146,12 +152,13 @@
"timestep",
"TIMESTEP",
"timesteps",
- "UNCOMING",
"Unstarted",
"UNSTARTED",
"usageevent",
"Usain",
- "userchallenge"
+ "userchallenge",
+ "weektype"
],
- "typescript.tsdk": "node_modules/typescript/lib"
+ "typescript.tsdk": "node_modules/typescript/lib",
+ "conventionalCommits.scopes": ["ui", "ecogestures"]
}
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 89bf774603d7414a071f1b960bf21a70dfabcd8f..2f0e8b35159a5bf4f79e079474c983f1699f2006 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,40 @@
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+## [3.0.0](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/compare/v2.8.0...v3.0.0) (2024-05-29)
+
+
+### âš BREAKING CHANGES
+
+* **grdf:** update login method ([c0709f7](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/c0709f7031caab19d41b49b50a3147b496f43666))
+* **grdf:** update error messages
+
+### Features
+
+* **analysis:** add monthly average temperature comparison ([c64756f](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/c64756f1774957567c93cafa91da99034611d5a7))
+* **analysis:** change text order in modal ([c976b9b](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/c976b9b4ed546cece976bbb8758b42045a9aa4cc))
+* **analysis:** Make monthly summary button clickable ([4f966f6](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/4f966f60f54bf3cc0a9b68db35dcdfbb44941650))
+* **ecogesture/profile:** add "garden" equipment ([87e6ff1](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/87e6ff137131fb3d0461f4c315b5c9fed90cf425))
+* **ecogestures:** rework ecogesture order and add score ([f9d847e](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/f9d847e0291db0791ce8179bc28903b8aeb458c0))
+* GRDF consent email ([819af22](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/819af22356342b33c0e8dfbcc843caaa5ffc4f3a))
+* **grdf:** update error messages ([dfecbc3](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/dfecbc306aaac9dd8faca7e16be062aaa250c795))
+* **UI:** Use MaterialUI components for input fields ([71e3907](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/71e39078187079fef9b8fb680731cd9ede079dcc))
+
+
+### Bug Fixes
+
+* **accessibility:** SAU Link ([79d628a](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/79d628a8cc0f755cb146d9b971904f758b60e36b))
+* add wait consent modal ([017eeeb](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/017eeeb18ec5e5c3a745667ffe0fdca4c70bbeae))
+* **alt:** correct alt for logo des financeurs ([7d53753](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/7d537539aac484ade9e1e12c3f8f06dc375bf0da))
+* **analysis:** update order of "plus d'infos" modal ([c76d94b](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/c76d94beb1becb502f72b8ecf2f8c9f246da7967))
+* **deps:** update dependency cozy-keys-lib & cozy-ui ([4824e44](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/4824e4437fc7e08f19c334b45617c2cc49497c76))
+* **deps:** update dependency cozy-ui to v86 ([6073651](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/60736513aafd1d29e4f49242701e9e13d1323675))
+* **dju:** use dju sum instead of average ([966a404](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/966a4040edfd708f5e9f9ad120e9f2ccb77482fe))
+* **electricity:** remove loader delay ([de28d30](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/de28d30382e5e20bbbb27ba09c670f869d844570))
+* **equipments:** rename "Garden" to "Extérieur" ([df55664](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/df5566437798e09ea815a206a60dcc892a1d029b))
+* render "0" on analysis view ([f311a7f](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/f311a7f87ca9b1459fefb00fada394525f32a01e))
+* **UI:** center ecogesture content ([c48af14](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/commit/c48af14054390a87b03be99202837cdc1db1c753))
+
## [2.8.0](https://forge.grandlyon.com/web-et-numerique/factory/llle_project/ecolyo/compare/v2.7.2...v2.8.0) (2024-02-28)
diff --git a/app.config.environment.alpha.js b/app.config.environment.alpha.js
index 346a1c982aca46a5971ea7cfa8d91eceb0b32876..e3fe4c88a600f589777550e4dd9136b5ac6fabd2 100644
--- a/app.config.environment.alpha.js
+++ b/app.config.environment.alpha.js
@@ -19,22 +19,25 @@ module.exports = {
__STACK_ASSETS__: target !== 'mobile',
__PIWIK_TRACKER_URL__: JSON.stringify('https://statweb.grandlyon.com/'),
__PIWIK_SITEID__: 117,
- __SENTRY_DSN__: JSON.stringify(
- 'https://c868f6010f3f431d95be8f70d7f37666@grandlyon.errors.cozycloud.cc/6'
- ),
__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/'
),
+ __SAU_ISSUE_DIRECT_LINK__: JSON.stringify(
+ 'https://demarches-sau.guichet-recette.grandlyon.com/retour-ecolyo/ecolyo-un-probleme/'
+ ),
+ __SENTRY_DSN__: JSON.stringify(
+ 'https://c868f6010f3f431d95be8f70d7f37666@grandlyon.errors.cozycloud.cc/6'
+ ),
}),
],
optimization: {
minimizer: [
new TerserPlugin({
parallel: true,
- //To fix a SAfari 10 bug : https://github.com/zeit/next.js/issues/5630
+ // To fix a SAfari 10 bug : https://github.com/zeit/next.js/issues/5630
terserOptions: {
safari10: true,
},
diff --git a/app.config.environment.dev.js b/app.config.environment.dev.js
index 120aa2a2de67d54d8631f0eddd1dfe898241a24d..e8326334e093c0ec4fe7b203e422945e81ce0fe3 100644
--- a/app.config.environment.dev.js
+++ b/app.config.environment.dev.js
@@ -29,6 +29,9 @@ const stackProvidedLibsConfig = {
__SAU_IDEA_DIRECT_LINK__: JSON.stringify(
'https://demarches-sau.guichet-recette.grandlyon.com/retour-ecolyo/ecolyo-une-idee/'
),
+ __SAU_ISSUE_DIRECT_LINK__: JSON.stringify(
+ 'https://demarches-sau.guichet-recette.grandlyon.com/retour-ecolyo/ecolyo-un-probleme/'
+ ),
__SENTRY_DSN__: JSON.stringify(
'https://c868f6010f3f431d95be8f70d7f37666@grandlyon.errors.cozycloud.cc/6'
),
diff --git a/app.config.environment.prod.js b/app.config.environment.prod.js
index 6688983f2ee64a0289d0d71c5b218a6b26440948..b6b24c48cda1b9a04270be6e6f9e13af064f1fd7 100644
--- a/app.config.environment.prod.js
+++ b/app.config.environment.prod.js
@@ -23,6 +23,9 @@ module.exports = {
__SAU_IDEA_DIRECT_LINK__: JSON.stringify(
'https://demarches-support.grandlyon.com/retour-ecolyo/ecolyo-une-idee/'
),
+ __SAU_ISSUE_DIRECT_LINK__: JSON.stringify(
+ 'https://demarches-support.grandlyon.com/retour-ecolyo/ecolyo-un-probleme/'
+ ),
__SENTRY_DSN__: JSON.stringify(
'https://c868f6010f3f431d95be8f70d7f37666@grandlyon.errors.cozycloud.cc/6'
),
@@ -32,7 +35,7 @@ module.exports = {
minimizer: [
new TerserPlugin({
parallel: true,
- //To fix a SAfari 10 bug : https://github.com/zeit/next.js/issues/5630
+ // To fix a SAfari 10 bug : https://github.com/zeit/next.js/issues/5630
terserOptions: {
safari10: true,
},
diff --git a/docker-compose.yml b/docker-compose.yml
index 433d83f83864603c200994c79a92e1c500e84789..8c1efdd2da0f04e18b7627d5f0066e2f06df11f1 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,7 +1,6 @@
-version: '3.7'
services:
stack:
- image: registry.forge.grandlyon.com/web-et-numerique/factory/llle_project/cozy-stack:1.5.8
+ image: registry.forge.grandlyon.com/web-et-numerique/factory/llle_project/cozy-stack:1.6.26
container_name: cozy-stack
depends_on:
- cozy-db
@@ -16,7 +15,7 @@ services:
- ./docker/cozy.yaml:/etc/cozy/cozy.yaml
cozy-db:
- image: couchdb:3.2.2
+ image: couchdb:3.3.3
container_name: cozy-db
volumes:
- ./data/db:/opt/couchdb/data
diff --git a/docker/docker-compose.matomo.yml b/docker/docker-compose.matomo.yml
index a0a90254efbabe79f3c8bc443e950f93537fd7e4..0b2ecaaf3cbe87b8b1fb1ee8d7e441a7a49dfa86 100644
--- a/docker/docker-compose.matomo.yml
+++ b/docker/docker-compose.matomo.yml
@@ -1,5 +1,3 @@
-version: '3.8'
-
services:
db:
image: mariadb
diff --git a/manifest.webapp b/manifest.webapp
index 37f256c9d8be3c63a3d719a68302624c8180dee5..e7c27f575ada5bc6d2a2e428ca9122afe9ac1abf 100644
--- a/manifest.webapp
+++ b/manifest.webapp
@@ -3,7 +3,7 @@
"slug": "ecolyo",
"icon": "public/icon.svg",
"categories": ["energy"],
- "version": "2.8.0",
+ "version": "3.0.0",
"licence": "AGPL-3.0",
"editor": "Métropole de Lyon",
"default_locale": "fr",
@@ -109,13 +109,13 @@
"description": "Required for the correct functioning of the energy and water connectors."
},
"terms": {
- "description": "Required for the correct managment of CGU."
+ "description": "Required for the correct management of CGU."
},
"apps": {
"description": "Required to display the icons of installed applications in the Cozy bar."
},
"settings": {
- "description": "Required for the application's consents managment"
+ "description": "Required for the application's consents management"
},
"ecolyo-dju": {
"description": "Required to gather udd data (Unified Degree Days), a meteorological data allowing the app to adjust our energical consumption model. "
@@ -243,6 +243,10 @@
"type": "org.ecolyo.dju_v3",
"verbs": ["GET"]
},
+ "ecolyo-avg-temperature": {
+ "type": "org.ecolyo.avg_temperature",
+ "verbs": ["GET"]
+ },
"dacc": {
"type": "cc.cozycloud.dacc_v2",
"verbs": ["ALL"]
diff --git a/package.json b/package.json
index 2a58e3818da63ee5b0aa447af6bd0074946b757c..c79571eea90539606c69b782f663f62429383ad0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "ecolyo",
- "version": "2.8.0",
+ "version": "3.0.0",
"engines": {
"node": "16"
},
@@ -59,7 +59,7 @@
"cozy-logger": ">1.7.0",
"cozy-realtime": "4.2.8",
"cozy-scripts": "8.1",
- "cozy-ui": "81.9.0",
+ "cozy-ui": "^86.0.0",
"d3": "^6.0.0",
"detect-browser": "^5.1.1",
"file-saver": "^2.0.5",
@@ -85,9 +85,9 @@
"devDependencies": {
"@babel/preset-typescript": "^7.7.4",
"@testing-library/dom": "^9.3.3",
- "@testing-library/jest-dom": "^6.1.4",
- "@testing-library/react": "^14.1.2",
- "@testing-library/user-event": "^14.5.1",
+ "@testing-library/jest-dom": "^6.4.2",
+ "@testing-library/react": "^14.3.0",
+ "@testing-library/user-event": "^14.5.2",
"@types/d3": "^6.0.0",
"@types/file-saver": "^2.0.5",
"@types/history": "^5.0.0",
diff --git a/scripts/createConnections.js b/scripts/createConnections.js
index 728531c3b77fe2b8c8aaeabd37294406c72348a5..80a42cca29c97e4b56491e2be571224144e4e3ff 100644
--- a/scripts/createConnections.js
+++ b/scripts/createConnections.js
@@ -9,7 +9,11 @@ const headers = {
'content-type': 'application/json',
}
+const COZY_PREFIX = 'cozy35ba44d2d1749e6f21646edce51e7190'
+
+const ENEDIS_ACCOUNT_ID = '70e68b8450cee09fe2f077610901094d'
const dataEnedisAccount = JSON.stringify({
+ id: ENEDIS_ACCOUNT_ID,
account_type: 'enedissgegrandlyon',
name: '',
auth: {
@@ -25,31 +29,32 @@ const dataEnedisAccount = JSON.stringify({
expirationDate: '2023-09-26',
offPeakHours: '22H00-6H00',
},
- id: '70e68b8450cee09fe2f077610901094d',
identifier: 'address',
state: null,
})
+const GRDF_ACCOUNT_ID = '89e68b8450cee09fe2f077610901094d'
const dataGrdfAccount = JSON.stringify({
+ id: GRDF_ACCOUNT_ID,
account_type: 'grdfgrandlyon',
auth: {
credentials_encrypted:
'bmFjbMKrNCS+4Liakxdu+xNu9I3sSyvda8iAp0o3U3OAymbIeoLhLtxPdsa+3mu/8yTnDudBcJo=',
login: 'test',
},
- id: '89e68b8450cee09fe2f077610901094d',
identifier: 'login',
state: null,
})
+const EGL_ACCOUNT_ID = '90e68b8450cee09fe2f077610901094d'
const dataEglAccount = JSON.stringify({
+ id: EGL_ACCOUNT_ID,
account_type: 'eglgrandlyon',
auth: {
credentials_encrypted:
'bmFjbHI5OoL+VNCT6JDFYea1dNiBGGNJM1zY0M4uWcjhALJcQT9uk9p9WPD7+1OryCAoYf9eaSE=',
login: 'test',
},
- id: '90e68b8450cee09fe2f077610901094d',
identifier: 'login',
state: null,
})
@@ -59,14 +64,14 @@ const dataEnedisTrigger = JSON.stringify({
attributes: {
_id: '3ed832cec67e6e0b2c6382edd30df11c',
domain: 'cozy.tools:8080',
- prefix: 'cozy35ba44d2d1749e6f21646edce51e7190',
+ prefix: COZY_PREFIX,
type: '@cron',
worker: 'konnector',
arguments: '0 47 8 * * *',
debounce: '',
options: null,
message: {
- account: '70e68b8450cee09fe2f077610901094d',
+ account: ENEDIS_ACCOUNT_ID,
konnector: 'enedissgegrandlyon',
},
cozyMetadata: {
@@ -85,14 +90,14 @@ const dataGrdfTrigger = JSON.stringify({
attributes: {
_id: '4ed832cec67e6e0b2c6382edd30df11c',
domain: 'cozy.tools:8080',
- prefix: 'cozy35ba44d2d1749e6f21646edce51e7190',
+ prefix: COZY_PREFIX,
type: '@cron',
worker: 'konnector',
arguments: '0 47 8 * * *',
debounce: '',
options: null,
message: {
- account: '89e68b8450cee09fe2f077610901094d',
+ account: GRDF_ACCOUNT_ID,
konnector: 'grdfgrandlyon',
},
cozyMetadata: {
@@ -111,14 +116,14 @@ const dataEglTrigger = JSON.stringify({
attributes: {
_id: '5ed832cec67e6e0b2c6382edd30df11c',
domain: 'cozy.tools:8080',
- prefix: 'cozy35ba44d2d1749e6f21646edce51e7190',
+ prefix: COZY_PREFIX,
type: '@cron',
worker: 'konnector',
arguments: '0 47 8 * * *',
debounce: '',
options: null,
message: {
- account: '90e68b8450cee09fe2f077610901094d',
+ account: EGL_ACCOUNT_ID,
konnector: 'eglgrandlyon',
},
cozyMetadata: {
@@ -136,7 +141,7 @@ async function launch() {
// Enedis
await axios({
method: 'put',
- url: 'http://cozy.tools:8080/data/io.cozy.accounts/70e68b8450cee09fe2f077610901094d',
+ url: `http://cozy.tools:8080/data/io.cozy.accounts/${ENEDIS_ACCOUNT_ID}`,
headers: headers,
data: dataEnedisAccount,
})
@@ -163,7 +168,7 @@ async function launch() {
// GRDF
await axios({
method: 'put',
- url: 'http://cozy.tools:8080/data/io.cozy.accounts/89e68b8450cee09fe2f077610901094d',
+ url: `http://cozy.tools:8080/data/io.cozy.accounts/${GRDF_ACCOUNT_ID}`,
headers: headers,
data: dataGrdfAccount,
})
@@ -190,7 +195,7 @@ async function launch() {
// EGL
await axios({
method: 'put',
- url: 'http://cozy.tools:8080/data/io.cozy.accounts/90e68b8450cee09fe2f077610901094d',
+ url: `http://cozy.tools:8080/data/io.cozy.accounts/${EGL_ACCOUNT_ID}`,
headers: headers,
data: dataEglAccount,
})
diff --git a/src/assets/icons/ico/exclamationMark.svg b/src/assets/icons/ico/exclamationMark.svg
new file mode 100644
index 0000000000000000000000000000000000000000..987c0f422467e601221a6d5cc1cc389f30716d69
--- /dev/null
+++ b/src/assets/icons/ico/exclamationMark.svg
@@ -0,0 +1,28 @@
+<svg
+ viewBox="0 0 16 16"
+ version="1.1"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg">
+ <circle
+ cx="7.8000002"
+ cy="7.8000002"
+ r="7.3000002"
+ id="circle2"
+ style="fill:none;" />
+ <rect
+ x="7.1999998"
+ y="7.1999998"
+ width="1.2"
+ height="5.4000001"
+ rx="0.60000002"
+ id="rect4"
+ style="fill:#1b1c22" />
+ <rect
+ x="7.1999998"
+ y="3.5999904"
+ width="1.2"
+ height="1.8"
+ rx="0.60000002"
+ id="rect6"
+ style="fill:#1b1c22" />
+</svg>
diff --git a/src/assets/icons/ico/switchGRDFDesktop.svg b/src/assets/icons/ico/switchGRDFDesktop.svg
deleted file mode 100644
index 19bf66996ba838fb3c52f3c98e82856a711a8543..0000000000000000000000000000000000000000
--- a/src/assets/icons/ico/switchGRDFDesktop.svg
+++ /dev/null
@@ -1,45 +0,0 @@
-<svg width="335" height="256" viewBox="0 0 335 256" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g opacity="0.55" filter="url(#filter0_f)">
-<rect x="18" y="18" width="299" height="220" rx="2" fill="#121212"/>
-</g>
-<rect x="18" y="18" width="299" height="220" rx="4" fill="white"/>
-<rect x="273" y="73" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="292.5" cy="75.5" r="7.5" fill="#01B1AE"/>
-<rect x="273" y="96" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="292.5" cy="98.5" r="7.5" fill="#01B1AE"/>
-<rect x="273" y="119" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="292.5" cy="121.5" r="7.5" fill="#01B1AE"/>
-<rect width="24" height="6" rx="3" transform="matrix(-1 0 0 1 300 160)" fill="#D5D5D5"/>
-<circle r="7.5" transform="matrix(-1 0 0 1 280.5 162.5)" fill="#AEAEAE"/>
-<rect x="273" y="183" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="292.5" cy="185.5" r="7.5" fill="#01B1AE"/>
-<rect width="24" height="6" rx="3" transform="matrix(-1 0 0 1 300 206)" fill="#D5D5D5"/>
-<circle r="7.5" transform="matrix(-1 0 0 1 280.5 208.5)" fill="#AEAEAE"/>
-<path d="M32 77L41.0476 73L40.0423 77L48.5873 73L47.0794 77L57.1323 73L55.6243 77L67.1852 73L64.672 77L75.2275 73L73.7196 77L84.7778 73L82.2645 77L92.3175 73L91.3122 77L101.365 73L99.3545 77L109.91 73L107.899 77L118.455 73L115.942 77L127 73" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M127.005 73L126 77L134.545 73L133.037 77L143.09 73L141.582 77L153.143 73L150.63 77L161.185 73L159.677 77L170.735 73L168.222 77L178.275 73L177.27 77L187.323 73L185.312 77L195.868 73L193.857 77L204.413 73L201.899 77L212.958 73" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M75.0053 95L74 99L82.545 95L81.037 99L91.0899 95L89.582 99L101.143 95L98.6296 99L109.185 95L107.677 99L118.735 95L116.222 99L126.275 95L125.27 99L135.323 95L133.312 99L143.868 95L141.857 99L152.413 95L149.899 99L160.958 95" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M102.005 117L101 121L109.545 117L108.037 121L118.09 117L116.582 121L128.143 117L125.63 121L136.185 117L134.677 121L145.735 117L143.222 121L153.275 117L152.27 121L162.323 117L160.312 121L170.868 117L168.857 121L179.413 117L176.899 121L187.958 117" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M93.0053 161L92 165L100.545 161L99.037 165L109.09 161L107.582 165L119.143 161L116.63 165L127.185 161L125.677 165L136.735 161L134.222 165L144.275 161L143.27 165L153.323 161L151.312 165L161.868 161L159.857 165L170.413 161L167.899 165L178.958 161" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M119.005 183L118 187L126.545 183L125.037 187L135.09 183L133.582 187L145.143 183L142.63 187L153.185 183L151.677 187L162.735 183L160.222 187L170.275 183L169.27 187L179.323 183L177.312 187L187.868 183L185.857 187L196.413 183L193.899 187L204.958 183" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M102.005 207L101 211L109.545 207L108.037 211L118.09 207L116.582 211L128.143 207L125.63 211L136.185 207L134.677 211L145.735 207L143.222 211L153.275 207L152.27 211L162.323 207L160.312 211L170.868 207L168.857 211L179.413 207L176.899 211L187.958 207" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 99L41.0476 95L40.0423 99L48.5873 95L47.0794 99L57.1323 95L55.6243 99L67.1852 95L64.672 99L75.2275 95" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 121L41.0476 117L40.0423 121L48.5873 117L47.0794 121L57.1323 117L55.6243 121L67.1852 117L64.672 121L75.2275 117L73.7196 121L84.7778 117L82.2645 121L92.3175 117L91.3122 121L101.365 117" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 187L41.0476 183L40.0423 187L48.5873 183L47.0794 187L57.1323 183L55.6243 187L67.1852 183L64.672 187L75.2275 183L73.7196 187L84.7778 183L82.2645 187L92.3175 183L91.3122 187L101.365 183L99.3545 187L109.91 183L107.899 187L118.455 183" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 211L41.0476 207L40.0423 211L48.5873 207L47.0794 211L57.1323 207L55.6243 211L67.1852 207L64.672 211L75.2275 207L73.7196 211L84.7778 207L82.2645 211L92.3175 207L91.3122 211L101.365 207" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 165L41.0476 161L40.0423 165L48.5873 161L47.0794 165L57.1323 161L55.6243 165L67.1852 161L64.672 165L75.2275 161L73.7196 165L84.7778 161L82.2645 165L92.3175 161" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M18 22C18 19.7909 19.7909 18 22 18H313C315.209 18 317 19.7909 317 22V51H18V22Z" fill="#01B1AE"/>
-<path d="M39.1588 34.7091C39.8892 34.7428 39.9893 35.3904 40.0013 35.5602V38.9181C39.9847 38.9392 39.9681 38.9607 39.9512 38.9824C39.879 39.0754 39.8038 39.1722 39.7258 39.2592C39.5829 39.4159 39.3546 39.6577 39.2689 39.739C37.6995 41.2258 35.8554 41.7672 34.1354 41.7672C32.7216 41.7672 30.7763 41.3212 29.1192 39.7359C26.308 37.0351 26.2798 32.7103 29.1177 30.0352C29.6434 29.5431 29.847 29.3592 30.6836 28.8848C31.8382 28.2276 33.1469 28 34.2041 28C35.1323 28 36.1486 28.2004 36.9095 28.5143C37.0868 28.5859 37.2869 28.6714 37.5384 28.8162C38.2117 29.2048 39.0951 29.8861 39.5366 30.9633V30.9683H31.2333V36.0008C31.2963 36.8979 31.4917 37.6099 32.0437 38.1104C32.4895 38.5162 33.1704 38.7821 34.2041 38.8867C34.5351 38.9224 34.906 38.9396 35.3177 38.9396L37.1224 38.9354C37.1054 38.9296 37.037 38.8867 36.7867 38.5763C36.4754 38.1859 36.4055 37.5175 36.4055 37.0182H36.4039V34.7083L39.1588 34.7091Z" fill="white"/>
-<path d="M65.3996 28.028V34.7739C66.0084 34.2753 66.9752 34.109 68.4898 34.0113L68.4863 30.971H70.9051C72.1771 30.9139 75.0058 30.536 75 28.028H65.3996Z" fill="white"/>
-<path d="M55.13 46.6042C55.13 46.8241 54.948 47 54.7286 47H47.3261C47.1083 47 46.931 46.8241 46.931 46.6042V45.4683C46.931 45.2495 47.1083 45.0717 47.3261 45.0717H54.7286C54.948 45.0717 55.13 45.2495 55.13 45.4683V46.6042Z" fill="white"/>
-<path d="M72.7146 33.934H73.3554C73.3554 33.934 73.3539 34.3901 73.3539 34.5682C73.3539 35.9688 72.1167 36.6789 69.6824 36.6789H68.4865V38.9988C68.4865 39.8154 68.291 41.7 66.4358 41.7395H65.3994V38.3412C65.693 34.4196 70.8991 33.9762 72.7146 33.934Z" fill="white"/>
-<path d="M58.6291 28.0314L51.8945 28.0291V41.7392C54.2418 41.4511 55.1001 40.3455 55.2245 38.7158V30.9694H58.1849C58.2213 30.9718 58.2627 30.9741 58.3043 30.9764C58.3758 30.9803 58.448 30.9843 58.4966 30.9889C59.9011 31.1552 60.7961 31.7676 60.8869 34.5784C60.8973 34.6884 60.894 34.8121 60.891 34.9245C60.8897 34.9741 60.8884 35.0216 60.8884 35.0646C60.8162 39.6182 57.3235 41.0127 55.3887 41.5216L55.3786 41.525C55.3555 41.5346 55.3389 41.5461 55.3389 41.5695V41.6921C55.3389 41.717 55.3586 41.7358 55.3786 41.7385L55.3852 41.7392H55.6119C58.4321 41.7392 64.0999 41.0591 64.0999 34.9144V34.8022C64.0666 29.4768 61.7536 28.0314 58.6291 28.0314Z" fill="white"/>
-<path d="M46.0177 30.9822L44.4259 30.9691C44.3243 30.9691 44.2254 30.9649 44.1242 30.9576C42.1623 30.8185 41.0414 29.3352 40.5844 28.5573C40.4797 28.3979 40.3801 28.2342 40.2858 28.0614C40.2858 28.0614 40.2762 28.0281 40.2924 28.0281H44.8453C46.3688 28.0281 47.0034 28.1216 47.6779 28.3837C47.837 28.4427 48.0027 28.5155 48.1785 28.5964C49.1561 29.0524 49.8186 29.8693 50.0836 30.9174C50.123 31.0619 50.1481 31.2163 50.1697 31.3707C50.1994 31.5742 50.2164 31.7861 50.2164 32.0053C50.2195 33.6351 49.4014 34.5643 48.2696 35.215C48.2681 35.2177 48.2495 35.2284 48.2495 35.2284C48.2341 35.2342 48.2341 35.2342 48.2252 35.2414C48.2127 35.2475 48.2016 35.2542 48.1912 35.2605C48.1846 35.2644 48.1782 35.2683 48.1719 35.2717C48.1684 35.2717 48.1518 35.284 48.1518 35.284C48.0197 35.3499 47.8899 35.3905 47.769 35.42C47.75 35.4239 47.7318 35.4288 47.7147 35.4333C47.6999 35.4373 47.6858 35.4411 47.6728 35.4438V32.2337C47.6311 31.2443 46.7535 30.9856 46.2487 30.9856C46.2327 30.9856 46.2162 30.9858 46.1992 30.986C46.144 30.9865 46.0836 30.9871 46.0177 30.9822Z" fill="white"/>
-<path d="M42.635 34.7091C41.8679 34.7386 41.7937 35.4402 41.7849 35.5778V37.6479H44.6661C44.9089 38.0019 45.1505 38.3524 45.3752 38.6783L45.6306 39.0488C45.955 39.5121 46.2664 39.9494 46.3958 40.1168C46.4046 40.1284 46.4149 40.1429 46.4269 40.1598C46.5904 40.3898 47.0831 41.0827 48.7845 41.4971C49.4069 41.6479 50.0927 41.6928 50.4763 41.7179C50.5458 41.7224 50.6058 41.7263 50.6533 41.7301L50.824 41.7385L50.8058 41.7056C50.8058 41.7056 50.4976 41.2817 50.1082 40.6134L50.0234 40.4677C49.4873 39.5466 47.6691 36.4226 47.3201 35.8127C47.0057 35.2628 46.5051 35.018 45.9929 34.8693H45.9879C45.6209 34.7681 45.218 34.7294 44.9164 34.7141C44.903 34.7135 44.89 34.7127 44.877 34.7119C44.8542 34.7105 44.8316 34.7091 44.8082 34.7091H42.635Z" fill="white"/>
-<defs>
-<filter id="filter0_f" x="0" y="0" width="335" height="256" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="9" result="effect1_foregroundBlur"/>
-</filter>
-</defs>
-</svg>
diff --git a/src/assets/icons/ico/switchGRDFMobile.svg b/src/assets/icons/ico/switchGRDFMobile.svg
deleted file mode 100644
index 5b262e5689da1f088a42a6320e37882bc1e44c68..0000000000000000000000000000000000000000
--- a/src/assets/icons/ico/switchGRDFMobile.svg
+++ /dev/null
@@ -1,39 +0,0 @@
-<svg width="210" height="256" viewBox="0 0 210 256" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g opacity="0.55" filter="url(#filter0_f)">
-<rect x="18" y="18" width="174" height="220" rx="2" fill="#121212"/>
-</g>
-<rect x="18" y="18" width="174" height="220" rx="4" fill="white"/>
-<rect x="150" y="73" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="169.5" cy="75.5" r="7.5" fill="#01B1AE"/>
-<rect x="150" y="96" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="169.5" cy="98.5" r="7.5" fill="#01B1AE"/>
-<rect x="150" y="119" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="169.5" cy="121.5" r="7.5" fill="#01B1AE"/>
-<rect width="24" height="6" rx="3" transform="matrix(-1 0 0 1 177 160)" fill="#D5D5D5"/>
-<circle r="7.5" transform="matrix(-1 0 0 1 157.5 162.5)" fill="#AEAEAE"/>
-<rect x="150" y="183" width="24" height="6" rx="3" fill="#D5D5D5"/>
-<circle cx="169.5" cy="185.5" r="7.5" fill="#01B1AE"/>
-<rect width="24" height="6" rx="3" transform="matrix(-1 0 0 1 177 206)" fill="#D5D5D5"/>
-<circle r="7.5" transform="matrix(-1 0 0 1 157.5 208.5)" fill="#AEAEAE"/>
-<path d="M32 77L41.0476 73L40.0423 77L48.5873 73L47.0794 77L57.1323 73L55.6243 77L67.1852 73L64.672 77L75.2275 73L73.7196 77L84.7778 73L82.2645 77L92.3175 73L91.3122 77L101.365 73L99.3545 77L109.91 73L107.899 77L118.455 73L115.942 77L127 73" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 99L41.0476 95L40.0423 99L48.5873 95L47.0794 99L57.1323 95L55.6243 99L67.1852 95L64.672 99L75.2275 95" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 121L41.0476 117L40.0423 121L48.5873 117L47.0794 121L57.1323 117L55.6243 121L67.1852 117L64.672 121L75.2275 117L73.7196 121L84.7778 117L82.2645 121L92.3175 117L91.3122 121L101.365 117" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 187L41.0476 183L40.0423 187L48.5873 183L47.0794 187L57.1323 183L55.6243 187L67.1852 183L64.672 187L75.2275 183L73.7196 187L84.7778 183L82.2645 187L92.3175 183L91.3122 187L101.365 183L99.3545 187L109.91 183L107.899 187L118.455 183" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 210L41.0476 207L40.0423 210L48.5873 207L47.0794 210L57.1323 207L55.6243 210L67.1852 207L64.672 210L75.2275 207L73.7196 210L84.7778 207L82.2645 210L92.3175 207L91.3122 210L101.365 207" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M32 165L41.0476 161L40.0423 165L48.5873 161L47.0794 165L57.1323 161L55.6243 165L67.1852 161L64.672 165L75.2275 161L73.7196 165L84.7778 161L82.2645 165L92.3175 161" stroke="#878787" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M18 22C18 19.7909 19.7909 18 22 18H188C190.209 18 192 19.7909 192 22V51H18V22Z" fill="#01B1AE"/>
-<path d="M39.1588 34.7091C39.8892 34.7428 39.9893 35.3904 40.0013 35.5602V38.9181C39.9847 38.9392 39.9681 38.9607 39.9512 38.9824C39.879 39.0754 39.8038 39.1722 39.7258 39.2592C39.5829 39.4159 39.3546 39.6577 39.2689 39.739C37.6995 41.2258 35.8554 41.7672 34.1354 41.7672C32.7216 41.7672 30.7763 41.3212 29.1192 39.7359C26.308 37.0351 26.2798 32.7103 29.1177 30.0352C29.6434 29.5431 29.847 29.3592 30.6836 28.8848C31.8382 28.2276 33.1469 28 34.2041 28C35.1323 28 36.1486 28.2004 36.9095 28.5143C37.0868 28.5859 37.2869 28.6714 37.5384 28.8162C38.2117 29.2048 39.0951 29.8861 39.5366 30.9633V30.9683H31.2333V36.0008C31.2963 36.8979 31.4917 37.6099 32.0437 38.1104C32.4895 38.5162 33.1704 38.7821 34.2041 38.8867C34.5351 38.9224 34.906 38.9396 35.3177 38.9396L37.1224 38.9354C37.1054 38.9296 37.037 38.8867 36.7867 38.5763C36.4754 38.1859 36.4055 37.5175 36.4055 37.0182H36.4039V34.7083L39.1588 34.7091Z" fill="white"/>
-<path d="M65.3996 28.028V34.7739C66.0084 34.2753 66.9752 34.109 68.4898 34.0113L68.4863 30.971H70.9051C72.1771 30.9139 75.0058 30.536 75 28.028H65.3996Z" fill="white"/>
-<path d="M55.13 46.6042C55.13 46.8241 54.948 47 54.7286 47H47.3261C47.1083 47 46.931 46.8241 46.931 46.6042V45.4683C46.931 45.2495 47.1083 45.0717 47.3261 45.0717H54.7286C54.948 45.0717 55.13 45.2495 55.13 45.4683V46.6042Z" fill="white"/>
-<path d="M72.7146 33.934H73.3554C73.3554 33.934 73.3539 34.3901 73.3539 34.5682C73.3539 35.9688 72.1167 36.6789 69.6824 36.6789H68.4865V38.9988C68.4865 39.8154 68.291 41.7 66.4358 41.7395H65.3994V38.3412C65.693 34.4196 70.8991 33.9762 72.7146 33.934Z" fill="white"/>
-<path d="M58.6291 28.0314L51.8945 28.0291V41.7392C54.2418 41.4511 55.1001 40.3455 55.2245 38.7158V30.9694H58.1849C58.2213 30.9718 58.2627 30.9741 58.3043 30.9764C58.3758 30.9803 58.448 30.9843 58.4966 30.9889C59.9011 31.1552 60.7961 31.7676 60.8869 34.5784C60.8973 34.6884 60.894 34.8121 60.891 34.9245C60.8897 34.9741 60.8884 35.0216 60.8884 35.0646C60.8162 39.6182 57.3235 41.0127 55.3887 41.5216L55.3786 41.525C55.3555 41.5346 55.3389 41.5461 55.3389 41.5695V41.6921C55.3389 41.717 55.3586 41.7358 55.3786 41.7385L55.3852 41.7392H55.6119C58.4321 41.7392 64.0999 41.0591 64.0999 34.9144V34.8022C64.0666 29.4768 61.7536 28.0314 58.6291 28.0314Z" fill="white"/>
-<path d="M46.0177 30.9822L44.4259 30.9691C44.3243 30.9691 44.2254 30.9649 44.1242 30.9576C42.1623 30.8185 41.0414 29.3352 40.5844 28.5573C40.4797 28.3979 40.3801 28.2342 40.2858 28.0614C40.2858 28.0614 40.2762 28.0281 40.2924 28.0281H44.8453C46.3688 28.0281 47.0034 28.1216 47.6779 28.3837C47.837 28.4427 48.0027 28.5155 48.1785 28.5964C49.1561 29.0524 49.8186 29.8693 50.0836 30.9174C50.123 31.0619 50.1481 31.2163 50.1697 31.3707C50.1994 31.5742 50.2164 31.7861 50.2164 32.0053C50.2195 33.6351 49.4014 34.5643 48.2696 35.215C48.2681 35.2177 48.2495 35.2284 48.2495 35.2284C48.2341 35.2342 48.2341 35.2342 48.2252 35.2414C48.2127 35.2475 48.2016 35.2542 48.1912 35.2605C48.1846 35.2644 48.1782 35.2683 48.1719 35.2717C48.1684 35.2717 48.1518 35.284 48.1518 35.284C48.0197 35.3499 47.8899 35.3905 47.769 35.42C47.75 35.4239 47.7318 35.4288 47.7147 35.4333C47.6999 35.4373 47.6858 35.4411 47.6728 35.4438V32.2337C47.6311 31.2443 46.7535 30.9856 46.2487 30.9856C46.2327 30.9856 46.2162 30.9858 46.1992 30.986C46.144 30.9865 46.0836 30.9871 46.0177 30.9822Z" fill="white"/>
-<path d="M42.635 34.7091C41.8679 34.7386 41.7937 35.4402 41.7849 35.5778V37.6479H44.6661C44.9089 38.0019 45.1505 38.3524 45.3752 38.6783L45.6306 39.0488C45.955 39.5121 46.2664 39.9494 46.3958 40.1168C46.4046 40.1284 46.4149 40.1429 46.4269 40.1598C46.5904 40.3898 47.0831 41.0827 48.7845 41.4971C49.4069 41.6479 50.0927 41.6928 50.4763 41.7179C50.5458 41.7224 50.6058 41.7263 50.6533 41.7301L50.824 41.7385L50.8058 41.7056C50.8058 41.7056 50.4976 41.2817 50.1082 40.6134L50.0234 40.4677C49.4873 39.5466 47.6691 36.4226 47.3201 35.8127C47.0057 35.2628 46.5051 35.018 45.9929 34.8693H45.9879C45.6209 34.7681 45.218 34.7294 44.9164 34.7141C44.903 34.7135 44.89 34.7127 44.877 34.7119C44.8542 34.7105 44.8316 34.7091 44.8082 34.7091H42.635Z" fill="white"/>
-<defs>
-<filter id="filter0_f" x="0" y="0" width="210" height="256" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="9" result="effect1_foregroundBlur"/>
-</filter>
-</defs>
-</svg>
diff --git a/src/assets/icons/visu/equipments/OUTSIDE.svg b/src/assets/icons/visu/equipments/OUTSIDE.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5529a9c0e29e34e55646c5c1a670fb1c231f4529
--- /dev/null
+++ b/src/assets/icons/visu/equipments/OUTSIDE.svg
@@ -0,0 +1,6 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M25.7714 6.27598L25.6335 6.42525C25.0024 7.11492 24.6132 7.50794 24.292 7.76302C23.9865 7.36436 23.6835 6.96378 23.3831 6.5613C22.837 5.85463 22.3836 5.34257 21.9187 4.95145C21.3519 4.47152 20.7888 4.19565 20.1823 4.19565C19.863 4.19565 19.5531 4.27501 19.2546 4.4205C18.5233 4.77573 17.9111 5.44272 17.0911 6.58964C16.9872 6.73324 16.7283 7.10358 16.5734 7.32654L16.4543 7.4966L16.254 7.77435L16.2238 7.75168C15.8856 7.49282 15.4793 7.09791 14.8086 6.39691L14.6782 6.26087C13.6711 5.20275 13.3971 4.925 12.9758 4.58111C12.6319 4.30146 12.3352 4.12196 12.0121 4.0426C11.7173 3.96167 11.4027 3.9969 11.1331 4.14102C10.8634 4.28515 10.6594 4.52719 10.5629 4.81729C10.0481 6.24554 9.7866 7.75267 9.79007 9.27083C9.79007 16.2355 13.5993 21.0084 20.1823 21.0084C26.7653 21.0084 30.5745 16.2355 30.5745 9.27083C30.578 7.7525 30.3158 6.24527 29.7998 4.81729C29.7042 4.52714 29.5004 4.28497 29.2309 4.14107C28.9614 3.99716 28.6468 3.96258 28.3525 4.04449C28.0313 4.12574 27.7403 4.30902 27.4077 4.59244C26.9996 4.93822 26.7464 5.20653 25.7714 6.27409V6.27598Z" fill="#121212"/>
+<path d="M19 19.1333C19 18.8328 19.158 18.5445 19.4393 18.3319C19.7206 18.1194 20.1022 18 20.5 18C20.8978 18 21.2794 18.1194 21.5607 18.3319C21.842 18.5445 22 18.8328 22 19.1333V33.8667C22 34.1672 21.842 34.4555 21.5607 34.6681C21.2794 34.8806 20.8978 35 20.5 35C20.1022 35 19.7206 34.8806 19.4393 34.6681C19.158 34.4555 19 34.1672 19 33.8667V19.1333Z" fill="#121212"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M31.3446 26.7304C31.2269 26.6705 30.8617 26.5428 30.0185 26.6696C28.8316 26.8482 27.2528 27.4993 25.6937 28.7196C24.1346 29.9399 23.1233 31.316 22.6648 32.4252C22.3391 33.2132 22.3753 33.5985 22.4052 33.727C22.5228 33.7869 22.8881 33.9147 23.7313 33.7878C24.9181 33.6093 26.4969 32.9581 28.056 31.7378C29.6151 30.5176 30.6265 29.1414 31.085 28.0322C31.4107 27.2442 31.3744 26.859 31.3446 26.7304ZM29.9051 34.1003C33.6853 31.1416 35.3931 27.0097 33.7196 24.8715C32.0461 22.7333 27.6249 23.3985 23.8447 26.3572C20.0645 29.3159 18.3567 33.4477 20.0302 35.5859C21.7037 37.7241 26.1248 37.059 29.9051 34.1003Z" fill="#121212"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.40545 26.7304C9.52306 26.6705 9.88835 26.5428 10.7315 26.6696C11.9184 26.8482 13.4972 27.4993 15.0563 28.7196C16.6154 29.9399 17.6267 31.316 18.0852 32.4252C18.4109 33.2132 18.3747 33.5985 18.3448 33.727C18.2272 33.7869 17.8619 33.9147 17.0187 33.7878C15.8319 33.6093 14.2531 32.9581 12.694 31.7378C11.1349 30.5176 10.1235 29.1414 9.66503 28.0322C9.33932 27.2442 9.37555 26.859 9.40545 26.7304ZM10.8449 34.1003C7.06472 31.1416 5.3569 27.0097 7.03042 24.8715C8.70394 22.7333 13.1251 23.3985 16.9053 26.3572C20.6855 29.3159 22.3933 33.4477 20.7198 35.5859C19.0463 37.7241 14.6252 37.059 10.8449 34.1003Z" fill="#121212"/>
+</svg>
diff --git a/src/assets/icons/visu/onboarding/browser_grdf.svg b/src/assets/icons/visu/onboarding/browser_grdf.svg
deleted file mode 100644
index 06f210b1217ed42e9a509022ed865bab32d66e0e..0000000000000000000000000000000000000000
--- a/src/assets/icons/visu/onboarding/browser_grdf.svg
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg width="83" height="62" viewBox="0 0 83 62" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0.5 8.5H82.5V58C82.5 59.933 80.933 61.5 79 61.5H4C2.06701 61.5 0.5 59.933 0.5 58V8.5Z" fill="white" stroke="#A2B4C1"/>
-<path d="M0 4C0 1.79086 1.79086 0 4 0H79C81.2091 0 83 1.79086 83 4V8H0V4Z" fill="#A2B4C1"/>
-<circle cx="5" cy="5" r="2" fill="#FF5F5F"/>
-<circle cx="11" cy="5" r="2" fill="#FFB850"/>
-<circle cx="17" cy="5" r="2" fill="#3CE800"/>
-<path d="M45.9203 47.1802C45.9203 47.466 45.6815 47.6946 45.3936 47.6946H35.6778C35.3919 47.6946 35.1592 47.466 35.1592 47.1802V45.704C35.1592 45.4196 35.3919 45.1885 35.6778 45.1885H45.3936C45.6815 45.1885 45.9203 45.4196 45.9203 45.704V47.1802Z" fill="#FAB200"/>
-<path d="M59.3997 23.0361V31.8037C60.1987 31.1557 61.4677 30.9396 63.4555 30.8126L63.451 26.8611H66.6257C68.2952 26.7869 72.0078 26.2958 72.0002 23.0361H59.3997Z" fill="#71B857"/>
-<path d="M69.0006 30.7122H69.8417C69.8417 30.7122 69.8396 31.3049 69.8396 31.5365C69.8396 33.3568 68.2158 34.2797 65.0208 34.2797H63.4512V37.2948C63.4512 38.3562 63.1947 40.8055 60.7596 40.8568H59.3994V36.4402C59.7847 31.3432 66.6178 30.767 69.0006 30.7122Z" fill="#71B857"/>
-<path d="M50.513 23.0401L41.6738 23.0371V40.8561C44.7547 40.4816 45.8813 39.0447 46.0445 36.9265V26.8586H49.93C49.9779 26.8617 50.0321 26.8647 50.0867 26.8677C50.1806 26.8728 50.2753 26.878 50.3391 26.884C52.1825 27.1001 53.3572 27.896 53.4763 31.5492C53.49 31.6922 53.4857 31.853 53.4818 31.999C53.48 32.0635 53.4784 32.1253 53.4784 32.1812C53.3836 38.0994 48.7994 39.9118 46.26 40.5732L46.2468 40.5777C46.2164 40.5902 46.1946 40.6051 46.1946 40.6355V40.7949C46.1946 40.8272 46.2204 40.8516 46.2468 40.8551L46.2554 40.8561H46.553C50.2545 40.8561 57.6934 39.9721 57.6934 31.986V31.84C57.6498 24.9187 54.614 23.0401 50.513 23.0401Z" fill="#00B1AF"/>
-<path d="M33.9604 26.8756L31.8711 26.8586C31.7378 26.8586 31.608 26.8531 31.4752 26.8437C28.9002 26.6629 27.429 24.735 26.8292 23.7239C26.6918 23.5167 26.561 23.3041 26.4373 23.0795C26.4373 23.0795 26.4247 23.0361 26.446 23.0361H32.4217C34.4213 23.0361 35.2542 23.1577 36.1394 23.4983C36.3483 23.575 36.5658 23.6696 36.7965 23.7747C38.0796 24.3674 38.9491 25.4292 39.2969 26.7914C39.3486 26.9791 39.3815 27.1799 39.4099 27.3806C39.449 27.645 39.4713 27.9204 39.4713 28.2053C39.4753 30.3235 38.4016 31.5313 36.9161 32.3769C36.9141 32.3804 36.8897 32.3944 36.8897 32.3944C36.8695 32.4018 36.8695 32.4018 36.8578 32.4113C36.8414 32.4192 36.8268 32.4279 36.8132 32.436C36.8045 32.4412 36.7961 32.4462 36.7878 32.4507C36.7833 32.4507 36.7615 32.4666 36.7615 32.4666C36.5881 32.5523 36.4177 32.605 36.2591 32.6434C36.2341 32.6484 36.2102 32.6548 36.1878 32.6607C36.1683 32.6659 36.1498 32.6708 36.1328 32.6743V28.5022C36.0781 27.2162 34.9262 26.88 34.2636 26.88C34.2426 26.88 34.221 26.8803 34.1987 26.8805C34.1262 26.8812 34.0469 26.882 33.9604 26.8756Z" fill="#009BC4"/>
-<path d="M29.5207 31.7194C28.5138 31.7578 28.4165 32.6697 28.4048 32.8485V35.5389H32.1864C32.5051 35.9991 32.8222 36.4546 33.1171 36.8781L33.4523 37.3598C33.8782 37.9619 34.2868 38.5302 34.4567 38.7478C34.4682 38.7629 34.4817 38.7817 34.4975 38.8037C34.7122 39.1026 35.3588 40.0032 37.5918 40.5418C38.4088 40.7378 39.3089 40.7961 39.8124 40.8287C39.9036 40.8346 39.9823 40.8397 40.0446 40.8446L40.2687 40.8555L40.2449 40.8127C40.2449 40.8127 39.8403 40.2619 39.3293 39.3933L39.2179 39.2038C38.5143 38.0067 36.1279 33.9464 35.6699 33.1538C35.2572 32.4391 34.6001 32.1208 33.9279 31.9276H33.9213C33.4397 31.7961 32.9109 31.7458 32.5149 31.7259C32.4974 31.7252 32.4803 31.7241 32.4632 31.7231C32.4333 31.7212 32.4036 31.7194 32.373 31.7194H29.5207Z" fill="#009BC4"/>
-<path d="M24.9584 31.7197C25.9171 31.7636 26.0484 32.6053 26.0641 32.8259V37.1903C26.0425 37.2177 26.0206 37.2456 25.9985 37.2738C25.9037 37.3946 25.805 37.5204 25.7027 37.6335C25.5151 37.8372 25.2155 38.1515 25.1029 38.2571C23.043 40.1895 20.6227 40.8932 18.3651 40.8932C16.5096 40.8932 13.9564 40.3135 11.7815 38.2531C8.0917 34.7429 8.05469 29.122 11.7795 25.6451C12.4695 25.0056 12.7367 24.7666 13.8348 24.15C15.3501 23.2958 17.0678 23 18.4554 23C19.6737 23 21.0075 23.2605 22.0063 23.6684C22.239 23.7615 22.5016 23.8726 22.8316 24.0608C23.7153 24.5658 24.8748 25.4514 25.4542 26.8514V26.8578H14.5562V33.3987C14.6388 34.5646 14.8954 35.4899 15.6198 36.1404C16.2049 36.6678 17.0987 37.0135 18.4554 37.1494C18.8899 37.1957 19.3766 37.2181 19.917 37.2181L22.2856 37.2127C22.2633 37.2052 22.1736 37.1494 21.8451 36.746C21.4364 36.2385 21.3447 35.3699 21.3447 34.721H21.3426V31.7188L24.9584 31.7197Z" fill="#0053A2"/>
-</svg>
diff --git a/src/assets/icons/visu/onboarding/grdf-mail.svg b/src/assets/icons/visu/onboarding/grdf-mail.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b397180f4a760fa71892e3d856e8ef89c9ed53a0
--- /dev/null
+++ b/src/assets/icons/visu/onboarding/grdf-mail.svg
@@ -0,0 +1,33 @@
+<svg width="78" height="75" viewBox="0 0 78 75" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M66.6722 31.5706C66.6722 28.1162 65.0488 24.8626 62.2886 22.7855L43.6853 8.78557C40.8367 6.64179 36.9132 6.64179 34.0645 8.78556L15.8114 22.5219C12.9888 24.6461 11.3285 27.9734 11.3285 31.5061C11.3285 36.0711 14.0886 40.1831 18.3134 41.9122L33.9507 48.3123C37.1065 49.6039 40.6434 49.6039 43.7991 48.3123L59.842 41.7462C63.9733 40.0554 66.6722 36.0345 66.6722 31.5706Z"
+ fill="#7B7B7B" />
+ <rect x="16.1047" y="19.8311" width="46.5452" height="28.2264" rx="4" fill="#45D1B8" />
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M31.9807 31.8938C31.973 31.7826 31.9087 31.3583 31.4391 31.3362L29.6679 31.3357V32.8489H29.6689C29.6689 33.176 29.7139 33.6137 29.914 33.8695C30.0749 34.0729 30.1189 34.101 30.1298 34.1047L28.9696 34.1075C28.7048 34.1075 28.4664 34.0962 28.2536 34.0729C27.589 34.0043 27.1512 33.8301 26.8646 33.5643C26.5098 33.2365 26.3841 32.7701 26.3436 32.1824V28.8858H31.682V28.8825C31.3981 28.1769 30.8301 27.7306 30.3973 27.4761C30.2356 27.3812 30.107 27.3252 29.993 27.2783C29.5038 27.0727 28.8504 26.9414 28.2536 26.9414C27.5739 26.9414 26.7325 27.0905 25.9902 27.521C25.4523 27.8318 25.3214 27.9523 24.9835 28.2746C23.1589 30.0269 23.177 32.8599 24.9844 34.6291C26.0498 35.6676 27.3005 35.9598 28.2094 35.9598C29.3153 35.9598 30.5008 35.6051 31.5099 34.6311C31.565 34.5779 31.7118 34.4195 31.8036 34.3169C31.8538 34.2599 31.9021 34.1964 31.9485 34.1356L31.9486 34.1355L31.9807 34.0934V31.8938ZM35.8491 28.8946L34.8257 28.886C34.7604 28.886 34.6968 28.8833 34.6317 28.8785C33.3704 28.7874 32.6497 27.8157 32.356 27.3061C32.2887 27.2017 32.2246 27.0945 32.164 26.9813C32.164 26.9813 32.1578 26.9595 32.1682 26.9595H35.0954C36.0749 26.9595 36.4829 27.0207 36.9165 27.1924C37.0188 27.2311 37.1253 27.2788 37.2383 27.3317C37.8669 27.6304 38.2928 28.1656 38.4632 28.8522C38.4885 28.9468 38.5046 29.048 38.5185 29.1491C38.5377 29.2824 38.5486 29.4212 38.5486 29.5648C38.5506 30.6324 38.0246 31.2411 37.2969 31.6673C37.2959 31.6691 37.284 31.6761 37.284 31.6761C37.2741 31.6799 37.2741 31.6799 37.2684 31.6847C37.2603 31.6886 37.2532 31.693 37.2465 31.6971L37.2415 31.7002L37.2341 31.7045C37.2319 31.7045 37.2212 31.7125 37.2212 31.7125C37.1363 31.7557 37.0528 31.7823 36.9751 31.8016C36.9629 31.8042 36.9512 31.8074 36.9402 31.8104L36.9402 31.8104C36.9306 31.813 36.9216 31.8154 36.9133 31.8172V29.7144C36.8864 29.0663 36.3222 28.8968 35.9976 28.8968L35.9658 28.8971H35.9658C35.9303 28.8974 35.8915 28.8978 35.8491 28.8946ZM33.6744 31.3359C33.1811 31.3553 33.1335 31.8149 33.1278 31.905V33.261H34.9801C35.136 33.4926 35.2911 33.7218 35.4353 33.935L35.436 33.936L35.6002 34.1787C35.8088 34.4822 36.009 34.7686 36.0922 34.8783C36.0979 34.8859 36.1045 34.8954 36.1122 34.9065C36.2174 35.0571 36.5341 35.5111 37.6279 35.7825C38.0281 35.8813 38.469 35.9107 38.7157 35.9271C38.7603 35.9301 38.7989 35.9327 38.8294 35.9351L38.9392 35.9406L38.9275 35.9191C38.9275 35.9191 38.7293 35.6414 38.479 35.2036L38.4245 35.1082L38.4236 35.1067C38.0779 34.5014 36.9107 32.458 36.6865 32.0589C36.4843 31.6987 36.1625 31.5383 35.8332 31.4409H35.83C35.594 31.3746 35.335 31.3492 35.1411 31.3392C35.1325 31.3388 35.1241 31.3383 35.1157 31.3378C35.1011 31.3369 35.0865 31.3359 35.0715 31.3359H33.6744ZM48.3094 31.3784V26.9595H54.4817C54.4854 28.6024 52.6668 28.8499 51.8491 28.8873H50.2939L50.2962 30.8789C49.3224 30.9429 48.7008 31.0518 48.3094 31.3784ZM53.4244 30.8283H53.0124C51.8452 30.8559 48.4981 31.1463 48.3093 33.7153V35.9413H48.9756C50.1684 35.9154 50.2941 34.6809 50.2941 34.146V32.6263H51.0629C52.628 32.6263 53.4234 32.1612 53.4234 31.2437C53.4234 31.127 53.4244 30.8283 53.4244 30.8283ZM39.6268 26.96L43.9567 26.9615C45.9655 26.9615 47.4526 27.9083 47.4739 31.3967V31.4703C47.4739 35.4954 43.83 35.9409 42.0169 35.9409H41.8711L41.8669 35.9404C41.854 35.9387 41.8413 35.9264 41.8413 35.91V35.8297C41.8413 35.8144 41.852 35.8069 41.8669 35.8006L41.8733 35.7983C43.1173 35.465 45.3628 34.5515 45.4092 31.5687C45.4092 31.5406 45.41 31.5095 45.4109 31.4771V31.477V31.477V31.4769C45.4128 31.4032 45.4149 31.3222 45.4082 31.2501C45.3498 29.4089 44.7744 29.0078 43.8715 28.8988C43.8402 28.8958 43.7938 28.8932 43.7478 28.8906C43.7211 28.8891 43.6945 28.8876 43.6711 28.886H41.7678V33.9604C41.6878 35.028 41.136 35.7522 39.6268 35.9409V26.96Z"
+ fill="#1B1C22" />
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M12.1026 28.4502L39.126 48.7866L65.9628 28.5906C66.4206 29.5981 66.6755 30.7173 66.6755 31.8961V53.8734C66.6755 58.2917 63.0938 61.8734 58.6755 61.8734H19.3245C14.9062 61.8734 11.3245 58.2917 11.3245 53.8734V31.8961C11.3245 30.6623 11.6038 29.4937 12.1026 28.4502Z"
+ fill="#383941" />
+ <path
+ d="M36.0909 44.932L27.1389 50.9733C23.0504 53.7325 25.0035 60.1178 29.9359 60.1178H47.929C52.8733 60.1178 54.8179 53.7075 50.7069 50.9605L41.6659 44.9192C39.9774 43.7909 37.7742 43.796 36.0909 44.932Z"
+ fill="#383941" />
+ <path
+ d="M38.5354 41.9437L13.5887 60.1174L38.5865 44.1672C38.9152 43.9574 39.3359 43.9579 39.6642 44.1684L64.5369 60.1174L39.715 41.9451C39.3639 41.6881 38.8871 41.6875 38.5354 41.9437Z"
+ fill="white" />
+ <mask id="path-7-inside-1_4484_19904" fill="white">
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M52.8918 8.21365C51.8896 7.7836 50.8117 8.60204 50.9462 9.69091L51.7422 16.1351C51.9333 17.6829 53.7178 18.4486 54.9364 17.5058L60.0101 13.5804C60.8675 12.9172 60.6875 11.5589 59.6853 11.1289C58.9638 10.8193 58.6216 9.9799 58.921 9.25411L60.773 4.76489C61.1942 3.7438 60.7128 2.56293 59.6978 2.12735L59.1928 1.91068C58.1778 1.4751 57.0134 1.94976 56.5922 2.97085L54.7402 7.46009C54.4408 8.18587 53.6132 8.52325 52.8918 8.21365Z" />
+ </mask>
+ <path fill-rule="evenodd" clip-rule="evenodd"
+ d="M52.8918 8.21365C51.8896 7.7836 50.8117 8.60204 50.9462 9.69091L51.7422 16.1351C51.9333 17.6829 53.7178 18.4486 54.9364 17.5058L60.0101 13.5804C60.8675 12.9172 60.6875 11.5589 59.6853 11.1289C58.9638 10.8193 58.6216 9.9799 58.921 9.25411L60.773 4.76489C61.1942 3.7438 60.7128 2.56293 59.6978 2.12735L59.1928 1.91068C58.1778 1.4751 57.0134 1.94976 56.5922 2.97085L54.7402 7.46009C54.4408 8.18587 53.6132 8.52325 52.8918 8.21365Z"
+ fill="white" />
+ <path
+ d="M59.1928 1.91068L59.5742 0.986253L59.1928 1.91068ZM56.5922 2.97085L57.5112 3.3652L56.5922 2.97085ZM59.6978 2.12735L59.3164 3.05178L59.6978 2.12735ZM54.9364 17.5058L55.5463 18.3059L54.9364 17.5058ZM52.7294 16.0203L51.9334 9.57616L49.9589 9.80565L50.7549 16.2498L52.7294 16.0203ZM59.4003 12.7803L54.3266 16.7057L55.5463 18.3059L60.62 14.3806L59.4003 12.7803ZM59.854 4.37055L58.0021 8.85977L59.84 9.64845L61.6919 5.15924L59.854 4.37055ZM58.8115 2.83511L59.3164 3.05178L60.0791 1.20292L59.5742 0.986253L58.8115 2.83511ZM55.6592 7.85444L57.5112 3.3652L55.6732 2.57651L53.8213 7.06575L55.6592 7.85444ZM53.8213 7.06575C53.7325 7.28098 53.4871 7.38103 53.2731 7.28922L52.5104 9.13808C53.7394 9.66547 55.1492 9.09076 55.6592 7.85444L53.8213 7.06575ZM59.5742 0.986253C58.0516 0.332886 56.3051 1.04487 55.6732 2.57651L57.5112 3.3652C57.7218 2.85465 58.3039 2.61732 58.8115 2.83511L59.5742 0.986253ZM61.6919 5.15924C62.3238 3.62759 61.6017 1.85629 60.0791 1.20292L59.3164 3.05178C59.8239 3.26957 60.0646 3.86 59.854 4.37055L61.6919 5.15924ZM60.0666 10.2044C59.8527 10.1126 59.7512 9.86369 59.84 9.64845L58.0021 8.85977C57.492 10.0961 58.0749 11.5259 59.3039 12.0533L60.0666 10.2044ZM60.62 14.3806C62.0804 13.2507 61.7738 10.937 60.0666 10.2044L59.3039 12.0533C59.6012 12.1808 59.6545 12.5836 59.4003 12.7803L60.62 14.3806ZM51.9334 9.57616C51.8935 9.25325 52.2132 9.01054 52.5104 9.13808L53.2731 7.28922C51.5659 6.55665 49.7298 7.95082 49.9589 9.80565L51.9334 9.57616ZM50.7549 16.2498C51.0417 18.5715 53.7183 19.7201 55.5463 18.3059L54.3266 16.7057C53.7172 17.1771 52.825 16.7942 52.7294 16.0203L50.7549 16.2498Z"
+ fill="white" mask="url(#path-7-inside-1_4484_19904)" />
+ <path d="M49.6108 14.8994L46.6999 11.9305" stroke="white" stroke-width="2" stroke-linecap="round" />
+ <path d="M49.0653 17.8965H47.5557" stroke="white" stroke-width="2" stroke-linecap="round" />
+ <path d="M57.8223 18.4336L61.905 17.896" stroke="white" stroke-width="2" stroke-linecap="round" />
+ <path d="M55.2557 20.4531L56.5728 21.4893" stroke="white" stroke-width="2" stroke-linecap="round" />
+ <ellipse cx="39" cy="71.5898" rx="38.5" ry="3.40909" fill="#212121" />
+</svg>
\ No newline at end of file
diff --git a/src/assets/icons/visu/onboarding/grdf.svg b/src/assets/icons/visu/onboarding/grdf.svg
deleted file mode 100644
index 564e21d8a9355eec4d0bc3f5b9bc1006b78d043c..0000000000000000000000000000000000000000
--- a/src/assets/icons/visu/onboarding/grdf.svg
+++ /dev/null
@@ -1,37 +0,0 @@
-<svg width="220" height="220" viewBox="0 0 220 220" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M2.5293 131.207H115.611V199.241C115.611 201.174 114.044 202.741 112.111 202.741H6.0293C4.0963 202.741 2.5293 201.174 2.5293 199.241V131.207Z" fill="url(#paint0_linear_11182_69332)" stroke="#52616C"/>
-<path d="M2.0293 123.962C2.0293 121.753 3.82016 119.962 6.0293 119.962H112.111C114.321 119.962 116.111 121.753 116.111 123.962V130.707H2.0293V123.962Z" fill="#52616C"/>
-<ellipse cx="8.90131" cy="126.678" rx="2.74897" ry="2.68643" fill="#FF5F5F"/>
-<ellipse cx="17.1484" cy="126.678" rx="2.74897" ry="2.68643" fill="#FFB850"/>
-<ellipse cx="25.3954" cy="126.678" rx="2.74896" ry="2.68643" fill="#3CE800"/>
-<path d="M44.2788 179.917V181.115H39.0259V184.723H43.2786V185.875H39.0259V189.582H44.2788V190.78H37.5371V179.917H44.2788Z" fill="white"/>
-<path d="M51.4717 184.465C51.431 184.521 51.3902 184.564 51.3495 184.594C51.3088 184.624 51.2503 184.64 51.1739 184.64C51.0976 184.64 51.0136 184.609 50.922 184.549C50.8354 184.483 50.7235 184.412 50.586 184.336C50.4486 184.261 50.2806 184.192 50.0821 184.132C49.8887 184.066 49.6495 184.033 49.3644 184.033C48.9878 184.033 48.6544 184.101 48.3643 184.238C48.0741 184.369 47.8298 184.561 47.6313 184.814C47.4379 185.067 47.2903 185.372 47.1885 185.731C47.0918 186.09 47.0434 186.492 47.0434 186.937C47.0434 187.402 47.0969 187.816 47.2038 188.18C47.3106 188.539 47.4608 188.842 47.6542 189.09C47.8476 189.332 48.0818 189.519 48.3566 189.651C48.6366 189.777 48.9496 189.84 49.2957 189.84C49.6266 189.84 49.8989 189.802 50.1127 189.726C50.3264 189.645 50.5046 189.557 50.6471 189.461C50.7896 189.365 50.9067 189.279 50.9983 189.203C51.0899 189.122 51.1816 189.082 51.2732 189.082C51.3902 189.082 51.4768 189.125 51.5328 189.211L51.9145 189.704C51.5786 190.113 51.1586 190.414 50.6547 190.606C50.1508 190.793 49.6189 190.886 49.059 190.886C48.5755 190.886 48.125 190.798 47.7077 190.621C47.2954 190.444 46.9365 190.189 46.6311 189.855C46.3257 189.517 46.084 189.102 45.9058 188.612C45.7328 188.122 45.6462 187.563 45.6462 186.937C45.6462 186.366 45.7251 185.837 45.8829 185.352C46.0458 184.867 46.2799 184.45 46.5853 184.101C46.8958 183.748 47.2776 183.472 47.7306 183.275C48.1836 183.078 48.7027 182.979 49.2881 182.979C49.8276 182.979 50.3061 183.068 50.7235 183.245C51.1408 183.417 51.5099 183.662 51.8305 183.98L51.4717 184.465Z" fill="white"/>
-<path d="M56.4542 182.979C57.0192 182.979 57.5282 183.073 57.9812 183.26C58.4393 183.447 58.8261 183.712 59.1417 184.056C59.4623 184.4 59.7067 184.817 59.8746 185.307C60.0477 185.792 60.1342 186.335 60.1342 186.937C60.1342 187.543 60.0477 188.089 59.8746 188.574C59.7067 189.059 59.4623 189.474 59.1417 189.817C58.8261 190.161 58.4393 190.426 57.9812 190.613C57.5282 190.795 57.0192 190.886 56.4542 190.886C55.8892 190.886 55.3777 190.795 54.9196 190.613C54.4666 190.426 54.0797 190.161 53.7591 189.817C53.4384 189.474 53.1915 189.059 53.0185 188.574C52.8454 188.089 52.7589 187.543 52.7589 186.937C52.7589 186.335 52.8454 185.792 53.0185 185.307C53.1915 184.817 53.4384 184.4 53.7591 184.056C54.0797 183.712 54.4666 183.447 54.9196 183.26C55.3777 183.073 55.8892 182.979 56.4542 182.979ZM56.4542 189.832C57.2177 189.832 57.7878 189.58 58.1644 189.074C58.5411 188.564 58.7294 187.854 58.7294 186.944C58.7294 186.029 58.5411 185.317 58.1644 184.806C57.7878 184.296 57.2177 184.041 56.4542 184.041C56.0673 184.041 55.7314 184.106 55.4464 184.238C55.1613 184.369 54.9221 184.559 54.7287 184.806C54.5404 185.054 54.3978 185.36 54.3011 185.724C54.2095 186.083 54.1637 186.489 54.1637 186.944C54.1637 187.399 54.2095 187.806 54.3011 188.165C54.3978 188.524 54.5404 188.827 54.7287 189.074C54.9221 189.317 55.1613 189.504 55.4464 189.635C55.7314 189.767 56.0673 189.832 56.4542 189.832Z" fill="white"/>
-<path d="M63.3205 179.614V190.78H61.9615V179.614H63.3205Z" fill="white"/>
-<path d="M67.9833 193.047C67.9375 193.148 67.8789 193.229 67.8077 193.289C67.7415 193.35 67.6372 193.38 67.4946 193.38H66.4868L67.8993 190.333L64.7079 183.101H65.8837C66.0007 183.101 66.0924 183.131 66.1585 183.192C66.2247 183.247 66.2731 183.311 66.3036 183.381L68.3727 188.218C68.4185 188.329 68.4566 188.44 68.4872 188.551C68.5228 188.662 68.5534 188.776 68.5788 188.892C68.6144 188.776 68.6501 188.662 68.6857 188.551C68.7213 188.44 68.762 188.326 68.8078 188.21L70.8158 183.381C70.8464 183.3 70.8973 183.235 70.9685 183.184C71.0449 183.129 71.1263 183.101 71.2128 183.101H72.297L67.9833 193.047Z" fill="white"/>
-<path d="M76.466 182.979C77.031 182.979 77.54 183.073 77.993 183.26C78.4511 183.447 78.838 183.712 79.1535 184.056C79.4742 184.4 79.7185 184.817 79.8865 185.307C80.0595 185.792 80.1461 186.335 80.1461 186.937C80.1461 187.543 80.0595 188.089 79.8865 188.574C79.7185 189.059 79.4742 189.474 79.1535 189.817C78.838 190.161 78.4511 190.426 77.993 190.613C77.54 190.795 77.031 190.886 76.466 190.886C75.9011 190.886 75.3895 190.795 74.9314 190.613C74.4784 190.426 74.0916 190.161 73.7709 189.817C73.4502 189.474 73.2034 189.059 73.0303 188.574C72.8573 188.089 72.7707 187.543 72.7707 186.937C72.7707 186.335 72.8573 185.792 73.0303 185.307C73.2034 184.817 73.4502 184.4 73.7709 184.056C74.0916 183.712 74.4784 183.447 74.9314 183.26C75.3895 183.073 75.9011 182.979 76.466 182.979ZM76.466 189.832C77.2295 189.832 77.7996 189.58 78.1763 189.074C78.5529 188.564 78.7412 187.854 78.7412 186.944C78.7412 186.029 78.5529 185.317 78.1763 184.806C77.7996 184.296 77.2295 184.041 76.466 184.041C76.0792 184.041 75.7433 184.106 75.4582 184.238C75.1732 184.369 74.934 184.559 74.7405 184.806C74.5522 185.054 74.4097 185.36 74.313 185.724C74.2214 186.083 74.1756 186.489 74.1756 186.944C74.1756 187.399 74.2214 187.806 74.313 188.165C74.4097 188.524 74.5522 188.827 74.7405 189.074C74.934 189.317 75.1732 189.504 75.4582 189.635C75.7433 189.767 76.0792 189.832 76.466 189.832Z" fill="white"/>
-<path d="M59.1015 174.342C74.561 168.216 73.3594 159.506 72.5584 146.515C67.5922 146.293 63.1866 144.743 59.1015 142.16C55.0163 144.743 50.6107 146.293 45.6445 146.515C44.8435 159.506 43.6419 168.216 59.1015 174.342Z" fill="#1B1C22"/>
-<path d="M59.1014 139.79L58.0541 140.452C54.2241 142.874 50.1454 144.301 45.5575 144.505L43.7785 144.584L43.6673 146.389C43.6342 146.925 43.5999 147.458 43.5657 147.988C43.1983 153.691 42.8537 159.041 44.4 163.651C46.1826 168.965 50.3182 173.02 58.3811 176.215L59.1014 176.501V174.342C44.248 168.456 44.7748 160.184 45.5494 148.023C45.581 147.527 45.613 147.024 45.6444 146.515C50.6107 146.293 55.0162 144.743 59.1014 142.16V139.79Z" fill="#FFC600"/>
-<path d="M59.1017 139.79L60.1491 140.452C63.979 142.874 68.0577 144.301 72.6456 144.505L74.4246 144.584L74.5359 146.389C74.5689 146.925 74.6032 147.458 74.6374 147.988C75.0048 153.691 75.3494 159.041 73.8032 163.651C72.0205 168.965 67.8849 173.02 59.822 176.215L59.1017 176.501V174.342C73.9551 168.456 73.4283 160.184 72.6538 148.023C72.6221 147.527 72.5901 147.024 72.5587 146.515C67.5925 146.293 63.1869 144.743 59.1017 142.16V139.79Z" fill="#DB8300"/>
-<path d="M54.2159 152.442H54.9187C55.1994 152.442 55.4686 152.554 55.667 152.754C55.8655 152.953 55.977 153.223 55.977 153.505V164.285H53.1576V153.505C53.1576 153.223 53.2691 152.953 53.4676 152.754C53.666 152.554 53.9352 152.442 54.2159 152.442ZM59.099 157.692H59.8018C60.0824 157.692 60.3516 157.804 60.5501 158.003C60.7486 158.202 60.8601 158.472 60.8601 158.754V164.285H58.0407V158.754C58.0407 158.472 58.1522 158.202 58.3506 158.003C58.5491 157.804 58.8183 157.692 59.099 157.692ZM64.2731 155.661H64.9759C65.2566 155.661 65.5257 155.773 65.7242 155.972C65.9227 156.172 66.0342 156.442 66.0342 156.723V164.285H63.2148V156.723C63.2148 156.442 63.3263 156.172 63.5248 155.972C63.7232 155.773 63.9924 155.661 64.2731 155.661Z" fill="#FFC600"/>
-<path d="M121.39 51.5078C105.493 53.5147 90.8171 61.0771 79.9564 72.8584C69.0957 84.6396 62.7497 99.8811 62.04 115.889" stroke="#A0A0A0" stroke-width="2"/>
-<path d="M131.5 25.5H213.5V75C213.5 76.933 211.933 78.5 210 78.5H135C133.067 78.5 131.5 76.933 131.5 75V25.5Z" fill="white" stroke="#A2B4C1"/>
-<path d="M131 21C131 18.7909 132.791 17 135 17H210C212.209 17 214 18.7909 214 21V25H131V21Z" fill="#A2B4C1"/>
-<circle cx="136" cy="22" r="2" fill="#FF5F5F"/>
-<circle cx="142" cy="22" r="2" fill="#FFB850"/>
-<circle cx="148" cy="22" r="2" fill="#3CE800"/>
-<path d="M180.92 68.1802C180.92 68.466 180.682 68.6946 180.394 68.6946H170.678C170.392 68.6946 170.159 68.466 170.159 68.1802V66.704C170.159 66.4196 170.392 66.1885 170.678 66.1885H180.394C180.682 66.1885 180.92 66.4196 180.92 66.704V68.1802Z" fill="#FAB200"/>
-<path d="M194.4 44.0361V52.8037C195.199 52.1557 196.468 51.9396 198.456 51.8126L198.451 47.8611H201.626C203.295 47.7869 207.008 47.2958 207 44.0361H194.4Z" fill="#71B857"/>
-<path d="M204.001 51.7122H204.842C204.842 51.7122 204.84 52.3049 204.84 52.5365C204.84 54.3568 203.216 55.2797 200.021 55.2797H198.451V58.2948C198.451 59.3562 198.195 61.8055 195.76 61.8568H194.399V57.4402C194.785 52.3432 201.618 51.767 204.001 51.7122Z" fill="#71B857"/>
-<path d="M185.513 44.0401L176.674 44.0371V61.8561C179.755 61.4816 180.881 60.0447 181.045 57.9265V47.8586H184.93C184.978 47.8617 185.032 47.8647 185.087 47.8677C185.181 47.8728 185.275 47.878 185.339 47.884C187.183 48.1001 188.357 48.896 188.476 52.5492C188.49 52.6922 188.486 52.853 188.482 52.999C188.48 53.0635 188.478 53.1253 188.478 53.1812C188.384 59.0994 183.799 60.9118 181.26 61.5732L181.247 61.5777C181.216 61.5902 181.195 61.6051 181.195 61.6355V61.7949C181.195 61.8272 181.22 61.8516 181.247 61.8551L181.255 61.8561H181.553C185.254 61.8561 192.693 60.9721 192.693 52.986V52.84C192.65 45.9187 189.614 44.0401 185.513 44.0401Z" fill="#00B1AF"/>
-<path d="M168.96 47.8756L166.871 47.8586C166.738 47.8586 166.608 47.8531 166.475 47.8437C163.9 47.6629 162.429 45.735 161.829 44.7239C161.692 44.5167 161.561 44.3041 161.437 44.0795C161.437 44.0795 161.425 44.0361 161.446 44.0361H167.422C169.421 44.0361 170.254 44.1577 171.139 44.4983C171.348 44.575 171.566 44.6696 171.796 44.7747C173.08 45.3674 173.949 46.4292 174.297 47.7914C174.349 47.9791 174.382 48.1799 174.41 48.3806C174.449 48.645 174.471 48.9204 174.471 49.2053C174.475 51.3235 173.402 52.5313 171.916 53.3769C171.914 53.3804 171.89 53.3944 171.89 53.3944C171.869 53.4018 171.869 53.4018 171.858 53.4113C171.841 53.4192 171.827 53.4279 171.813 53.436C171.804 53.4412 171.796 53.4462 171.788 53.4507C171.783 53.4507 171.761 53.4666 171.761 53.4666C171.588 53.5523 171.418 53.605 171.259 53.6434C171.234 53.6484 171.21 53.6548 171.188 53.6607C171.168 53.6659 171.15 53.6708 171.133 53.6743V49.5022C171.078 48.2162 169.926 47.88 169.264 47.88C169.243 47.88 169.221 47.8803 169.199 47.8805C169.126 47.8812 169.047 47.882 168.96 47.8756Z" fill="#009BC4"/>
-<path d="M164.521 52.7194C163.514 52.7578 163.417 53.6697 163.405 53.8485V56.5389H167.186C167.505 56.9991 167.822 57.4546 168.117 57.8781L168.452 58.3598C168.878 58.9619 169.287 59.5302 169.457 59.7478C169.468 59.7629 169.482 59.7817 169.498 59.8037C169.712 60.1026 170.359 61.0032 172.592 61.5418C173.409 61.7378 174.309 61.7961 174.812 61.8287C174.904 61.8346 174.982 61.8397 175.045 61.8446L175.269 61.8555L175.245 61.8127C175.245 61.8127 174.84 61.2619 174.329 60.3933L174.218 60.2038C173.514 59.0067 171.128 54.9464 170.67 54.1538C170.257 53.4391 169.6 53.1208 168.928 52.9276H168.921C168.44 52.7961 167.911 52.7458 167.515 52.7259C167.497 52.7252 167.48 52.7241 167.463 52.7231C167.433 52.7212 167.404 52.7194 167.373 52.7194H164.521Z" fill="#009BC4"/>
-<path d="M159.958 52.7197C160.917 52.7636 161.048 53.6053 161.064 53.8259V58.1903C161.042 58.2177 161.021 58.2456 160.998 58.2738C160.904 58.3946 160.805 58.5204 160.703 58.6335C160.515 58.8372 160.215 59.1515 160.103 59.2571C158.043 61.1895 155.623 61.8932 153.365 61.8932C151.51 61.8932 148.956 61.3135 146.782 59.2531C143.092 55.7429 143.055 50.122 146.779 46.6451C147.469 46.0056 147.737 45.7666 148.835 45.15C150.35 44.2958 152.068 44 153.455 44C154.674 44 156.008 44.2605 157.006 44.6684C157.239 44.7615 157.502 44.8726 157.832 45.0608C158.715 45.5658 159.875 46.4514 160.454 47.8514V47.8578H149.556V54.3987C149.639 55.5646 149.895 56.4899 150.62 57.1404C151.205 57.6678 152.099 58.0135 153.455 58.1494C153.89 58.1957 154.377 58.2181 154.917 58.2181L157.286 58.2127C157.263 58.2052 157.174 58.1494 156.845 57.746C156.436 57.2385 156.345 56.3699 156.345 55.721H156.343V52.7188L159.958 52.7197Z" fill="#0053A2"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M188.731 87C193.047 94.9617 195.732 103.771 196.553 112.912C197.9 127.919 194.144 142.942 185.892 155.548C177.643 168.152 165.384 177.603 151.097 182.375C147.902 183.347 139.667 184.868 121.422 184.992L126.071 180.343C126.462 179.953 126.462 179.319 126.071 178.929C125.681 178.538 125.047 178.538 124.657 178.929L118.293 185.293C117.902 185.683 117.902 186.317 118.293 186.707L124.657 193.071C125.047 193.462 125.681 193.462 126.071 193.071C126.462 192.681 126.462 192.047 126.071 191.657L121.406 186.992C139.762 186.869 148.23 185.34 151.693 184.284L151.705 184.28L151.718 184.276C166.437 179.363 179.068 169.627 187.566 156.644C196.064 143.66 199.932 128.189 198.545 112.734C197.732 103.683 195.145 94.9472 190.996 87H188.731Z" fill="#A0A0A0"/>
-<defs>
-<linearGradient id="paint0_linear_11182_69332" x1="57.1095" y1="130.707" x2="57.1095" y2="203.241" gradientUnits="userSpaceOnUse">
-<stop stop-color="#323339"/>
-<stop offset="1" stop-color="#25262B"/>
-</linearGradient>
-</defs>
-</svg>
diff --git a/src/assets/icons/visu/onboarding/grdf_consent.svg b/src/assets/icons/visu/onboarding/grdf_consent.svg
deleted file mode 100644
index 0fe88893ce78805d76c354b18d502c2be412eb0f..0000000000000000000000000000000000000000
--- a/src/assets/icons/visu/onboarding/grdf_consent.svg
+++ /dev/null
@@ -1,56 +0,0 @@
-<svg width="211" height="247" viewBox="0 0 211 247" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g opacity="0.55" filter="url(#filter0_f_1394_2484)">
-<rect x="18.5" y="18" width="174" height="211" rx="2" fill="#121212"/>
-</g>
-<rect x="18.5" y="18" width="174" height="204" rx="4" fill="white"/>
-<path d="M66.0066 57.5052C66.0066 57.74 65.8121 57.9278 65.5776 57.9278H57.6662C57.4334 57.9278 57.2439 57.74 57.2439 57.5052V56.2926C57.2439 56.059 57.4334 55.8691 57.6662 55.8691H65.5776C65.8121 55.8691 66.0066 56.059 66.0066 56.2926V57.5052Z" fill="#FAB200"/>
-<path d="M76.9826 37.6719V44.8738C77.6333 44.3415 78.6666 44.164 80.2853 44.0597L80.2815 40.8138H82.8667C84.2261 40.7529 87.2492 40.3495 87.243 37.6719H76.9826Z" fill="#71B857"/>
-<path d="M84.8005 43.9772H85.4854C85.4854 43.9772 85.4838 44.4641 85.4838 44.6543C85.4838 46.1496 84.1615 46.9076 81.5598 46.9076H80.2817V49.3844C80.2817 50.2562 80.0728 52.2682 78.09 52.3103H76.9824V48.6824C77.2962 44.4956 82.8602 44.0222 84.8005 43.9772Z" fill="#71B857"/>
-<path d="M69.7463 37.6753L62.5487 37.6729V52.3099C65.0575 52.0022 65.9748 50.822 66.1077 49.082V40.8119H69.2716C69.3106 40.8145 69.3548 40.8169 69.3992 40.8194C69.4757 40.8236 69.5528 40.8279 69.6047 40.8328C71.1058 41.0103 72.0623 41.6641 72.1593 44.6649C72.1705 44.7824 72.1669 44.9144 72.1637 45.0344C72.1623 45.0874 72.161 45.1381 72.161 45.1841C72.0838 50.0455 68.351 51.5342 66.2831 52.0775L66.2724 52.0812C66.2476 52.0914 66.2299 52.1037 66.2299 52.1287V52.2596C66.2299 52.2862 66.2509 52.3062 66.2724 52.3091L66.2794 52.3099H66.5218C69.5358 52.3099 75.5932 51.5837 75.5932 45.0237V44.9038C75.5577 39.2185 73.0857 37.6753 69.7463 37.6753Z" fill="#00B1AF"/>
-<path d="M56.2678 40.8257L54.5665 40.8118C54.4579 40.8118 54.3523 40.8073 54.2441 40.7995C52.1474 40.651 50.9493 39.0673 50.461 38.2369C50.3491 38.0667 50.2426 37.892 50.1418 37.7075C50.1418 37.7075 50.1315 37.6719 50.1489 37.6719H55.0148C56.643 37.6719 57.3213 37.7717 58.0421 38.0515C58.2122 38.1145 58.3893 38.1923 58.5771 38.2786C59.622 38.7654 60.33 39.6376 60.6132 40.7565C60.6553 40.9108 60.6821 41.0756 60.7052 41.2405C60.737 41.4578 60.7552 41.684 60.7552 41.918C60.7585 43.6579 59.8841 44.65 58.6746 45.3447C58.6729 45.3475 58.6531 45.359 58.6531 45.359C58.6366 45.3651 58.6366 45.3651 58.6271 45.3729C58.6137 45.3794 58.6019 45.3865 58.5907 45.3932C58.5837 45.3975 58.5768 45.4016 58.5701 45.4052C58.5664 45.4052 58.5486 45.4183 58.5486 45.4183C58.4075 45.4887 58.2687 45.5321 58.1395 45.5636C58.1192 45.5677 58.0998 45.5729 58.0815 45.5778C58.0656 45.582 58.0505 45.5861 58.0367 45.5889V42.1618C57.9921 41.1055 57.0542 40.8294 56.5146 40.8294C56.4976 40.8294 56.48 40.8295 56.4618 40.8297C56.4028 40.8303 56.3382 40.831 56.2678 40.8257Z" fill="#009BC4"/>
-<path d="M52.6526 44.8046C51.8327 44.8361 51.7534 45.5852 51.744 45.732V47.942H54.8232C55.0827 48.32 55.341 48.6942 55.5811 49.0421L55.8541 49.4377C56.2008 49.9323 56.5336 50.3991 56.6719 50.5779C56.6813 50.5903 56.6923 50.6057 56.7051 50.6238C56.8799 50.8693 57.4065 51.6091 59.2248 52.0515C59.89 52.2125 60.623 52.2604 61.033 52.2872C61.1072 52.292 61.1713 52.2962 61.222 52.3002L61.4045 52.3092L61.3851 52.2741C61.3851 52.2741 61.0557 51.8216 60.6395 51.1081L60.5489 50.9525C59.976 49.9692 58.0328 46.6339 57.6598 45.9828C57.3237 45.3957 56.7887 45.1343 56.2413 44.9756H56.2359C55.8437 44.8676 55.4132 44.8263 55.0907 44.8099C55.0765 44.8093 55.0625 44.8084 55.0486 44.8076C55.0243 44.8061 55.0001 44.8046 54.9751 44.8046H52.6526Z" fill="#009BC4"/>
-<path d="M48.9376 44.8052C49.7182 44.8412 49.8252 45.5326 49.838 45.7139V49.2989C49.8203 49.3214 49.8025 49.3443 49.7845 49.3675C49.7073 49.4667 49.627 49.5701 49.5436 49.663C49.3909 49.8303 49.1469 50.0884 49.0552 50.1752C47.3779 51.7625 45.4071 52.3406 43.5688 52.3406C42.0578 52.3406 39.9788 51.8644 38.2078 50.1719C35.2033 47.2885 35.1731 42.6713 38.2062 39.8153C38.768 39.2901 38.9856 39.0937 39.8798 38.5872C41.1137 37.8856 42.5124 37.6426 43.6423 37.6426C44.6343 37.6426 45.7204 37.8565 46.5337 38.1916C46.7232 38.2681 46.937 38.3593 47.2058 38.514C47.9253 38.9288 48.8695 39.6562 49.3413 40.8062V40.8115H40.4672V46.1843C40.5345 47.142 40.7434 47.9022 41.3333 48.4365C41.8097 48.8697 42.5375 49.1536 43.6423 49.2653C43.996 49.3034 44.3924 49.3218 44.8324 49.3218L46.7612 49.3173C46.743 49.3111 46.6699 49.2653 46.4024 48.9339C46.0697 48.5171 45.995 47.8036 45.995 47.2705H45.9933V44.8044L48.9376 44.8052Z" fill="#0053A2"/>
-<path d="M32.5 72L41.5476 68L40.5423 72L49.0873 68L47.5794 72L57.6323 68L56.1243 72L67.6852 68L65.172 72L75.7275 68L74.2196 72L85.2778 68L82.7645 72L92.8175 68L91.8122 72L101.865 68L99.8545 72L110.41 68L108.399 72L118.955 68L116.442 72" stroke="#7B7B7B" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M116.5 72L125.548 68L124.542 72L133.087 68L131.579 72L141.632 68L140.124 72L151.685 68L149.172 72L159.728 68L158.22 72L169.278 68" stroke="#7B7B7B" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M57.5 113L66.5476 109L65.5423 113L74.0873 109L72.5794 113L82.6323 109L81.1243 113L92.6852 109L90.172 113L100.728 109" stroke="#7B7B7B" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M57.5 150L66.5476 146L65.5423 150L74.0873 146L72.5794 150L82.6323 146L81.1243 150L92.6852 146L90.172 150L100.728 146L99.2196 150L110.278 146L107.765 150L117.817 146L116.812 150L126.865 146" stroke="#7B7B7B" stroke-linecap="round" stroke-linejoin="round"/>
-<circle cx="39.5" cy="88" r="6" fill="#0053A2"/>
-<circle cx="39.5" cy="88" r="4.5" fill="#0053A2" stroke="white"/>
-<circle cx="84.5" cy="88" r="5.5" stroke="#0053A2"/>
-<path d="M55.632 88.108C55.632 88.532 55.5613 88.9253 55.42 89.288C55.2787 89.648 55.08 89.96 54.824 90.224C54.568 90.488 54.26 90.6947 53.9 90.844C53.54 90.9907 53.1413 91.064 52.704 91.064C52.2667 91.064 51.8667 90.9907 51.504 90.844C51.144 90.6947 50.8347 90.488 50.576 90.224C50.32 89.96 50.1213 89.648 49.98 89.288C49.8387 88.9253 49.768 88.532 49.768 88.108C49.768 87.684 49.8387 87.292 49.98 86.932C50.1213 86.5693 50.32 86.256 50.576 85.992C50.8347 85.728 51.144 85.5227 51.504 85.376C51.8667 85.2267 52.2667 85.152 52.704 85.152C53.1413 85.152 53.54 85.2267 53.9 85.376C54.26 85.5253 54.568 85.732 54.824 85.996C55.08 86.2573 55.2787 86.5693 55.42 86.932C55.5613 87.292 55.632 87.684 55.632 88.108ZM54.528 88.108C54.528 87.7907 54.4853 87.5067 54.4 87.256C54.3173 87.0027 54.1973 86.788 54.04 86.612C53.8827 86.436 53.6907 86.3013 53.464 86.208C53.24 86.1147 52.9867 86.068 52.704 86.068C52.4213 86.068 52.1667 86.1147 51.94 86.208C51.7133 86.3013 51.52 86.436 51.36 86.612C51.2027 86.788 51.0813 87.0027 50.996 87.256C50.9107 87.5067 50.868 87.7907 50.868 88.108C50.868 88.4253 50.9107 88.7107 50.996 88.964C51.0813 89.2147 51.2027 89.428 51.36 89.604C51.52 89.7773 51.7133 89.9107 51.94 90.004C52.1667 90.0973 52.4213 90.144 52.704 90.144C52.9867 90.144 53.24 90.0973 53.464 90.004C53.6907 89.9107 53.8827 89.7773 54.04 89.604C54.1973 89.428 54.3173 89.2147 54.4 88.964C54.4853 88.7107 54.528 88.4253 54.528 88.108ZM57.3304 86.896V89.504C57.3304 89.7547 57.3878 89.9493 57.5024 90.088C57.6198 90.224 57.7944 90.292 58.0264 90.292C58.1971 90.292 58.3571 90.2547 58.5064 90.18C58.6558 90.1027 58.7971 89.9973 58.9304 89.864V86.896H59.9184V91H59.3144C59.1864 91 59.1024 90.94 59.0624 90.82L58.9944 90.492C58.9091 90.5773 58.8211 90.656 58.7304 90.728C58.6398 90.7973 58.5424 90.8573 58.4384 90.908C58.3371 90.956 58.2264 90.9933 58.1064 91.02C57.9891 91.0493 57.8624 91.064 57.7264 91.064C57.5024 91.064 57.3038 91.0267 57.1304 90.952C56.9598 90.8747 56.8158 90.7667 56.6984 90.628C56.5811 90.4893 56.4918 90.3253 56.4304 90.136C56.3718 89.944 56.3424 89.7333 56.3424 89.504V86.896H57.3304ZM62.0253 86.896V91H61.0373V86.896H62.0253ZM62.1733 85.7C62.1733 85.7853 62.156 85.8653 62.1213 85.94C62.0866 86.0147 62.04 86.08 61.9813 86.136C61.9253 86.192 61.8586 86.2373 61.7813 86.272C61.704 86.304 61.6213 86.32 61.5333 86.32C61.448 86.32 61.3666 86.304 61.2893 86.272C61.2146 86.2373 61.1493 86.192 61.0933 86.136C61.0373 86.08 60.992 86.0147 60.9573 85.94C60.9253 85.8653 60.9093 85.7853 60.9093 85.7C60.9093 85.612 60.9253 85.5293 60.9573 85.452C60.992 85.3747 61.0373 85.308 61.0933 85.252C61.1493 85.196 61.2146 85.152 61.2893 85.12C61.3666 85.0853 61.448 85.068 61.5333 85.068C61.6213 85.068 61.704 85.0853 61.7813 85.12C61.8586 85.152 61.9253 85.196 61.9813 85.252C62.04 85.308 62.0866 85.3747 62.1213 85.452C62.156 85.5293 62.1733 85.612 62.1733 85.7Z" fill="#0053A2"/>
-<path d="M94.648 85.216C94.696 85.216 94.736 85.2187 94.768 85.224C94.8 85.2267 94.828 85.2347 94.852 85.248C94.8787 85.2587 94.904 85.276 94.928 85.3C94.952 85.3213 94.9787 85.3507 95.008 85.388L98.044 89.256C98.0333 89.1627 98.0253 89.072 98.02 88.984C98.0173 88.8933 98.016 88.8093 98.016 88.732V85.216H98.964V91H98.408C98.3227 91 98.252 90.9867 98.196 90.96C98.14 90.9333 98.0853 90.8853 98.032 90.816L95.008 86.964C95.016 87.0493 95.0213 87.1347 95.024 87.22C95.0293 87.3027 95.032 87.3787 95.032 87.448V91H94.084V85.216H94.648ZM101.827 86.832C102.134 86.832 102.411 86.8813 102.659 86.98C102.91 87.0787 103.123 87.2187 103.299 87.4C103.475 87.5813 103.611 87.8027 103.707 88.064C103.803 88.3253 103.851 88.6173 103.851 88.94C103.851 89.2653 103.803 89.5587 103.707 89.82C103.611 90.0813 103.475 90.304 103.299 90.488C103.123 90.672 102.91 90.8133 102.659 90.912C102.411 91.0107 102.134 91.06 101.827 91.06C101.52 91.06 101.242 91.0107 100.991 90.912C100.74 90.8133 100.526 90.672 100.347 90.488C100.171 90.304 100.034 90.0813 99.9349 89.82C99.8389 89.5587 99.7909 89.2653 99.7909 88.94C99.7909 88.6173 99.8389 88.3253 99.9349 88.064C100.034 87.8027 100.171 87.5813 100.347 87.4C100.526 87.2187 100.74 87.0787 100.991 86.98C101.242 86.8813 101.52 86.832 101.827 86.832ZM101.827 90.3C102.168 90.3 102.42 90.1853 102.583 89.956C102.748 89.7267 102.831 89.3907 102.831 88.948C102.831 88.5053 102.748 88.168 102.583 87.936C102.42 87.704 102.168 87.588 101.827 87.588C101.48 87.588 101.224 87.7053 101.059 87.94C100.894 88.172 100.811 88.508 100.811 88.948C100.811 89.388 100.894 89.724 101.059 89.956C101.224 90.1853 101.48 90.3 101.827 90.3ZM104.622 91V86.896H105.226C105.354 86.896 105.438 86.956 105.478 87.076L105.546 87.4C105.628 87.3147 105.715 87.2373 105.806 87.168C105.899 87.0987 105.996 87.0387 106.098 86.988C106.202 86.9373 106.312 86.8987 106.43 86.872C106.547 86.8453 106.675 86.832 106.814 86.832C107.038 86.832 107.236 86.8707 107.41 86.948C107.583 87.0227 107.727 87.1293 107.842 87.268C107.959 87.404 108.047 87.568 108.106 87.76C108.167 87.9493 108.198 88.1587 108.198 88.388V91H107.21V88.388C107.21 88.1373 107.151 87.944 107.034 87.808C106.919 87.6693 106.746 87.6 106.514 87.6C106.343 87.6 106.183 87.6387 106.034 87.716C105.884 87.7933 105.743 87.8987 105.61 88.032V91H104.622Z" fill="#7B7B7B"/>
-<circle cx="63.5" cy="125" r="6" fill="#0053A2"/>
-<circle cx="63.5" cy="125" r="4.5" fill="#0053A2" stroke="white"/>
-<circle cx="108.5" cy="125" r="5.5" stroke="#0053A2"/>
-<path d="M79.632 125.108C79.632 125.532 79.5613 125.925 79.42 126.288C79.2787 126.648 79.08 126.96 78.824 127.224C78.568 127.488 78.26 127.695 77.9 127.844C77.54 127.991 77.1413 128.064 76.704 128.064C76.2667 128.064 75.8667 127.991 75.504 127.844C75.144 127.695 74.8347 127.488 74.576 127.224C74.32 126.96 74.1213 126.648 73.98 126.288C73.8387 125.925 73.768 125.532 73.768 125.108C73.768 124.684 73.8387 124.292 73.98 123.932C74.1213 123.569 74.32 123.256 74.576 122.992C74.8347 122.728 75.144 122.523 75.504 122.376C75.8667 122.227 76.2667 122.152 76.704 122.152C77.1413 122.152 77.54 122.227 77.9 122.376C78.26 122.525 78.568 122.732 78.824 122.996C79.08 123.257 79.2787 123.569 79.42 123.932C79.5613 124.292 79.632 124.684 79.632 125.108ZM78.528 125.108C78.528 124.791 78.4853 124.507 78.4 124.256C78.3173 124.003 78.1973 123.788 78.04 123.612C77.8827 123.436 77.6907 123.301 77.464 123.208C77.24 123.115 76.9867 123.068 76.704 123.068C76.4213 123.068 76.1667 123.115 75.94 123.208C75.7133 123.301 75.52 123.436 75.36 123.612C75.2027 123.788 75.0813 124.003 74.996 124.256C74.9107 124.507 74.868 124.791 74.868 125.108C74.868 125.425 74.9107 125.711 74.996 125.964C75.0813 126.215 75.2027 126.428 75.36 126.604C75.52 126.777 75.7133 126.911 75.94 127.004C76.1667 127.097 76.4213 127.144 76.704 127.144C76.9867 127.144 77.24 127.097 77.464 127.004C77.6907 126.911 77.8827 126.777 78.04 126.604C78.1973 126.428 78.3173 126.215 78.4 125.964C78.4853 125.711 78.528 125.425 78.528 125.108ZM81.3304 123.896V126.504C81.3304 126.755 81.3878 126.949 81.5024 127.088C81.6198 127.224 81.7944 127.292 82.0264 127.292C82.1971 127.292 82.3571 127.255 82.5064 127.18C82.6558 127.103 82.7971 126.997 82.9304 126.864V123.896H83.9184V128H83.3144C83.1864 128 83.1024 127.94 83.0624 127.82L82.9944 127.492C82.9091 127.577 82.8211 127.656 82.7304 127.728C82.6398 127.797 82.5424 127.857 82.4384 127.908C82.3371 127.956 82.2264 127.993 82.1064 128.02C81.9891 128.049 81.8624 128.064 81.7264 128.064C81.5024 128.064 81.3038 128.027 81.1304 127.952C80.9598 127.875 80.8158 127.767 80.6984 127.628C80.5811 127.489 80.4918 127.325 80.4304 127.136C80.3718 126.944 80.3424 126.733 80.3424 126.504V123.896H81.3304ZM86.0253 123.896V128H85.0373V123.896H86.0253ZM86.1733 122.7C86.1733 122.785 86.156 122.865 86.1213 122.94C86.0866 123.015 86.04 123.08 85.9813 123.136C85.9253 123.192 85.8586 123.237 85.7813 123.272C85.704 123.304 85.6213 123.32 85.5333 123.32C85.448 123.32 85.3666 123.304 85.2893 123.272C85.2146 123.237 85.1493 123.192 85.0933 123.136C85.0373 123.08 84.992 123.015 84.9573 122.94C84.9253 122.865 84.9093 122.785 84.9093 122.7C84.9093 122.612 84.9253 122.529 84.9573 122.452C84.992 122.375 85.0373 122.308 85.0933 122.252C85.1493 122.196 85.2146 122.152 85.2893 122.12C85.3666 122.085 85.448 122.068 85.5333 122.068C85.6213 122.068 85.704 122.085 85.7813 122.12C85.8586 122.152 85.9253 122.196 85.9813 122.252C86.04 122.308 86.0866 122.375 86.1213 122.452C86.156 122.529 86.1733 122.612 86.1733 122.7Z" fill="#0053A2"/>
-<path d="M118.648 122.216C118.696 122.216 118.736 122.219 118.768 122.224C118.8 122.227 118.828 122.235 118.852 122.248C118.879 122.259 118.904 122.276 118.928 122.3C118.952 122.321 118.979 122.351 119.008 122.388L122.044 126.256C122.033 126.163 122.025 126.072 122.02 125.984C122.017 125.893 122.016 125.809 122.016 125.732V122.216H122.964V128H122.408C122.323 128 122.252 127.987 122.196 127.96C122.14 127.933 122.085 127.885 122.032 127.816L119.008 123.964C119.016 124.049 119.021 124.135 119.024 124.22C119.029 124.303 119.032 124.379 119.032 124.448V128H118.084V122.216H118.648ZM125.827 123.832C126.134 123.832 126.411 123.881 126.659 123.98C126.91 124.079 127.123 124.219 127.299 124.4C127.475 124.581 127.611 124.803 127.707 125.064C127.803 125.325 127.851 125.617 127.851 125.94C127.851 126.265 127.803 126.559 127.707 126.82C127.611 127.081 127.475 127.304 127.299 127.488C127.123 127.672 126.91 127.813 126.659 127.912C126.411 128.011 126.134 128.06 125.827 128.06C125.52 128.06 125.242 128.011 124.991 127.912C124.74 127.813 124.526 127.672 124.347 127.488C124.171 127.304 124.034 127.081 123.935 126.82C123.839 126.559 123.791 126.265 123.791 125.94C123.791 125.617 123.839 125.325 123.935 125.064C124.034 124.803 124.171 124.581 124.347 124.4C124.526 124.219 124.74 124.079 124.991 123.98C125.242 123.881 125.52 123.832 125.827 123.832ZM125.827 127.3C126.168 127.3 126.42 127.185 126.583 126.956C126.748 126.727 126.831 126.391 126.831 125.948C126.831 125.505 126.748 125.168 126.583 124.936C126.42 124.704 126.168 124.588 125.827 124.588C125.48 124.588 125.224 124.705 125.059 124.94C124.894 125.172 124.811 125.508 124.811 125.948C124.811 126.388 124.894 126.724 125.059 126.956C125.224 127.185 125.48 127.3 125.827 127.3ZM128.622 128V123.896H129.226C129.354 123.896 129.438 123.956 129.478 124.076L129.546 124.4C129.628 124.315 129.715 124.237 129.806 124.168C129.899 124.099 129.996 124.039 130.098 123.988C130.202 123.937 130.312 123.899 130.43 123.872C130.547 123.845 130.675 123.832 130.814 123.832C131.038 123.832 131.236 123.871 131.41 123.948C131.583 124.023 131.727 124.129 131.842 124.268C131.959 124.404 132.047 124.568 132.106 124.76C132.167 124.949 132.198 125.159 132.198 125.388V128H131.21V125.388C131.21 125.137 131.151 124.944 131.034 124.808C130.919 124.669 130.746 124.6 130.514 124.6C130.343 124.6 130.183 124.639 130.034 124.716C129.884 124.793 129.743 124.899 129.61 125.032V128H128.622Z" fill="#7B7B7B"/>
-<circle cx="63.5" cy="163" r="6" fill="#0053A2"/>
-<circle cx="63.5" cy="163" r="4.5" fill="#0053A2" stroke="white"/>
-<circle cx="108.5" cy="163" r="5.5" stroke="#0053A2"/>
-<path d="M79.632 163.108C79.632 163.532 79.5613 163.925 79.42 164.288C79.2787 164.648 79.08 164.96 78.824 165.224C78.568 165.488 78.26 165.695 77.9 165.844C77.54 165.991 77.1413 166.064 76.704 166.064C76.2667 166.064 75.8667 165.991 75.504 165.844C75.144 165.695 74.8347 165.488 74.576 165.224C74.32 164.96 74.1213 164.648 73.98 164.288C73.8387 163.925 73.768 163.532 73.768 163.108C73.768 162.684 73.8387 162.292 73.98 161.932C74.1213 161.569 74.32 161.256 74.576 160.992C74.8347 160.728 75.144 160.523 75.504 160.376C75.8667 160.227 76.2667 160.152 76.704 160.152C77.1413 160.152 77.54 160.227 77.9 160.376C78.26 160.525 78.568 160.732 78.824 160.996C79.08 161.257 79.2787 161.569 79.42 161.932C79.5613 162.292 79.632 162.684 79.632 163.108ZM78.528 163.108C78.528 162.791 78.4853 162.507 78.4 162.256C78.3173 162.003 78.1973 161.788 78.04 161.612C77.8827 161.436 77.6907 161.301 77.464 161.208C77.24 161.115 76.9867 161.068 76.704 161.068C76.4213 161.068 76.1667 161.115 75.94 161.208C75.7133 161.301 75.52 161.436 75.36 161.612C75.2027 161.788 75.0813 162.003 74.996 162.256C74.9107 162.507 74.868 162.791 74.868 163.108C74.868 163.425 74.9107 163.711 74.996 163.964C75.0813 164.215 75.2027 164.428 75.36 164.604C75.52 164.777 75.7133 164.911 75.94 165.004C76.1667 165.097 76.4213 165.144 76.704 165.144C76.9867 165.144 77.24 165.097 77.464 165.004C77.6907 164.911 77.8827 164.777 78.04 164.604C78.1973 164.428 78.3173 164.215 78.4 163.964C78.4853 163.711 78.528 163.425 78.528 163.108ZM81.3304 161.896V164.504C81.3304 164.755 81.3878 164.949 81.5024 165.088C81.6198 165.224 81.7944 165.292 82.0264 165.292C82.1971 165.292 82.3571 165.255 82.5064 165.18C82.6558 165.103 82.7971 164.997 82.9304 164.864V161.896H83.9184V166H83.3144C83.1864 166 83.1024 165.94 83.0624 165.82L82.9944 165.492C82.9091 165.577 82.8211 165.656 82.7304 165.728C82.6398 165.797 82.5424 165.857 82.4384 165.908C82.3371 165.956 82.2264 165.993 82.1064 166.02C81.9891 166.049 81.8624 166.064 81.7264 166.064C81.5024 166.064 81.3038 166.027 81.1304 165.952C80.9598 165.875 80.8158 165.767 80.6984 165.628C80.5811 165.489 80.4918 165.325 80.4304 165.136C80.3718 164.944 80.3424 164.733 80.3424 164.504V161.896H81.3304ZM86.0253 161.896V166H85.0373V161.896H86.0253ZM86.1733 160.7C86.1733 160.785 86.156 160.865 86.1213 160.94C86.0866 161.015 86.04 161.08 85.9813 161.136C85.9253 161.192 85.8586 161.237 85.7813 161.272C85.704 161.304 85.6213 161.32 85.5333 161.32C85.448 161.32 85.3666 161.304 85.2893 161.272C85.2146 161.237 85.1493 161.192 85.0933 161.136C85.0373 161.08 84.992 161.015 84.9573 160.94C84.9253 160.865 84.9093 160.785 84.9093 160.7C84.9093 160.612 84.9253 160.529 84.9573 160.452C84.992 160.375 85.0373 160.308 85.0933 160.252C85.1493 160.196 85.2146 160.152 85.2893 160.12C85.3666 160.085 85.448 160.068 85.5333 160.068C85.6213 160.068 85.704 160.085 85.7813 160.12C85.8586 160.152 85.9253 160.196 85.9813 160.252C86.04 160.308 86.0866 160.375 86.1213 160.452C86.156 160.529 86.1733 160.612 86.1733 160.7Z" fill="#0053A2"/>
-<path d="M118.648 160.216C118.696 160.216 118.736 160.219 118.768 160.224C118.8 160.227 118.828 160.235 118.852 160.248C118.879 160.259 118.904 160.276 118.928 160.3C118.952 160.321 118.979 160.351 119.008 160.388L122.044 164.256C122.033 164.163 122.025 164.072 122.02 163.984C122.017 163.893 122.016 163.809 122.016 163.732V160.216H122.964V166H122.408C122.323 166 122.252 165.987 122.196 165.96C122.14 165.933 122.085 165.885 122.032 165.816L119.008 161.964C119.016 162.049 119.021 162.135 119.024 162.22C119.029 162.303 119.032 162.379 119.032 162.448V166H118.084V160.216H118.648ZM125.827 161.832C126.134 161.832 126.411 161.881 126.659 161.98C126.91 162.079 127.123 162.219 127.299 162.4C127.475 162.581 127.611 162.803 127.707 163.064C127.803 163.325 127.851 163.617 127.851 163.94C127.851 164.265 127.803 164.559 127.707 164.82C127.611 165.081 127.475 165.304 127.299 165.488C127.123 165.672 126.91 165.813 126.659 165.912C126.411 166.011 126.134 166.06 125.827 166.06C125.52 166.06 125.242 166.011 124.991 165.912C124.74 165.813 124.526 165.672 124.347 165.488C124.171 165.304 124.034 165.081 123.935 164.82C123.839 164.559 123.791 164.265 123.791 163.94C123.791 163.617 123.839 163.325 123.935 163.064C124.034 162.803 124.171 162.581 124.347 162.4C124.526 162.219 124.74 162.079 124.991 161.98C125.242 161.881 125.52 161.832 125.827 161.832ZM125.827 165.3C126.168 165.3 126.42 165.185 126.583 164.956C126.748 164.727 126.831 164.391 126.831 163.948C126.831 163.505 126.748 163.168 126.583 162.936C126.42 162.704 126.168 162.588 125.827 162.588C125.48 162.588 125.224 162.705 125.059 162.94C124.894 163.172 124.811 163.508 124.811 163.948C124.811 164.388 124.894 164.724 125.059 164.956C125.224 165.185 125.48 165.3 125.827 165.3ZM128.622 166V161.896H129.226C129.354 161.896 129.438 161.956 129.478 162.076L129.546 162.4C129.628 162.315 129.715 162.237 129.806 162.168C129.899 162.099 129.996 162.039 130.098 161.988C130.202 161.937 130.312 161.899 130.43 161.872C130.547 161.845 130.675 161.832 130.814 161.832C131.038 161.832 131.236 161.871 131.41 161.948C131.583 162.023 131.727 162.129 131.842 162.268C131.959 162.404 132.047 162.568 132.106 162.76C132.167 162.949 132.198 163.159 132.198 163.388V166H131.21V163.388C131.21 163.137 131.151 162.944 131.034 162.808C130.919 162.669 130.746 162.6 130.514 162.6C130.343 162.6 130.183 162.639 130.034 162.716C129.884 162.793 129.743 162.899 129.61 163.032V166H128.622Z" fill="#7B7B7B"/>
-<rect x="74" y="186.5" width="109" height="23" rx="4.5" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M82.25 194.842V203.053C82.25 203.401 82.5298 203.684 82.875 203.684H90.375C90.7202 203.684 91 203.401 91 203.053V194.842C91 194.493 90.7202 194.21 90.375 194.21H82.875C82.5298 194.21 82.25 194.493 82.25 194.842ZM82.875 196.105V203.053H90.375V196.105H82.875Z" fill="#0053A1"/>
-<path d="M84.125 193.579C84.125 193.23 84.4048 192.947 84.75 192.947C85.0952 192.947 85.375 193.23 85.375 193.579V194.21C85.375 194.559 85.0952 194.842 84.75 194.842C84.4048 194.842 84.125 194.559 84.125 194.21V193.579Z" fill="#0053A1"/>
-<path d="M87.875 193.579C87.875 193.23 88.1548 192.947 88.5 192.947C88.8452 192.947 89.125 193.23 89.125 193.579V194.21C89.125 194.559 88.8452 194.842 88.5 194.842C88.1548 194.842 87.875 194.559 87.875 194.21V193.579Z" fill="#0053A1"/>
-<path d="M101.026 198.369L99.2525 195.728H99.9762C100.029 195.728 100.067 195.737 100.092 195.754C100.117 195.772 100.14 195.797 100.16 195.83L101.562 198.005C101.58 197.952 101.606 197.894 101.641 197.831L102.965 195.845C102.987 195.81 103.011 195.782 103.036 195.762C103.064 195.739 103.096 195.728 103.134 195.728H103.827L102.046 198.335L103.887 201.158H103.167C103.112 201.158 103.069 201.144 103.036 201.116C103.006 201.086 102.981 201.053 102.961 201.018L101.521 198.74C101.504 198.793 101.481 198.844 101.454 198.892L100.051 201.018C100.029 201.053 100.002 201.086 99.9725 201.116C99.945 201.144 99.905 201.158 99.8525 201.158H99.1775L101.026 198.369Z" fill="#1B1C22"/>
-<path d="M105.846 198.369L104.072 195.728H104.796C104.848 195.728 104.887 195.737 104.912 195.754C104.937 195.772 104.959 195.797 104.979 195.83L106.382 198.005C106.399 197.952 106.426 197.894 106.461 197.831L107.784 195.845C107.807 195.81 107.831 195.782 107.856 195.762C107.883 195.739 107.916 195.728 107.953 195.728H108.647L106.866 198.335L108.707 201.158H107.987C107.932 201.158 107.888 201.144 107.856 201.116C107.826 201.086 107.801 201.053 107.781 201.018L106.341 198.74C106.323 198.793 106.301 198.844 106.273 198.892L104.871 201.018C104.848 201.053 104.822 201.086 104.792 201.116C104.764 201.144 104.724 201.158 104.672 201.158H103.997L105.846 198.369Z" fill="#1B1C22"/>
-<path d="M109.367 201.238C109.332 201.326 109.28 201.392 109.21 201.435C109.142 201.478 109.072 201.499 109 201.499H108.719L110.972 195.826C111.005 195.745 111.051 195.684 111.111 195.641C111.171 195.598 111.242 195.576 111.325 195.576H111.606L109.367 201.238Z" fill="#1B1C22"/>
-<path d="M113.463 198.369L111.689 195.728H112.413C112.465 195.728 112.504 195.737 112.529 195.754C112.554 195.772 112.577 195.797 112.597 195.83L113.999 198.005C114.017 197.952 114.043 197.894 114.078 197.831L115.402 195.845C115.424 195.81 115.448 195.782 115.473 195.762C115.5 195.739 115.533 195.728 115.57 195.728H116.264L114.483 198.335L116.324 201.158H115.604C115.549 201.158 115.505 201.144 115.473 201.116C115.443 201.086 115.418 201.053 115.398 201.018L113.958 198.74C113.94 198.793 113.918 198.844 113.89 198.892L112.488 201.018C112.465 201.053 112.439 201.086 112.409 201.116C112.382 201.144 112.342 201.158 112.289 201.158H111.614L113.463 198.369Z" fill="#1B1C22"/>
-<path d="M118.282 198.369L116.508 195.728H117.232C117.285 195.728 117.323 195.737 117.348 195.754C117.373 195.772 117.396 195.797 117.416 195.83L118.818 198.005C118.836 197.952 118.862 197.894 118.897 197.831L120.221 195.845C120.243 195.81 120.267 195.782 120.292 195.762C120.32 195.739 120.352 195.728 120.39 195.728H121.083L119.302 198.335L121.143 201.158H120.423C120.368 201.158 120.325 201.144 120.292 201.116C120.262 201.086 120.237 201.053 120.217 201.018L118.777 198.74C118.76 198.793 118.737 198.844 118.71 198.892L117.307 201.018C117.285 201.053 117.258 201.086 117.228 201.116C117.201 201.144 117.161 201.158 117.108 201.158H116.433L118.282 198.369Z" fill="#1B1C22"/>
-<path d="M121.804 201.238C121.769 201.326 121.716 201.392 121.646 201.435C121.579 201.478 121.509 201.499 121.436 201.499H121.155L123.409 195.826C123.441 195.745 123.488 195.684 123.548 195.641C123.608 195.598 123.679 195.576 123.761 195.576H124.043L121.804 201.238Z" fill="#1B1C22"/>
-<path d="M125.899 198.369L124.126 195.728H124.849C124.902 195.728 124.941 195.737 124.966 195.754C124.991 195.772 125.013 195.797 125.033 195.83L126.436 198.005C126.453 197.952 126.479 197.894 126.514 197.831L127.838 195.845C127.861 195.81 127.884 195.782 127.909 195.762C127.937 195.739 127.969 195.728 128.007 195.728H128.701L126.919 198.335L128.761 201.158H128.041C127.986 201.158 127.942 201.144 127.909 201.116C127.879 201.086 127.854 201.053 127.834 201.018L126.394 198.74C126.377 198.793 126.354 198.844 126.327 198.892L124.924 201.018C124.902 201.053 124.876 201.086 124.846 201.116C124.818 201.144 124.778 201.158 124.726 201.158H124.051L125.899 198.369Z" fill="#1B1C22"/>
-<path d="M130.719 198.369L128.945 195.728H129.669C129.721 195.728 129.76 195.737 129.785 195.754C129.81 195.772 129.832 195.797 129.852 195.83L131.255 198.005C131.272 197.952 131.299 197.894 131.334 197.831L132.657 195.845C132.68 195.81 132.704 195.782 132.729 195.762C132.756 195.739 132.789 195.728 132.826 195.728H133.52L131.739 198.335L133.58 201.158H132.86C132.805 201.158 132.761 201.144 132.729 201.116C132.699 201.086 132.674 201.053 132.654 201.018L131.214 198.74C131.196 198.793 131.174 198.844 131.146 198.892L129.744 201.018C129.721 201.053 129.695 201.086 129.665 201.116C129.637 201.144 129.597 201.158 129.545 201.158H128.87L130.719 198.369Z" fill="#1B1C22"/>
-<path d="M135.538 198.369L133.764 195.728H134.488C134.54 195.728 134.579 195.737 134.604 195.754C134.629 195.772 134.652 195.797 134.672 195.83L136.074 198.005C136.092 197.952 136.118 197.894 136.153 197.831L137.477 195.845C137.499 195.81 137.523 195.782 137.548 195.762C137.575 195.739 137.608 195.728 137.645 195.728H138.339L136.558 198.335L138.399 201.158H137.679C137.624 201.158 137.58 201.144 137.548 201.116C137.518 201.086 137.493 201.053 137.473 201.018L136.033 198.74C136.015 198.793 135.993 198.844 135.965 198.892L134.563 201.018C134.54 201.053 134.514 201.086 134.484 201.116C134.457 201.144 134.417 201.158 134.364 201.158H133.689L135.538 198.369Z" fill="#1B1C22"/>
-<path d="M140.357 198.369L138.584 195.728H139.307C139.36 195.728 139.399 195.737 139.424 195.754C139.449 195.772 139.471 195.797 139.491 195.83L140.894 198.005C140.911 197.952 140.937 197.894 140.972 197.831L142.296 195.845C142.319 195.81 142.342 195.782 142.367 195.762C142.395 195.739 142.427 195.728 142.465 195.728H143.159L141.377 198.335L143.219 201.158H142.499C142.444 201.158 142.4 201.144 142.367 201.116C142.337 201.086 142.312 201.053 142.292 201.018L140.852 198.74C140.835 198.793 140.812 198.844 140.785 198.892L139.382 201.018C139.36 201.053 139.334 201.086 139.304 201.116C139.276 201.144 139.236 201.158 139.184 201.158H138.509L140.357 198.369Z" fill="#1B1C22"/>
-<rect x="74" y="186.5" width="109" height="23" rx="4.5" stroke="#909090"/>
-<path d="M34.5 196L40.3605 192L39.7093 196L45.2442 192L44.2674 196L50.7791 192L49.8023 196L57.2907 192L55.6628 196L62.5 192" stroke="#7B7B7B" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M34.5 207L40.3605 203L39.7093 207L45.2442 203L44.2674 207L50.7791 203L49.8023 207L57.2907 203L55.6628 207L62.5 203" stroke="#7B7B7B" stroke-linecap="round" stroke-linejoin="round"/>
-<defs>
-<filter id="filter0_f_1394_2484" x="0.5" y="0" width="210" height="247" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feGaussianBlur stdDeviation="9" result="effect1_foregroundBlur_1394_2484"/>
-</filter>
-</defs>
-</svg>
diff --git a/src/assets/png/temperatures/cold.svg b/src/assets/png/temperatures/cold.svg
new file mode 100644
index 0000000000000000000000000000000000000000..e466a2bbefc073668f9c368d6fb8caf0fa6803f8
--- /dev/null
+++ b/src/assets/png/temperatures/cold.svg
@@ -0,0 +1,36 @@
+<svg width="288" height="60" viewBox="0 0 288 60" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_15704_1893)">
+<g opacity="0.5" filter="url(#filter0_d_15704_1893)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M256.694 67.2605C256.671 67.2607 256.647 67.2608 256.623 67.2608C251.596 67.2608 247.521 62.8458 247.521 57.3997C247.521 51.9536 251.596 47.5387 256.623 47.5387C256.672 47.5387 256.721 47.5391 256.77 47.5399C257.884 38.9789 265.205 32.3674 274.07 32.3674C280.755 32.3674 286.562 36.1277 289.491 41.6485C290.15 41.531 290.826 41.4699 291.516 41.4699C298.219 41.4699 303.653 47.2433 303.653 54.3651C303.653 61.4869 298.219 67.2602 291.516 67.2603V67.2605H256.694Z" fill="#4D5C6E"/>
+</g>
+<path opacity="0.5" fill-rule="evenodd" clip-rule="evenodd" d="M195.958 67.2605C195.982 67.2607 196.005 67.2608 196.029 67.2608C201.057 67.2608 205.132 62.8458 205.132 57.3997C205.132 51.9536 201.057 47.5387 196.029 47.5387C195.98 47.5387 195.931 47.5391 195.882 47.5399C194.768 38.9789 187.447 32.3674 178.583 32.3674C171.897 32.3674 166.09 36.1277 163.161 41.6485C162.503 41.531 161.826 41.4699 161.136 41.4699C154.433 41.4699 149 47.2433 149 54.3651C149 61.4869 154.433 67.2602 161.136 67.2603V67.2605H195.958Z" fill="#4D5C6E"/>
+<g filter="url(#filter1_d_15704_1893)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M189.232 77.5223C189.207 77.5224 189.182 77.5225 189.157 77.5225C180.582 77.5225 173.63 69.9913 173.63 60.7011C173.63 51.4109 180.582 43.8797 189.157 43.8797C189.241 43.8797 189.325 43.8804 189.408 43.8819C191.309 29.2782 203.797 18 218.919 18C230.323 18 240.229 24.4144 245.226 33.8322C246.349 33.6318 247.502 33.5275 248.679 33.5275C260.113 33.5275 269.382 43.376 269.382 55.5247C269.382 67.6733 260.113 77.5218 248.68 77.5219V77.5223H189.232Z" fill="#4D5C6E"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_d_15704_1893" x="225.021" y="17.8674" width="101.132" height="79.8933" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="8"/>
+<feGaussianBlur stdDeviation="11.25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_15704_1893"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_15704_1893" result="shape"/>
+</filter>
+<filter id="filter1_d_15704_1893" x="151.13" y="3.5" width="140.753" height="104.522" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="8"/>
+<feGaussianBlur stdDeviation="11.25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_15704_1893"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_15704_1893" result="shape"/>
+</filter>
+<clipPath id="clip0_15704_1893">
+<rect width="288" height="60" rx="4" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/png/temperatures/hot.svg b/src/assets/png/temperatures/hot.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5e817db1668234ab5d9ec226d2ee9902e12fce27
--- /dev/null
+++ b/src/assets/png/temperatures/hot.svg
@@ -0,0 +1,48 @@
+<svg width="288" height="60" viewBox="0 0 288 60" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_15704_1892)">
+<g filter="url(#filter0_d_15704_1892)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M251.15 67.2604C251.125 67.2605 251.1 67.2606 251.075 67.2606C244.843 67.2606 239.79 61.787 239.79 55.0349C239.79 48.2828 244.843 42.8092 251.075 42.8092C251.136 42.8092 251.197 42.8097 251.257 42.8107C252.639 32.1969 261.715 24 272.705 24C280.994 24 288.194 28.662 291.825 35.5067C292.641 35.3611 293.48 35.2853 294.335 35.2853C302.645 35.2853 309.382 42.4432 309.382 51.2728C309.382 60.1023 302.646 67.26 294.336 67.2603V67.2604H251.15Z" fill="white"/>
+</g>
+<g filter="url(#filter1_d_15704_1892)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M164.174 73.893C164.15 73.8932 164.126 73.8933 164.102 73.8933C159.075 73.8933 155 69.4784 155 64.0323C155 58.5862 159.075 54.1712 164.102 54.1712C164.152 54.1712 164.201 54.1717 164.25 54.1725C165.364 45.6115 172.684 39 181.549 39C188.234 39 194.042 42.7602 196.971 48.2811C197.629 48.1636 198.306 48.1024 198.995 48.1024C205.698 48.1024 211.132 53.8758 211.132 60.9977C211.132 68.1194 205.698 73.8928 198.996 73.8929V73.893H164.174Z" fill="white" fill-opacity="0.35" shape-rendering="crispEdges"/>
+</g>
+<g filter="url(#filter2_d_15704_1892)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M200.602 77.5223C200.577 77.5224 200.552 77.5225 200.527 77.5225C191.952 77.5225 185 69.9913 185 60.7011C185 51.4109 191.952 43.8797 200.527 43.8797C200.611 43.8797 200.695 43.8804 200.778 43.8819C202.679 29.2782 215.167 18 230.289 18C241.693 18 251.599 24.4144 256.596 33.8322C257.719 33.6318 258.873 33.5275 260.049 33.5275C271.483 33.5275 280.753 43.376 280.753 55.5247C280.753 67.6733 271.484 77.5218 260.05 77.5219V77.5223H200.602Z" fill="white"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_d_15704_1892" x="217.29" y="9.5" width="114.592" height="88.2606" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="8"/>
+<feGaussianBlur stdDeviation="11.25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_15704_1892"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_15704_1892" result="shape"/>
+</filter>
+<filter id="filter1_d_15704_1892" x="132.5" y="24.5" width="101.132" height="79.8933" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="8"/>
+<feGaussianBlur stdDeviation="11.25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_15704_1892"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_15704_1892" result="shape"/>
+</filter>
+<filter id="filter2_d_15704_1892" x="162.5" y="3.5" width="140.753" height="104.522" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="8"/>
+<feGaussianBlur stdDeviation="11.25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_15704_1892"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_15704_1892" result="shape"/>
+</filter>
+<clipPath id="clip0_15704_1892">
+<rect width="288" height="60" rx="4" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/components/Action/ActionBegin/ActionBegin.spec.tsx b/src/components/Action/ActionBegin/ActionBegin.spec.tsx
index f4e0ba50d1ed2e4016e6142ab11685a0f3bf6ede..99bab9320fa6c3606ad87e4aa26ae48d12fb5808 100644
--- a/src/components/Action/ActionBegin/ActionBegin.spec.tsx
+++ b/src/components/Action/ActionBegin/ActionBegin.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -62,8 +62,7 @@ describe('ActionBegin component', () => {
</Provider>
)
await waitFor(() => null, { container })
- const title = screen.getByRole('heading')
- expect(title).toHaveTextContent('Coup de vent')
+ expect(screen.getByText('Coup de vent')).toBeInTheDocument()
})
it('should open launch Modal', async () => {
const store = createMockEcolyoStore({
@@ -71,7 +70,7 @@ describe('ActionBegin component', () => {
profile: mockProfileState,
})
- render(
+ const { container } = render(
<Provider store={store}>
<ActionBegin
action={defaultEcogestureData[1]}
@@ -80,7 +79,10 @@ describe('ActionBegin component', () => {
/>
</Provider>
)
- await userEvent.click(await screen.findByText('action.apply'))
+ await waitFor(() => null, { container })
+ await act(async () => {
+ await userEvent.click(screen.getByText('action.apply'))
+ })
expect(await screen.findByRole('dialog')).toBeInTheDocument()
})
})
diff --git a/src/components/Action/ActionBegin/ActionBegin.tsx b/src/components/Action/ActionBegin/ActionBegin.tsx
index 50281d6965e06d6d98e6d0653ae37a159d685318..880b904f839394e15b920153a6111dceab912ad9 100644
--- a/src/components/Action/ActionBegin/ActionBegin.tsx
+++ b/src/components/Action/ActionBegin/ActionBegin.tsx
@@ -6,7 +6,7 @@ import StarsContainer from 'components/CommonKit/StarsContainer/StarsContainer'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { Ecogesture, UserChallenge } from 'models'
-import React, { useCallback, useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
import ActionService from 'services/action.service'
import { useAppSelector } from 'store/hooks'
import { importIconById } from 'utils/utils'
@@ -33,25 +33,26 @@ const ActionBegin = ({
const [actionIcon, setActionIcon] = useState<string>('')
const [openLaunchModal, setOpenLaunchModal] = useState<boolean>(false)
- const toggleLaunchModal = useCallback(() => {
- setOpenLaunchModal(prev => !prev)
- }, [])
-
useEffect(() => {
let subscribed = true
const getAction = async () => {
- if (action) {
- if (subscribed) setCurrentAction(action)
- } else {
- const actionService = new ActionService(client)
- let actions: Ecogesture[] = []
- if (isProfileTypeCompleted) {
- actions = await actionService.getCustomActions(fluidTypes)
+ if (subscribed) {
+ if (action) {
+ setCurrentAction(action)
+ const icon = await importIconById(action.id, 'ecogesture')
+ setActionIcon(icon || defaultIcon)
} else {
- actions = await actionService.getDefaultActions()
- }
- if (subscribed) {
+ const actionService = new ActionService(client)
+ let actions: Ecogesture[] = []
+ if (isProfileTypeCompleted) {
+ actions = await actionService.getCustomActions(fluidTypes)
+ } else {
+ actions = await actionService.getDefaultActions()
+ }
+
setCurrentAction(actions[0])
+ const icon = await importIconById(actions[0].id, 'ecogesture')
+ setActionIcon(icon || defaultIcon)
}
}
}
@@ -61,16 +62,6 @@ const ActionBegin = ({
}
}, [action, client, fluidTypes, isProfileTypeCompleted])
- useEffect(() => {
- async function handleEcogestureIcon() {
- if (currentAction) {
- const icon = await importIconById(currentAction.id, 'ecogesture')
- setActionIcon(icon || defaultIcon)
- }
- }
- handleEcogestureIcon()
- }, [currentAction])
-
return (
<div className="action-begin">
{currentAction && (
@@ -97,7 +88,10 @@ const ActionBegin = ({
{currentAction.actionName}
</div>
<div className="action-buttons">
- <Button onClick={toggleLaunchModal} className="btnSecondary">
+ <Button
+ onClick={() => setOpenLaunchModal(true)}
+ className="btnSecondary"
+ >
{t('action.apply')}
</Button>
<Button
@@ -111,7 +105,7 @@ const ActionBegin = ({
<ActionModal
open={openLaunchModal}
action={currentAction}
- handleCloseClick={toggleLaunchModal}
+ handleCloseClick={() => setOpenLaunchModal(false)}
userChallenge={userChallenge}
/>
</div>
diff --git a/src/components/Action/ActionCard/ActionCard.spec.tsx b/src/components/Action/ActionCard/ActionCard.spec.tsx
index 6da3d6ac9cbbf3d88c792275d9ff1d3878f25f85..44a22ec8a316dfd5f773800f83fed2f55f3d8fb8 100644
--- a/src/components/Action/ActionCard/ActionCard.spec.tsx
+++ b/src/components/Action/ActionCard/ActionCard.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -27,7 +27,7 @@ describe('ActionCard component', () => {
expect(container).toMatchSnapshot()
})
it('should open Ecogesture modal', async () => {
- render(
+ const { container } = render(
<Provider store={store}>
<ActionCard
setShowList={jest.fn()}
@@ -36,7 +36,10 @@ describe('ActionCard component', () => {
/>
</Provider>
)
- await userEvent.click(await screen.findByRole('button'))
+ await waitFor(() => null, { container })
+ await act(async () => {
+ await userEvent.click(await screen.findByRole('button'))
+ })
expect(await screen.findByRole('dialog')).toBeInTheDocument()
})
})
diff --git a/src/components/Action/ActionCard/ActionCard.tsx b/src/components/Action/ActionCard/ActionCard.tsx
index b14f909d5324041a112bc3a0538d48ef63028282..75c04ea0859f46faea90b98aef4471bc12c22e2c 100644
--- a/src/components/Action/ActionCard/ActionCard.tsx
+++ b/src/components/Action/ActionCard/ActionCard.tsx
@@ -20,15 +20,12 @@ const ActionCard = ({
}: ActionCardProps) => {
const [actionIcon, setActionIcon] = useState<string>('')
const [openEcogestureModal, setOpenEcogestureModal] = useState<boolean>(false)
- const toggleModal = useCallback(() => {
- setOpenEcogestureModal(prev => !prev)
- }, [])
const selectEcogesture = useCallback(() => {
setSelectedAction(action)
setShowList(false)
- toggleModal()
- }, [setSelectedAction, setShowList, action, toggleModal])
+ setOpenEcogestureModal(false)
+ }, [setSelectedAction, setShowList, action])
useEffect(() => {
async function handleEcogestureIcon() {
@@ -41,7 +38,11 @@ const ActionCard = ({
return (
<>
{action && (
- <Button key={action.id} className="action-card" onClick={toggleModal}>
+ <Button
+ key={action.id}
+ className="action-card"
+ onClick={() => setOpenEcogestureModal(true)}
+ >
<StyledIcon className="action-icon" icon={actionIcon} size={100} />
<div className="action-title text-18-bold">{action.shortName}</div>
</Button>
@@ -51,7 +52,7 @@ const ActionCard = ({
open={openEcogestureModal}
ecogesture={action}
isAction={true}
- handleCloseClick={toggleModal}
+ handleCloseClick={() => setOpenEcogestureModal(false)}
selectEcogesture={selectEcogesture}
/>
)}
diff --git a/src/components/Action/ActionChoose/ActionChoose.spec.tsx b/src/components/Action/ActionChoose/ActionChoose.spec.tsx
index c7f251918247054dcc6f0eacbb711aa37269d06c..a2c2d2e7044d32f9d9e851322570d572a008055c 100644
--- a/src/components/Action/ActionChoose/ActionChoose.spec.tsx
+++ b/src/components/Action/ActionChoose/ActionChoose.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -12,6 +12,8 @@ import {
import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock'
import ActionChoose from './ActionChoose'
+jest.mock('components/Action/ActionList/ActionList', () => 'mock-ActionList')
+
jest.mock('services/ecogesture.service', () => {
return jest.fn(() => ({
getEcogesturesByIds: jest.fn(() => []),
@@ -65,8 +67,13 @@ describe('ActionChoose component', () => {
<ActionChoose userChallenge={userChallengeData[1]} />
</Provider>
)
- await userEvent.click(await screen.findByText('action.other'))
- const elements = container.getElementsByClassName('action-list-container')
- expect(elements.item(0)).toBeInTheDocument()
+ await waitFor(() => null, { container })
+
+ await act(async () => {
+ await userEvent.click(await screen.findByText('action.other'))
+ })
+
+ const list = container.getElementsByTagName('mock-ActionList')[0]
+ expect(list).toBeInTheDocument()
})
})
diff --git a/src/components/Action/ActionChoose/__snapshots__/ActionChoose.spec.tsx.snap b/src/components/Action/ActionChoose/__snapshots__/ActionChoose.spec.tsx.snap
index 07ca33e2f1dac1835822ac668fee8ee5fbe887ed..972120fc6cbd97a5941b146281b3b840ce9628ab 100644
--- a/src/components/Action/ActionChoose/__snapshots__/ActionChoose.spec.tsx.snap
+++ b/src/components/Action/ActionChoose/__snapshots__/ActionChoose.spec.tsx.snap
@@ -21,7 +21,7 @@ exports[`ActionChoose component should render correctly 1`] = `
width="100"
>
<use
- xlink:href="#"
+ xlink:href="#test-file-stub"
/>
</svg>
</div>
diff --git a/src/components/Action/ActionDone/ActionDone.spec.tsx b/src/components/Action/ActionDone/ActionDone.spec.tsx
index 09c2d698ff27ff4764736c633b536282298775cc..038a6dd206fee247504430ae81e435a579e305b0 100644
--- a/src/components/Action/ActionDone/ActionDone.spec.tsx
+++ b/src/components/Action/ActionDone/ActionDone.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -35,7 +35,9 @@ describe('ActionDone component', () => {
<ActionDone currentChallenge={userChallengeData[1]} />
</Provider>
)
- await userEvent.click(await screen.findByText('action.ok'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('action.ok'))
+ })
expect(updateChallengeSpy).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Action/ActionList/ActionList.tsx b/src/components/Action/ActionList/ActionList.tsx
index b79e28bc2c2ebf569577c2506278007f063d01a9..4de937d4c78d4e6741f67eccfde57092f139ff63 100644
--- a/src/components/Action/ActionList/ActionList.tsx
+++ b/src/components/Action/ActionList/ActionList.tsx
@@ -43,16 +43,14 @@ const ActionList = ({ setSelectedAction, setShowList }: ActionListProps) => {
<>
{actions && (
<div className="action-list-container">
- {actions.map(action => {
- return (
- <ActionCard
- key={action.id}
- action={action}
- setSelectedAction={setSelectedAction}
- setShowList={setShowList}
- />
- )
- })}
+ {actions.map(action => (
+ <ActionCard
+ key={action.id}
+ action={action}
+ setSelectedAction={setSelectedAction}
+ setShowList={setShowList}
+ />
+ ))}
</div>
)}
</>
diff --git a/src/components/Action/ActionModal/ActionModal.spec.tsx b/src/components/Action/ActionModal/ActionModal.spec.tsx
index a3c59c54d2523c2f93e0c264740a6389efe9afd2..138d005c3e36aa4cecbea8a50376afe0ac90490b 100644
--- a/src/components/Action/ActionModal/ActionModal.spec.tsx
+++ b/src/components/Action/ActionModal/ActionModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -47,7 +47,9 @@ describe('ActionModal component', () => {
/>
</Provider>
)
- await userEvent.click(await screen.findByText('action_modal.accept'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('action_modal.accept'))
+ })
expect(updateChallengeSpy).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Action/ActionOnGoing/ActionOnGoing.spec.tsx b/src/components/Action/ActionOnGoing/ActionOnGoing.spec.tsx
index 899e6e3cdeb3b9216ac26e2433901bf913bc08cb..ed1789703e930b669c776175fc812a17f48beef9 100644
--- a/src/components/Action/ActionOnGoing/ActionOnGoing.spec.tsx
+++ b/src/components/Action/ActionOnGoing/ActionOnGoing.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { UserActionState } from 'enums'
import { DateTime } from 'luxon'
@@ -39,13 +39,14 @@ describe('ActionOnGoing component', () => {
state: UserActionState.ONGOING,
}
- const { container } = render(
+ render(
<Provider store={store}>
<ActionOnGoing userAction={userAction1} />
</Provider>
)
- await waitFor(() => null, { container })
- await userEvent.click(await screen.findByText('action.details'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('action.details'))
+ })
expect(screen.findByRole('dialog')).toBeTruthy()
})
})
diff --git a/src/components/Action/ActionOnGoing/ActionOnGoing.tsx b/src/components/Action/ActionOnGoing/ActionOnGoing.tsx
index 81d15d6abb3eaec8e75a98ac99d64f00f6799e3b..d6e36fe48ae9a4b8bf74a0f70a781d28018d2842 100644
--- a/src/components/Action/ActionOnGoing/ActionOnGoing.tsx
+++ b/src/components/Action/ActionOnGoing/ActionOnGoing.tsx
@@ -12,10 +12,6 @@ const ActionOnGoing = ({ userAction }: { userAction: UserAction }) => {
const { t } = useI18n()
const [openEcogestureModal, setOpenEcogestureModal] = useState<boolean>(false)
- const toggleEcogestureModal = useCallback(() => {
- setOpenEcogestureModal(prev => !prev)
- }, [setOpenEcogestureModal])
-
const setGradient = useCallback(() => {
if (!userAction.startDate || !userAction.ecogesture) return null
@@ -88,14 +84,17 @@ const ActionOnGoing = ({ userAction }: { userAction: UserAction }) => {
</div>
<div className="result-title text-18-bold"> {t('action.result')}</div>
<div className="result-date text-24-bold">{getResultDate()}</div>
- <Button className="btnSecondary" onClick={toggleEcogestureModal}>
+ <Button
+ className="btnSecondary"
+ onClick={() => setOpenEcogestureModal(true)}
+ >
{t('action.details')}
</Button>
<EcogestureModal
open={openEcogestureModal}
ecogesture={userAction.ecogesture}
isAction={false}
- handleCloseClick={toggleEcogestureModal}
+ handleCloseClick={() => setOpenEcogestureModal(false)}
/>
</>
)}
diff --git a/src/components/Action/ActionView.tsx b/src/components/Action/ActionView.tsx
index 705a66031d0b2d791d1041f7bc8f874c019f5ace..7b5fbab5d6852111c2d6781d1045870ecc459227 100644
--- a/src/components/Action/ActionView.tsx
+++ b/src/components/Action/ActionView.tsx
@@ -3,7 +3,7 @@ import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import { UserActionState } from 'enums'
import { UserChallenge } from 'models'
-import React, { useState } from 'react'
+import React from 'react'
import { useAppSelector } from 'store/hooks'
import ActionChoose from './ActionChoose/ActionChoose'
import ActionDone from './ActionDone/ActionDone'
@@ -11,7 +11,6 @@ import ActionOnGoing from './ActionOnGoing/ActionOnGoing'
const ActionView = () => {
const { currentChallenge } = useAppSelector(state => state.ecolyo.challenge)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const renderAction = (challenge: UserChallenge) => {
switch (challenge.action.state) {
@@ -29,14 +28,8 @@ const ActionView = () => {
return (
<>
<CozyBar titleKey="common.title_action" displayBackArrow={true} />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_action"
- displayBackArrow={true}
- />
- <Content heightOffset={headerHeight}>
- {currentChallenge && renderAction(currentChallenge)}
- </Content>
+ <Header desktopTitleKey="common.title_action" displayBackArrow={true} />
+ <Content>{currentChallenge && renderAction(currentChallenge)}</Content>
</>
)
}
diff --git a/src/components/Action/__snapshots__/ActionView.spec.tsx.snap b/src/components/Action/__snapshots__/ActionView.spec.tsx.snap
index 6197c430c16f23523cbf9163f61e433bc862f146..cd7ed71bda2e62a0f90c8c17df8c29aee1794b1d 100644
--- a/src/components/Action/__snapshots__/ActionView.spec.tsx.snap
+++ b/src/components/Action/__snapshots__/ActionView.spec.tsx.snap
@@ -10,9 +10,7 @@ exports[`ActionView component should render match snapshot with "Notification" s
desktoptitlekey="common.title_action"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<mock-action-done
currentchallenge="[object Object]"
/>
@@ -30,9 +28,7 @@ exports[`ActionView component should render match snapshot with "Unstarted" stat
desktoptitlekey="common.title_action"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<mock-action-choose
userchallenge="[object Object]"
/>
@@ -50,9 +46,7 @@ exports[`ActionView component should render match snapshot with "onGoing" state
desktoptitlekey="common.title_action"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<mock-action-ongoing
useraction="[object Object]"
/>
@@ -70,9 +64,7 @@ exports[`ActionView component should render match snapshot with default case 1`]
desktoptitlekey="common.title_action"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<mock-action-choose
userchallenge="[object Object]"
/>
diff --git a/src/components/Analysis/AnalysisView.tsx b/src/components/Analysis/AnalysisView.tsx
index 0047d6c501a1a73776a2652111f7b460de643e6e..85e543aca28f0ce4ed04e8fab04ce12505fd3326 100644
--- a/src/components/Analysis/AnalysisView.tsx
+++ b/src/components/Analysis/AnalysisView.tsx
@@ -26,7 +26,6 @@ const AnalysisView = () => {
profile: { monthlyAnalysisDate, mailToken },
} = useAppSelector(state => state.ecolyo)
const dispatch = useAppDispatch()
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const dateChartService = new DateChartService()
@@ -106,10 +105,7 @@ const AnalysisView = () => {
return (
<>
<CozyBar titleKey="common.title_analysis" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_analysis"
- >
+ <Header desktopTitleKey="common.title_analysis">
<DateNavigator
disableNext={isLastDateReached(analysisMonth, TimeStep.MONTH)}
disablePrev={false}
@@ -120,7 +116,7 @@ const AnalysisView = () => {
timeStep={TimeStep.MONTH}
/>
</Header>
- <Content heightOffset={headerHeight}>
+ <Content>
<MonthlyAnalysis
saveLastScrollPosition={saveLastScrollPosition}
scrollPosition={scrollPosition}
diff --git a/src/components/Analysis/Comparison/Comparison.tsx b/src/components/Analysis/Comparison/Comparison.tsx
index 78f6ecac820f8256cb0fcaebae26b5e6072a29ed..927e1094cc8bbcc529ba7d64f38a38e36b8bae5c 100644
--- a/src/components/Analysis/Comparison/Comparison.tsx
+++ b/src/components/Analysis/Comparison/Comparison.tsx
@@ -9,6 +9,7 @@ import ConsumptionService from 'services/consumption.service'
import { setPeriod } from 'store/analysis/analysis.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import FluidPerformanceIndicator from './FluidPerformanceIndicator'
+import TemperatureComparison from './TemperatureComparison'
import './comparison.scss'
const Comparison = ({
@@ -20,11 +21,11 @@ const Comparison = ({
}) => {
const { t } = useI18n()
const client = useClient()
+ const dispatch = useAppDispatch()
const {
global: { fluidTypes },
analysis: { period, analysisMonth },
} = useAppSelector(state => state.ecolyo)
- const dispatch = useAppDispatch()
const [yearPerformanceIndicators, setYearPerformanceIndicators] = useState<
PerformanceIndicator[]
>([])
@@ -33,6 +34,7 @@ const Comparison = ({
() => new ConsumptionService(client),
[client]
)
+
const periods = useMemo(() => {
return {
monthPeriod: {
@@ -49,6 +51,7 @@ const Comparison = ({
},
}
}, [analysisMonth])
+
const NAVIGATION_HEIGHT = 40
const loaderPlaceholderHeight =
fluidsWithData.length * 84 +
@@ -125,7 +128,7 @@ const Comparison = ({
<Loader />
</div>
)}
-
+ {!isLoading && <TemperatureComparison />}
{/* Placeholder when no data is found */}
{!isLoading &&
fluidsWithData.length === 0 &&
diff --git a/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx b/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
index 84ede422be562056cbcffbd4f54222ce1ebed52d..1c193147dcb6a8ffa8fd59981205e30b4e9357e6 100644
--- a/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
+++ b/src/components/Analysis/Comparison/FluidPerformanceIndicator.tsx
@@ -1,11 +1,14 @@
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { FluidType } from 'enums'
+import { FluidType, TimeStep } from 'enums'
import { DateTime } from 'luxon'
import { PerformanceIndicator } from 'models'
import React from 'react'
+import { useNavigate } from 'react-router-dom'
+import { setCurrentTimeStep, setShowCompare } from 'store/chart/chart.slice'
+import { useAppDispatch, useAppSelector } from 'store/hooks'
import { getPicto } from 'utils/picto'
-import { formatNumberValues, getMonthName } from 'utils/utils'
+import { formatNumberValues, getFluidName, getMonthName } from 'utils/utils'
import './fluidPerformanceIndicator.scss'
interface FluidPerformanceIndicatorProps {
@@ -20,6 +23,10 @@ const FluidPerformanceIndicator = ({
comparisonDate,
}: FluidPerformanceIndicatorProps) => {
const { t } = useI18n()
+ const navigate = useNavigate()
+ const dispatch = useAppDispatch()
+ const { period } = useAppSelector(state => state.ecolyo.analysis)
+
const iconType = getPicto(fluidType)
const displayedValue = performanceIndicator?.value
? formatNumberValues(performanceIndicator.value).toString()
@@ -35,8 +42,20 @@ const FluidPerformanceIndicator = ({
}
}
+ const handleFluidClick = (fluid: FluidType) => {
+ const fluidName = getFluidName(fluid)
+ const url = `/consumption/${fluidName}`
+ dispatch(setCurrentTimeStep(TimeStep.MONTH))
+ if (period === 'year') {
+ dispatch(setShowCompare(true))
+ } else {
+ dispatch(setShowCompare(false))
+ }
+ navigate(url)
+ }
+
return (
- <div className="fpi">
+ <button className="fpi" onClick={() => handleFluidClick(fluidType)}>
<StyledIcon icon={iconType} size={50} />
<div className="fpi-content">
{!displayedValue && (
@@ -72,7 +91,7 @@ const FluidPerformanceIndicator = ({
</>
)}
</div>
- </div>
+ </button>
)
}
diff --git a/src/components/Analysis/Comparison/TemperatureComparison.spec.tsx b/src/components/Analysis/Comparison/TemperatureComparison.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8d3383f30fbf92a4b590a9677db2eb2d621d8408
--- /dev/null
+++ b/src/components/Analysis/Comparison/TemperatureComparison.spec.tsx
@@ -0,0 +1,75 @@
+import { act, render, screen, waitFor } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
+import { DateTime } from 'luxon'
+import React from 'react'
+import { Provider } from 'react-redux'
+import { createMockEcolyoStore } from 'tests/__mocks__/store'
+import TemperatureComparison from './TemperatureComparison'
+
+const mockFetchAvgTemperature = jest.fn<Promise<number | null>, []>()
+jest.mock('services/consumption.service', () => {
+ return jest.fn(() => ({
+ fetchAvgTemperature: mockFetchAvgTemperature,
+ }))
+})
+
+jest
+ .spyOn(DateTime.prototype, 'toLocaleString')
+ .mockReturnValue('novembre 2022')
+
+describe('TemperatureComparison component', () => {
+ const store = createMockEcolyoStore()
+ afterEach(() => {
+ jest.clearAllMocks()
+ })
+ it('should be rendered correctly with hot result', async () => {
+ mockFetchAvgTemperature.mockResolvedValueOnce(1)
+ mockFetchAvgTemperature.mockResolvedValueOnce(2)
+ const { container } = render(
+ <Provider store={store}>
+ <TemperatureComparison />
+ </Provider>
+ )
+ await waitFor(() => null, { container })
+ expect(container).toMatchSnapshot()
+ })
+ it('should be rendered correctly with cold result', async () => {
+ mockFetchAvgTemperature.mockResolvedValueOnce(2)
+ mockFetchAvgTemperature.mockResolvedValueOnce(1)
+ const { container } = render(
+ <Provider store={store}>
+ <TemperatureComparison />
+ </Provider>
+ )
+ await waitFor(() => null, { container })
+ expect(container).toMatchSnapshot()
+ })
+ it('should be rendered correctly with no data', async () => {
+ mockFetchAvgTemperature.mockResolvedValueOnce(null)
+ mockFetchAvgTemperature.mockResolvedValueOnce(0)
+ const { container } = render(
+ <Provider store={store}>
+ <TemperatureComparison />
+ </Provider>
+ )
+ await waitFor(() => null, { container })
+ expect(container).toMatchSnapshot()
+ })
+
+ it('should open the modal', async () => {
+ mockFetchAvgTemperature.mockResolvedValueOnce(1)
+ mockFetchAvgTemperature.mockResolvedValueOnce(2)
+ const { container } = render(
+ <Provider store={store}>
+ <TemperatureComparison />
+ </Provider>
+ )
+ await waitFor(() => container)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('analysis.temperature_comparison.info_button')
+ )
+ })
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+ })
+})
diff --git a/src/components/Analysis/Comparison/TemperatureComparison.tsx b/src/components/Analysis/Comparison/TemperatureComparison.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..393df4a980a3608affd5c0d06b2510daf6ea8221
--- /dev/null
+++ b/src/components/Analysis/Comparison/TemperatureComparison.tsx
@@ -0,0 +1,111 @@
+import ExclamationMarkIcon from 'assets/icons/ico/exclamationMark.svg'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
+import { useClient } from 'cozy-client'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import React, { useEffect, useMemo, useState } from 'react'
+import ConsumptionService from 'services/consumption.service'
+import { useAppSelector } from 'store/hooks'
+import TemperatureComparisonModal from './TemperatureComparisonModal/TemperatureComparisonModal'
+import './temperatureComparison.scss'
+
+const TemperatureComparison = () => {
+ const { t } = useI18n()
+ const client = useClient()
+ const { period, analysisMonth } = useAppSelector(
+ state => state.ecolyo.analysis
+ )
+
+ const [temperatureDifference, setTemperatureDifference] = useState<string>()
+ const [positive, setPositive] = useState<boolean>(true)
+ const [openTemperatureComparisonModal, setOpenTemperatureComparisonModal] =
+ useState<boolean>(false)
+ const consumptionService = useMemo(
+ () => new ConsumptionService(client),
+ [client]
+ )
+ const comparisonDates = useMemo(() => {
+ const endMonth = analysisMonth.minus({ month: 1 }).startOf('month')
+ return {
+ startMonth: endMonth
+ .minus({ month: period === 'month' ? 1 : 12 })
+ .startOf('month'),
+ endMonth: endMonth,
+ }
+ }, [analysisMonth, period])
+
+ useEffect(() => {
+ async function handleTemperatureComparison() {
+ const startMonthTemperature =
+ await consumptionService.fetchAvgTemperature(
+ comparisonDates.startMonth.year,
+ comparisonDates.startMonth.month
+ )
+
+ const endMonthTemperature = await consumptionService.fetchAvgTemperature(
+ comparisonDates.endMonth.year,
+ comparisonDates.endMonth.month
+ )
+
+ if (startMonthTemperature !== null && endMonthTemperature !== null) {
+ const temperatureDifference =
+ endMonthTemperature - startMonthTemperature
+ setTemperatureDifference(temperatureDifference.toFixed(1))
+ setPositive(temperatureDifference >= 0)
+ }
+ }
+ handleTemperatureComparison()
+ }, [
+ consumptionService,
+ comparisonDates.endMonth.month,
+ comparisonDates.endMonth.year,
+ comparisonDates.startMonth.month,
+ comparisonDates.startMonth.year,
+ ])
+
+ return (
+ <>
+ {temperatureDifference && (
+ <div className={`temperatureComparison ${positive ? 'hot' : 'cold'}`}>
+ <div className="tc-content">
+ <div>
+ <span className="text-28-bold">
+ {positive ? '+' : ''}
+ {temperatureDifference}
+ </span>
+ <span className="text-18">
+ {t('analysis.temperature_comparison.unit')}
+ </span>
+ </div>
+ <div>
+ <span className="tc-text text-12">
+ {t('analysis.temperature_comparison.comparison')}
+ </span>
+ <span className="tc-period text-12-bold">
+
+ {comparisonDates.startMonth.toLocaleString({
+ month: 'long',
+ year: 'numeric',
+ })}
+ </span>
+ </div>
+ </div>
+
+ <StyledIconButton
+ icon={ExclamationMarkIcon}
+ sized={16}
+ onClick={() => setOpenTemperatureComparisonModal(true)}
+ aria-label={t('analysis.temperature_comparison.info_button')}
+ className="info-icon"
+ />
+
+ <TemperatureComparisonModal
+ open={openTemperatureComparisonModal}
+ handleCloseClick={() => setOpenTemperatureComparisonModal(false)}
+ />
+ </div>
+ )}
+ </>
+ )
+}
+
+export default TemperatureComparison
diff --git a/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.spec.tsx b/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..783e566a34c6903a1c00b977362dbbc610f2c628
--- /dev/null
+++ b/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.spec.tsx
@@ -0,0 +1,34 @@
+import { act, render, screen } from '@testing-library/react'
+import userEvent from '@testing-library/user-event'
+import React from 'react'
+import { Provider } from 'react-redux'
+import { createMockEcolyoStore } from 'tests/__mocks__/store'
+import TemperatureComparisonModal from './TemperatureComparisonModal'
+
+describe('TemperatureComparisonModal component', () => {
+ const store = createMockEcolyoStore()
+ it('should be rendered correctly', () => {
+ const { baseElement } = render(
+ <Provider store={store}>
+ <TemperatureComparisonModal open={true} handleCloseClick={jest.fn()} />
+ </Provider>
+ )
+ expect(baseElement).toMatchSnapshot()
+ })
+
+ it('should close modal', async () => {
+ const mockHandleClose = jest.fn()
+ render(
+ <Provider store={store}>
+ <TemperatureComparisonModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ />
+ </Provider>
+ )
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('button')[0])
+ })
+ expect(mockHandleClose).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx b/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..b165c9936433fcd09c2a469195455cd29b56b0cb
--- /dev/null
+++ b/src/components/Analysis/Comparison/TemperatureComparisonModal/TemperatureComparisonModal.tsx
@@ -0,0 +1,61 @@
+import { IconButton } from '@material-ui/core'
+import Dialog from '@material-ui/core/Dialog'
+import CloseIcon from 'assets/icons/ico/close.svg'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import React from 'react'
+import { useAppSelector } from 'store/hooks'
+import './temperatureComparisonModal.scss'
+
+interface TemperatureComparisonModalProps {
+ open: boolean
+ handleCloseClick: () => void
+}
+
+const TemperatureComparisonModal = ({
+ open,
+ handleCloseClick,
+}: TemperatureComparisonModalProps) => {
+ const { t } = useI18n()
+ const { period } = useAppSelector(state => state.ecolyo.analysis)
+
+ return (
+ <Dialog
+ open={open}
+ onClose={handleCloseClick}
+ aria-label={t('analysis.temperature_comparison.modal.title')}
+ classes={{
+ root: 'modal-root',
+ paper: 'modal-paper',
+ }}
+ >
+ <div className="modal-start-root">
+ <IconButton
+ aria-label={t('analysis.temperature_comparison.modal.close')}
+ className="modal-paper-close-button"
+ onClick={handleCloseClick}
+ >
+ <Icon icon={CloseIcon} size={18} />
+ </IconButton>
+ <div className="content">
+ <div className="text-20-bold subtitle">
+ {t('analysis.temperature_comparison.modal.title')}
+ </div>
+ <div>
+ <p className="text-15-bold">
+ {period === 'month'
+ ? t('analysis.temperature_comparison.modal.month_comparison')
+ : t('analysis.temperature_comparison.modal.year_comparison')}
+ </p>
+ <br />
+ <p className="text-15-bold">
+ {t('analysis.temperature_comparison.modal.data_info')}
+ </p>
+ </div>
+ </div>
+ </div>
+ </Dialog>
+ )
+}
+
+export default TemperatureComparisonModal
diff --git a/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap b/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..19f0c60c854b994a7206326d40398cf10636f3bd
--- /dev/null
+++ b/src/components/Analysis/Comparison/TemperatureComparisonModal/__snapshots__/TemperatureComparisonModal.spec.tsx.snap
@@ -0,0 +1,92 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TemperatureComparisonModal component should be rendered correctly 1`] = `
+<body
+ style="padding-right: 0px; overflow: hidden;"
+>
+ <div
+ aria-hidden="true"
+ />
+ <div
+ aria-label="analysis.temperature_comparison.modal.title"
+ class="MuiDialog-root modal-root"
+ role="presentation"
+ style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px;"
+ >
+ <div
+ aria-hidden="true"
+ class="MuiBackdrop-root"
+ style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
+ />
+ <div
+ data-test="sentinelStart"
+ tabindex="0"
+ />
+ <div
+ class="MuiDialog-container MuiDialog-scrollPaper"
+ role="none presentation"
+ style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
+ tabindex="-1"
+ >
+ <div
+ class="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
+ role="dialog"
+ >
+ <div
+ class="modal-start-root"
+ >
+ <button
+ aria-label="analysis.temperature_comparison.modal.close"
+ class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <svg
+ class="styles__icon___23x3R"
+ height="18"
+ width="18"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <div
+ class="content"
+ >
+ <div
+ class="text-20-bold subtitle"
+ >
+ analysis.temperature_comparison.modal.title
+ </div>
+ <div>
+ <p
+ class="text-15-bold"
+ >
+ analysis.temperature_comparison.modal.month_comparison
+ </p>
+ <br />
+ <p
+ class="text-15-bold"
+ >
+ analysis.temperature_comparison.modal.data_info
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+</body>
+`;
diff --git a/src/components/Analysis/Comparison/TemperatureComparisonModal/temperatureComparisonModal.scss b/src/components/Analysis/Comparison/TemperatureComparisonModal/temperatureComparisonModal.scss
new file mode 100644
index 0000000000000000000000000000000000000000..2375d955054cc64c033444a5b0d6eac896235e3d
--- /dev/null
+++ b/src/components/Analysis/Comparison/TemperatureComparisonModal/temperatureComparisonModal.scss
@@ -0,0 +1,25 @@
+@import 'src/styles/base/color';
+
+.modal-start-root {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-end;
+
+ .content {
+ text-align: center;
+ padding: 1rem 0;
+ display: flex;
+ flex-direction: column;
+ gap: 2rem;
+ flex-grow: 1;
+
+ .subtitle {
+ color: $gold-shadow;
+ }
+
+ p {
+ color: $white;
+ margin: 0;
+ }
+ }
+}
diff --git a/src/components/Analysis/Comparison/__snapshots__/TemperatureComparison.spec.tsx.snap b/src/components/Analysis/Comparison/__snapshots__/TemperatureComparison.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..eac3ee09c526dd84802cca03337293575eb5d0df
--- /dev/null
+++ b/src/components/Analysis/Comparison/__snapshots__/TemperatureComparison.spec.tsx.snap
@@ -0,0 +1,124 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TemperatureComparison component should be rendered correctly with cold result 1`] = `
+<div>
+ <div
+ class="temperatureComparison cold"
+ >
+ <div
+ class="tc-content"
+ >
+ <div>
+ <span
+ class="text-28-bold"
+ >
+ -1.0
+ Â
+ </span>
+ <span
+ class="text-18"
+ >
+ analysis.temperature_comparison.unit
+ </span>
+ </div>
+ <div>
+ <span
+ class="tc-text text-12"
+ >
+ analysis.temperature_comparison.comparison
+ </span>
+ <span
+ class="tc-period text-12-bold"
+ >
+ Â
+ novembre 2022
+ </span>
+ </div>
+ </div>
+ <button
+ aria-label="analysis.temperature_comparison.info_button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-2 info-icon"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="16"
+ width="16"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ </span>
+ </button>
+ </div>
+</div>
+`;
+
+exports[`TemperatureComparison component should be rendered correctly with hot result 1`] = `
+<div>
+ <div
+ class="temperatureComparison hot"
+ >
+ <div
+ class="tc-content"
+ >
+ <div>
+ <span
+ class="text-28-bold"
+ >
+ +
+ 1.0
+ Â
+ </span>
+ <span
+ class="text-18"
+ >
+ analysis.temperature_comparison.unit
+ </span>
+ </div>
+ <div>
+ <span
+ class="tc-text text-12"
+ >
+ analysis.temperature_comparison.comparison
+ </span>
+ <span
+ class="tc-period text-12-bold"
+ >
+ Â
+ novembre 2022
+ </span>
+ </div>
+ </div>
+ <button
+ aria-label="analysis.temperature_comparison.info_button"
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 info-icon"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="16"
+ width="16"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ </span>
+ </button>
+ </div>
+</div>
+`;
+
+exports[`TemperatureComparison component should be rendered correctly with no data 1`] = `<div />`;
diff --git a/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss b/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss
index 4457dccc9a5eb45d45950391ac206451b1de7afd..bd93542a3ce2d389c0d16db289dfe974815548a7 100644
--- a/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss
+++ b/src/components/Analysis/Comparison/fluidPerformanceIndicator.scss
@@ -35,13 +35,31 @@
gap: 1rem;
align-items: center;
box-shadow: 0px 4px 16px 0px $black-shadow;
+ transition: background-color 0.3s;
+ background: linear-gradient(180deg, #323339 0%, #25262b 100%);
+ cursor: pointer;
+
+ &:hover {
+ background: linear-gradient(
+ 180deg,
+ rgba(70, 71, 77, 0.7) 0%,
+ rgba(57, 58, 63, 0.7) 100%
+ );
+ }
.fpi-content {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ text-align: left;
.fpi-value {
+ display: flex;
+ flex-direction: row;
+ gap: 4px;
+ align-items: flex-end;
.fpi-load {
font-size: 1.75rem;
font-weight: 900;
- margin-right: 4px;
color: $white;
}
.fpi-unit {
diff --git a/src/components/Analysis/Comparison/temperatureComparison.scss b/src/components/Analysis/Comparison/temperatureComparison.scss
new file mode 100644
index 0000000000000000000000000000000000000000..ce4fc3e5e665d169435eb4df2ffa3975962b3429
--- /dev/null
+++ b/src/components/Analysis/Comparison/temperatureComparison.scss
@@ -0,0 +1,50 @@
+@import 'src/styles/base/color';
+@import 'src/styles/base/breakpoint';
+
+.temperatureComparison {
+ display: flex;
+ border: 1px solid $grey-dark;
+ border-radius: 4px;
+ padding: 4px 4px 8px 22px;
+ box-shadow: 0px 4px 16px 0px $black-shadow;
+ background: linear-gradient(180deg, #323339 0%, #25262b 100%);
+ background-position: bottom right;
+ background-repeat: no-repeat;
+ &.hot {
+ background-image: url('../../../assets/png/temperatures/hot.svg'),
+ linear-gradient(259deg, rgba(6, 29, 62, 0) 25.28%, #77aee0 121.36%),
+ radial-gradient(
+ 185.82% 146.65% at 50% 79.83%,
+ rgba(6, 29, 62, 0) 0%,
+ #e0bc77 100%
+ );
+ }
+ &.cold {
+ background-image: url('../../../assets/png/temperatures/cold.svg'),
+ radial-gradient(
+ 185.82% 146.65% at 50% 79.83%,
+ rgba(6, 29, 62, 0) 0%,
+ #77a3e0 100%
+ );
+ }
+
+ .tc-content {
+ text-align: left;
+ padding-top: 4px;
+ flex-grow: 1;
+ color: $white;
+ .tc-text {
+ font-weight: 200;
+ }
+ .tc-period {
+ font-weight: 900;
+ }
+ }
+
+ .info-icon {
+ padding: 0;
+ stroke: $white;
+ align-items: flex-start;
+ height: 100%;
+ }
+}
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.spec.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.spec.tsx
index 079b98bd5a78e418233b508098bda144c53b7faf..a8611f6d0468ba324dd31caf734b0c6488dab2c5 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.spec.tsx
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { PerformanceIndicator } from 'models'
import React from 'react'
@@ -66,7 +66,7 @@ describe('ElecHalfHourMonthlyAnalysis component', () => {
expect(container).toMatchSnapshot()
})
- it('should be rendered correctly when isHalfHourActivated is true', async () => {
+ it('should be rendered correctly when isHalfHourActivated is true and render weekend graph', async () => {
mockCheckDoctypeEntries.mockResolvedValue(true)
mockGetEnedisMonthlyAnalysisByDate.mockResolvedValueOnce(
mockEnedisMonthlyAnalysisArray
@@ -83,6 +83,7 @@ describe('ElecHalfHourMonthlyAnalysis component', () => {
)
await waitFor(() => null, { container })
expect(container).toMatchSnapshot()
+ expect(screen.getByText('special_elec.weekend')).toBeInTheDocument()
})
it('should change from weekend to week', async () => {
@@ -94,14 +95,20 @@ describe('ElecHalfHourMonthlyAnalysis component', () => {
mockDataLoadEnedisAnalysis
)
mockGetPrices.mockResolvedValue(allLastFluidPrices[0])
- const { container } = render(
+ render(
<Provider store={store}>
<ElecHalfHourMonthlyAnalysis perfIndicator={mockPerfIndicator} />
</Provider>
)
- await waitFor(() => null, { container })
- await userEvent.click(screen.getAllByRole('button')[0])
- expect(container.getElementsByClassName('week').length).toBeTruthy()
+ await waitFor(() =>
+ screen.getByLabelText('consumption.accessibility.button_previous_value')
+ )
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('consumption.accessibility.button_previous_value')
+ )
+ })
+ expect(screen.getByText('special_elec.week')).toBeInTheDocument()
})
it('should call the ElecInfoModal with open = true when click on the button', async () => {
@@ -113,14 +120,15 @@ describe('ElecHalfHourMonthlyAnalysis component', () => {
mockDataLoadEnedisAnalysis
)
mockGetPrices.mockResolvedValue(allLastFluidPrices[0])
-
- const { container } = render(
+ render(
<Provider store={store}>
<ElecHalfHourMonthlyAnalysis perfIndicator={mockPerfIndicator} />
</Provider>
)
- await waitFor(() => null, { container })
- await userEvent.click(await screen.findByText('special_elec.showModal'))
+
+ await waitFor(async () => {
+ await userEvent.click(screen.getByText('special_elec.showModal'))
+ })
expect(await screen.findByRole('dialog')).toBeInTheDocument()
})
})
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx
index 332d2177ccc1fb7d3231789e62c24fcdb6be3e43..a7ee2e698aca2fb1a4d95601ccd9bd5da5993c85 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx
@@ -16,7 +16,7 @@ import {
FluidPrice,
PerformanceIndicator,
} from 'models'
-import React, { useCallback, useEffect, useState } from 'react'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
import ConsumptionService from 'services/consumption.service'
import EnedisMonthlyAnalysisDataService from 'services/enedisMonthlyAnalysisData.service'
import FluidPricesService from 'services/fluidsPrices.service'
@@ -35,8 +35,9 @@ const ElecHalfHourMonthlyAnalysis = ({
const { t } = useI18n()
const client = useClient()
const { analysisMonth } = useAppSelector(state => state.ecolyo.analysis)
+
const [isWeekend, setIsWeekend] = useState<boolean>(true)
- const [isHalfHourActivated, setIsHalfHourActivated] = useState<boolean>(true)
+ const [isHalfHourActivated, setIsHalfHourActivated] = useState<boolean>(false)
const [isLoading, setIsLoading] = useState<boolean>(true)
const [monthDataloads, setMonthDataloads] =
useState<AggregatedEnedisMonthlyDataloads>()
@@ -47,23 +48,23 @@ const ElecHalfHourMonthlyAnalysis = ({
const [openInfoModal, setOpenInfoModal] = useState<boolean>(false)
const [offPeakHours, setOffPeakHours] = useState<OffPeakHours[]>()
- const handleChangeWeek = useCallback(() => {
- setIsWeekend(prev => !prev)
- }, [])
+ /** EnedisMonthlyAnalysisDataService */
+ const emas = useMemo(
+ () => new EnedisMonthlyAnalysisDataService(client),
+ [client]
+ )
- const toggleOpenModal = useCallback(() => {
- setOpenInfoModal(prev => !prev)
- }, [])
- const isDataFullyComplete = useCallback(monthDataloads => {
- if (
- monthDataloads?.weekend &&
- monthDataloads.week &&
- monthDataloads.weekend[0]?.value !== null &&
- monthDataloads.week[0]?.value !== null
- ) {
- return true
- } else return false
- }, [])
+ const isDataFullyComplete = useCallback(
+ (monthDataloads: AggregatedEnedisMonthlyDataloads | undefined) => {
+ return (
+ monthDataloads?.weekend &&
+ monthDataloads.week &&
+ monthDataloads.weekend[0]?.value !== null &&
+ monthDataloads.week[0]?.value !== null
+ )
+ },
+ []
+ )
const getPowerChart = useCallback((): JSX.Element => {
if (monthDataloads && isDataFullyComplete(monthDataloads)) {
@@ -73,9 +74,8 @@ const ElecHalfHourMonthlyAnalysis = ({
isWeekend={isWeekend}
/>
)
- } else {
- return <p className="text-20-bold no_data">{t('analysis.no_data')}</p>
}
+ return <p className="text-20-bold no_data">{t('analysis.no_data')}</p>
}, [isDataFullyComplete, isWeekend, monthDataloads, t])
useEffect(() => {
@@ -88,7 +88,7 @@ const ElecHalfHourMonthlyAnalysis = ({
)
if (!subscribed) return
if (isHalfHourLoadActivated) {
- const emas = new EnedisMonthlyAnalysisDataService(client)
+ setIsHalfHourActivated(true)
const aggregatedDate = analysisMonth.minus({ month: 1 })
const data = await emas.getEnedisMonthlyAnalysisByDate(
aggregatedDate.year,
@@ -103,8 +103,6 @@ const ElecHalfHourMonthlyAnalysis = ({
setFacturePercentage(percentage)
}
}
- } else {
- setIsHalfHourActivated(false)
}
setIsLoading(false)
@@ -114,13 +112,13 @@ const ElecHalfHourMonthlyAnalysis = ({
return () => {
subscribed = false
}
- }, [analysisMonth, client, perfIndicator])
+ }, [analysisMonth, client, emas, perfIndicator])
useEffect(() => {
let subscribed = true
const fluidsPricesService = new FluidPricesService(client)
async function getAllLastPrices() {
- const price: FluidPrice = await fluidsPricesService.getPrices(
+ const price = await fluidsPricesService.getPrices(
FluidType.ELECTRICITY,
analysisMonth.minus({ month: 1 })
)
@@ -137,12 +135,9 @@ const ElecHalfHourMonthlyAnalysis = ({
useEffect(() => {
let subscribed = true
- const enedisMonthlyAnalysisDataService =
- new EnedisMonthlyAnalysisDataService(client)
async function getOffPeakHours() {
if (subscribed) {
- const offPeakHours =
- await enedisMonthlyAnalysisDataService.getOffPeakHours()
+ const offPeakHours = await emas.getOffPeakHours()
if (offPeakHours) {
setOffPeakHours(offPeakHours)
}
@@ -153,7 +148,7 @@ const ElecHalfHourMonthlyAnalysis = ({
return () => {
subscribed = false
}
- }, [client])
+ }, [emas])
return (
<div className="special-elec-container">
@@ -173,7 +168,7 @@ const ElecHalfHourMonthlyAnalysis = ({
<div className="navigator">
<IconButton
aria-label={t('consumption.accessibility.button_previous_value')}
- onClick={handleChangeWeek}
+ onClick={() => setIsWeekend(prev => !prev)}
className="arrow-prev"
>
<Icon icon={LeftArrowIcon} size={24} />
@@ -190,8 +185,8 @@ const ElecHalfHourMonthlyAnalysis = ({
</div>
</div>
<IconButton
- aria-label={t('consumption.accessibility.button_previous_value')}
- onClick={handleChangeWeek}
+ aria-label={t('consumption.accessibility.button_next_value')}
+ onClick={() => setIsWeekend(prev => !prev)}
className="arrow-next"
>
<Icon icon={RightArrowIcon} size={24} />
@@ -279,7 +274,10 @@ const ElecHalfHourMonthlyAnalysis = ({
</div>
</div>
- <Button className="btnText" onClick={toggleOpenModal}>
+ <Button
+ className="btnText"
+ onClick={() => setOpenInfoModal(true)}
+ >
{t('special_elec.showModal')}
</Button>
</div>
@@ -291,7 +289,7 @@ const ElecHalfHourMonthlyAnalysis = ({
<ElecInfoModal
open={openInfoModal}
offPeakHours={offPeakHours}
- handleCloseClick={toggleOpenModal}
+ handleCloseClick={() => setOpenInfoModal(false)}
/>
</div>
)
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx
index d90558d7466add54019bd1fb73b204842fbffc81..f755d44ae425545eb0761e878cf378e08c022956 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecInfoModal.tsx
@@ -49,32 +49,35 @@ const ElecInfoModal = ({
<Icon icon={CloseIcon} size={16} />
</IconButton>
<div className="elecInfoModal">
- <div className="title text-18-bold">{t('elec_info_modal.title1')}</div>
- <div className="text">
- {t('elec_info_modal.text1-1')}
- <br />
- {t('elec_info_modal.text1-2')}
+ <div className="title text-18-bold">
+ {t('elec_info_modal.maxPowerTitle')}
</div>
- <div className="title text-18-bold">{t('elec_info_modal.title2')}</div>
- <div className="text">
- {t('elec_info_modal.text2-1')}
- <br />
- {t('elec_info_modal.text2-2')}
+ <div>
+ {t('elec_info_modal.maxPowerDetails-1')}
<br />
- {t('elec_info_modal.text2-3')}
+ {t('elec_info_modal.maxPowerDetails-2')}
</div>
{offPeakHours && (
<>
<div className="title text-18-bold">
- {t('elec_info_modal.title3')}
+ {t('elec_info_modal.offPeakTitle')}
</div>
- <div className="text">
- {t('elec_info_modal.text3-1', {
+ <div>
+ {t('elec_info_modal.offPeakDetails-1', {
offPeakHours: displayedOffPeakHours,
})}
</div>
</>
)}
+ <div className="title text-18-bold">
+ {t('elec_info_modal.minPowerTitle')}
+ </div>
+ <div>
+ {t('elec_info_modal.minPowerDetails-1')}
+ <br />
+ {t('elec_info_modal.minPowerDetails-2')}
+ <br />
+ </div>
</div>
</Dialog>
)
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap
index 7ec215c0aee87c294490ac0a9bf075397e9e3a7b..1f0c220c490f82d9382dd7825eb5f08f85f72bc1 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap
@@ -112,7 +112,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--0"
+ class="bar-ELECTRICITY weekend bounce-3 delay--0"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -128,7 +128,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY weekend bounce-3 delay--0"
+ class="bar-ELECTRICITY weekend bounce-3 delay--0"
id="gradient"
x1="0"
x2="0"
@@ -146,7 +146,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--0"
+ class="bar-ELECTRICITY weekend bounce-3 delay--0"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -195,7 +195,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--1"
+ class="bar-ELECTRICITY weekend bounce-3 delay--1"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -211,7 +211,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY weekend bounce-3 delay--1"
+ class="bar-ELECTRICITY weekend bounce-3 delay--1"
id="gradient"
x1="0"
x2="0"
@@ -229,7 +229,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--1"
+ class="bar-ELECTRICITY weekend bounce-3 delay--1"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -278,7 +278,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--2"
+ class="bar-ELECTRICITY weekend bounce-3 delay--2"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -294,7 +294,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY weekend bounce-3 delay--2"
+ class="bar-ELECTRICITY weekend bounce-3 delay--2"
id="gradient"
x1="0"
x2="0"
@@ -312,7 +312,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--2"
+ class="bar-ELECTRICITY weekend bounce-3 delay--2"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -361,7 +361,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--3"
+ class="bar-ELECTRICITY weekend bounce-3 delay--3"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -377,7 +377,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY weekend bounce-3 delay--3"
+ class="bar-ELECTRICITY weekend bounce-3 delay--3"
id="gradient"
x1="0"
x2="0"
@@ -395,7 +395,7 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY weekend bounce-3 delay--3"
+ class="bar-ELECTRICITY weekend bounce-3 delay--3"
d="
M0,4
a4,4 0 0 1 4,-4
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap
index e4058feef99e3df1d3e78658d97e488bcf281631..6e75e12edacb1b00e73a65b3de0d3f7be8b0684e 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap
@@ -28,7 +28,7 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when
</div>
`;
-exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when isHalfHourActivated is true 1`] = `
+exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when isHalfHourActivated is true and render weekend graph 1`] = `
<div>
<div
class="special-elec-container"
@@ -69,9 +69,6 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when
/>
</svg>
</span>
- <span
- class="MuiTouchRipple-root"
- />
</button>
<div
class="average text-18-normal"
@@ -94,7 +91,7 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when
</div>
</div>
<button
- aria-label="consumption.accessibility.button_previous_value"
+ aria-label="consumption.accessibility.button_next_value"
class="MuiButtonBase-root MuiIconButton-root arrow-next"
tabindex="0"
type="button"
@@ -112,9 +109,6 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when
/>
</svg>
</span>
- <span
- class="MuiTouchRipple-root"
- />
</button>
</div>
<p
diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap
index 120a26734e421ffd093d96aa49886940c689423f..940eea0eba67e229302d406768073180e0ad6356 100644
--- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap
+++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecInfoModal.spec.tsx.snap
@@ -66,38 +66,31 @@ exports[`ElecInfoModal component should be rendered correctly with off-peak hour
<div
class="title text-18-bold"
>
- elec_info_modal.title1
+ elec_info_modal.maxPowerTitle
</div>
- <div
- class="text"
- >
- elec_info_modal.text1-1
+ <div>
+ elec_info_modal.maxPowerDetails-1
<br />
- elec_info_modal.text1-2
+ elec_info_modal.maxPowerDetails-2
</div>
<div
class="title text-18-bold"
>
- elec_info_modal.title2
+ elec_info_modal.offPeakTitle
</div>
- <div
- class="text"
- >
- elec_info_modal.text2-1
- <br />
- elec_info_modal.text2-2
- <br />
- elec_info_modal.text2-3
+ <div>
+ elec_info_modal.offPeakDetails-1
</div>
<div
class="title text-18-bold"
>
- elec_info_modal.title3
+ elec_info_modal.minPowerTitle
</div>
- <div
- class="text"
- >
- elec_info_modal.text3-1
+ <div>
+ elec_info_modal.minPowerDetails-1
+ <br />
+ elec_info_modal.minPowerDetails-2
+ <br />
</div>
</div>
</div>
@@ -176,28 +169,23 @@ exports[`ElecInfoModal component should be rendered correctly without off-peak h
<div
class="title text-18-bold"
>
- elec_info_modal.title1
+ elec_info_modal.maxPowerTitle
</div>
- <div
- class="text"
- >
- elec_info_modal.text1-1
+ <div>
+ elec_info_modal.maxPowerDetails-1
<br />
- elec_info_modal.text1-2
+ elec_info_modal.maxPowerDetails-2
</div>
<div
class="title text-18-bold"
>
- elec_info_modal.title2
+ elec_info_modal.minPowerTitle
</div>
- <div
- class="text"
- >
- elec_info_modal.text2-1
+ <div>
+ elec_info_modal.minPowerDetails-1
<br />
- elec_info_modal.text2-2
+ elec_info_modal.minPowerDetails-2
<br />
- elec_info_modal.text2-3
</div>
</div>
</div>
diff --git a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.spec.tsx b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.spec.tsx
index 18977eb0ddad4f84dfd778067a7610ab5b7d9b52..1c8b8f3414a79c8d798a69a2dca9598cb1fc9ea7 100644
--- a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.spec.tsx
+++ b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { FluidType } from 'enums'
import React from 'react'
@@ -35,9 +35,12 @@ describe('MaxConsumptionCard component', () => {
</Provider>
)
await waitFor(() => null, { container })
- const [prevButton, nextButton] = screen.getAllByRole('button')
- expect(prevButton).toBeDisabled()
- expect(nextButton).toBeDisabled()
+ expect(
+ screen.getByLabelText('consumption.accessibility.button_previous_value')
+ ).toBeDisabled()
+ expect(
+ screen.getByLabelText('consumption.accessibility.button_next_value')
+ ).toBeDisabled()
})
it('should be rendered with several fluids and click navigate between fluid', async () => {
const { container } = render(
@@ -48,24 +51,33 @@ describe('MaxConsumptionCard component', () => {
</Provider>
)
await waitFor(() => null, { container })
- const [prevButton, nextButton] = screen.getAllByRole('button')
+ const prevButton = screen.getByLabelText(
+ 'consumption.accessibility.button_previous_value'
+ )
+ const nextButton = screen.getByLabelText(
+ 'consumption.accessibility.button_next_value'
+ )
// navigate next
- await userEvent.click(nextButton)
- await waitFor(() => null, { container })
+ await act(async () => {
+ await userEvent.click(nextButton)
+ })
expect(screen.getByText('FLUID.GAS.LABEL')).toBeInTheDocument()
- await userEvent.click(nextButton)
- await waitFor(() => null, { container })
+ await act(async () => {
+ await userEvent.click(nextButton)
+ })
expect(screen.getByText('FLUID.ELECTRICITY.LABEL')).toBeInTheDocument()
// navigate prev
- await userEvent.click(prevButton)
- await waitFor(() => null, { container })
+ await act(async () => {
+ await userEvent.click(prevButton)
+ })
expect(screen.getByText('FLUID.GAS.LABEL')).toBeInTheDocument()
- await userEvent.click(prevButton)
- await waitFor(() => null, { container })
+ await act(async () => {
+ await userEvent.click(prevButton)
+ })
expect(screen.getByText('FLUID.ELECTRICITY.LABEL')).toBeInTheDocument()
})
})
diff --git a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx
index 42429b5af412be83452c3d86aceef5db57b6677a..46656f1f9406b307455512e596f4ddeddb8941a5 100644
--- a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx
+++ b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx
@@ -16,6 +16,7 @@ import React, { useEffect, useRef, useState } from 'react'
import ConsumptionDataManager from 'services/consumption.service'
import { setSelectedDate } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
+import { getFluidName } from 'utils/utils'
import './maxConsumptionCard.scss'
const MaxConsumptionCard = ({
@@ -29,22 +30,15 @@ const MaxConsumptionCard = ({
const { analysisMonth } = useAppSelector(state => state.ecolyo.analysis)
const [isLoading, setIsLoading] = useState<boolean>(false)
const [maxDayData, setMaxDayData] = useState<Dataload | null>(null)
+ const [currentFluid, setCurrentFluid] = useState<FluidType>(fluidsWithData[0])
const [chartData, setChartData] = useState<Datachart>({
actualData: [],
comparisonData: null,
})
const containerRef = useRef<HTMLDivElement>(null)
const { height, width } = useChartResize(containerRef, isLoading, 250, 940)
- const [currentFluid, setCurrentFluid] = useState<FluidType | undefined>()
- useEffect(() => {
- setCurrentFluid(fluidsWithData[0])
- }, [fluidsWithData])
-
- const currentFluidSlug = FluidType[currentFluid || 0] as
- | 'ELECTRICITY'
- | 'WATER'
- | 'GAZ'
+ const fluidName = getFluidName(currentFluid || FluidType.ELECTRICITY)
const handleFluidChange = (direction: number) => {
if (currentFluid === undefined) return
@@ -135,8 +129,8 @@ const MaxConsumptionCard = ({
<div className="text-16-normal title">{t('analysis.max_day')}</div>
<div className="fluid-navigation">
{buttonPrev()}
- <div className={`text-20-bold fluid ${currentFluidSlug.toLowerCase()}`}>
- {t(`FLUID.${currentFluidSlug}.LABEL`)}
+ <div className={`text-20-bold fluid ${fluidName}`}>
+ {t(`FLUID.${fluidName.toUpperCase()}.LABEL`)}
</div>
{buttonNext()}
</div>
diff --git a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap
index b731c1f5e66d493e2b636cc801f6d70b22245e9c..91030a58f917c22d05e9efbdecb62d6fb6013d9d 100644
--- a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap
+++ b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap
@@ -152,7 +152,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined disabled bounce-3 delay--0"
+ class="bar-ELECTRICITY disabled bounce-3 delay--0"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -168,7 +168,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY undefined disabled bounce-3 delay--0"
+ class="bar-ELECTRICITY disabled bounce-3 delay--0"
id="gradient"
x1="0"
x2="0"
@@ -186,7 +186,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined disabled bounce-3 delay--0"
+ class="bar-ELECTRICITY disabled bounce-3 delay--0"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -235,7 +235,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined disabled bounce-3 delay--1"
+ class="bar-ELECTRICITY disabled bounce-3 delay--1"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -251,7 +251,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY undefined disabled bounce-3 delay--1"
+ class="bar-ELECTRICITY disabled bounce-3 delay--1"
id="gradient"
x1="0"
x2="0"
@@ -269,7 +269,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined disabled bounce-3 delay--1"
+ class="bar-ELECTRICITY disabled bounce-3 delay--1"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -318,7 +318,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY bar-UNCOMING undefined disabled bounce-3 delay--2"
+ class="bar-ELECTRICITY bar-UPCOMING disabled bounce-3 delay--2"
d="
M0,4
a4,4 0 0 1 4,-4
diff --git a/src/components/Analysis/MonthlyAnalysis.tsx b/src/components/Analysis/MonthlyAnalysis.tsx
index 90e2d0253851d8285065acfa4a45f59b088564d9..0b36bc41ba1b3cbc27a146527b9a4308497401ff 100644
--- a/src/components/Analysis/MonthlyAnalysis.tsx
+++ b/src/components/Analysis/MonthlyAnalysis.tsx
@@ -44,7 +44,7 @@ const MonthlyAnalysis = ({
fluid => fluid.status === FluidState.NOT_CONNECTED
)
- const [loadAnalysis, setLoadAnalysis] = useState<boolean>(true)
+ const [isLoadingAnalysis, setLoadingAnalysis] = useState<boolean>(true)
const [openNoDataModal, setOpenNoDataModal] = useState(false)
const [fluidsWithData, setFluidsWithData] = useState<FluidType[]>([])
const [incompleteDataFluids, setIncompleteDataFluids] = useState<FluidType[]>(
@@ -64,7 +64,7 @@ const MonthlyAnalysis = ({
let subscribed = true
const populateData = async () => {
- setLoadAnalysis(true)
+ setLoadingAnalysis(true)
const timePeriod: TimePeriod = {
startDate: analysisMonth.minus({ month: 1 }).startOf('month'),
@@ -97,7 +97,7 @@ const MonthlyAnalysis = ({
if (fetchedPerformanceIndicators) {
setPerformanceIndicators(fetchedPerformanceIndicators)
- setLoadAnalysis(false)
+ setLoadingAnalysis(false)
setAggregatedPerformanceIndicators(
performanceIndicatorService.aggregatePerformanceIndicators(
fetchedPerformanceIndicators
@@ -108,7 +108,7 @@ const MonthlyAnalysis = ({
setOpenNoDataModal(true)
}
setFluidsWithData(resultFluids)
- setLoadAnalysis(false)
+ setLoadingAnalysis(false)
}
if (subscribed) {
@@ -128,23 +128,23 @@ const MonthlyAnalysis = ({
])
useEffect(() => {
- if (!loadAnalysis) {
+ if (!isLoadingAnalysis) {
const app = document.querySelector('.app-content')
window.scrollTo(0, scrollPosition)
app?.scrollTo(0, scrollPosition)
}
- }, [loadAnalysis, scrollPosition])
+ }, [isLoadingAnalysis, scrollPosition])
return (
<>
- {loadAnalysis && (
+ {isLoadingAnalysis && (
<div className="loaderContainer">
<Loader />
</div>
)}
<NoAnalysisModal open={openNoDataModal} onClose={setOpenNoDataModal} />
- {!loadAnalysis && (
- <Fade in={!loadAnalysis}>
+ {!isLoadingAnalysis && (
+ <Fade in={!isLoadingAnalysis}>
<div className="analysis-root">
{incompleteDataFluids.length !== 0 && (
<div className="analysis-content">
diff --git a/src/components/Analysis/ProfileComparator/ProfileComparator.spec.tsx b/src/components/Analysis/ProfileComparator/ProfileComparator.spec.tsx
index 20b645a30b567aa285443488c39d063fcc157972..7cb6a06109365de9896a3718bc9331d70b7a8684 100644
--- a/src/components/Analysis/ProfileComparator/ProfileComparator.spec.tsx
+++ b/src/components/Analysis/ProfileComparator/ProfileComparator.spec.tsx
@@ -1,8 +1,7 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
-import { profileData } from 'tests/__mocks__/profileData.mock'
import {
createMockEcolyoStore,
mockAnalysisState,
@@ -34,7 +33,7 @@ jest.mock(
() => 'mock-profileComparatorRow'
)
-const profileCompleted = { ...profileData, isProfileTypeCompleted: true }
+const profileCompleted = { ...mockProfileState, isProfileTypeCompleted: true }
const storeProfileCompleted = createMockEcolyoStore({
profile: profileCompleted,
analysis: mockAnalysisState,
@@ -98,7 +97,9 @@ describe('AnalysisConsumption component', () => {
expect(rows.length).toBe(4)
expect(screen.getByTestId('iconGoToProfile')).toBeInTheDocument()
expect(screen.queryByTestId('goToProfile')).not.toBeInTheDocument()
- await userEvent.click(screen.getByTestId('iconGoToProfile'))
+ await act(async () => {
+ await userEvent.click(screen.getByTestId('iconGoToProfile'))
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/profileType')
})
})
diff --git a/src/components/Analysis/ProfileComparator/ProfileComparator.tsx b/src/components/Analysis/ProfileComparator/ProfileComparator.tsx
index a4159281de4a8465b23d8f55af85bbd6219d0117..90db508772bd64a1f1e1870f654e59e980027e9d 100644
--- a/src/components/Analysis/ProfileComparator/ProfileComparator.tsx
+++ b/src/components/Analysis/ProfileComparator/ProfileComparator.tsx
@@ -14,7 +14,7 @@ import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import { FluidType } from 'enums'
-import { MonthlyForecast, PerformanceIndicator, ProfileType } from 'models'
+import { MonthlyForecast, PerformanceIndicator } from 'models'
import React, { useCallback, useEffect, useState } from 'react'
import { useNavigate } from 'react-router-dom'
import ProfileTypeService from 'services/profileType.service'
@@ -35,7 +35,6 @@ const ProfileComparator = ({
const { t } = useI18n()
const client = useClient()
const navigate = useNavigate()
- const userPriceConsumption: number = aggregatedPerformanceIndicator.value || 0
const {
analysis: { analysisMonth },
profile,
@@ -43,22 +42,9 @@ const ProfileComparator = ({
const [homePriceConsumption, setHomePriceConsumption] = useState<number>(0)
const [forecast, setForecast] = useState<MonthlyForecast | null>(null)
const [isLoading, setIsLoading] = useState<boolean>(true)
+ const [isExpanded, setIsExpanded] = useState<boolean>(false)
- const [activeAverageHome, setActiveAverageHome] = useState<boolean>(false)
- const toggleAccordion = () => {
- setActiveAverageHome(prev => !prev)
- if (!activeAverageHome) {
- setTimeout(() => {
- const content = document.querySelector('.consumption-electricity')
- if (content) {
- content.scrollIntoView({
- behavior: 'smooth',
- block: 'start',
- })
- }
- }, 300)
- }
- }
+ const userPriceConsumption = aggregatedPerformanceIndicator.value || 0
const emptyFluidTypes: FluidType[] = []
if (performanceIndicators.length === 0) {
@@ -72,6 +58,22 @@ const ProfileComparator = ({
}
}
+ /** Toggle accordion and scroll to the first element */
+ const toggleAccordion = () => {
+ setIsExpanded(prev => !prev)
+ if (!isExpanded) {
+ setTimeout(() => {
+ const content = document.querySelector('.consumption-electricity')
+ if (content) {
+ content.scrollIntoView({
+ behavior: 'smooth',
+ block: 'start',
+ })
+ }
+ }, 300)
+ }
+ }
+
const getTotalValueWithConnectedFluids = useCallback(
(monthlyForecast: MonthlyForecast) => {
if (performanceIndicators.length === 3) {
@@ -93,19 +95,18 @@ const ProfileComparator = ({
async function loadAverageConsumption() {
const analysisDate = analysisMonth.minus({ month: 1 }).startOf('month')
const profileTypeEntityService = new ProfileTypeEntityService(client)
- const profileType: ProfileType | null =
+ const profileType =
await profileTypeEntityService.getProfileType(analysisDate)
if (profileType !== null) {
- const profileTypeService: ProfileTypeService = new ProfileTypeService(
+ const profileTypeService = new ProfileTypeService(
profileType,
client,
analysisMonth.minus({ month: 1 }).year
)
- const monthlyForecast: MonthlyForecast =
- await profileTypeService.getMonthlyForecast(
- analysisDate.year,
- analysisDate.month
- )
+ const monthlyForecast = await profileTypeService.getMonthlyForecast(
+ analysisDate.year,
+ analysisDate.month
+ )
if (subscribed) {
setForecast(monthlyForecast)
if (monthlyForecast) {
@@ -167,7 +168,7 @@ const ProfileComparator = ({
<div className="average-title">{t(`analysis.comparison`)}</div>
</div>
<ProfileComparatorRow
- fluid={FluidType.MULTIFLUID}
+ fluidType={FluidType.MULTIFLUID}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={null}
@@ -177,10 +178,10 @@ const ProfileComparator = ({
/>
{performanceIndicators.map(
(indicator, index) =>
- indicator.value && (
+ Boolean(indicator.value) && (
<ProfileComparatorRow
key={FluidType[index]}
- fluid={index}
+ fluidType={index}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={indicator.value}
@@ -194,7 +195,7 @@ const ProfileComparator = ({
{emptyFluidTypes.map(fluid => (
<ProfileComparatorRow
key={fluid}
- fluid={fluid}
+ fluidType={fluid}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={null}
@@ -205,7 +206,7 @@ const ProfileComparator = ({
))}
<Accordion
- expanded={activeAverageHome}
+ expanded={isExpanded}
onChange={toggleAccordion}
classes={{
root: 'expansion-panel-root',
diff --git a/src/components/Analysis/ProfileComparator/ProfileComparatorRow.spec.tsx b/src/components/Analysis/ProfileComparator/ProfileComparatorRow.spec.tsx
index c1f7609879ef1d7bd1bd3e18a9515a17f560732e..62845a52f0cebe1be5cba0856bd46af2285133bc 100644
--- a/src/components/Analysis/ProfileComparator/ProfileComparatorRow.spec.tsx
+++ b/src/components/Analysis/ProfileComparator/ProfileComparatorRow.spec.tsx
@@ -14,7 +14,7 @@ describe('AnalysisConsumptionRow component', () => {
it('should be rendered correctly for Multifluid and at least fluid connected', async () => {
const { container } = render(
<ProfileComparatorRow
- fluid={FluidType.MULTIFLUID}
+ fluidType={FluidType.MULTIFLUID}
userPriceConsumption={20}
homePriceConsumption={18}
performanceValue={null}
@@ -38,7 +38,7 @@ describe('AnalysisConsumptionRow component', () => {
const mockConnected = false
const { container } = render(
<ProfileComparatorRow
- fluid={FluidType.MULTIFLUID}
+ fluidType={FluidType.MULTIFLUID}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={null}
@@ -65,7 +65,7 @@ describe('AnalysisConsumptionRow component', () => {
it('should be rendered correctly for singleFluid connected for average', async () => {
const { container } = render(
<ProfileComparatorRow
- fluid={FluidType.ELECTRICITY}
+ fluidType={FluidType.ELECTRICITY}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={performanceValue}
@@ -94,7 +94,7 @@ describe('AnalysisConsumptionRow component', () => {
const mockConnected = false
const { container } = render(
<ProfileComparatorRow
- fluid={FluidType.ELECTRICITY}
+ fluidType={FluidType.ELECTRICITY}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={performanceValue}
@@ -123,7 +123,7 @@ describe('AnalysisConsumptionRow component', () => {
const mockPerformanceValue: number | null = null
const { container } = render(
<ProfileComparatorRow
- fluid={FluidType.ELECTRICITY}
+ fluidType={FluidType.ELECTRICITY}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={mockPerformanceValue}
@@ -162,7 +162,7 @@ describe('AnalysisConsumptionRow component', () => {
}
const { container } = render(
<ProfileComparatorRow
- fluid={FluidType.ELECTRICITY}
+ fluidType={FluidType.ELECTRICITY}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
performanceValue={performanceValue}
diff --git a/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx b/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx
index 0ba4dd6f8bd20e733be73cf931d4f7fc505be4e2..5d9fcb185d1862c01d949ba40d0ef8cf7ac7f7df 100644
--- a/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx
+++ b/src/components/Analysis/ProfileComparator/ProfileComparatorRow.tsx
@@ -7,11 +7,11 @@ import { MonthlyForecast } from 'models'
import React from 'react'
import ConverterService from 'services/converter.service'
import { getPicto } from 'utils/picto'
-import { formatNumberValues } from 'utils/utils'
+import { formatNumberValues, getFluidName } from 'utils/utils'
import './profileComparatorRow.scss'
interface ProfileComparatorRowProps {
- fluid: FluidType
+ fluidType: FluidType
userPriceConsumption: number
homePriceConsumption: number
performanceValue: number | null
@@ -21,7 +21,7 @@ interface ProfileComparatorRowProps {
}
const ProfileComparatorRow = ({
- fluid,
+ fluidType,
userPriceConsumption,
homePriceConsumption,
performanceValue,
@@ -31,91 +31,86 @@ const ProfileComparatorRow = ({
}: ProfileComparatorRowProps) => {
const { t } = useI18n()
const converterService: ConverterService = new ConverterService()
- const maxPriceConsumption: number = Math.max(
+ const maxPriceConsumption = Math.max(
userPriceConsumption,
homePriceConsumption
)
- const fluidLoad: number =
- forecast && fluid !== FluidType.MULTIFLUID
- ? forecast.fluidForecast[fluid].load
- : 0
+ const isMulti = fluidType === FluidType.MULTIFLUID
+ const isElecOrGas =
+ fluidType === FluidType.ELECTRICITY || fluidType === FluidType.GAS
+ const FLUIDNAME = getFluidName(fluidType).toUpperCase()
- const formatFluidConsumptionForConso = (_fluid: FluidType) => {
- if (_fluid === FluidType.MULTIFLUID) {
+ const fluidLoad =
+ forecast && !isMulti ? forecast.fluidForecast[fluidType].load : 0
+
+ const formatFluidConsumptionForConso = () => {
+ if (isMulti) {
return `${formatNumberValues(userPriceConsumption).toString()} €`
} else {
if (performanceValue) {
// keeps unit in kWh for electricity and gas
- if (_fluid === FluidType.ELECTRICITY || _fluid === FluidType.GAS) {
+ if (isElecOrGas) {
return `${Math.round(performanceValue)} ${t(
- `FLUID.${FluidType[_fluid]}.UNIT`
+ `FLUID.${FLUIDNAME}.UNIT`
)}`
}
return performanceValue >= 1000 || fluidLoad >= 1000
? formatNumberValues(performanceValue / 1000).toString() +
' ' +
- t(`FLUID.${FluidType[_fluid]}.MEGAUNIT`)
- : Math.round(performanceValue) +
- ' ' +
- t(`FLUID.${FluidType[_fluid]}.UNIT`)
+ t(`FLUID.${FLUIDNAME}.MEGAUNIT`)
+ : Math.round(performanceValue) + ' ' + t(`FLUID.${FLUIDNAME}.UNIT`)
} else {
return '-'
}
}
}
- const formatFluidConsumptionForForecast = (_fluid: FluidType) => {
- if (_fluid === FluidType.MULTIFLUID) {
+ const formatFluidConsumptionForForecast = () => {
+ if (isMulti) {
return `${formatNumberValues(homePriceConsumption).toString()} €`
} else {
// keeps unit in kWh for electricity and gas
- if (_fluid === FluidType.ELECTRICITY || _fluid === FluidType.GAS) {
- return `${Math.round(fluidLoad)} ${t(
- `FLUID.${FluidType[_fluid]}.UNIT`
- )}`
+ if (isElecOrGas) {
+ return `${Math.round(fluidLoad)} ${t('FLUID.' + FLUIDNAME + '.UNIT')}`
}
return (performanceValue && performanceValue >= 1000) || fluidLoad >= 1000
? formatNumberValues(fluidLoad / 1000).toString() +
' ' +
- t(`FLUID.${FluidType[_fluid]}.MEGAUNIT`)
- : Math.round(fluidLoad) + ' ' + t(`FLUID.${FluidType[_fluid]}.UNIT`)
+ t(`FLUID.${FLUIDNAME}.MEGAUNIT`)
+ : Math.round(fluidLoad) + ' ' + t(`FLUID.${FLUIDNAME}.UNIT`)
}
}
- const getWidthForConso = (_fluid: FluidType) => {
- if (_fluid === FluidType.MULTIFLUID) {
+ const getWidthForConso = () => {
+ if (isMulti) {
return `${(userPriceConsumption / maxPriceConsumption) * 100}%`
} else {
return `${
- (converterService.LoadToEuro(performanceValue || 0, _fluid) /
+ (converterService.LoadToEuro(performanceValue || 0, fluidType) /
maxPriceConsumption) *
100
}%`
}
}
- const getWidthForForecast = (_fluid: FluidType) => {
- if (_fluid === FluidType.MULTIFLUID) {
+ const getWidthForForecast = () => {
+ if (isMulti) {
return `${(homePriceConsumption / maxPriceConsumption) * 100}%`
} else {
- const fluidValue: number = forecast
- ? forecast.fluidForecast[_fluid].value
- : 0
+ const fluidValue = forecast ? forecast.fluidForecast[fluidType].value : 0
return `${(fluidValue / maxPriceConsumption) * 100}%`
}
}
const comparaisonText = connected
- ? formatFluidConsumptionForConso(fluid)
+ ? formatFluidConsumptionForConso()
: t(`analysis.no_data`)
return (
- <div
- className={`analysisRow consumption-${FluidType[fluid].toLowerCase()}`}
- >
+ <div className={`analysisRow consumption-${FLUIDNAME.toLowerCase()}`}>
<div className="user-graph">
<div
- className={classNames('price', 'text-15-bold', {
+ className={classNames('price text-15-bold', {
['not-connected']: !connected || noData,
})}
data-testid="userPrice"
@@ -127,7 +122,7 @@ const ProfileComparatorRow = ({
<div
className="graph"
style={{
- width: getWidthForConso(fluid),
+ width: getWidthForConso(),
}}
/>
</div>
@@ -135,9 +130,7 @@ const ProfileComparatorRow = ({
</div>
<div className="icon-container">
<StyledIcon
- icon={
- fluid === FluidType.MULTIFLUID ? EuroIcon : getPicto(fluid, true)
- }
+ icon={isMulti ? EuroIcon : getPicto(fluidType, true)}
size={22}
className={noData ? 'noData' : ''}
/>
@@ -148,7 +141,7 @@ const ProfileComparatorRow = ({
<div
className="graph"
style={{
- width: getWidthForForecast(fluid),
+ width: getWidthForForecast(),
}}
/>
)}
@@ -159,7 +152,7 @@ const ProfileComparatorRow = ({
})}
data-testid="averagePrice"
>
- {formatFluidConsumptionForForecast(fluid)}
+ {formatFluidConsumptionForForecast()}
</div>
</div>
</div>
diff --git a/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap b/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap
index c8c370b1e1cd54cf3b3e63cd84f919ea15d67680..0ec6fdfe3f1938edb876719ba7253d5b03b1752c 100644
--- a/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap
+++ b/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap
@@ -136,14 +136,14 @@ exports[`AnalysisConsumption component should be rendered correctly with profile
</div>
<mock-profilecomparatorrow
connected="true"
- fluid="3"
+ fluidtype="3"
homepriceconsumption="0"
nodata="false"
userpriceconsumption="156.161853"
/>
<mock-profilecomparatorrow
connected="true"
- fluid="0"
+ fluidtype="0"
homepriceconsumption="0"
nodata="false"
performancevalue="178.54"
@@ -151,7 +151,7 @@ exports[`AnalysisConsumption component should be rendered correctly with profile
/>
<mock-profilecomparatorrow
connected="true"
- fluid="1"
+ fluidtype="1"
homepriceconsumption="0"
nodata="false"
performancevalue="7763.98"
@@ -159,7 +159,7 @@ exports[`AnalysisConsumption component should be rendered correctly with profile
/>
<mock-profilecomparatorrow
connected="true"
- fluid="2"
+ fluidtype="2"
homepriceconsumption="0"
nodata="false"
performancevalue="1317.67"
diff --git a/src/components/Analysis/TotalAnalysisChart/PieChart.tsx b/src/components/Analysis/TotalAnalysisChart/PieChart.tsx
index ad96a96122221cf037ac4e0ab48d0bb088e6e7cb..12b27e060930b5b345f1b0149ef4b53a144a3fc5 100644
--- a/src/components/Analysis/TotalAnalysisChart/PieChart.tsx
+++ b/src/components/Analysis/TotalAnalysisChart/PieChart.tsx
@@ -23,7 +23,7 @@ const PieChart = ({
const arcWidth = outerRadius - innerRadius
useEffect(() => {
- const dataloadArray: number[] = dataloadValueDetailArray.map(
+ const dataloadArray = dataloadValueDetailArray.map(
dataload => dataload.value
)
const data = createPie(dataloadArray)
diff --git a/src/components/Challenge/ChallengeCardDone/ChallengeCardDone.spec.tsx b/src/components/Challenge/ChallengeCardDone/ChallengeCardDone.spec.tsx
index 56ef37bff49697a3fc05c852f9ef7586b8b3c7eb..d62b47d36700bfebc8cddf816d03ef991ab9ba93 100644
--- a/src/components/Challenge/ChallengeCardDone/ChallengeCardDone.spec.tsx
+++ b/src/components/Challenge/ChallengeCardDone/ChallengeCardDone.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import ChallengeCardDone from 'components/Challenge/ChallengeCardDone/ChallengeCardDone'
import React from 'react'
@@ -44,10 +44,10 @@ describe('ChallengeCardDone component', () => {
<ChallengeCardDone userChallenge={userChallengeData[0]} />
</Provider>
)
- const resetButton = screen.getByRole('button', {
- name: 'challenge.card_done.reset_defi',
+ const resetButton = screen.getByText('challenge.card_done.reset_defi')
+ await act(async () => {
+ await userEvent.click(resetButton)
})
- await userEvent.click(resetButton)
expect(mockDispatch).toHaveBeenCalledWith({
type: 'challenge/updateUserChallengeList',
})
@@ -65,10 +65,8 @@ describe('ChallengeCardDone component', () => {
<ChallengeCardDone userChallenge={userChallengeData[0]} />
</Provider>
)
- const resetButton = screen.getByRole('button', {
- name: 'challenge.card_done.reset_defi',
- })
- expect(resetButton).toHaveProperty('disabled')
+ const resetBtn = screen.getByLabelText('challenge.card_done.reset_defi')
+ expect(resetBtn).toHaveProperty('disabled')
expect(mockDispatch).toHaveBeenCalledTimes(0)
expect(mockUpdateUserChallenge).toHaveBeenCalledTimes(0)
})
@@ -78,10 +76,8 @@ describe('ChallengeCardDone component', () => {
<ChallengeCardDone userChallenge={userChallengeData[1]} />
</Provider>
)
- const resetButton = screen.getByRole('button', {
- name: 'challenge.card_done.reset_defi',
- })
- expect(resetButton).toHaveClass('btnPrimaryNegative')
+ const resetBtn = screen.getByLabelText('challenge.card_done.reset_defi')
+ expect(resetBtn).toHaveClass('btnPrimaryNegative')
})
it('should be secondary button is challenge is won', async () => {
render(
@@ -89,10 +85,8 @@ describe('ChallengeCardDone component', () => {
<ChallengeCardDone userChallenge={userChallengeData[0]} />
</Provider>
)
- const resetButton = screen.getByRole('button', {
- name: 'challenge.card_done.reset_defi',
- })
- expect(resetButton).toHaveClass('btnSecondary')
+ const resetBtn = screen.getByLabelText('challenge.card_done.reset_defi')
+ expect(resetBtn).toHaveClass('btnSecondary')
})
})
})
diff --git a/src/components/Challenge/ChallengeCardLast/ChallengeCardLast.spec.tsx b/src/components/Challenge/ChallengeCardLast/ChallengeCardLast.spec.tsx
index 17fb028e94d666557241b6bbe591b932a966472f..f4825300a48bdda50d2ff32104a254aaca806a28 100644
--- a/src/components/Challenge/ChallengeCardLast/ChallengeCardLast.spec.tsx
+++ b/src/components/Challenge/ChallengeCardLast/ChallengeCardLast.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import ChallengeCardLast from './ChallengeCardLast'
@@ -16,7 +16,9 @@ describe('ChallengeCardLast component', () => {
global.open = jest.fn()
render(<ChallengeCardLast />)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('challenge.card_last.button'))
+ })
expect(window.open).toHaveBeenCalledTimes(1)
expect(global.open).toHaveBeenCalledWith(
`${__SAU_IDEA_DIRECT_LINK__}?version=0.0.0`
diff --git a/src/components/Challenge/ChallengeCardOnGoing/ChallengeCardOnGoing.tsx b/src/components/Challenge/ChallengeCardOnGoing/ChallengeCardOnGoing.tsx
index 028d698b59eac6ab1ff51946552ec155364d1d8c..b6e1ba070fef77130c61540cb384265af4137e16 100644
--- a/src/components/Challenge/ChallengeCardOnGoing/ChallengeCardOnGoing.tsx
+++ b/src/components/Challenge/ChallengeCardOnGoing/ChallengeCardOnGoing.tsx
@@ -19,7 +19,7 @@ import {
UserQuizState,
} from 'enums'
import { UserChallenge } from 'models'
-import React, { useCallback, useEffect, useState } from 'react'
+import React, { useEffect, useMemo, useState } from 'react'
import { useNavigate } from 'react-router-dom'
import ChallengeService from 'services/challenge.service'
import { updateUserChallengeList } from 'store/challenge/challenge.slice'
@@ -41,7 +41,7 @@ const ChallengeCardOnGoing = ({
challenge: { currentDataload },
global: { fluidTypes, fluidStatus },
} = useAppSelector(state => state.ecolyo)
- const [isOneFluidUp, setIsOneFluidUp] = useState<boolean>(true)
+ const [noFluidConnected, setNoFluidConnected] = useState<boolean>(false)
const [challengeIcon, setChallengeIcon] = useState<string>(defaultIcon)
const [isDone, setIsDone] = useState<boolean>(false)
const [isLoading, setIsLoading] = useState<boolean>(false)
@@ -55,16 +55,13 @@ const ChallengeCardOnGoing = ({
const explorationFinished = userChallenge.progress.explorationProgress === 5
const actionFinished = userChallenge.progress.actionProgress === 5
- const toggleNoFluidModal = useCallback(() => {
- setIsOneFluidUp(prev => !prev)
- }, [])
+ const challengeService = useMemo(() => new ChallengeService(client), [client])
const goDuel = async () => {
setIsLoading(true)
// Check if at least one fluid is up
if (fluidTypes.length !== 0) {
if (userChallenge.duel.state !== UserDuelState.ONGOING) {
- const challengeService = new ChallengeService(client)
const updatedChallenge = await challengeService.updateUserChallenge(
userChallenge,
UserChallengeUpdateFlag.DUEL_UPDATE_THRESHOLD,
@@ -77,13 +74,12 @@ const ChallengeCardOnGoing = ({
navigate(`/challenges/duel?id=${userChallenge.id}`)
} else {
setIsLoading(false)
- toggleNoFluidModal()
+ setNoFluidConnected(true)
}
}
const goQuiz = async () => {
if (userChallenge.quiz.state !== UserQuizState.ONGOING) {
- const challengeService = new ChallengeService(client)
const updatedChallenge = await challengeService.updateUserChallenge(
userChallenge,
UserChallengeUpdateFlag.QUIZ_RESET
@@ -119,7 +115,6 @@ const ChallengeCardOnGoing = ({
}, [userChallenge])
useEffect(() => {
- const challengeService = new ChallengeService(client)
let subscribed = true
async function setChallengeResult() {
const isChallengeDone = await challengeService.isChallengeDone(
@@ -156,7 +151,7 @@ const ChallengeCardOnGoing = ({
return () => {
subscribed = false
}
- }, [client, currentDataload, userChallenge, dispatch])
+ }, [currentDataload, userChallenge, dispatch, challengeService])
const quizButton = () => (
<Button
@@ -311,8 +306,8 @@ const ChallengeCardOnGoing = ({
{actionButton()}
{duelContainer()}
<ChallengeNoFluidModal
- open={!isOneFluidUp}
- handleCloseClick={toggleNoFluidModal}
+ open={noFluidConnected}
+ handleCloseClick={() => setNoFluidConnected(false)}
/>
</div>
)
diff --git a/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx b/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx
index 46c7d7a5ff3dbaa547b01c59af4ec345d753f0ea..89209571b601b886564d81ed83d6821e989b787f 100644
--- a/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx
+++ b/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx
@@ -1,6 +1,6 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
-import { FluidType } from 'enums'
+import { FluidState, FluidType } from 'enums'
import React from 'react'
import { Provider } from 'react-redux'
import {
@@ -27,7 +27,9 @@ describe('ChallengeCardUnlocked component', () => {
</Provider>
)
expect(screen.getByText('Simone VEILLE')).toBeInTheDocument()
- expect(screen.getByRole('button')).toBeInTheDocument()
+ expect(
+ screen.getByText('challenge.card_unlocked.button_launch')
+ ).toBeInTheDocument()
expect(screen.queryAllByRole('dialog').length).toBeFalsy()
})
@@ -37,7 +39,11 @@ describe('ChallengeCardUnlocked component', () => {
<ChallengeCardUnlocked userChallenge={userChallengeData[0]} />
</Provider>
)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('challenge.card_unlocked.button_launch')
+ )
+ })
expect(screen.queryAllByRole('dialog').length).toBeTruthy()
})
@@ -45,7 +51,9 @@ describe('ChallengeCardUnlocked component', () => {
const store = createMockEcolyoStore({
global: {
fluidTypes: [FluidType.ELECTRICITY],
- fluidStatus: [{ ...mockGlobalState.fluidStatus[0], status: 200 }],
+ fluidStatus: [
+ { ...mockGlobalState.fluidStatus[0], status: FluidState.DONE },
+ ],
},
challenge: mockChallengeState,
})
@@ -54,7 +62,11 @@ describe('ChallengeCardUnlocked component', () => {
<ChallengeCardUnlocked userChallenge={userChallengeData[0]} />
</Provider>
)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('challenge.card_unlocked.button_launch')
+ )
+ })
expect(screen.queryAllByRole('dialog').length).toBeFalsy()
expect(mockStartUserChallenge).toHaveBeenCalledWith(userChallengeData[0])
})
@@ -72,7 +84,9 @@ describe('ChallengeCardUnlocked component', () => {
<ChallengeCardUnlocked userChallenge={userChallengeData[0]} />
</Provider>
)
- const resetButton = screen.getByRole('button')
- expect(resetButton).toHaveAttribute('disabled')
+ const launchBtn = screen.getByLabelText(
+ 'challenge.accessibility.button_launch'
+ )
+ expect(launchBtn).toHaveAttribute('disabled')
})
})
diff --git a/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.tsx b/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.tsx
index 83926cbe364a54b9e8a17c80d1e5f80bcf32429e..2bbafcead7034e59401ebe6952fa7cf23b691fc9 100644
--- a/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.tsx
+++ b/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.tsx
@@ -25,14 +25,14 @@ const ChallengeCardUnlocked = ({
global: { fluidTypes, fluidStatus },
} = useAppSelector(state => state.ecolyo)
const dispatch = useAppDispatch()
- const [openNoFluidModal, setopenNoFluidModal] = useState(false)
+ const [openNoFluidModal, setOpenNoFluidModal] = useState(false)
const [challengeIcon, setChallengeIcon] = useState(defaultIcon)
- let statusRequirementOk = false
const toggleNoFluidModal = useCallback(() => {
- setopenNoFluidModal(prev => !prev)
+ setOpenNoFluidModal(prev => !prev)
}, [])
+ let statusRequirementOk = false
fluidStatus.forEach(fluid => {
if (
fluid.status !== FluidState.NOT_CONNECTED &&
diff --git a/src/components/Challenge/ChallengeView.tsx b/src/components/Challenge/ChallengeView.tsx
index d55765ebf5596fe03eb72362b2959a7031e826b7..6affdfee88aa882dd7fa7bd22f07be87ee98b64e 100644
--- a/src/components/Challenge/ChallengeView.tsx
+++ b/src/components/Challenge/ChallengeView.tsx
@@ -21,7 +21,6 @@ const ChallengeView = () => {
const cardWidth =
window.outerWidth < 500 ? window.outerWidth - marginPx * 6 : 285
const cardHeight = window.outerHeight * 0.65
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const [touchStart, setTouchStart] = useState<number>()
const [touchEnd, setTouchEnd] = useState<number>()
const [index, setIndex] = useState<number>(0)
@@ -99,11 +98,8 @@ const ChallengeView = () => {
return (
<>
<CozyBar titleKey="common.title_challenge" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_challenge"
- />
- <Content heightOffset={headerHeight}>
+ <Header desktopTitleKey="common.title_challenge" />
+ <Content>
<div
className="challengeSlider"
onClick={resetValues}
diff --git a/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap b/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap
index 3f3366ca5dc5e7798dbbe06ec4710fca25d1e5c3..0f0c1a5cb86a6d1aa750d9fccde498df95890c96 100644
--- a/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap
+++ b/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap
@@ -8,9 +8,7 @@ exports[`ChallengeView component should be rendered correctly 1`] = `
<mock-header
desktoptitlekey="common.title_challenge"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="challengeSlider"
>
diff --git a/src/components/Charts/AxisBottom.tsx b/src/components/Charts/AxisBottom.tsx
index 86cb03e3e4f8e3646c697cb9e396c470e02a9ee3..35dbdfe9e9d85202d7346a2c91b96f9ca9adce55 100644
--- a/src/components/Charts/AxisBottom.tsx
+++ b/src/components/Charts/AxisBottom.tsx
@@ -39,7 +39,9 @@ function TextAxis({
return (
<text y="10" dy="0.71em" transform={`translate(${width})`}>
<tspan className={style} textAnchor="middle">
- {dataload.date.toLocaleString({ year: 'numeric' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ year: 'numeric' })}
</tspan>
</text>
)
@@ -47,7 +49,9 @@ function TextAxis({
return (
<text y="10" dy="0.71em" transform={`translate(${width})`}>
<tspan className={style} textAnchor="middle">
- {dataload.date.toLocaleString({ month: 'narrow' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ month: 'narrow' })}
</tspan>
</text>
)
@@ -57,10 +61,14 @@ function TextAxis({
return (
<>
<tspan className={style} x="0" textAnchor="middle">
- {dataload.date.toLocaleString({ weekday: 'narrow' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ weekday: 'narrow' })}
</tspan>
<tspan className={style} x="0" dy="1.2em" textAnchor="middle">
- {dataload.date.toLocaleString({ day: 'numeric' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ day: 'numeric' })}
</tspan>
</>
)
@@ -70,12 +78,15 @@ function TextAxis({
<tspan className={style} x="0" textAnchor="middle">
{capitalize(
dataload.date
+ .setLocale('fr-FR')
.toLocaleString({ weekday: 'short' })
.substring(0, 3)
)}
</tspan>
<tspan className={style} x="0" dy="1.2em" textAnchor="middle">
- {dataload.date.toLocaleString({ day: 'numeric' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ day: 'numeric' })}
</tspan>
</>
)
@@ -93,10 +104,14 @@ function TextAxis({
return (
<text y="10" dy="0.71em" transform={`translate(${width})`}>
<tspan className={style} x="0" textAnchor="middle">
- {dataload.date.toLocaleString({ weekday: 'narrow' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ weekday: 'narrow' })}
</tspan>
<tspan className={style} x="0" dy="1.2em" textAnchor="middle">
- {dataload.date.toLocaleString({ day: 'numeric' })}
+ {dataload.date
+ .setLocale('fr-FR')
+ .toLocaleString({ day: 'numeric' })}
</tspan>
</text>
)
diff --git a/src/components/Charts/AxisRight.tsx b/src/components/Charts/AxisRight.tsx
index 71b7dac5e957d07822b173b39ec51f0656aa850e..7780c52ac0beb1e062554e7160423c5306a35883 100644
--- a/src/components/Charts/AxisRight.tsx
+++ b/src/components/Charts/AxisRight.tsx
@@ -5,6 +5,7 @@ import { ScaleLinear } from 'd3-scale'
import { select, selectAll } from 'd3-selection'
import { FluidType } from 'enums'
import React, { useEffect, useRef } from 'react'
+import { getFluidName } from 'utils/utils'
interface AxisRightProps {
yScale: ScaleLinear<number, number>
@@ -24,12 +25,10 @@ const AxisRight = ({
isAnalysis,
}: AxisRightProps) => {
const { t } = useI18n()
- const fluidStyle =
- fluidType === FluidType.MULTIFLUID ? 'MULTIFLUID' : FluidType[fluidType]
- const isMultiFluid = fluidStyle !== 'MULTIFLUID'
+ const isMulti = fluidType === FluidType.MULTIFLUID
+ const fluidStyle = getFluidName(fluidType).toLocaleUpperCase()
const yAxisRef = useRef<SVGGElement>(null)
- const newMarginRight =
- fluidType === FluidType.MULTIFLUID ? marginRight - 10 : marginRight
+ const newMarginRight = isMulti ? marginRight - 10 : marginRight
const formatFluidValue = (value: NumberValue, unit: 'UNIT' | 'MEGAUNIT') => {
const fluidUnit = t(`FLUID.${fluidStyle}.${unit}`)
@@ -54,7 +53,7 @@ const AxisRight = ({
.tickSize(-width)
.tickSizeOuter(0)
.tickFormat(d =>
- Number(d) >= 1000 && isMultiFluid
+ Number(d) >= 1000 && !isMulti
? formatMultiFluidValue(d)
: formatSingleFluidValue(d)
)
diff --git a/src/components/Charts/Bar.spec.tsx b/src/components/Charts/Bar.spec.tsx
index adb15d3502c845b9494097d54d3d5d16d6a5e585..73cf573db8ade5ee375ebe7be2e2fac8db7d7549 100644
--- a/src/components/Charts/Bar.spec.tsx
+++ b/src/components/Charts/Bar.spec.tsx
@@ -1,4 +1,4 @@
-import { render } from '@testing-library/react'
+import { act, render } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { scaleLinear } from 'd3'
import { FluidType, TimeStep } from 'enums'
@@ -122,7 +122,9 @@ describe('Bar component test', () => {
</svg>
</Provider>
)
- await userEvent.click(container.querySelector('rect') as Element)
+ await act(async () => {
+ await userEvent.click(container.querySelector('rect') as Element)
+ })
expect(setSelectedDateSpy).toHaveBeenCalledTimes(1)
expect(setSelectedDateSpy).toHaveBeenCalledWith(
graphData.actualData[0].date
diff --git a/src/components/Charts/Bar.tsx b/src/components/Charts/Bar.tsx
index 62ca898f1ec8a8c770095689814a9ab8bb715593..0b6ccdb99804c32a1349444c92be2729f083d9c7 100644
--- a/src/components/Charts/Bar.tsx
+++ b/src/components/Charts/Bar.tsx
@@ -10,6 +10,7 @@ import {
setSelectedDate,
} from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
+import { getFluidName } from 'utils/utils'
interface BarProps {
index: number
@@ -56,9 +57,8 @@ const Bar = ({
const [compareAnimationEnded, setCompareAnimationEnded] = useState(false)
const browser = detect()
- const fluidStyle =
- fluidType === FluidType.MULTIFLUID ? 'MULTIFLUID' : FluidType[fluidType]
const isMulti = fluidType === FluidType.MULTIFLUID
+ const FLUIDNAME = getFluidName(fluidType).toUpperCase()
const handleClick = () => {
if (!isSwitching && !isDuel && clickable) {
@@ -129,11 +129,20 @@ const Bar = ({
const selected = isSelectedDate ? 'selected' : ''
const getBarClass = () => {
- const upcoming = dataload.value === -1 ? 'bar-UNCOMING' : ''
+ const upcoming = dataload.value === -1 ? 'bar-UPCOMING' : ''
const edgeBrowser = browser && browser.name !== 'edge'
const bounce = edgeBrowser ? '1' : '3'
- const baseStyles = `bar-${fluidStyle} ${upcoming} ${weekdays} ${selected} ${disabled}`
+ const baseStyles = [
+ `bar-${FLUIDNAME}`,
+ upcoming,
+ weekdays,
+ selected,
+ disabled,
+ ]
+ .filter(Boolean)
+ .join(' ')
+
if (clicked) {
return `${baseStyles} ${clickedAnim}`
}
@@ -147,7 +156,7 @@ const Bar = ({
const animate = `bounce-2 delay--${clicked ? 0 : index}`
const animationClass = compareAnimationEnded ? '' : animate
- return `bar-compare-${fluidStyle} ${selected} ${animationClass} ${clickedAnim}`
+ return `bar-compare-${FLUIDNAME} ${selected} ${animationClass} ${clickedAnim}`
}
const barBackgroundClass = isSelectedDate
diff --git a/src/components/Charts/UncomingBar.spec.tsx b/src/components/Charts/UpcomingBar.spec.tsx
similarity index 84%
rename from src/components/Charts/UncomingBar.spec.tsx
rename to src/components/Charts/UpcomingBar.spec.tsx
index 30f5cb0cc48a9a054940be9528373826093c53b8..a84b0d4f20bdd91c54daa565fea05780efe85ea1 100644
--- a/src/components/Charts/UncomingBar.spec.tsx
+++ b/src/components/Charts/UpcomingBar.spec.tsx
@@ -3,13 +3,13 @@ import { scaleLinear } from 'd3'
import React from 'react'
import { dataLoadArray } from 'tests/__mocks__/chartData.mock'
import { mockXScale } from 'tests/__mocks__/xScale.mock'
-import UncomingBar from './UncomingBar'
+import UpcomingBar from './UpcomingBar'
-describe('Uncoming component', () => {
+describe('Upcoming component', () => {
it('should match snapshot', () => {
const { container } = render(
<svg>
- <UncomingBar
+ <UpcomingBar
index={0}
average={10}
dataload={dataLoadArray[0]}
diff --git a/src/components/Charts/UncomingBar.tsx b/src/components/Charts/UpcomingBar.tsx
similarity index 95%
rename from src/components/Charts/UncomingBar.tsx
rename to src/components/Charts/UpcomingBar.tsx
index 32dcb3c1544e50f9764f8ac90f9ed4632136451e..7022e3766230b8739f343894cd018bcc4413ff04 100644
--- a/src/components/Charts/UncomingBar.tsx
+++ b/src/components/Charts/UpcomingBar.tsx
@@ -13,7 +13,7 @@ interface BarProps {
average: number
}
-const UncomingBar = ({
+const UpcomingBar = ({
index,
dataload,
xScale,
@@ -32,7 +32,7 @@ const UncomingBar = ({
animationClass = browser?.name !== 'edge' ? 'bounce-1' : 'bounce-3'
animationClass += ` delay--${index % 13}`
}
- const barClass = `bar-UNCOMING ${animationClass}`
+ const barClass = `bar-UPCOMING ${animationClass}`
const topRoundedRectDashedLine = (
x: number,
@@ -114,4 +114,4 @@ const UncomingBar = ({
)
}
-export default UncomingBar
+export default UpcomingBar
diff --git a/src/components/Charts/__snapshots__/AxisBottom.spec.tsx.snap b/src/components/Charts/__snapshots__/AxisBottom.spec.tsx.snap
index f468fcd4dbd5c46e5528dbf9e34a4a8e16e8a4a3..dd321196e7290b0bf856235e533e89b974dada6a 100644
--- a/src/components/Charts/__snapshots__/AxisBottom.spec.tsx.snap
+++ b/src/components/Charts/__snapshots__/AxisBottom.spec.tsx.snap
@@ -22,7 +22,7 @@ exports[`AxisBottom component test should correctly render DAY format of AxisBot
text-anchor="middle"
x="0"
>
- T
+ J
</tspan>
<tspan
class="tick-text tick-text-selected chart-ticks-x-text"
@@ -49,7 +49,7 @@ exports[`AxisBottom component test should correctly render DAY format of AxisBot
text-anchor="middle"
x="0"
>
- F
+ V
</tspan>
<tspan
class="tick-text chart-ticks-x-text"
@@ -266,7 +266,7 @@ exports[`AxisBottom component test should correctly render WEEK format of AxisBo
text-anchor="middle"
x="0"
>
- T
+ J
</tspan>
<tspan
class="tick-text tick-text-selected chart-ticks-x-text"
@@ -293,7 +293,7 @@ exports[`AxisBottom component test should correctly render WEEK format of AxisBo
text-anchor="middle"
x="0"
>
- F
+ V
</tspan>
<tspan
class="tick-text chart-ticks-x-text"
diff --git a/src/components/Charts/__snapshots__/Bar.spec.tsx.snap b/src/components/Charts/__snapshots__/Bar.spec.tsx.snap
index e3916b074b4eaaf5f36842494457fd46f1c40607..4b70e2896a14a9e91562af3834b1a8ffaae5d9cd 100644
--- a/src/components/Charts/__snapshots__/Bar.spec.tsx.snap
+++ b/src/components/Charts/__snapshots__/Bar.spec.tsx.snap
@@ -40,7 +40,7 @@ exports[`Bar component test should correctly render Bar with isDuel 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined bounce-3 delay--4"
+ class="bar-MULTIFLUID bounce-3 delay--4"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -56,7 +56,7 @@ exports[`Bar component test should correctly render Bar with isDuel 1`] = `
>
<defs>
<lineargradient
- class="bar-MULTIFLUID undefined bounce-3 delay--4"
+ class="bar-MULTIFLUID bounce-3 delay--4"
id="gradient"
x1="0"
x2="0"
@@ -130,7 +130,7 @@ exports[`Bar component test should correctly render Bar with isSwitching 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -146,7 +146,7 @@ exports[`Bar component test should correctly render Bar with isSwitching 1`] = `
>
<defs>
<lineargradient
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -164,7 +164,7 @@ exports[`Bar component test should correctly render Bar with isSwitching 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -220,7 +220,7 @@ exports[`Bar component test should correctly render Bar with showCompare 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
d="
M1.2500000000000002,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -236,7 +236,7 @@ exports[`Bar component test should correctly render Bar with showCompare 1`] = `
>
<defs>
<lineargradient
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -254,7 +254,7 @@ exports[`Bar component test should correctly render Bar with showCompare 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
d="
M1.2500000000000002,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -344,7 +344,7 @@ exports[`Bar component test should correctly render Electricity Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -360,7 +360,7 @@ exports[`Bar component test should correctly render Electricity Bar 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -378,7 +378,7 @@ exports[`Bar component test should correctly render Electricity Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -434,7 +434,7 @@ exports[`Bar component test should correctly render Gas Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-GAS undefined selected bounce-2 delay"
+ class="bar-GAS selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -450,7 +450,7 @@ exports[`Bar component test should correctly render Gas Bar 1`] = `
>
<defs>
<lineargradient
- class="bar-GAS undefined selected bounce-2 delay"
+ class="bar-GAS selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -468,7 +468,7 @@ exports[`Bar component test should correctly render Gas Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-GAS undefined selected bounce-2 delay"
+ class="bar-GAS selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -524,7 +524,7 @@ exports[`Bar component test should correctly render Multifluid Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -540,7 +540,7 @@ exports[`Bar component test should correctly render Multifluid Bar 1`] = `
>
<defs>
<lineargradient
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -558,7 +558,7 @@ exports[`Bar component test should correctly render Multifluid Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-MULTIFLUID undefined selected bounce-2 delay"
+ class="bar-MULTIFLUID selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -614,7 +614,7 @@ exports[`Bar component test should correctly render Water Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-WATER undefined selected bounce-2 delay"
+ class="bar-WATER selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
@@ -630,7 +630,7 @@ exports[`Bar component test should correctly render Water Bar 1`] = `
>
<defs>
<lineargradient
- class="bar-WATER undefined selected bounce-2 delay"
+ class="bar-WATER selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -648,7 +648,7 @@ exports[`Bar component test should correctly render Water Bar 1`] = `
</lineargradient>
</defs>
<path
- class="bar-WATER undefined selected bounce-2 delay"
+ class="bar-WATER selected bounce-2 delay"
d="
M0,-12.295074999999997
a-12.295074999999997,-12.295074999999997 0 0 1 -12.295074999999997,12.295074999999997
diff --git a/src/components/Charts/__snapshots__/BarChart.spec.tsx.snap b/src/components/Charts/__snapshots__/BarChart.spec.tsx.snap
index 57ffaf1973a018c655d6a057bfe19515c1e904a5..9df650b27b60a6bfb1e770e9d86a1a0f94c6e7a2 100644
--- a/src/components/Charts/__snapshots__/BarChart.spec.tsx.snap
+++ b/src/components/Charts/__snapshots__/BarChart.spec.tsx.snap
@@ -127,7 +127,7 @@ exports[`BarChart component should render correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -143,7 +143,7 @@ exports[`BarChart component should render correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -161,7 +161,7 @@ exports[`BarChart component should render correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -210,7 +210,7 @@ exports[`BarChart component should render correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -226,7 +226,7 @@ exports[`BarChart component should render correctly 1`] = `
>
<defs>
<lineargradient
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
id="gradient"
x1="0"
x2="0"
@@ -244,7 +244,7 @@ exports[`BarChart component should render correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY selected bounce-2 delay"
d="
M0,4
a4,4 0 0 1 4,-4
@@ -293,7 +293,7 @@ exports[`BarChart component should render correctly 1`] = `
</lineargradient>
</defs>
<path
- class="bar-ELECTRICITY bar-UNCOMING undefined selected bounce-2 delay"
+ class="bar-ELECTRICITY bar-UPCOMING selected bounce-2 delay"
d="
M0,4
a4,4 0 0 1 4,-4
diff --git a/src/components/Charts/__snapshots__/UncomingBar.spec.tsx.snap b/src/components/Charts/__snapshots__/UpcomingBar.spec.tsx.snap
similarity index 84%
rename from src/components/Charts/__snapshots__/UncomingBar.spec.tsx.snap
rename to src/components/Charts/__snapshots__/UpcomingBar.spec.tsx.snap
index 0b62bbcd9d26f68c31cfcd922a16a6c611442d1d..c54a776a9e4502dc173f0c5946ab2e07c3f5fac1 100644
--- a/src/components/Charts/__snapshots__/UncomingBar.spec.tsx.snap
+++ b/src/components/Charts/__snapshots__/UpcomingBar.spec.tsx.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Uncoming component should match snapshot 1`] = `
+exports[`Upcoming component should match snapshot 1`] = `
<div>
<svg>
<g>
@@ -20,7 +20,7 @@ exports[`Uncoming component should match snapshot 1`] = `
transform="translate(undefined, 10)"
>
<path
- class="bar-UNCOMING bounce-1 delay--0"
+ class="bar-UPCOMING bounce-1 delay--0"
d="M0,40v-36 a4,4 0 0 1 4,-4h-5.5a4,4 0 0 1 4,4v36"
fill="url(#gradient)"
stroke="#61f0f2"
diff --git a/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx b/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx
index b9be78286030fbeb9deedf9ac78ed3b28526f7e6..0d8be396b947acfd4f3ea589bacc19da9cabb42f 100644
--- a/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx
+++ b/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import FormNavigation from './FormNavigation'
@@ -15,10 +15,15 @@ describe('FormNavigation component', () => {
disablePrevButton={false}
/>
)
- const [prevButton, nextButton] = screen.getAllByRole('button')
- await userEvent.click(prevButton)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('profile_type.form.button_previous')
+ )
+ })
expect(mockHandlePrevious).toHaveBeenCalled()
- await userEvent.click(nextButton)
+ await act(async () => {
+ await userEvent.click(screen.getByText('profile_type.form.button_next'))
+ })
expect(mockHandleNext).toHaveBeenCalled()
})
})
diff --git a/src/components/CommonKit/Switch/StyledSwitch.tsx b/src/components/CommonKit/Switch/StyledSwitch.tsx
index d8136853ef6452b872454f953f6f3ba6c8db0088..bd890d435fe1ef6051610d1ef4280a411016843b 100644
--- a/src/components/CommonKit/Switch/StyledSwitch.tsx
+++ b/src/components/CommonKit/Switch/StyledSwitch.tsx
@@ -72,20 +72,19 @@ interface StyledSwitchProps extends SwitchProps {
}
const StyledSwitch = ({ fluidType, ...props }: StyledSwitchProps) => {
- if (fluidType !== undefined) {
- switch (fluidType) {
- case FluidType.ELECTRICITY:
- return <SwitchElec {...props} />
- case FluidType.WATER:
- return <SwitchWater {...props} />
- case FluidType.GAS:
- return <SwitchGas {...props} />
- default:
- return <SwitchBase {...props} />
- }
- } else {
+ if (fluidType === undefined) {
return <SwitchBase {...props} />
}
+ switch (fluidType) {
+ case FluidType.ELECTRICITY:
+ return <SwitchElec {...props} />
+ case FluidType.WATER:
+ return <SwitchWater {...props} />
+ case FluidType.GAS:
+ return <SwitchGas {...props} />
+ default:
+ return <SwitchBase {...props} />
+ }
}
export default StyledSwitch
diff --git a/src/components/Connection/Connection.tsx b/src/components/Connection/Connection.tsx
index 04513039f6f7c9d959eefa6649142fb884619e5b..075556c3c4a9ac4d483c56dfdb193563c02355fb 100644
--- a/src/components/Connection/Connection.tsx
+++ b/src/components/Connection/Connection.tsx
@@ -1,35 +1,16 @@
import { FluidType } from 'enums'
-import { FluidConnection } from 'models'
-import React, { useCallback } from 'react'
-import { updateFluidConnection } from 'store/global/global.slice'
-import { useAppDispatch, useAppSelector } from 'store/hooks'
+import React from 'react'
import EpglInit from './EPGLConnect/EpglInit'
import GrdfInit from './GRDFConnect/GrdfInit'
import SgeInit from './SGEConnect/SgeInit'
import './connection.scss'
const Connection = ({ fluidType }: { fluidType: FluidType }) => {
- const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
- const currentFluidStatus = fluidStatus[fluidType]
- const dispatch = useAppDispatch()
-
- const handleSuccess = useCallback(async () => {
- const updatedConnection: FluidConnection = {
- ...currentFluidStatus.connection,
- shouldLaunchKonnector: true,
- }
- dispatch(
- updateFluidConnection({
- fluidType: fluidType,
- fluidConnection: updatedConnection,
- })
- )
- }, [dispatch, fluidType, currentFluidStatus.connection])
return (
<div className="konnector-form">
{fluidType === FluidType.ELECTRICITY && <SgeInit />}
{fluidType === FluidType.WATER && <EpglInit />}
- {fluidType === FluidType.GAS && <GrdfInit onSuccess={handleSuccess} />}
+ {fluidType === FluidType.GAS && <GrdfInit />}
</div>
)
}
diff --git a/src/components/Connection/EPGLConnect/EpglBill.tsx b/src/components/Connection/EPGLConnect/EpglBill.tsx
index 113c53dc041a033cc9ecb5b12e3de39feeccebee..56ed120f6f123c7e56ab72e7d900266605486fad 100644
--- a/src/components/Connection/EPGLConnect/EpglBill.tsx
+++ b/src/components/Connection/EPGLConnect/EpglBill.tsx
@@ -6,10 +6,13 @@ import { FluidType } from 'enums'
import React from 'react'
import { setShowOfflineData } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
import '../connection.scss'
-const EpglBill = () => {
+const EpglBill = ({
+ openModal: setOpenModal,
+}: {
+ openModal: (value: boolean) => void
+}) => {
const { t } = useI18n()
const dispatch = useAppDispatch()
const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
@@ -17,20 +20,20 @@ const EpglBill = () => {
return (
<div className="connection-form">
- <p className="connection-form-title eglgrandlyon text-20-bold">
+ <h2 className="connection-form-title eglgrandlyon text-20-bold">
{t('auth.eglgrandlyon.no_account.title')}
- </p>
+ </h2>
<StyledIcon icon={WaterBillIcon} size={180} />
<p
- className="connection-form-subtitle eglgrandlyon text-16-regular"
+ className="connection-form-subtitle text-16-regular"
dangerouslySetInnerHTML={{ __html: t('auth.eglgrandlyon.bill') }}
/>
<div className="connection-form-button">
<Button
aria-label={t('auth.eglgrandlyon.accessibility.connect')}
- onClick={() => dispatch(openConnectionModal(true))}
+ onClick={() => setOpenModal(true)}
className="btnPrimary"
>
{t('auth.eglgrandlyon.connect')}
diff --git a/src/components/Connection/PartnerConnectModal/EpglConnectModal.tsx b/src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx
similarity index 76%
rename from src/components/Connection/PartnerConnectModal/EpglConnectModal.tsx
rename to src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx
index 404ab89396ad58811c9c2f1147789f310bae02a6..3638cc07d8486793bf1d00b9054ed67a6b7ba377 100644
--- a/src/components/Connection/PartnerConnectModal/EpglConnectModal.tsx
+++ b/src/components/Connection/EPGLConnect/EpglConnectModal/EpglConnectModal.tsx
@@ -2,12 +2,19 @@ import { Button, Dialog, IconButton } from '@material-ui/core'
import CloseIcon from 'assets/icons/ico/close.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
-import React, { useEffect, useState } from 'react'
+import { FluidType } from 'enums'
+import React, { useState } from 'react'
+import { useAppSelector } from 'store/hooks'
import './PartnerConnectModal.scss'
-import { StepContent } from './StepContent.interface'
import EpglCreateAccount from './Steps/EpglCreateAccount'
import EpglDoYouHaveAccount from './Steps/EpglDoYouHaveAccount'
+interface StepContent {
+ content: JSX.Element
+ topButton: JSX.Element
+ bottomButton: JSX.Element
+}
+
enum StepEnum {
DoYouHaveAccount,
CreateAccount,
@@ -15,37 +22,42 @@ enum StepEnum {
interface EpglConnectModalProps {
open: boolean
- handleCloseClick: () => void
setShowForm: (value: boolean) => void
- goToPartnerSite: () => void
setHasCreatedAccount: (value: boolean) => void
+ closeModal: (value: boolean) => void
}
const EpglConnectModal = ({
open,
- handleCloseClick,
setShowForm,
- goToPartnerSite,
setHasCreatedAccount,
+ closeModal: setOpenModal,
}: EpglConnectModalProps) => {
const { t } = useI18n()
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+ const currentFluidStatus = fluidStatus[FluidType.WATER]
+ const siteLink = currentFluidStatus.connection.konnectorConfig.siteLink
+
const [currentStep, setCurrentStep] = useState(StepEnum.DoYouHaveAccount)
- useEffect(() => {
- if (open) {
- setCurrentStep(0)
- }
- }, [open])
+ const handleCloseModal = () => {
+ setCurrentStep(StepEnum.DoYouHaveAccount)
+ setOpenModal(false)
+ }
+
+ const goToPartnerSite = () => {
+ window.open(siteLink, '_blank')
+ }
const handleGoToPartnerSite = () => {
goToPartnerSite()
setHasCreatedAccount(true)
setShowForm(true)
- handleCloseClick()
+ handleCloseModal()
}
const handleShowForm = () => {
setShowForm(true)
- handleCloseClick()
+ handleCloseModal()
}
const steps: Record<StepEnum, StepContent> = {
@@ -86,7 +98,7 @@ const EpglConnectModal = ({
return (
<Dialog
open={open}
- onClose={handleCloseClick}
+ onClose={handleCloseModal}
classes={{
root: 'modal-root',
paper: 'modal-paper',
@@ -95,7 +107,7 @@ const EpglConnectModal = ({
<IconButton
aria-label={t('auth.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
+ onClick={handleCloseModal}
>
<Icon icon={CloseIcon} size={16} />
</IconButton>
diff --git a/src/components/Connection/PartnerConnectModal/PartnerConnectModal.scss b/src/components/Connection/EPGLConnect/EpglConnectModal/PartnerConnectModal.scss
similarity index 100%
rename from src/components/Connection/PartnerConnectModal/PartnerConnectModal.scss
rename to src/components/Connection/EPGLConnect/EpglConnectModal/PartnerConnectModal.scss
diff --git a/src/components/Connection/PartnerConnectModal/Steps/EpglCreateAccount.tsx b/src/components/Connection/EPGLConnect/EpglConnectModal/Steps/EpglCreateAccount.tsx
similarity index 100%
rename from src/components/Connection/PartnerConnectModal/Steps/EpglCreateAccount.tsx
rename to src/components/Connection/EPGLConnect/EpglConnectModal/Steps/EpglCreateAccount.tsx
diff --git a/src/components/Connection/PartnerConnectModal/Steps/EpglDoYouHaveAccount.tsx b/src/components/Connection/EPGLConnect/EpglConnectModal/Steps/EpglDoYouHaveAccount.tsx
similarity index 100%
rename from src/components/Connection/PartnerConnectModal/Steps/EpglDoYouHaveAccount.tsx
rename to src/components/Connection/EPGLConnect/EpglConnectModal/Steps/EpglDoYouHaveAccount.tsx
diff --git a/src/components/Connection/PartnerConnectModal/Steps/stepDetail.scss b/src/components/Connection/EPGLConnect/EpglConnectModal/Steps/stepDetail.scss
similarity index 100%
rename from src/components/Connection/PartnerConnectModal/Steps/stepDetail.scss
rename to src/components/Connection/EPGLConnect/EpglConnectModal/Steps/stepDetail.scss
diff --git a/src/components/Connection/EPGLConnect/EpglForm.scss b/src/components/Connection/EPGLConnect/EpglForm.scss
new file mode 100644
index 0000000000000000000000000000000000000000..8ec67c230423962c184fc1811b762b54b5f06da5
--- /dev/null
+++ b/src/components/Connection/EPGLConnect/EpglForm.scss
@@ -0,0 +1,22 @@
+@import 'src/styles/base/color';
+@import 'src/styles/base/breakpoint';
+@import 'src/styles/components/input';
+
+form {
+ margin-top: 1rem;
+ display: flex;
+ flex-direction: column;
+ gap: 1rem;
+
+ .iconShowPassword {
+ float: right;
+ position: relative;
+ margin-top: -67px;
+ margin-right: 15px;
+ }
+
+ .errorMessage {
+ color: $red-primary;
+ min-height: 1.25rem;
+ }
+}
diff --git a/src/components/Connection/EPGLConnect/EpglForm.tsx b/src/components/Connection/EPGLConnect/EpglForm.tsx
index 7626152639d743c4bfd23c1ba892c365bedd1387..14ba3dd2c8b8fb66ccac624b268666b7f2acacc4 100644
--- a/src/components/Connection/EPGLConnect/EpglForm.tsx
+++ b/src/components/Connection/EPGLConnect/EpglForm.tsx
@@ -1,22 +1,155 @@
+import { Button, TextField } from '@material-ui/core'
+import * as Sentry from '@sentry/react'
+import TrailingIcon from 'assets/icons/ico/trailing-icon.svg'
+import EglLogo from 'assets/icons/visu/egl-logo.svg'
+import classNames from 'classnames'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
+import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import React from 'react'
-import '../connection.scss'
-import FormLogin from './FormLogin/FormLogin'
+import { FluidType } from 'enums'
+import { AccountEGLData } from 'models'
+import React, { useEffect, useState } from 'react'
+import { useAppSelector } from 'store/hooks'
+import logApp from 'utils/logger'
+import './EpglForm.scss'
const EpglForm = ({ hasCreatedAccount }: { hasCreatedAccount: boolean }) => {
const { t } = useI18n()
+ const { fluidStatus, lastEpglLogin } = useAppSelector(
+ state => state.ecolyo.global
+ )
+ const currentFluidStatus = fluidStatus[FluidType.WATER]
+ const fluidName = FluidType[currentFluidStatus.fluidType]
+ const account = currentFluidStatus.connection.account
+
+ const [login, setLogin] = useState<string>('')
+ const [password, setPassword] = useState<string>('')
+ const [error, setError] = useState<string>('')
+ const [loading, setLoading] = useState<boolean>(false)
+ const [showPassword, setShowPassword] = useState(false)
+
+ const [connect, update, connectError] = useKonnectorAuth(FluidType.WATER, {
+ eglAuthData: { login, password },
+ })
+
+ const changeLogin = (value: string) => {
+ if (value.toString().length > 7) return
+ setError('')
+ setLogin(value)
+ }
+
+ const changePassword = (value: string) => {
+ setError('')
+ setPassword(value)
+ }
+
+ const handleSubmit = async () => {
+ try {
+ setError('')
+ setLoading(true)
+ if (!login || !password) {
+ setError(t('konnector_form.error_no_login_password'))
+ setLoading(false)
+ return null
+ }
+ if (!account) {
+ await connect()
+ setLoading(false)
+ } else {
+ await update()
+ }
+ } catch (error) {
+ logApp.error(error)
+ Sentry.captureException(error)
+ setLoading(false)
+ }
+ }
+
+ useEffect(() => {
+ if (connectError) setError(connectError)
+ }, [connectError])
+
+ useEffect(() => {
+ if (account?.auth) {
+ const auth = account.auth
+ const authData = auth as AccountEGLData
+ if (authData.login) {
+ setLogin(authData.login)
+ }
+ } else if (lastEpglLogin) {
+ setLogin(lastEpglLogin)
+ setError(t('konnector_form.error_login_failed'))
+ }
+ }, [account, lastEpglLogin, t])
return (
<div className="connection-form">
{hasCreatedAccount && (
- <p className="connection-form-title eglgrandlyon text-20-bold">
+ <h2 className="connection-form-title eglgrandlyon text-20-bold">
{t('auth.eglgrandlyon.with_account.title')}
- </p>
+ </h2>
)}
<div className="connection-form-subtitle text-18-bold">
{t('auth.eglgrandlyon.with_account.subtitle1')}
</div>
- <FormLogin />
+ <form>
+ <TextField
+ variant="outlined"
+ id={'idFieldLogin' + fluidName}
+ type="number"
+ className={classNames('inputText', { error: error !== '' })}
+ label={t(`auth.eglgrandlyon.connect_form.login`)}
+ name="login"
+ onChange={e => changeLogin(e.target.value)}
+ value={login}
+ inputMode="numeric"
+ error={Boolean(error)}
+ />
+
+ <TextField
+ variant="outlined"
+ id={'idFieldPassword' + fluidName}
+ name="password"
+ type={showPassword ? 'text' : 'password'}
+ className={classNames('inputText', { error: error !== '' })}
+ label={t(`auth.eglgrandlyon.connect_form.password`)}
+ onChange={e => changePassword(e.target.value)}
+ value={password}
+ error={Boolean(error)}
+ />
+ <span>
+ <StyledIconButton
+ icon={TrailingIcon}
+ aria-label={t('auth.accessibility.button_reveal_password')}
+ className="iconShowPassword"
+ sized={22}
+ onClick={() => setShowPassword(prev => !prev)}
+ />
+ </span>
+
+ <div className="errorMessage">{error === '' ? null : error}</div>
+ <div className="connection-form-connect-button">
+ <Button
+ aria-label={t('auth.accessibility.button_connect')}
+ disabled={loading}
+ classes={{
+ root: 'btnPrimary',
+ label: 'text-18-bold',
+ }}
+ onClick={handleSubmit}
+ >
+ <div className="connection-form-connect-button-content">
+ <div className="connection-form-connect-button-content-icon">
+ <StyledIcon icon={EglLogo} size={80} />
+ </div>
+ <div className="connection-form-connect-button-text text-18-bold">
+ <div>{t(`auth.eglgrandlyon.connect_form.label`)}</div>
+ </div>
+ </div>
+ </Button>
+ </div>
+ </form>
</div>
)
}
diff --git a/src/components/Connection/EPGLConnect/EpglInit.tsx b/src/components/Connection/EPGLConnect/EpglInit.tsx
index d79dd4a9d07517da49bed11e57cc3d59342c7bf5..216e832f9f8d8f28b28644d9625fbe3a79c74aef 100644
--- a/src/components/Connection/EPGLConnect/EpglInit.tsx
+++ b/src/components/Connection/EPGLConnect/EpglInit.tsx
@@ -1,42 +1,26 @@
-import EpglConnectModal from 'components/Connection/PartnerConnectModal/EpglConnectModal'
-import { FluidType } from 'enums'
-import React, { useCallback, useState } from 'react'
-import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
+import React, { useState } from 'react'
import '../connection.scss'
import EpglBill from './EpglBill'
+import EpglConnectModal from './EpglConnectModal/EpglConnectModal'
import EpglForm from './EpglForm'
const EpglInit = () => {
- const dispatch = useAppDispatch()
- const {
- modal: { isConnectionModalOpen },
- global: { fluidStatus },
- } = useAppSelector(state => state.ecolyo)
- const currentFluidStatus = fluidStatus[FluidType.WATER]
- const siteLink: string =
- currentFluidStatus.connection.konnectorConfig.siteLink
-
+ const [openModal, setOpenModal] = useState(false)
const [showForm, setShowForm] = useState(false)
const [hasCreatedAccount, setHasCreatedAccount] = useState(false)
- const goToPartnerSite = useCallback(() => {
- window.open(siteLink, '_blank')
- }, [siteLink])
-
return (
<>
{!showForm ? (
- <EpglBill />
+ <EpglBill openModal={setOpenModal} />
) : (
<EpglForm hasCreatedAccount={hasCreatedAccount} />
)}
<EpglConnectModal
- open={isConnectionModalOpen}
- handleCloseClick={() => dispatch(openConnectionModal(false))}
+ open={openModal}
setShowForm={setShowForm}
- goToPartnerSite={goToPartnerSite}
setHasCreatedAccount={setHasCreatedAccount}
+ closeModal={setOpenModal}
/>
</>
)
diff --git a/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx b/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx
deleted file mode 100644
index 68ca5f4fbf8b5585b43bc24dbe0dd7ec20d100dd..0000000000000000000000000000000000000000
--- a/src/components/Connection/EPGLConnect/FormLogin/FormLogin.tsx
+++ /dev/null
@@ -1,152 +0,0 @@
-import Button from '@material-ui/core/Button'
-import * as Sentry from '@sentry/react'
-import TrailingIcon from 'assets/icons/ico/trailing-icon.svg'
-import EglLogo from 'assets/icons/visu/egl-logo.svg'
-import classNames from 'classnames'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
-import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { FluidType } from 'enums'
-import { Account, AccountAuthData } from 'models'
-import React, { useEffect, useState } from 'react'
-import { useAppSelector } from 'store/hooks'
-import logApp from 'utils/logger'
-import './formLogin.scss'
-
-const FormLogin = () => {
- const { t } = useI18n()
- const { fluidStatus, lastEpglLogin } = useAppSelector(
- state => state.ecolyo.global
- )
- const currentFluidStatus = fluidStatus[FluidType.WATER]
- const konnectorSlug: string =
- currentFluidStatus.connection.konnectorConfig.slug
- const fluidName: string = FluidType[currentFluidStatus.fluidType]
- const account: Account | null = currentFluidStatus.connection.account
-
- const [login, setLogin] = useState<string>('')
- const [password, setPassword] = useState<string>('')
- const [error, setError] = useState<string>('')
- const [loading, setLoading] = useState<boolean>(false)
- const [showPassword, setShowPassword] = useState(false)
-
- const [connect, update, connectError] = useKonnectorAuth(
- currentFluidStatus.fluidType,
- login,
- password
- )
-
- const changeLogin = (value: string) => {
- if ((/\d/.test(value) && value.length <= 7) || value === '') {
- setError('')
- setLogin(value)
- }
- }
-
- const changePassword = (value: string) => {
- setError('')
- setPassword(value)
- }
-
- const handleSubmit = async () => {
- try {
- setError('')
- setLoading(true)
- if (!login || !password) {
- setError(t('konnector_form.error_no_login_password'))
- setLoading(false)
- return null
- }
- if (!account) {
- await connect()
- setLoading(false)
- } else {
- await update()
- }
- } catch (error) {
- logApp.error(error)
- Sentry.captureException(error)
- setLoading(false)
- }
- }
-
- useEffect(() => {
- if (connectError) setError(connectError)
- }, [connectError])
-
- useEffect(() => {
- if (account?.auth) {
- const auth = account.auth
- const authData = auth as AccountAuthData
- if (authData.login) {
- setLogin(authData.login)
- }
- } else if (lastEpglLogin) {
- setLogin(lastEpglLogin)
- setError(t('konnector_form.error_login_failed'))
- }
- }, [account, lastEpglLogin, t])
-
- return (
- <form>
- <div className="form-group">
- <input
- id={'idFieldLogin' + fluidName}
- type="number"
- className={classNames('inputText', { error: error !== '' })}
- aria-label={t(`auth.${konnectorSlug}.connect_form.login`)}
- placeholder={t(`auth.${konnectorSlug}.connect_form.login`)}
- name="login"
- onChange={e => changeLogin(e.target.value)}
- value={login}
- inputMode="numeric"
- />
- </div>
- <div className="form-group">
- <input
- id={'idFieldPassword' + fluidName}
- name="password"
- type={showPassword ? 'text' : 'password'}
- className={classNames('inputText', { error: error !== '' })}
- aria-label={t(`auth.${konnectorSlug}.connect_form.password`)}
- placeholder={t(`auth.${konnectorSlug}.connect_form.password`)}
- onChange={e => changePassword(e.target.value)}
- value={password}
- />
- <span>
- <StyledIconButton
- icon={TrailingIcon}
- aria-label={t('auth.accessibility.button_reveal_password')}
- className="form-trailing-icon"
- sized={22}
- onClick={() => setShowPassword(prev => !prev)}
- />
- </span>
- </div>
- <div className="form-message">{error === '' ? null : error}</div>
- <div className="connection-form-connect-button">
- <Button
- aria-label={t('auth.accessibility.button_connect')}
- disabled={loading}
- classes={{
- root: 'btnPrimary',
- label: 'text-18-bold',
- }}
- onClick={handleSubmit}
- >
- <div className="connection-form-connect-button-content">
- <div className="connection-form-connect-button-content-icon">
- <StyledIcon icon={EglLogo} size={80} />
- </div>
- <div className="connection-form-connect-button-text text-18-bold">
- <div>{t(`auth.${konnectorSlug}.connect_form.label`)}</div>
- </div>
- </div>
- </Button>
- </div>
- </form>
- )
-}
-
-export default FormLogin
diff --git a/src/components/Connection/EPGLConnect/FormLogin/formLogin.scss b/src/components/Connection/EPGLConnect/FormLogin/formLogin.scss
deleted file mode 100644
index 92be631cd3d13a41bc390b45a8e520e2de1256ab..0000000000000000000000000000000000000000
--- a/src/components/Connection/EPGLConnect/FormLogin/formLogin.scss
+++ /dev/null
@@ -1,46 +0,0 @@
-@import 'src/styles/base/color';
-@import 'src/styles/base/breakpoint';
-@import 'src/styles/components/input';
-
-form {
- margin-top: 1rem;
- display: flex;
- flex-direction: column;
- gap: 1rem;
-
- .form-info-provider {
- padding: 0;
- margin: 0;
- color: $grey-bright;
- text-align: center;
- }
- label {
- font-style: normal;
- font-weight: normal;
- font-size: 1rem;
- color: $grey-bright;
- margin-top: 0rem;
- }
-
- .form-group {
- display: flex;
- flex-direction: column;
- input {
- max-width: unset;
- &.error {
- border: 1px solid $red-primary;
- }
- }
- .form-trailing-icon {
- float: right;
- position: relative;
- margin-top: -48px;
- margin-right: 15px;
- }
- }
- .form-message {
- color: $red-primary;
- min-height: 1.25rem;
- margin-top: 0.25rem;
- }
-}
diff --git a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx
index cf6cc00505123e43982dd9e58a8caae962f7ca0e..a5edf19121aeb28e37bb93818c5d2b77a684d0a2 100644
--- a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx
+++ b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { FluidType } from 'enums'
import React from 'react'
@@ -45,9 +45,9 @@ describe('ExpiredConsentModal component', () => {
/>
</Provider>
)
- await userEvent.click(
- screen.getByRole('button', { name: 'consent_outdated.go' })
- )
+ await act(async () => {
+ await userEvent.click(screen.getByText('consent_outdated.go'))
+ })
expect(mockAppDispatch).toHaveBeenCalledTimes(1)
expect(mockedNavigate).toHaveBeenCalledTimes(1)
})
@@ -65,9 +65,9 @@ describe('ExpiredConsentModal component', () => {
/>
</Provider>
)
- await userEvent.click(
- screen.getByRole('button', { name: 'consent_outdated.go' })
- )
+ await act(async () => {
+ await userEvent.click(screen.getByText('consent_outdated.yes'))
+ })
expect(mockAppDispatch).toHaveBeenCalledTimes(1)
expect(mockedNavigate).toHaveBeenCalledTimes(1)
})
@@ -82,9 +82,9 @@ describe('ExpiredConsentModal component', () => {
/>
</Provider>
)
- await userEvent.click(
- screen.getByRole('button', { name: 'consent_outdated.later' })
- )
+ await act(async () => {
+ await userEvent.click(screen.getByText('consent_outdated.no'))
+ })
expect(mockHandleCloseClick).toHaveBeenCalled()
})
})
diff --git a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx
index f922cb1ce2f99aed1e069ea04521dbcec4e033d6..577a4932ce4f5f05cf82611e0f7622d8e6992f49 100644
--- a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx
+++ b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.tsx
@@ -54,9 +54,13 @@ const ExpiredConsentModal = ({
})
)
dispatch(setShouldRefreshConsent(true))
+ toggleModal()
+ navigate(`/consumption/${FluidType[fluidType].toLocaleLowerCase()}`)
+ }
+ if (fluidType === FluidType.GAS) {
+ toggleModal()
+ navigate(`/connect/${FluidType[fluidType].toLocaleLowerCase()}`)
}
- toggleModal()
- navigate(`/consumption/${FluidType[fluidType].toLocaleLowerCase()}`)
}, [dispatch, fluidStatus, fluidType, navigate, toggleModal])
return (
diff --git a/src/components/Connection/ExpiredConsentModal/expiredConsentModal.scss b/src/components/Connection/ExpiredConsentModal/expiredConsentModal.scss
index 929dea4460217dddf286f52f02f557ff0b8ec407..7ef0409e91a0f0bcc6e4303f8b2c1211a9bd34a4 100644
--- a/src/components/Connection/ExpiredConsentModal/expiredConsentModal.scss
+++ b/src/components/Connection/ExpiredConsentModal/expiredConsentModal.scss
@@ -3,8 +3,9 @@
.expired-consent-modal {
display: flex;
flex-direction: column;
- gap: 1rem;
+ gap: 24px;
color: $grey-bright;
+ text-align: center;
.icon-main {
display: flex;
diff --git a/src/components/Connection/GRDFConnect/GrdfBill.tsx b/src/components/Connection/GRDFConnect/GrdfBill.tsx
deleted file mode 100644
index 2ca3a67747bd2612f56271b14658dd7d388b5901..0000000000000000000000000000000000000000
--- a/src/components/Connection/GRDFConnect/GrdfBill.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import Button from '@material-ui/core/Button'
-import GasBillIcon from 'assets/icons/visu/onboarding/gas_bill.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { FluidType } from 'enums'
-import React from 'react'
-import { setShowOfflineData } from 'store/chart/chart.slice'
-import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
-import '../connection.scss'
-
-const GrdfBill = () => {
- const { t } = useI18n()
- const dispatch = useAppDispatch()
- const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
- const currentFluidStatus = fluidStatus[FluidType.GAS]
-
- return (
- <div className="connection-form">
- <p className="connection-form-title grdfgrandlyon text-20-bold">
- {t('auth.grdfgrandlyon.no_account.title')}
- </p>
- <StyledIcon icon={GasBillIcon} size={180} />
- <p
- className="connection-form-subtitle grdfgrandlyon text-16-regular"
- dangerouslySetInnerHTML={{ __html: t('auth.grdfgrandlyon.bill') }}
- />
-
- <div className="connection-form-button">
- <Button
- aria-label={t('auth.grdfgrandlyon.accessibility.connect')}
- onClick={() => dispatch(openConnectionModal(true))}
- className="btnPrimary"
- >
- {t('auth.grdfgrandlyon.connect')}
- </Button>
- {currentFluidStatus.firstDataDate && (
- <Button
- className="btnSecondary"
- onClick={() => dispatch(setShowOfflineData(true))}
- >
- {t('auth.button_showOfflineData')}
- </Button>
- )}
- </div>
- </div>
- )
-}
-
-export default GrdfBill
diff --git a/src/components/Connection/GRDFConnect/GrdfConnectView.tsx b/src/components/Connection/GRDFConnect/GrdfConnectView.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8923b875d3b8e77182357bb2436d6e260e856fc5
--- /dev/null
+++ b/src/components/Connection/GRDFConnect/GrdfConnectView.tsx
@@ -0,0 +1,146 @@
+import FormNavigation from 'components/CommonKit/FormNavigation/FormNavigation'
+import FormProgress from 'components/CommonKit/FormProgress/FormProgress'
+import Content from 'components/Content/Content'
+import CozyBar from 'components/Header/CozyBar'
+import Header from 'components/Header/Header'
+import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
+import useUserInstanceSettings from 'components/Hooks/useUserInstanceSettings'
+import { FluidType } from 'enums'
+import { AccountGRDFData } from 'models'
+import React, { useCallback, useEffect, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import { useAppSelector } from 'store/hooks'
+import '../connection.scss'
+import StepConsent from './StepConsent'
+import { StepIdentity } from './StepIdentity'
+
+export enum GrdfStep {
+ Identity,
+ Consent,
+}
+
+export const GrdfConnectView = () => {
+ const navigate = useNavigate()
+ const { instanceSettings } = useUserInstanceSettings()
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+ const currentFluidStatus = fluidStatus[FluidType.GAS]
+ const account = currentFluidStatus.connection.account
+
+ const [launchConnection, setLaunchConnection] = useState(false)
+ const [currentStep, setCurrentStep] = useState<GrdfStep>(GrdfStep.Identity)
+ const [formData, setFormData] = useState<AccountGRDFData>({
+ lastname: '',
+ firstname: '',
+ email: '',
+ postalCode: '',
+ pce: '',
+ })
+ const [formConsent, setFormConsent] = useState({
+ dataConsent: false,
+ pceConfirm: false,
+ })
+
+ const [connect, update] = useKonnectorAuth(FluidType.GAS, {
+ grdfAuthData: formData,
+ })
+
+ useEffect(() => {
+ setFormData(prev => ({ ...prev, email: instanceSettings.email ?? '' }))
+ }, [instanceSettings])
+
+ useEffect(() => {
+ async function launchConnect() {
+ if (launchConnection) {
+ if (!account) {
+ await connect()
+ } else {
+ await update()
+ }
+
+ setLaunchConnection(false)
+ navigate('/consumption/gas')
+ }
+ }
+ launchConnect()
+ }, [account, connect, launchConnection, navigate, update])
+
+ const isNextValid = useCallback(() => {
+ if (currentStep === GrdfStep.Identity) {
+ return (
+ formData.firstname !== '' &&
+ formData.lastname !== '' &&
+ formData.postalCode !== '' &&
+ formData.email.includes('@') &&
+ formData.pce.length === 14
+ )
+ } else if (currentStep === GrdfStep.Consent) {
+ return formConsent.dataConsent && formConsent.pceConfirm
+ }
+ return false
+ }, [
+ currentStep,
+ formConsent.dataConsent,
+ formConsent.pceConfirm,
+ formData.email,
+ formData.firstname,
+ formData.lastname,
+ formData.pce,
+ formData.postalCode,
+ ])
+
+ const handleNext = useCallback(() => {
+ if (!isNextValid()) return
+ if (currentStep < GrdfStep.Consent) {
+ setCurrentStep(prev => prev + 1)
+ }
+ if (currentStep === GrdfStep.Consent) {
+ setLaunchConnection(true)
+ }
+ }, [currentStep, isNextValid])
+
+ const handlePrev = () => {
+ setCurrentStep(prev => prev - 1)
+ }
+
+ const renderStep = (step: GrdfStep) => {
+ if (step === GrdfStep.Identity) {
+ return <StepIdentity formData={formData} setFormData={setFormData} />
+ } else {
+ return (
+ <StepConsent
+ formConsent={formConsent}
+ setFormConsent={setFormConsent}
+ />
+ )
+ }
+ }
+
+ return (
+ <>
+ <CozyBar titleKey="common.title_gas_connect" displayBackArrow={true} />
+ <Header
+ desktopTitleKey="common.title_gas_connect"
+ displayBackArrow={true}
+ />
+ <Content>
+ <div className="connectView">
+ <div className="stepContainer">
+ <FormProgress
+ currentStep={currentStep}
+ totalSteps={Object.keys(GrdfStep).length / 2}
+ />
+ {renderStep(currentStep)}
+ </div>
+ <FormNavigation
+ handlePrevious={handlePrev}
+ handleNext={handleNext}
+ isLoading={false}
+ disableNextButton={!isNextValid()}
+ disablePrevButton={currentStep === GrdfStep.Identity}
+ isLastStep={currentStep === GrdfStep.Consent}
+ />
+ </div>
+ </Content>
+ </>
+ )
+}
diff --git a/src/components/Connection/GRDFConnect/GrdfForm.tsx b/src/components/Connection/GRDFConnect/GrdfForm.tsx
deleted file mode 100644
index 77dd226b7ab96be2a0d7c3c5f51ecdc9017371e3..0000000000000000000000000000000000000000
--- a/src/components/Connection/GRDFConnect/GrdfForm.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import Button from '@material-ui/core/Button'
-import iconGrdfLogo from 'assets/icons/visu/grdf-logo.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import React from 'react'
-import { useAppDispatch } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
-import '../connection.scss'
-
-const GrdfForm = () => {
- const { t } = useI18n()
- const dispatch = useAppDispatch()
-
- return (
- <div className="connection-form">
- <p className="connection-form-title grdfgrandlyon text-20-bold">
- {t('auth.grdfgrandlyon.with_account.title')}
- </p>
-
- <div className="connection-form-subtitle text-18-bold">
- {t('auth.grdfgrandlyon.with_account.subtitle1')}
- </div>
- <div className="connection-form-connect-button grdf">
- <Button
- aria-label={t('auth.accessibility.button_connect')}
- onClick={() => dispatch(openConnectionModal(true))}
- classes={{
- root: 'btnPrimary',
- label: 'text-18-bold',
- }}
- >
- <div className="connection-form-connect-button-content">
- <div className="connection-form-connect-button-content-icon">
- <StyledIcon icon={iconGrdfLogo} size={80} />
- </div>
- <div className="connection-form-connect-button-text text-18-bold">
- <div>{t('auth.grdfgrandlyon.connect_form.label')}</div>
- </div>
- </div>
- </Button>
- </div>
- </div>
- )
-}
-
-export default GrdfForm
diff --git a/src/components/Connection/GRDFConnect/GrdfInit.tsx b/src/components/Connection/GRDFConnect/GrdfInit.tsx
index d851448b4ba66e7fc1f36d827593bcb1bc938b4e..8793804daa0e702b5ac657d04543489b5ae398f3 100644
--- a/src/components/Connection/GRDFConnect/GrdfInit.tsx
+++ b/src/components/Connection/GRDFConnect/GrdfInit.tsx
@@ -1,96 +1,50 @@
-import GrdfConnectModal from 'components/Connection/PartnerConnectModal/GrdfConnectModal'
-import { useClient } from 'cozy-client'
+import Button from '@material-ui/core/Button'
+import GasBillIcon from 'assets/icons/visu/onboarding/gas_bill.svg'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType } from 'enums'
-import { FluidConnection, Konnector, Trigger } from 'models'
-import React, { useCallback, useState } from 'react'
-import AccountService from 'services/account.service'
-import TriggerService from 'services/triggers.service'
-import { updateFluidConnection } from 'store/global/global.slice'
+import React from 'react'
+import { useNavigate } from 'react-router-dom'
+import { setShowOfflineData } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
import '../connection.scss'
-import GrdfBill from './GrdfBill'
-import GrdfForm from './GrdfForm'
-const GrdfInit = ({ onSuccess }: { onSuccess: () => Promise<void> }) => {
- const client = useClient()
+const GrdfInit = () => {
+ const { t } = useI18n()
+ const navigate = useNavigate()
const dispatch = useAppDispatch()
- const {
- modal: { isConnectionModalOpen },
- global: { fluidStatus },
- } = useAppSelector(state => state.ecolyo)
-
- const [showForm, setShowForm] = useState(false)
-
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
const currentFluidStatus = fluidStatus[FluidType.GAS]
- const siteLink: string =
- currentFluidStatus.connection.konnectorConfig.siteLink
- const konnector: Konnector | null = currentFluidStatus.connection.konnector
-
- const handleSuccess = useCallback(
- async (accountId: string) => {
- if (konnector) {
- const accountService = new AccountService(client)
- const account = await accountService.getAccount(accountId)
- if (!account) {
- const updatedConnection: FluidConnection = {
- ...currentFluidStatus.connection,
- account: null,
- trigger: null,
- }
- dispatch(
- updateFluidConnection({
- fluidType: currentFluidStatus.fluidType,
- fluidConnection: updatedConnection,
- })
- )
- } else {
- const triggersServices = new TriggerService(client)
- const trigger: Trigger = await triggersServices.createTrigger(
- account,
- konnector
- )
- const updatedConnection: FluidConnection = {
- ...currentFluidStatus.connection,
- account: account,
- trigger: trigger,
- }
- dispatch(
- updateFluidConnection({
- fluidType: currentFluidStatus.fluidType,
- fluidConnection: updatedConnection,
- })
- )
- onSuccess()
- }
- }
- },
- [
- client,
- konnector,
- dispatch,
- currentFluidStatus.fluidType,
- currentFluidStatus.connection,
- onSuccess,
- ]
- )
-
- const goToPartnerSite = useCallback(() => {
- window.open(siteLink, '_blank')
- }, [siteLink])
return (
- <>
- {!showForm ? <GrdfBill /> : <GrdfForm />}
- <GrdfConnectModal
- open={isConnectionModalOpen}
- showForm={showForm}
- handleCloseClick={() => dispatch(openConnectionModal(false))}
- setShowForm={setShowForm}
- goToPartnerSite={goToPartnerSite}
- handleSuccess={handleSuccess}
+ <div className="connection-form">
+ <h2 className="connection-form-title grdfgrandlyon text-20-bold">
+ {t('auth.grdfgrandlyon.title')}
+ </h2>
+ <StyledIcon icon={GasBillIcon} size={180} />
+ <p
+ className="connection-form-subtitle text-16-regular"
+ dangerouslySetInnerHTML={{ __html: t('auth.grdfgrandlyon.bill') }}
/>
- </>
+
+ <div className="connection-form-button">
+ <Button
+ aria-label={t('auth.grdfgrandlyon.accessibility.connect')}
+ onClick={() => navigate('/connect/gas')}
+ className="btnPrimary"
+ >
+ {t('auth.grdfgrandlyon.connect')}
+ </Button>
+ {currentFluidStatus.firstDataDate && (
+ <Button
+ className="btnSecondary"
+ onClick={() => dispatch(setShowOfflineData(true))}
+ >
+ {t('auth.button_showOfflineData')}
+ </Button>
+ )}
+ </div>
+ </div>
)
}
diff --git a/src/components/Connection/GRDFConnect/GrdfModalHint.tsx b/src/components/Connection/GRDFConnect/GrdfModalHint.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..c015a99bd03ed0331699bd7cd8a0b081d72b72c8
--- /dev/null
+++ b/src/components/Connection/GRDFConnect/GrdfModalHint.tsx
@@ -0,0 +1,67 @@
+import { IconButton } from '@material-ui/core'
+import Button from '@material-ui/core/Button'
+import Dialog from '@material-ui/core/Dialog'
+import CloseIcon from 'assets/icons/ico/close.svg'
+import GasBill from 'assets/icons/visu/onboarding/gas_bill.svg'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import React from 'react'
+
+const GrdfModalHint = ({
+ open,
+ handleCloseClick,
+}: {
+ open: boolean
+ handleCloseClick: () => void
+}) => {
+ const { t } = useI18n()
+
+ return (
+ <Dialog
+ open={open}
+ disableEscapeKeyDown
+ onClose={handleCloseClick}
+ aria-labelledby="accessibility-title"
+ classes={{
+ root: 'modal-root',
+ paper: 'modal-paper',
+ }}
+ >
+ <div id="accessibility-title">
+ {t('challenge_no_fluid_modal.accessibility.window_title')}
+ </div>
+ <IconButton
+ aria-label={t('feedback.accessibility.button_close')}
+ className="modal-paper-close-button"
+ onClick={handleCloseClick}
+ >
+ <Icon icon={CloseIcon} size={16} />
+ </IconButton>
+ <div className="hintModal">
+ <h1 className="text-20-bold">
+ {t('auth.grdfgrandlyon.pceModal.title')}
+ </h1>
+ <div className="content">
+ <div className="bill grdf">
+ <Icon icon={GasBill} alt="Facture" className="bill" size={180} />
+ </div>
+ <p
+ className="grdfText"
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.pceModal.txt1'),
+ }}
+ />
+ <Button
+ aria-label={t('auth.grdfgrandlyon.pceModal.button-accessibility')}
+ onClick={handleCloseClick}
+ className="btnPrimary"
+ >
+ {t('auth.grdfgrandlyon.pceModal.button')}
+ </Button>
+ </div>
+ </div>
+ </Dialog>
+ )
+}
+
+export default GrdfModalHint
diff --git a/src/components/Connection/GRDFConnect/GrdfWaitConsent.scss b/src/components/Connection/GRDFConnect/GrdfWaitConsent.scss
new file mode 100644
index 0000000000000000000000000000000000000000..a1e3cbbf8ff4bd038a8c10dfd3be4812a141077c
--- /dev/null
+++ b/src/components/Connection/GRDFConnect/GrdfWaitConsent.scss
@@ -0,0 +1,22 @@
+@import 'src/styles/base/color';
+
+.grdfWait {
+ margin: auto;
+ margin-top: 16px;
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+ align-items: center;
+ text-align: center;
+ padding-inline: 1rem;
+ max-width: 600px;
+
+ .green {
+ color: $gas-color;
+ }
+
+ .emailContainer {
+ color: $gold-shadow;
+ font-weight: 700;
+ }
+}
diff --git a/src/components/Connection/GRDFConnect/GrdfWaitConsent.tsx b/src/components/Connection/GRDFConnect/GrdfWaitConsent.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..2f829315f6d3ca9835fc606257dbe435f2275408
--- /dev/null
+++ b/src/components/Connection/GRDFConnect/GrdfWaitConsent.tsx
@@ -0,0 +1,55 @@
+import { Button } from '@material-ui/core'
+import GRDFMail from 'assets/icons/visu/onboarding/grdf-mail.svg'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { FluidType } from 'enums'
+import { AccountGRDFData, FluidConnection } from 'models'
+import React from 'react'
+import { updateFluidConnection } from 'store/global/global.slice'
+import { useAppDispatch, useAppSelector } from 'store/hooks'
+import './GrdfWaitConsent.scss'
+
+export const GrdfWaitConsent = () => {
+ const { t } = useI18n()
+ const dispatch = useAppDispatch()
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+ const currentFluidStatus = fluidStatus[FluidType.GAS]
+ const authData = currentFluidStatus.connection.account
+ ?.auth as AccountGRDFData
+
+ const updateKonnector = async () => {
+ const updatedConnection: FluidConnection = {
+ ...currentFluidStatus.connection,
+ shouldLaunchKonnector: true,
+ }
+ dispatch(
+ updateFluidConnection({
+ fluidType: currentFluidStatus.fluidType,
+ fluidConnection: updatedConnection,
+ })
+ )
+ }
+
+ return (
+ <div className="grdfWait">
+ <div className="text-18-normal">
+ {t('auth.grdfgrandlyon.waiting.mailSent')}
+ </div>
+ <div className="text-16-normal">
+ {t('auth.grdfgrandlyon.waiting.mailDelay')}
+ </div>
+ <span className="emailContainer">{authData.email || ''}</span>
+ <StyledIcon size={80} icon={GRDFMail} />
+ <div className="text-18-normal">
+ <span className="text-18-bold green">
+ {t('auth.grdfgrandlyon.waiting.validate')}
+ </span>
+ <br />
+ <span>{t('auth.grdfgrandlyon.waiting.comeback')}</span>
+ </div>
+ <Button className="btnPrimary" onClick={updateKonnector}>
+ {t('auth.grdfgrandlyon.waiting.button_done')}
+ </Button>
+ </div>
+ )
+}
diff --git a/src/components/Connection/GRDFConnect/StepConsent.tsx b/src/components/Connection/GRDFConnect/StepConsent.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..ac9c00dea6cea9d96aca4382038ab404dd4cab01
--- /dev/null
+++ b/src/components/Connection/GRDFConnect/StepConsent.tsx
@@ -0,0 +1,65 @@
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import React from 'react'
+
+const StepConsent = ({
+ formConsent,
+ setFormConsent,
+}: {
+ formConsent: {
+ dataConsent: boolean
+ pceConfirm: boolean
+ }
+ setFormConsent: React.Dispatch<
+ React.SetStateAction<{
+ dataConsent: boolean
+ pceConfirm: boolean
+ }>
+ >
+}) => {
+ const { t } = useI18n()
+
+ return (
+ <div className="stepDetails stepConsent">
+ <div className="text-16-normal">
+ {t('auth.grdfgrandlyon.headConsent')}
+ </div>
+ <h2 className="text-22-bold">{t('auth.grdfgrandlyon.textConsent')}</h2>
+ <ul className="text-16-normal">
+ <li>{t('auth.grdfgrandlyon.consentLi1')}</li>
+ <li>{t('auth.grdfgrandlyon.consentLi2')}</li>
+ </ul>
+ <label className="inline">
+ <input
+ id="dataConsent"
+ type="checkbox"
+ name="Data-consent-validation"
+ className="inputCheckbox"
+ checked={formConsent.dataConsent}
+ onChange={e =>
+ setFormConsent(prev => ({ ...prev, dataConsent: e.target.checked }))
+ }
+ />
+ <span
+ dangerouslySetInnerHTML={{
+ __html: t('auth.grdfgrandlyon.consentCheck1'),
+ }}
+ />
+ </label>
+ <label className="inline">
+ <input
+ id="pdlConfirm"
+ type="checkbox"
+ name="Data-consent-validation"
+ className="inputCheckbox"
+ checked={formConsent.pceConfirm}
+ onChange={e =>
+ setFormConsent(prev => ({ ...prev, pceConfirm: e.target.checked }))
+ }
+ />
+ <span>{t('auth.grdfgrandlyon.consentCheck2')}</span>
+ </label>
+ </div>
+ )
+}
+
+export default StepConsent
diff --git a/src/components/Connection/GRDFConnect/StepIdentity.tsx b/src/components/Connection/GRDFConnect/StepIdentity.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..ff7db3b2755c3aa716809a0c8577faa300e78dcf
--- /dev/null
+++ b/src/components/Connection/GRDFConnect/StepIdentity.tsx
@@ -0,0 +1,99 @@
+import { TextField } from '@material-ui/core'
+import Button from '@material-ui/core/Button'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { AccountGRDFData } from 'models'
+import React, { useState } from 'react'
+import GrdfModalHint from './GrdfModalHint'
+
+export const StepIdentity = ({
+ formData,
+ setFormData,
+}: {
+ formData: AccountGRDFData
+ setFormData: React.Dispatch<React.SetStateAction<AccountGRDFData>>
+}) => {
+ const { t } = useI18n()
+ const [openHintModal, setOpenHintModal] = useState<boolean>(false)
+
+ return (
+ <div className="stepDetails stepIdentity">
+ <h2 className="text-22-bold">{t('auth.grdfgrandlyon.identityTitle')}</h2>
+ <TextField
+ label={t('auth.grdfgrandlyon.firstName')}
+ variant="outlined"
+ type="text"
+ id="firstName"
+ name="firstName"
+ value={formData.firstname}
+ onChange={e =>
+ setFormData(prev => ({ ...prev, firstname: e.target.value }))
+ }
+ required
+ />
+
+ <TextField
+ label={t('auth.grdfgrandlyon.lastName')}
+ variant="outlined"
+ type="text"
+ id="lastName"
+ name="lastName"
+ required
+ value={formData.lastname}
+ onChange={e =>
+ setFormData(prev => ({ ...prev, lastname: e.target.value }))
+ }
+ />
+
+ <TextField
+ label={t('auth.grdfgrandlyon.email')}
+ variant="outlined"
+ type="email"
+ id="email"
+ name="email"
+ required
+ value={formData.email}
+ onChange={e =>
+ setFormData(prev => ({ ...prev, email: e.target.value }))
+ }
+ />
+
+ <TextField
+ label={t('auth.grdfgrandlyon.zipCode')}
+ variant="outlined"
+ type="number"
+ id="zipCode"
+ name="zipCode"
+ required
+ value={formData.postalCode}
+ onChange={e =>
+ setFormData(prev => ({ ...prev, postalCode: e.target.value }))
+ }
+ />
+
+ <div className="text-22-bold">{t('auth.grdfgrandlyon.pceTitle')}</div>
+
+ <TextField
+ label={t('auth.grdfgrandlyon.pceLabel')}
+ variant="outlined"
+ id="pce"
+ name="pce"
+ type="number"
+ inputMode="numeric"
+ required
+ value={formData.pce}
+ onChange={e => {
+ if (e.target.value.length > 14) return
+ setFormData(prev => ({ ...prev, pce: e.target.value }))
+ }}
+ />
+
+ <Button className="btnText" onClick={() => setOpenHintModal(true)}>
+ {t('auth.grdfgrandlyon.pceHint')}
+ </Button>
+ <GrdfModalHint
+ open={openHintModal}
+ handleCloseClick={() => setOpenHintModal(false)}
+ />
+ </div>
+ )
+}
diff --git a/src/components/Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal.spec.tsx b/src/components/Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal.spec.tsx
deleted file mode 100644
index 9826c86b36f19a970fdf49bf23a18ff45ca65ae1..0000000000000000000000000000000000000000
--- a/src/components/Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal.spec.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import { render, screen } from '@testing-library/react'
-import { userEvent } from '@testing-library/user-event'
-import React from 'react'
-import DeleteGRDFAccountModal from './DeleteGRDFAccountModal'
-
-describe('DeleteGRDFAccountModal component', () => {
- it('should be rendered correctly', () => {
- const { baseElement } = render(
- <DeleteGRDFAccountModal
- open={true}
- handleCloseClick={jest.fn()}
- deleteAccount={jest.fn()}
- />
- )
- expect(baseElement).toMatchSnapshot()
- })
- it('should launch the deletion process and close modal', async () => {
- const mockDelete = jest.fn()
- render(
- <DeleteGRDFAccountModal
- open={true}
- handleCloseClick={jest.fn()}
- deleteAccount={mockDelete}
- />
- )
- await userEvent.click(
- screen.getByRole('button', { name: 'delete_grdf_modal.go' })
- )
- expect(mockDelete).toHaveBeenCalledTimes(1)
- })
-})
diff --git a/src/components/Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal.tsx b/src/components/Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal.tsx
deleted file mode 100644
index f47a29865b9029c859b923bdfb9be1e28ceb91d4..0000000000000000000000000000000000000000
--- a/src/components/Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import { Button, IconButton } from '@material-ui/core'
-import Dialog from '@material-ui/core/Dialog'
-import CloseIcon from 'assets/icons/ico/close.svg'
-import GrdfIcon from 'assets/icons/ico/consent-outdated-grdf.svg'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import React, { useCallback } from 'react'
-import './deleteGRDFAccountModal.scss'
-
-interface DeleteGRDFAccountModalProps {
- open: boolean
- handleCloseClick: () => void
- deleteAccount: () => void
-}
-
-const DeleteGRDFAccountModal = ({
- open,
- handleCloseClick,
- deleteAccount,
-}: DeleteGRDFAccountModalProps) => {
- const { t } = useI18n()
-
- const handleDelete = useCallback(() => {
- deleteAccount()
- handleCloseClick()
- }, [deleteAccount, handleCloseClick])
-
- return (
- <Dialog
- open={open}
- onClose={handleCloseClick}
- aria-labelledby="accessibility-title"
- classes={{
- root: 'modal-root',
- paper: 'modal-paper',
- }}
- >
- <div id="accessibility-title">
- {t('consumption_visualizer.modal.window_title')}
- </div>
- <IconButton
- aria-label={t('consumption_visualizer.modal.close')}
- className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <Icon icon={CloseIcon} size={16} />
- </IconButton>
- <div className="delete-grdf-modal">
- <div className="icon-main">
- <Icon icon={GrdfIcon} size={135} />
- </div>
-
- <div className="text-15-normal text1">
- {t(`delete_grdf_modal.text1`)}
- </div>
- <div className="text-16-normal text2">
- {t(`delete_grdf_modal.text2`)}
- </div>
- <div className="text-15-normal text3">
- {t(`delete_grdf_modal.text3`)}
- </div>
- <div className="buttons">
- <Button
- aria-label={t(`delete_grdf_modal.go`)}
- onClick={handleDelete}
- className="btnPrimary"
- >
- {t(`delete_grdf_modal.go`)}
- </Button>
- <Button
- aria-label={t(`delete_grdf_modal.cancel`)}
- onClick={handleCloseClick}
- className="btnSecondary"
- >
- {t(`delete_grdf_modal.cancel`)}
- </Button>
- </div>
- </div>
- </Dialog>
- )
-}
-
-export default DeleteGRDFAccountModal
diff --git a/src/components/Connection/GRDFDeleteAccountModal/__snapshots__/DeleteGRDFAccountModal.spec.tsx.snap b/src/components/Connection/GRDFDeleteAccountModal/__snapshots__/DeleteGRDFAccountModal.spec.tsx.snap
deleted file mode 100644
index 901dd8ffa45493404d270d6f3fb91fd995d534a2..0000000000000000000000000000000000000000
--- a/src/components/Connection/GRDFDeleteAccountModal/__snapshots__/DeleteGRDFAccountModal.spec.tsx.snap
+++ /dev/null
@@ -1,137 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`DeleteGRDFAccountModal component should be rendered correctly 1`] = `
-<body
- style="padding-right: 0px; overflow: hidden;"
->
- <div
- aria-hidden="true"
- />
- <div
- class="MuiDialog-root modal-root"
- role="presentation"
- style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px;"
- >
- <div
- aria-hidden="true"
- class="MuiBackdrop-root"
- style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
- />
- <div
- data-test="sentinelStart"
- tabindex="0"
- />
- <div
- class="MuiDialog-container MuiDialog-scrollPaper"
- role="none presentation"
- style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
- tabindex="-1"
- >
- <div
- aria-labelledby="accessibility-title"
- class="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
- role="dialog"
- >
- <div
- id="accessibility-title"
- >
- consumption_visualizer.modal.window_title
- </div>
- <button
- aria-label="consumption_visualizer.modal.close"
- class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
- tabindex="0"
- type="button"
- >
- <span
- class="MuiIconButton-label"
- >
- <svg
- class="styles__icon___23x3R"
- height="16"
- width="16"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
- </span>
- <span
- class="MuiTouchRipple-root"
- />
- </button>
- <div
- class="delete-grdf-modal"
- >
- <div
- class="icon-main"
- >
- <svg
- class="styles__icon___23x3R"
- height="135"
- width="135"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
- </div>
- <div
- class="text-15-normal text1"
- >
- delete_grdf_modal.text1
- </div>
- <div
- class="text-16-normal text2"
- >
- delete_grdf_modal.text2
- </div>
- <div
- class="text-15-normal text3"
- >
- delete_grdf_modal.text3
- </div>
- <div
- class="buttons"
- >
- <button
- aria-label="delete_grdf_modal.go"
- class="MuiButtonBase-root MuiButton-root MuiButton-text btnPrimary"
- tabindex="0"
- type="button"
- >
- <span
- class="MuiButton-label"
- >
- delete_grdf_modal.go
- </span>
- <span
- class="MuiTouchRipple-root"
- />
- </button>
- <button
- aria-label="delete_grdf_modal.cancel"
- class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary"
- tabindex="0"
- type="button"
- >
- <span
- class="MuiButton-label"
- >
- delete_grdf_modal.cancel
- </span>
- <span
- class="MuiTouchRipple-root"
- />
- </button>
- </div>
- </div>
- </div>
- </div>
- <div
- data-test="sentinelEnd"
- tabindex="0"
- />
- </div>
-</body>
-`;
diff --git a/src/components/Connection/GRDFDeleteAccountModal/deleteGRDFAccountModal.scss b/src/components/Connection/GRDFDeleteAccountModal/deleteGRDFAccountModal.scss
deleted file mode 100644
index 84b0d3caa520462824848fa9d933dc53e7f16d72..0000000000000000000000000000000000000000
--- a/src/components/Connection/GRDFDeleteAccountModal/deleteGRDFAccountModal.scss
+++ /dev/null
@@ -1,24 +0,0 @@
-@import 'src/styles/base/color';
-
-.delete-grdf-modal {
- .icon-main {
- display: flex;
- svg {
- margin: auto;
- }
- }
- .text1 {
- margin-top: 1rem;
- }
- .text2 {
- color: $grey-bright;
- margin: 1rem 0;
- }
- .text3 {
- margin-bottom: 1rem;
- }
- .buttons {
- display: flex;
- gap: 1rem;
- }
-}
diff --git a/src/components/Connection/PartnerConnectModal/GrdfConnectModal.tsx b/src/components/Connection/PartnerConnectModal/GrdfConnectModal.tsx
deleted file mode 100644
index 5e5ca5cf272ae7c72267a9c6a4ad29bbf92a1613..0000000000000000000000000000000000000000
--- a/src/components/Connection/PartnerConnectModal/GrdfConnectModal.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import { Button, Dialog, IconButton } from '@material-ui/core'
-import CloseIcon from 'assets/icons/ico/close.svg'
-import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import GrdfFormOAuth from 'components/Connection/PartnerConnectModal/Steps/GrdfFormOAuth'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import React, { useEffect, useState } from 'react'
-import './PartnerConnectModal.scss'
-import { StepContent } from './StepContent.interface'
-import GrdfCreateAccount from './Steps/GrdfCreateAccount'
-import GrdfDoYouHaveAccount from './Steps/GrdfDoYouHaveAccount'
-import GrdfGiveConsent from './Steps/GrdfGiveConsent'
-
-enum StepEnum {
- DoYouHaveAccount,
- CreateAccount,
- GiveConsent,
-}
-
-interface GrdfConnectModalProps {
- open: boolean
- showForm: boolean
- handleCloseClick: () => void
- setShowForm: (value: boolean) => void
- goToPartnerSite: () => void
- handleSuccess: (accountId: string) => Promise<void>
-}
-
-const GrdfConnectModal = ({
- open,
- showForm,
- handleCloseClick,
- setShowForm,
- goToPartnerSite,
- handleSuccess,
-}: GrdfConnectModalProps) => {
- const { t } = useI18n()
- const [currentStep, setCurrentStep] = useState(StepEnum.DoYouHaveAccount)
-
- useEffect(() => {
- if (open) {
- showForm
- ? setCurrentStep(StepEnum.GiveConsent)
- : setCurrentStep(StepEnum.DoYouHaveAccount)
- }
- }, [showForm, open])
-
- const handleGoToPartnerSite = () => {
- goToPartnerSite()
- setShowForm(true)
- handleCloseClick()
- }
- const handleGiveConsentPrevious = () => {
- showForm ? handleCloseClick() : setCurrentStep(StepEnum.DoYouHaveAccount)
- }
-
- const steps: Record<StepEnum, StepContent> = {
- [StepEnum.DoYouHaveAccount]: {
- content: <GrdfDoYouHaveAccount />,
- topButton: (
- <Button
- onClick={() => setCurrentStep(StepEnum.GiveConsent)}
- className="btnPrimary"
- >
- {t('auth.button_has_account')}
- </Button>
- ),
- bottomButton: (
- <Button
- onClick={() => setCurrentStep(StepEnum.CreateAccount)}
- className="btnSecondary"
- >
- {t('auth.button_create_account')}
- </Button>
- ),
- },
- [StepEnum.CreateAccount]: {
- content: <GrdfCreateAccount />,
- topButton: (
- <Button onClick={handleGoToPartnerSite} className="btnPrimary">
- {t('auth.grdfgrandlyon.button_go_to_partner_site')}
- </Button>
- ),
- bottomButton: (
- <Button
- onClick={() => setCurrentStep(StepEnum.DoYouHaveAccount)}
- className="btnSecondary"
- >
- {t('auth.button_previous')}
- </Button>
- ),
- },
- [StepEnum.GiveConsent]: {
- content: <GrdfGiveConsent />,
- topButton: <GrdfFormOAuth onSuccess={handleSuccess} />,
- bottomButton: (
- <Button onClick={handleGiveConsentPrevious} className="btnSecondary">
- {t('auth.button_previous')}
- </Button>
- ),
- },
- }
-
- return (
- <Dialog
- open={open}
- onClose={handleCloseClick}
- classes={{
- root: 'modal-root',
- paper: 'modal-paper',
- }}
- >
- <IconButton
- aria-label={t('auth.accessibility.button_close')}
- className="modal-paper-close-button"
- onClick={handleCloseClick}
- >
- <StyledIcon icon={CloseIcon} size={16} />
- </IconButton>
- <div className="partners-connection-step-content">
- {steps[currentStep].content}
- </div>
- <div className="partners-connection-step-navigation">
- {steps[currentStep].topButton}
- {steps[currentStep].bottomButton}
- </div>
- </Dialog>
- )
-}
-
-export default GrdfConnectModal
diff --git a/src/components/Connection/PartnerConnectModal/StepContent.interface.ts b/src/components/Connection/PartnerConnectModal/StepContent.interface.ts
deleted file mode 100644
index 8e62bd015db93f7bba4b275c4da809787e6576d9..0000000000000000000000000000000000000000
--- a/src/components/Connection/PartnerConnectModal/StepContent.interface.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export interface StepContent {
- content: JSX.Element
- topButton: JSX.Element
- bottomButton: JSX.Element
-}
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx
deleted file mode 100644
index 3d945808cb5b30cf220bb8fd02b769b2f066be11..0000000000000000000000000000000000000000
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfCreateAccount.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import GrdfIcon from 'assets/icons/visu/onboarding/grdf.svg'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import React from 'react'
-import './stepDetail.scss'
-
-const GrdfCreateAccount = () => {
- const { t } = useI18n()
-
- return (
- <div className="step-detail-info">
- <Icon className="info-icon" icon={GrdfIcon} size={220} />
- <div className="info-content text-18-normal">
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step2.info1'),
- }}
- />
- </div>
- </div>
- )
-}
-
-export default GrdfCreateAccount
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx
deleted file mode 100644
index aadcc4ee4c5a5657d1bfb933eacb2c3b3f616445..0000000000000000000000000000000000000000
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfDoYouHaveAccount.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import BrowserGrdf from 'assets/icons/visu/onboarding/browser_grdf.svg'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import React from 'react'
-import './stepDetail.scss'
-
-const GrdfDoYouHaveAccount = () => {
- const { t } = useI18n()
-
- return (
- <div className="step-detail-info">
- <Icon className="info-icon" icon={BrowserGrdf} size={150} />
- <div className="info-content text-18-normal">
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step1.info1'),
- }}
- />
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step1.info2'),
- }}
- />
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step1.info3'),
- }}
- />
- </div>
- </div>
- )
-}
-
-export default GrdfDoYouHaveAccount
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfFormOAuth.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfFormOAuth.tsx
deleted file mode 100644
index aa598b45f1ac7ed9491ed17aff330cadc5ce08d2..0000000000000000000000000000000000000000
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfFormOAuth.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import Button from '@material-ui/core/Button'
-import { useClient } from 'cozy-client'
-import { OAuthWindow } from 'cozy-harvest-lib/dist/components/OAuthWindow'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { FluidType } from 'enums'
-import { Konnector } from 'models'
-import React, { useCallback, useEffect, useState } from 'react'
-import { setShouldRefreshConsent } from 'store/global/global.slice'
-import { useAppDispatch, useAppSelector } from 'store/hooks'
-
-const GrdfFormOAuth = ({
- onSuccess,
-}: {
- onSuccess: (accountId: string) => Promise<void>
-}) => {
- const { t } = useI18n()
- const client = useClient()
- const { shouldRefreshConsent, fluidStatus } = useAppSelector(
- state => state.ecolyo.global
- )
- const currentFluidStatus = fluidStatus[FluidType.GAS]
- const konnector: Konnector | null = currentFluidStatus.connection.konnector
- const dispatch = useAppDispatch()
- const [status, setStatus] = useState<'idle' | 'waiting'>('idle')
- const endOAuth = useCallback(() => {
- setStatus('idle')
- // Set back to false the variable that allows to automatically refresh the consent (deletes and recreates the account)
- dispatch(setShouldRefreshConsent(false))
- }, [dispatch])
-
- const handleAccountId = useCallback(
- (accountId: string) => {
- endOAuth()
- onSuccess(accountId)
- },
- [endOAuth, onSuccess]
- )
-
- const isWaiting = status === 'waiting'
-
- useEffect(() => {
- if (shouldRefreshConsent) {
- // If user has selected accept button on Expired consent modal, his account has been deleted on KonnectorViewerCard, such as his consent (for GRDF), then automatically launch oauth connection flow
- setStatus('waiting')
- }
- }, [shouldRefreshConsent])
-
- if (!konnector) {
- return null
- }
-
- return (
- <>
- <Button
- aria-label={t('auth.accessibility.button_connect')}
- onClick={() => setStatus('waiting')}
- disabled={isWaiting}
- className="btnPrimary"
- >
- {isWaiting
- ? t('auth.connect_oauth.loading')
- : t('auth.button_validate')}
- </Button>
- {isWaiting && (
- <OAuthWindow
- client={client}
- konnector={konnector}
- redirectSlug={client.appMetadata.slug}
- onSuccess={handleAccountId}
- onCancel={endOAuth}
- t={t}
- />
- )}
- </>
- )
-}
-
-export default GrdfFormOAuth
diff --git a/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx b/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx
deleted file mode 100644
index 64bebd7590a0caeeb1a2bf0c09018abed3a6712d..0000000000000000000000000000000000000000
--- a/src/components/Connection/PartnerConnectModal/Steps/GrdfGiveConsent.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import GrdfConsent from 'assets/icons/visu/onboarding/grdf_consent.svg'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import React from 'react'
-import './stepDetail.scss'
-
-const GrdfGiveConsent = () => {
- const { t } = useI18n()
-
- return (
- <div className="step-detail-info">
- <Icon className="info-icon" icon={GrdfConsent} size={220} />
- <div className="info-content text-18-normal">
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step3.info1'),
- }}
- />
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step3.info2'),
- }}
- />
- <div
- className="info-content-text"
- dangerouslySetInnerHTML={{
- __html: t('auth.grdfgrandlyon.step3.info3'),
- }}
- />
- </div>
- </div>
- )
-}
-
-export default GrdfGiveConsent
diff --git a/src/components/Connection/SGEConnect/SgeConnect.scss b/src/components/Connection/SGEConnect/SgeConnect.scss
deleted file mode 100644
index feb9ac3bc4103c797bdbb1348a5fe8d3939221ce..0000000000000000000000000000000000000000
--- a/src/components/Connection/SGEConnect/SgeConnect.scss
+++ /dev/null
@@ -1,109 +0,0 @@
-@import 'src/styles/base/color';
-@import 'src/styles/base/mixins';
-@import 'src/styles/base/breakpoint';
-@import 'src/styles/components/input';
-
-.sge-view {
- box-sizing: border-box;
- min-height: inherit;
- width: inherit;
- display: flex;
- flex: 1;
- flex-direction: column;
- justify-content: space-between;
- .sge-container {
- padding: 1rem;
-
- .sge-step-container {
- margin-top: 1rem;
- display: flex;
- flex-direction: column;
- gap: 1rem;
- color: $grey-bright;
-
- .head {
- margin-top: 1rem;
- }
- label {
- display: flex;
- flex-direction: column;
- align-items: flex-start;
- gap: 10px;
- &.inline {
- flex-direction: row;
- align-items: center;
- gap: 0.5rem;
- }
- cursor: pointer;
-
- span span {
- color: $gold-shadow;
- }
- }
- #zipCode {
- max-width: 115px;
- }
-
- /* Chrome, Safari, Edge, Opera */
- input::-webkit-outer-spin-button,
- input::-webkit-inner-spin-button {
- -webkit-appearance: none;
- margin: 0;
- }
- /* Firefox */
- input[type='number'] {
- -moz-appearance: textfield;
- }
-
- .btnText {
- max-width: 280px;
- }
- ul {
- margin: 0;
- padding: 0 1rem 1rem;
- line-height: 130%;
- border-bottom: 1px solid $grey-dark;
- li {
- margin: 0.5rem 0;
- }
- }
- }
- }
-}
-.sgeHintModal {
- padding: 1rem;
- display: flex;
- flex-direction: column;
- text-align: left;
-
- h1 {
- text-align: center;
- color: $gold-shadow;
- margin: 1rem 0;
- }
-
- .sgeHintModal-content {
- display: flex;
- flex-direction: column;
- gap: 1rem;
- p {
- color: $grey-bright;
- margin: 0;
- text-wrap: pretty;
- }
-
- .bill {
- display: flex;
- align-items: center;
- gap: 0.5rem;
- p {
- color: $gold-shadow;
- }
- }
-
- svg.prm {
- width: 100%;
- height: 180px;
- }
- }
-}
diff --git a/src/components/Connection/SGEConnect/SgeConnectView.spec.tsx b/src/components/Connection/SGEConnect/SgeConnectView.spec.tsx
index d7c9af6ba030bc7974378d9cdb429050d76f1e0f..8cb9c8bb0363de72c8d0abfff8243b9301abce37 100644
--- a/src/components/Connection/SGEConnect/SgeConnectView.spec.tsx
+++ b/src/components/Connection/SGEConnect/SgeConnectView.spec.tsx
@@ -1,18 +1,23 @@
import { render, screen } from '@testing-library/react'
-import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
-import * as storeHooks from 'store/hooks'
-import { createMockEcolyoStore } from 'tests/__mocks__/store'
+import { SgeStatusWithAccount } from 'tests/__mocks__/fluidStatusData.mock'
+import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store'
import SgeConnectView from './SgeConnectView'
jest.mock('components/Content/Content', () => 'mock-content')
jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
-const mockAppDispatch = jest.spyOn(storeHooks, 'useAppDispatch')
const store = createMockEcolyoStore()
+const mockConnect = jest.fn()
+const mockUpdate = jest.fn()
+
+jest.mock('components/Hooks/useKonnectorAuth', () =>
+ jest.fn(() => [mockConnect, mockUpdate])
+)
+
describe('SgeConnectView component', () => {
beforeEach(() => {
jest.clearAllMocks()
@@ -28,17 +33,64 @@ describe('SgeConnectView component', () => {
expect(container).toMatchSnapshot()
})
- describe('SgeConnectView Navigation methods', () => {
- it('should call nextStep method', async () => {
+ it('should be on stepIdentity by default with button disabled', async () => {
+ render(
+ <Provider store={store}>
+ <BrowserRouter>
+ <SgeConnectView />
+ </BrowserRouter>
+ </Provider>
+ )
+ expect(
+ screen.getByText('auth.enedissgegrandlyon.identityTitle')
+ ).toBeInTheDocument()
+
+ const prevButton = screen.getByLabelText(
+ 'profile_type.accessibility.button_previous'
+ )
+ const nextButton = screen.getByLabelText(
+ 'profile_type.accessibility.button_next'
+ )
+ expect(prevButton).toBeDisabled()
+ expect(nextButton).toBeDisabled()
+ })
+
+ describe('should test methods from useKonnectorAuth hook', () => {
+ it('should launch account and trigger creation process', async () => {
+ const store = createMockEcolyoStore({
+ global: {
+ ...mockGlobalState,
+ sgeConnect: {
+ ...mockGlobalState.sgeConnect,
+ shouldLaunchAccount: true,
+ },
+ },
+ })
+
+ render(
+ <Provider store={store}>
+ <SgeConnectView />
+ </Provider>
+ )
+ expect(mockConnect).toHaveBeenCalled()
+ })
+ it('should launch existing account update process', async () => {
+ const store = createMockEcolyoStore({
+ global: {
+ ...mockGlobalState,
+ fluidStatus: [SgeStatusWithAccount],
+ sgeConnect: {
+ ...mockGlobalState.sgeConnect,
+ shouldLaunchAccount: true,
+ },
+ },
+ })
render(
<Provider store={store}>
- <BrowserRouter>
- <SgeConnectView />
- </BrowserRouter>
+ <SgeConnectView />
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[1])
- expect(mockAppDispatch).toHaveBeenCalled()
+ expect(mockUpdate).toHaveBeenCalled()
})
})
})
diff --git a/src/components/Connection/SGEConnect/SgeConnectView.tsx b/src/components/Connection/SGEConnect/SgeConnectView.tsx
index 5a5df27cc2eb7d666ebcdfe02487f0d85a392311..2b8a84e087e34da4a116f7981ef9e70ee1360518 100644
--- a/src/components/Connection/SGEConnect/SgeConnectView.tsx
+++ b/src/components/Connection/SGEConnect/SgeConnectView.tsx
@@ -3,13 +3,17 @@ import FormProgress from 'components/CommonKit/FormProgress/FormProgress'
import Content from 'components/Content/Content'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
-import { SgeStep } from 'enums'
+import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
+import { FluidType, SgeStep } from 'enums'
import { SgeStore } from 'models'
-import React, { useCallback, useState } from 'react'
-import { useNavigate } from 'react-router'
-import { updateSgeStore } from 'store/global/global.slice'
+import React, { useCallback, useEffect, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import {
+ setShouldRefreshConsent,
+ updateSgeStore,
+} from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import './SgeConnect.scss'
+import '../connection.scss'
import StepAddress from './StepAddress'
import StepConsent from './StepConsent'
import StepIdentityAndPdl from './StepIdentityAndPdl'
@@ -33,7 +37,29 @@ const SgeConnectView = () => {
const [currentStep, setCurrentStep] = useState<SgeStep>(
SgeStep.IdentityAndPDL
)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+ const currentFluidStatus = fluidStatus[FluidType.ELECTRICITY]
+ const account = currentFluidStatus.connection.account
+
+ const [connect, update] = useKonnectorAuth(FluidType.ELECTRICITY, {
+ sgeAuthData: sgeConnect,
+ })
+
+ useEffect(() => {
+ async function launchConnect() {
+ if (sgeConnect.shouldLaunchAccount) {
+ dispatch(updateSgeStore({ ...sgeConnect, shouldLaunchAccount: false }))
+ dispatch(setShouldRefreshConsent(false))
+ if (!account) {
+ await connect()
+ } else {
+ await update()
+ }
+ navigate('/consumption/electricity')
+ }
+ }
+ launchConnect()
+ }, [account, connect, dispatch, navigate, sgeConnect, update])
const isNextValid = useCallback(() => {
switch (currentStep) {
@@ -69,11 +95,11 @@ const SgeConnectView = () => {
])
const handleNext = useCallback(() => {
- if (currentStep < SgeStep.Consent && isNextValid()) {
+ if (currentStep < SgeStep.Consent) {
setCurrentStep(prev => prev + 1)
dispatch(updateSgeStore(currentSgeState))
}
- if (currentStep === SgeStep.Consent && isNextValid() && !isLoading) {
+ if (currentStep === SgeStep.Consent && !isLoading) {
setIsLoading(true)
const updatedState = {
...currentSgeState,
@@ -82,9 +108,8 @@ const SgeConnectView = () => {
}
setCurrentSgeState(updatedState)
dispatch(updateSgeStore(updatedState))
- navigate('/consumption/electricity')
}
- }, [currentStep, isNextValid, isLoading, dispatch, currentSgeState, navigate])
+ }, [currentStep, isLoading, dispatch, currentSgeState])
const handlePrev = useCallback(() => {
if (currentStep !== SgeStep.IdentityAndPDL) {
@@ -99,18 +124,13 @@ const SgeConnectView = () => {
value: string | boolean | number,
maxLength?: number
) => {
- // TODO duplicate with Form login input
- if (
- !maxLength ||
- value === '' ||
- (/\d/.test(value.toString()) && value.toString().length <= maxLength)
- ) {
- const updatedState = {
- ...currentSgeState,
- [key]: value,
- }
- setCurrentSgeState(updatedState)
+ if (maxLength && value.toString().length > maxLength) return
+
+ const updatedState = {
+ ...currentSgeState,
+ [key]: value,
}
+ setCurrentSgeState(updatedState)
},
[currentSgeState]
)
@@ -133,13 +153,12 @@ const SgeConnectView = () => {
<>
<CozyBar titleKey="common.title_sge_connect" displayBackArrow={true} />
<Header
- setHeaderHeight={setHeaderHeight}
desktopTitleKey="common.title_sge_connect"
displayBackArrow={true}
/>
- <Content heightOffset={headerHeight}>
- <div className="sge-view">
- <div className="sge-container">
+ <Content>
+ <div className="connectView">
+ <div className="stepContainer">
<FormProgress
currentStep={currentStep}
totalSteps={Object.values(SgeStep).length / 2}
diff --git a/src/components/Connection/SGEConnect/SgeInit.spec.tsx b/src/components/Connection/SGEConnect/SgeInit.spec.tsx
index b4789725b6d52711005d5e5ebca6808d409b9f20..5bb551e8e671f95b1527a92b4623c5f29cafdd0e 100644
--- a/src/components/Connection/SGEConnect/SgeInit.spec.tsx
+++ b/src/components/Connection/SGEConnect/SgeInit.spec.tsx
@@ -1,9 +1,8 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
-import { SgeStatusWithAccount } from 'tests/__mocks__/fluidStatusData.mock'
-import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store'
+import { createMockEcolyoStore } from 'tests/__mocks__/store'
import SgeInit from './SgeInit'
const mockedNavigate = jest.fn()
@@ -12,13 +11,6 @@ jest.mock('react-router-dom', () => ({
useNavigate: () => mockedNavigate,
}))
-const mockConnect = jest.fn()
-const mockUpdate = jest.fn()
-
-jest.mock('components/Hooks/useKonnectorAuth', () =>
- jest.fn(() => [mockConnect, mockUpdate])
-)
-
describe('SgeInit component', () => {
const store = createMockEcolyoStore()
it('should be rendered correctly', () => {
@@ -35,43 +27,9 @@ describe('SgeInit component', () => {
<SgeInit />
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
- expect(mockedNavigate).toHaveBeenCalled()
- })
- it('should launch account and trigger creation process', async () => {
- const store = createMockEcolyoStore({
- global: {
- ...mockGlobalState,
- sgeConnect: {
- ...mockGlobalState.sgeConnect,
- shouldLaunchAccount: true,
- },
- },
- })
-
- render(
- <Provider store={store}>
- <SgeInit />
- </Provider>
- )
- expect(mockConnect).toHaveBeenCalled()
- })
- it('should launch existing account update process', async () => {
- const store = createMockEcolyoStore({
- global: {
- ...mockGlobalState,
- fluidStatus: [SgeStatusWithAccount],
- sgeConnect: {
- ...mockGlobalState.sgeConnect,
- shouldLaunchAccount: true,
- },
- },
+ await act(async () => {
+ await userEvent.click(screen.getByText('auth.enedissgegrandlyon.connect'))
})
- render(
- <Provider store={store}>
- <SgeInit />
- </Provider>
- )
- expect(mockUpdate).toHaveBeenCalled()
+ expect(mockedNavigate).toHaveBeenCalled()
})
})
diff --git a/src/components/Connection/SGEConnect/SgeInit.tsx b/src/components/Connection/SGEConnect/SgeInit.tsx
index 5d349bc50929ef1bf6ec174a29abb81aacc1258e..3576986a69311b85e2506e8217fe25cb48e222ea 100644
--- a/src/components/Connection/SGEConnect/SgeInit.tsx
+++ b/src/components/Connection/SGEConnect/SgeInit.tsx
@@ -1,17 +1,11 @@
import { Button } from '@material-ui/core'
import ElectricityBillIcon from 'assets/icons/visu/onboarding/electricity_bill.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType } from 'enums'
-import { Account } from 'models'
-import React, { useEffect } from 'react'
+import React from 'react'
import { useNavigate } from 'react-router-dom'
import { setShowOfflineData } from 'store/chart/chart.slice'
-import {
- setShouldRefreshConsent,
- updateSgeStore,
-} from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
const SgeInit = () => {
@@ -19,48 +13,28 @@ const SgeInit = () => {
const navigate = useNavigate()
const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
const currentFluidStatus = fluidStatus[FluidType.ELECTRICITY]
- const konnectorSlug: string =
- currentFluidStatus.connection.konnectorConfig.slug
- const account: Account | null = currentFluidStatus.connection.account
- const { sgeConnect } = useAppSelector(state => state.ecolyo.global)
const dispatch = useAppDispatch()
- const [connect, update] = useKonnectorAuth(currentFluidStatus.fluidType)
-
- useEffect(() => {
- async function launchConnect() {
- if (sgeConnect.shouldLaunchAccount) {
- dispatch(updateSgeStore({ ...sgeConnect, shouldLaunchAccount: false }))
- dispatch(setShouldRefreshConsent(false))
- if (!account) {
- await connect()
- } else {
- await update()
- }
- }
- }
- launchConnect()
- }, [account, connect, dispatch, sgeConnect, update])
return (
<div className="connection-form">
- <p className={`connection-form-title ${konnectorSlug} text-20-bold`}>
- {t(`auth.${konnectorSlug}.title`)}
- </p>
+ <h2 className="connection-form-title enedissgegrandlyon text-20-bold">
+ {t(`auth.enedissgegrandlyon.title`)}
+ </h2>
<StyledIcon icon={ElectricityBillIcon} size={180} />
<p
- className={`connection-form-subtitle ${konnectorSlug} text-16-regular`}
- dangerouslySetInnerHTML={{ __html: t(`auth.${konnectorSlug}.bill`) }}
+ className="connection-form-subtitle text-16-regular"
+ dangerouslySetInnerHTML={{ __html: t(`auth.enedissgegrandlyon.bill`) }}
/>
<div className="connection-form-button">
<Button
- aria-label={t(`auth.${konnectorSlug}.accessibility.connect`)}
+ aria-label={t(`auth.enedissgegrandlyon.accessibility.connect`)}
onClick={() => {
- navigate('/sge-connect')
+ navigate('/connect/electricity')
}}
className="btnPrimary"
>
- {t(`auth.${konnectorSlug}.connect`)}
+ {t(`auth.enedissgegrandlyon.connect`)}
</Button>
{currentFluidStatus.firstDataDate && (
<Button
diff --git a/src/components/Connection/SGEConnect/SgeModalHint.tsx b/src/components/Connection/SGEConnect/SgeModalHint.tsx
index 4e18157d9b818e0da8ea8b5630c4c7dca05f0f44..5b68e0d94d2b0298ed34a3e4ecb23348568b8daa 100644
--- a/src/components/Connection/SGEConnect/SgeModalHint.tsx
+++ b/src/components/Connection/SGEConnect/SgeModalHint.tsx
@@ -37,11 +37,11 @@ const SgeModalHint = ({ open, handleCloseClick }: SgeModalHintProps) => {
>
<Icon icon={CloseIcon} size={16} />
</IconButton>
- <div className="sgeHintModal">
+ <div className="hintModal">
<h1 className="text-20-bold">
{t('auth.enedissgegrandlyon.pdlModal.title')}
</h1>
- <div className="sgeHintModal-content">
+ <div className="content">
<p>{t('auth.enedissgegrandlyon.pdlModal.txt1')}</p>
<p>{t('auth.enedissgegrandlyon.pdlModal.txt2')}</p>
<div className="bill">
diff --git a/src/components/Connection/SGEConnect/StepAddress.spec.tsx b/src/components/Connection/SGEConnect/StepAddress.spec.tsx
index d5aae6a3af4b54692c0c3549c89de48388bd5bf2..e7e1326c249c7c046f6afce0d3856bfba13ee33a 100644
--- a/src/components/Connection/SGEConnect/StepAddress.spec.tsx
+++ b/src/components/Connection/SGEConnect/StepAddress.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { mockGlobalState } from 'tests/__mocks__/store'
@@ -30,14 +30,18 @@ describe('StepAddress component', () => {
const input = screen.getByRole('textbox', {
name: 'auth.enedissgegrandlyon.address',
})
- await userEvent.type(input, 't')
+ await act(async () => {
+ await userEvent.type(input, 't')
+ })
expect(mockHandleChange).toHaveBeenCalledWith('address', 't')
})
it('should change zipCode value', async () => {
const input = screen.getByRole('spinbutton', {
name: 'auth.enedissgegrandlyon.zipCode',
})
- await userEvent.type(input, '0')
+ await act(async () => {
+ await userEvent.type(input, '0')
+ })
expect(mockHandleChange).toHaveBeenCalledWith('zipCode', '0', 5)
})
@@ -45,7 +49,9 @@ describe('StepAddress component', () => {
const input = screen.getByRole('textbox', {
name: 'auth.enedissgegrandlyon.city',
})
- await userEvent.type(input, 'c')
+ await act(async () => {
+ await userEvent.type(input, 'c')
+ })
expect(mockHandleChange).toHaveBeenCalledWith('city', 'c')
})
})
diff --git a/src/components/Connection/SGEConnect/StepAddress.tsx b/src/components/Connection/SGEConnect/StepAddress.tsx
index 0f5ef8712df848f61df65946a3d064c833e6cf4a..dfbcc2d51dd3dfc20d9cea6d97fedfbd9efba956 100644
--- a/src/components/Connection/SGEConnect/StepAddress.tsx
+++ b/src/components/Connection/SGEConnect/StepAddress.tsx
@@ -1,3 +1,4 @@
+import { TextField } from '@material-ui/core'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { SgeStore } from 'models'
import React from 'react'
@@ -11,45 +12,40 @@ interface StepAddressProps {
const StepAddress = ({ sgeState, onChange }: StepAddressProps) => {
const { t } = useI18n()
return (
- <div className="sge-step-container stepAddress">
- <div className="title text-22-bold">
+ <div className="stepDetails stepAddress">
+ <h2 className="text-22-bold">
{t('auth.enedissgegrandlyon.addressTitle')}
- </div>
- <label htmlFor="address" className="text-16-normal">
- {t('auth.enedissgegrandlyon.address')}
- <input
- type="text"
- id="address"
- name="address"
- className="inputText"
- value={sgeState.address}
- onChange={e => onChange('address', e.target.value)}
- />
- </label>
- <label htmlFor="zipCode" className="text-16-normal">
- {t('auth.enedissgegrandlyon.zipCode')}
- <input
- type="number"
- min={0}
- id="zipCode"
- name="zipCode"
- className="inputText"
- value={sgeState.zipCode !== null ? sgeState.zipCode : undefined}
- onChange={e => onChange('zipCode', e.target.value, 5)}
- />
- </label>
-
- <label htmlFor="city" className="text-16-normal">
- {t('auth.enedissgegrandlyon.city')}
- <input
- type="text"
- id="city"
- name="city"
- className="inputText"
- value={sgeState.city}
- onChange={e => onChange('city', e.target.value)}
- />
- </label>
+ </h2>
+ <TextField
+ label={t('auth.enedissgegrandlyon.address')}
+ variant="outlined"
+ type="text"
+ id="address"
+ name="address"
+ value={sgeState.address}
+ onChange={e => onChange('address', e.target.value)}
+ required
+ />
+ <TextField
+ label={t('auth.enedissgegrandlyon.zipCode')}
+ variant="outlined"
+ type="number"
+ id="zipCode"
+ name="zipCode"
+ value={sgeState.zipCode ?? undefined}
+ onChange={e => onChange('zipCode', e.target.value, 5)}
+ required
+ />
+ <TextField
+ label={t('auth.enedissgegrandlyon.city')}
+ variant="outlined"
+ type="text"
+ id="city"
+ name="city"
+ value={sgeState.city}
+ onChange={e => onChange('city', e.target.value)}
+ required
+ />
</div>
)
}
diff --git a/src/components/Connection/SGEConnect/StepConsent.spec.tsx b/src/components/Connection/SGEConnect/StepConsent.spec.tsx
index ebca791acb68896b788aee05439f6c553790e861..642ebccb39727a42e96b8fc4a45b59f19bb2d2d4 100644
--- a/src/components/Connection/SGEConnect/StepConsent.spec.tsx
+++ b/src/components/Connection/SGEConnect/StepConsent.spec.tsx
@@ -24,15 +24,15 @@ describe('StepConsent component', () => {
onChange={mockHandleChange}
/>
)
- const consentCheckbox = screen.getByRole('checkbox', {
- name: 'auth.enedissgegrandlyon.consentCheck1',
- })
+ const consentCheckbox = screen.getByLabelText(
+ 'auth.enedissgegrandlyon.consentCheck1'
+ )
await userEvent.click(consentCheckbox)
expect(mockHandleChange).toHaveBeenCalledWith('dataConsent', true)
- const pdlCheckbox = screen.getByRole('checkbox', {
- name: 'auth.enedissgegrandlyon.consentCheck2',
- })
+ const pdlCheckbox = screen.getByLabelText(
+ 'auth.enedissgegrandlyon.consentCheck2'
+ )
await userEvent.click(pdlCheckbox)
expect(mockHandleChange).toHaveBeenCalledWith('pdlConfirm', true)
})
diff --git a/src/components/Connection/SGEConnect/StepConsent.tsx b/src/components/Connection/SGEConnect/StepConsent.tsx
index e320304fa1f7dbfddec4a4ef160c714a66ead0c5..33988363d12cafb532a43b721be00e1a02027e4a 100644
--- a/src/components/Connection/SGEConnect/StepConsent.tsx
+++ b/src/components/Connection/SGEConnect/StepConsent.tsx
@@ -11,13 +11,13 @@ const StepConsent = ({ sgeState, onChange }: StepConsentProps) => {
const { t } = useI18n()
return (
- <div className="sge-step-container stepConsent">
- <div className="head text-16-normal">
+ <div className="stepDetails stepConsent">
+ <div className="text-16-normal">
{t('auth.enedissgegrandlyon.headConsent')}
</div>
- <div className="title text-22-bold">
+ <h2 className="text-22-bold">
{t('auth.enedissgegrandlyon.textConsent')}
- </div>
+ </h2>
<ul className="text-16-normal">
<li>{t('auth.enedissgegrandlyon.consentLi1')}</li>
<li>{t('auth.enedissgegrandlyon.consentLi2')}</li>
diff --git a/src/components/Connection/SGEConnect/StepIdentityAndPdl.spec.tsx b/src/components/Connection/SGEConnect/StepIdentityAndPdl.spec.tsx
index ef172bd9d6f3fb0345cd28e4816dc7d881da0b61..42846fe60b69c7bbe8b135ec64e32e4bf1b00e53 100644
--- a/src/components/Connection/SGEConnect/StepIdentityAndPdl.spec.tsx
+++ b/src/components/Connection/SGEConnect/StepIdentityAndPdl.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { mockGlobalState } from 'tests/__mocks__/store'
@@ -17,55 +17,68 @@ describe('StepIdentityAndPdl component', () => {
expect(container).toMatchSnapshot()
})
- describe('should change fields', () => {
- beforeEach(() => {
- jest.clearAllMocks()
- render(
- <StepIdentityAndPdl
- sgeState={mockGlobalState.sgeConnect}
- onChange={mockHandleChange}
- />
- )
+ it('should be able to change fields', async () => {
+ render(
+ <StepIdentityAndPdl
+ sgeState={mockGlobalState.sgeConnect}
+ onChange={mockHandleChange}
+ />
+ )
+ const firstNameInput = screen.getByRole('textbox', {
+ name: 'auth.enedissgegrandlyon.firstName',
})
- it('should change firstName value', async () => {
- const firstNameInput = screen.getByRole('textbox', {
- name: 'auth.enedissgegrandlyon.firstName',
- })
+ await act(async () => {
await userEvent.type(firstNameInput, 'n')
- expect(mockHandleChange).toHaveBeenCalledWith('firstName', 'n')
})
- it('should change lastName value', async () => {
- const lastNameInput = screen.getByRole('textbox', {
- name: 'auth.enedissgegrandlyon.lastName',
- })
+ expect(mockHandleChange).toHaveBeenCalledWith('firstName', 'n')
+
+ const lastNameInput = screen.getByRole('textbox', {
+ name: 'auth.enedissgegrandlyon.lastName',
+ })
+ await act(async () => {
await userEvent.type(lastNameInput, 'n')
- expect(mockHandleChange).toHaveBeenCalledWith('lastName', 'n')
})
- it('should change pdl value', async () => {
- const pdlInput = screen.getByRole('spinbutton', {
- name: 'auth.enedissgegrandlyon.pdlLabel',
- })
- await userEvent.type(pdlInput, '0')
- expect(mockHandleChange).toHaveBeenCalledWith('pdl', '0', 14)
+ expect(mockHandleChange).toHaveBeenCalledWith('lastName', 'n')
+
+ const pdlInput = screen.getByRole('spinbutton', {
+ name: 'auth.enedissgegrandlyon.pdlLabel',
})
- it('should open hint modal', async () => {
- const pdlModalButton = screen.getByRole('button', {
- name: 'auth.enedissgegrandlyon.pdlModal.title',
- })
- await userEvent.click(pdlModalButton)
- expect(screen.getByRole('dialog')).toBeInTheDocument()
+ await act(async () => {
+ await userEvent.type(pdlInput, '0')
})
+ expect(mockHandleChange).toHaveBeenCalledWith('pdl', '0', 14)
})
- it('should have an existing pdl value', () => {
+
+ it('should open hint modal', async () => {
render(
<StepIdentityAndPdl
- sgeState={{ ...mockGlobalState.sgeConnect, pdl: 11111111111111 }}
+ sgeState={mockGlobalState.sgeConnect}
onChange={mockHandleChange}
/>
)
- const pdlInput = screen.getByRole('spinbutton', {
- name: 'auth.enedissgegrandlyon.pdlLabel',
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('auth.enedissgegrandlyon.pdlModal.title')
+ )
})
- expect(pdlInput).toHaveValue(11111111111111)
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+ })
+
+ it('should be rendered with values in fields', () => {
+ render(
+ <StepIdentityAndPdl
+ sgeState={{
+ ...mockGlobalState.sgeConnect,
+ pdl: 11111111111111,
+ firstName: 'Zack',
+ lastName: 'Ichan',
+ zipCode: 69003,
+ }}
+ onChange={mockHandleChange}
+ />
+ )
+ expect(screen.getByDisplayValue(11111111111111)).toBeInTheDocument()
+ expect(screen.getByDisplayValue('Zack')).toBeInTheDocument()
+ expect(screen.getByDisplayValue('Ichan')).toBeInTheDocument()
})
})
diff --git a/src/components/Connection/SGEConnect/StepIdentityAndPdl.tsx b/src/components/Connection/SGEConnect/StepIdentityAndPdl.tsx
index b9ef3bd752e76cac895d3cbd720b7a4780e149e7..6a79150325643d1b99fa30281eab1545aa26a632 100644
--- a/src/components/Connection/SGEConnect/StepIdentityAndPdl.tsx
+++ b/src/components/Connection/SGEConnect/StepIdentityAndPdl.tsx
@@ -1,4 +1,4 @@
-import { Button } from '@material-ui/core'
+import { Button, TextField } from '@material-ui/core'
import SgeModalHint from 'components/Connection/SGEConnect/SgeModalHint'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { SgeStore } from 'models'
@@ -20,58 +20,51 @@ const StepIdentityAndPdl = ({
}: StepIdentityAndPdlProps) => {
const { t } = useI18n()
const [openHintModal, setOpenHintModal] = useState<boolean>(false)
- const toggleModal = () => setOpenHintModal(prev => !prev)
return (
- <div className="sge-step-container stepIdentity">
- <div className="title text-22-bold">
+ <div className="stepDetails stepIdentity">
+ <h2 className="text-22-bold">
{t('auth.enedissgegrandlyon.identityTitle')}
- </div>
- <label htmlFor="firstName" className="text-16-normal">
- {t('auth.enedissgegrandlyon.firstName')}
- <input
- type="text"
- id="firstName"
- name="firstName"
- className="inputText"
- value={sgeState.firstName}
- onChange={e => onChange('firstName', e.target.value)}
- required
- />
- </label>
- <label htmlFor="lastName" className="text-16-normal">
- {t('auth.enedissgegrandlyon.lastName')}
- <input
- type="text"
- id="lastName"
- name="lastName"
- className="inputText"
- value={sgeState.lastName}
- onChange={e => onChange('lastName', e.target.value)}
- required
- />
- </label>
- <div className="title text-22-bold">
- {t('auth.enedissgegrandlyon.pdlTitle')}
- </div>
- <label htmlFor="pdl" className="text-16-normal">
- {t('auth.enedissgegrandlyon.pdlLabel')}
- <input
- id="pdl"
- name="pdl"
- type="number"
- min={0}
- className="inputText"
- value={sgeState.pdl ? sgeState.pdl : undefined}
- onChange={e => onChange('pdl', e.target.value, 14)}
- inputMode="numeric"
- required
- />
- </label>
- <Button className="btnText" onClick={toggleModal}>
+ </h2>
+ <TextField
+ label={t('auth.enedissgegrandlyon.firstName')}
+ variant="outlined"
+ type="text"
+ id="firstName"
+ name="firstName"
+ value={sgeState.firstName}
+ onChange={e => onChange('firstName', e.target.value)}
+ required
+ />
+ <TextField
+ label={t('auth.enedissgegrandlyon.lastName')}
+ variant="outlined"
+ type="text"
+ id="lastName"
+ name="lastName"
+ value={sgeState.lastName}
+ onChange={e => onChange('lastName', e.target.value)}
+ required
+ />
+ <h2 className="text-22-bold">{t('auth.enedissgegrandlyon.pdlTitle')}</h2>
+ <TextField
+ label={t('auth.enedissgegrandlyon.pdlLabel')}
+ variant="outlined"
+ id="pdl"
+ name="pdl"
+ type="number"
+ value={sgeState.pdl ? sgeState.pdl : undefined}
+ onChange={e => onChange('pdl', e.target.value, 14)}
+ inputMode="numeric"
+ required
+ />
+ <Button className="btnText" onClick={() => setOpenHintModal(true)}>
{t('auth.enedissgegrandlyon.pdlModal.title')}
</Button>
- <SgeModalHint open={openHintModal} handleCloseClick={toggleModal} />
+ <SgeModalHint
+ open={openHintModal}
+ handleCloseClick={() => setOpenHintModal(false)}
+ />
</div>
)
}
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
index 036c91711c4583892436719e7182be2c67610df0..cdc58037adb76fba73cd409447e624c664bda733 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
@@ -76,14 +76,12 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
class="header-bar"
/>
</header>
- <mock-content
- heightoffset="-48"
- >
+ <mock-content>
<div
- class="sge-view"
+ class="connectView"
>
<div
- class="sge-container"
+ class="stepContainer"
>
<div
class="formProgress"
@@ -110,62 +108,154 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
</div>
</div>
<div
- class="sge-step-container stepIdentity"
+ class="stepDetails stepIdentity"
>
- <div
- class="title text-22-bold"
+ <h2
+ class="text-22-bold"
>
auth.enedissgegrandlyon.identityTitle
+ </h2>
+ <div
+ class="MuiFormControl-root MuiTextField-root"
+ >
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="firstName"
+ id="firstName-label"
+ >
+ auth.enedissgegrandlyon.firstName
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="firstName"
+ name="firstName"
+ required=""
+ type="text"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.firstName
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
</div>
- <label
- class="text-16-normal"
- for="firstName"
+ <div
+ class="MuiFormControl-root MuiTextField-root"
>
- auth.enedissgegrandlyon.firstName
- <input
- class="inputText"
- id="firstName"
- name="firstName"
- required=""
- type="text"
- value=""
- />
- </label>
- <label
- class="text-16-normal"
- for="lastName"
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="lastName"
+ id="lastName-label"
+ >
+ auth.enedissgegrandlyon.lastName
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="lastName"
+ name="lastName"
+ required=""
+ type="text"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.lastName
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
+ </div>
+ <h2
+ class="text-22-bold"
>
- auth.enedissgegrandlyon.lastName
- <input
- class="inputText"
- id="lastName"
- name="lastName"
- required=""
- type="text"
- value=""
- />
- </label>
+ auth.enedissgegrandlyon.pdlTitle
+ </h2>
<div
- class="title text-22-bold"
+ class="MuiFormControl-root MuiTextField-root"
+ inputmode="numeric"
>
- auth.enedissgegrandlyon.pdlTitle
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="pdl"
+ id="pdl-label"
+ >
+ auth.enedissgegrandlyon.pdlLabel
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="pdl"
+ name="pdl"
+ required=""
+ type="number"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.pdlLabel
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
</div>
- <label
- class="text-16-normal"
- for="pdl"
- >
- auth.enedissgegrandlyon.pdlLabel
- <input
- class="inputText"
- id="pdl"
- inputmode="numeric"
- min="0"
- name="pdl"
- required=""
- type="number"
- value=""
- />
- </label>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text btnText"
tabindex="0"
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap
index 4658462c50026aba4d736556c29c9cc6a13f1c90..0a5c931bc2a82e2df698f5f6149c7e998e5d5e18 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeInit.spec.tsx.snap
@@ -5,11 +5,11 @@ exports[`SgeInit component should be rendered correctly 1`] = `
<div
class="connection-form"
>
- <p
+ <h2
class="connection-form-title enedissgegrandlyon text-20-bold"
>
auth.enedissgegrandlyon.title
- </p>
+ </h2>
<svg
aria-hidden="true"
class="styles__icon___23x3R"
@@ -21,7 +21,7 @@ exports[`SgeInit component should be rendered correctly 1`] = `
/>
</svg>
<p
- class="connection-form-subtitle enedissgegrandlyon text-16-regular"
+ class="connection-form-subtitle text-16-regular"
>
auth.enedissgegrandlyon.bill
</p>
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap
index cc445baab5c109866977c4f3fcd16b676e047082..b9ab5c3f9dc4a7569fdc89d10fdbddcf246c804b 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeModalHint.spec.tsx.snap
@@ -61,7 +61,7 @@ exports[`SgeModalHint component should be rendered correctly 1`] = `
/>
</button>
<div
- class="sgeHintModal"
+ class="hintModal"
>
<h1
class="text-20-bold"
@@ -69,7 +69,7 @@ exports[`SgeModalHint component should be rendered correctly 1`] = `
auth.enedissgegrandlyon.pdlModal.title
</h1>
<div
- class="sgeHintModal-content"
+ class="content"
>
<p>
auth.enedissgegrandlyon.pdlModal.txt1
diff --git a/src/components/Connection/SGEConnect/__snapshots__/StepAddress.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/StepAddress.spec.tsx.snap
index 9917baafdc610e195ddc092c046f40e288211fe8..9333648f773064e1c9f2b800faca207d7e80aa25 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/StepAddress.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/StepAddress.spec.tsx.snap
@@ -3,53 +3,148 @@
exports[`StepAddress component should be rendered correctly 1`] = `
<div>
<div
- class="sge-step-container stepAddress"
+ class="stepDetails stepAddress"
>
- <div
- class="title text-22-bold"
+ <h2
+ class="text-22-bold"
>
auth.enedissgegrandlyon.addressTitle
- </div>
- <label
- class="text-16-normal"
- for="address"
+ </h2>
+ <div
+ class="MuiFormControl-root MuiTextField-root"
>
- auth.enedissgegrandlyon.address
- <input
- class="inputText"
- id="address"
- name="address"
- type="text"
- value=""
- />
- </label>
- <label
- class="text-16-normal"
- for="zipCode"
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="address"
+ id="address-label"
+ >
+ auth.enedissgegrandlyon.address
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="address"
+ name="address"
+ required=""
+ type="text"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.address
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
+ </div>
+ <div
+ class="MuiFormControl-root MuiTextField-root"
>
- auth.enedissgegrandlyon.zipCode
- <input
- class="inputText"
- id="zipCode"
- min="0"
- name="zipCode"
- type="number"
- value=""
- />
- </label>
- <label
- class="text-16-normal"
- for="city"
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="zipCode"
+ id="zipCode-label"
+ >
+ auth.enedissgegrandlyon.zipCode
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="zipCode"
+ name="zipCode"
+ required=""
+ type="number"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.zipCode
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
+ </div>
+ <div
+ class="MuiFormControl-root MuiTextField-root"
>
- auth.enedissgegrandlyon.city
- <input
- class="inputText"
- id="city"
- name="city"
- type="text"
- value=""
- />
- </label>
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="city"
+ id="city-label"
+ >
+ auth.enedissgegrandlyon.city
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="city"
+ name="city"
+ required=""
+ type="text"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.city
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
+ </div>
</div>
</div>
`;
diff --git a/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
index 4d4e94cc71c5da336220e045dc7e6da2d59f05de..12291fade1d0270bf8dd71711888143f63131886 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/StepConsent.spec.tsx.snap
@@ -3,18 +3,18 @@
exports[`StepConsent component should be rendered correctly 1`] = `
<div>
<div
- class="sge-step-container stepConsent"
+ class="stepDetails stepConsent"
>
<div
- class="head text-16-normal"
+ class="text-16-normal"
>
auth.enedissgegrandlyon.headConsent
</div>
- <div
- class="title text-22-bold"
+ <h2
+ class="text-22-bold"
>
auth.enedissgegrandlyon.textConsent
- </div>
+ </h2>
<ul
class="text-16-normal"
>
diff --git a/src/components/Connection/SGEConnect/__snapshots__/StepIdentityAndPdl.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/StepIdentityAndPdl.spec.tsx.snap
index 6699b43c1e3bfd684e788b61345aa311b2d033d5..2eaf41d731643a98e6a4fa75ba5903fcaad55e04 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/StepIdentityAndPdl.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/StepIdentityAndPdl.spec.tsx.snap
@@ -3,62 +3,154 @@
exports[`StepIdentityAndPdl component should be rendered correctly 1`] = `
<div>
<div
- class="sge-step-container stepIdentity"
+ class="stepDetails stepIdentity"
>
- <div
- class="title text-22-bold"
+ <h2
+ class="text-22-bold"
>
auth.enedissgegrandlyon.identityTitle
+ </h2>
+ <div
+ class="MuiFormControl-root MuiTextField-root"
+ >
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="firstName"
+ id="firstName-label"
+ >
+ auth.enedissgegrandlyon.firstName
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="firstName"
+ name="firstName"
+ required=""
+ type="text"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.firstName
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
</div>
- <label
- class="text-16-normal"
- for="firstName"
+ <div
+ class="MuiFormControl-root MuiTextField-root"
>
- auth.enedissgegrandlyon.firstName
- <input
- class="inputText"
- id="firstName"
- name="firstName"
- required=""
- type="text"
- value=""
- />
- </label>
- <label
- class="text-16-normal"
- for="lastName"
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="lastName"
+ id="lastName-label"
+ >
+ auth.enedissgegrandlyon.lastName
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="lastName"
+ name="lastName"
+ required=""
+ type="text"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.lastName
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
+ </div>
+ <h2
+ class="text-22-bold"
>
- auth.enedissgegrandlyon.lastName
- <input
- class="inputText"
- id="lastName"
- name="lastName"
- required=""
- type="text"
- value=""
- />
- </label>
+ auth.enedissgegrandlyon.pdlTitle
+ </h2>
<div
- class="title text-22-bold"
+ class="MuiFormControl-root MuiTextField-root"
+ inputmode="numeric"
>
- auth.enedissgegrandlyon.pdlTitle
+ <label
+ class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined Mui-required Mui-required"
+ data-shrink="false"
+ for="pdl"
+ id="pdl-label"
+ >
+ auth.enedissgegrandlyon.pdlLabel
+ <span
+ aria-hidden="true"
+ class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
+ >
+  
+ *
+ </span>
+ </label>
+ <div
+ class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+ >
+ <input
+ aria-invalid="false"
+ class="MuiInputBase-input MuiOutlinedInput-input"
+ id="pdl"
+ name="pdl"
+ required=""
+ type="number"
+ value=""
+ />
+ <fieldset
+ aria-hidden="true"
+ class="PrivateNotchedOutline-root-1 MuiOutlinedInput-notchedOutline"
+ >
+ <legend
+ class="PrivateNotchedOutline-legendLabelled-3"
+ >
+ <span>
+ auth.enedissgegrandlyon.pdlLabel
+ Â *
+ </span>
+ </legend>
+ </fieldset>
+ </div>
</div>
- <label
- class="text-16-normal"
- for="pdl"
- >
- auth.enedissgegrandlyon.pdlLabel
- <input
- class="inputText"
- id="pdl"
- inputmode="numeric"
- min="0"
- name="pdl"
- required=""
- type="number"
- value=""
- />
- </label>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text btnText"
tabindex="0"
diff --git a/src/components/Connection/connection.scss b/src/components/Connection/connection.scss
index ae93a0111e53974968b023e1ebe562daee2f5f88..bde9ff1d3bb802b579c84895e838e9a8f4bc15fd 100644
--- a/src/components/Connection/connection.scss
+++ b/src/components/Connection/connection.scss
@@ -33,9 +33,6 @@
margin: 0 auto 0.5rem auto;
color: $white;
}
- .connection-form-infotext {
- color: $grey-bright;
- }
.connection-form-button {
display: flex;
@@ -76,3 +73,128 @@
}
}
}
+
+// SGE & GRDF
+.connectView {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+ justify-content: space-between;
+ .stepContainer {
+ padding: 1rem;
+ display: flex;
+ flex-direction: column;
+ gap: 1rem;
+
+ .stepDetails {
+ display: flex;
+ flex-direction: column;
+ gap: 1rem;
+
+ h2 {
+ color: $grey-bright;
+ margin: 0;
+ }
+
+ label.inline {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 10px;
+ &.inline {
+ flex-direction: row;
+ align-items: center;
+ gap: 0.5rem;
+ }
+ cursor: pointer;
+
+ span span {
+ color: $gold-shadow;
+ }
+ }
+ #zipCode {
+ max-width: 115px;
+ }
+
+ .MuiInputBase-root {
+ max-width: 300px;
+ }
+
+
+ /* Chrome, Safari, Edge, Opera */
+ input::-webkit-outer-spin-button,
+ input::-webkit-inner-spin-button {
+ -webkit-appearance: none;
+ }
+ /* Firefox */
+ input[type='number'] {
+ appearance: textfield;
+ -moz-appearance: textfield;
+ }
+
+ .btnText {
+ max-width: 280px;
+ }
+ ul {
+ margin: 0;
+ padding: 0 1rem 1rem;
+ line-height: 130%;
+ border-bottom: 1px solid $grey-dark;
+ li {
+ margin: 0.5rem 0;
+ }
+ }
+ }
+ }
+}
+
+.hintModal {
+ display: flex;
+ flex-direction: column;
+ text-align: left;
+
+ h1 {
+ text-align: center;
+ color: $gold-shadow;
+ margin: 1rem 0;
+ }
+
+ .content {
+ display: flex;
+ flex-direction: column;
+ gap: 1.5rem;
+ p {
+ text-align: center;
+ color: $grey-bright;
+ margin: 0;
+ text-wrap: pretty;
+ }
+
+ .grdfText {
+ color: $grey-bright;
+ span {
+ color: $gold-shadow;
+ font-weight: 700;
+ }
+ }
+
+ .bill {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+
+ &.grdf {
+ justify-content: center;
+ }
+ p {
+ color: $gold-shadow;
+ }
+ }
+
+ svg.prm {
+ width: 100%;
+ height: 180px;
+ }
+ }
+}
+
diff --git a/src/components/Consumption/ConsumptionView.spec.tsx b/src/components/Consumption/ConsumptionView.spec.tsx
index 124c51accc0156479fc86be1bff71ee0f3e76bf9..96f96183d9ec8a16a75e399a85cdcbc450744fc4 100644
--- a/src/components/Consumption/ConsumptionView.spec.tsx
+++ b/src/components/Consumption/ConsumptionView.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { render, screen, waitFor } from '@testing-library/react'
import { FluidState, FluidType, TimeStep } from 'enums'
import React from 'react'
import { Provider } from 'react-redux'
@@ -59,7 +59,6 @@ describe('ConsumptionView component', () => {
const store = createMockEcolyoStore({
chart: {
...mockChartState,
- loading: false,
showOfflineData: true,
},
global: {
@@ -83,27 +82,6 @@ describe('ConsumptionView component', () => {
).toBeTruthy()
})
- it('should display a spinner when fluid connected and is loading', () => {
- const store = createMockEcolyoStore({
- chart: {
- ...mockChartState,
- loading: true,
- showOfflineData: true,
- },
- global: {
- fluidStatus: mockFluidStatus,
- releaseNotes: mockInitialEcolyoState.global.releaseNotes,
- },
- modal: mockModalState,
- })
- render(
- <Provider store={store}>
- <ConsumptionView fluidType={FluidType.ELECTRICITY} />
- </Provider>
- )
- expect(screen.getByRole('progressbar')).toBeInTheDocument()
- })
-
it('should set CurrentTimeStep to WEEK when fluid != ELECTRICITY and timeStep = HALF_AN_HOUR', () => {
const store = createMockEcolyoStore({
chart: {
@@ -144,7 +122,7 @@ describe('ConsumptionView component', () => {
).toBeTruthy()
})
- it('should render mutlifluid consumption if at least one fluid is connected', () => {
+ it('should render mutlifluid consumption if at least one fluid is connected without konnectorViewerCard', async () => {
const store = createMockEcolyoStore({
chart: mockChartStateShowOffline,
global: {
@@ -158,12 +136,16 @@ describe('ConsumptionView component', () => {
<ConsumptionView fluidType={FluidType.MULTIFLUID} />
</Provider>
)
+ await waitFor(() => null, { container })
expect(
- container.getElementsByClassName('consumptionview-content')[0]
+ container.getElementsByTagName('mock-consumptionDetails').item(0)
).toBeInTheDocument()
+ expect(
+ container.getElementsByTagName('mock-konnectorViewerCard').item(0)
+ ).not.toBeInTheDocument()
})
- it('should render Electricity when elec is connected', () => {
+ it('should render Electricity when elec is connected with konnectorViewCard', async () => {
const store = createMockEcolyoStore({
chart: mockChartStateShowOffline,
global: {
@@ -177,36 +159,71 @@ describe('ConsumptionView component', () => {
<ConsumptionView fluidType={FluidType.ELECTRICITY} />
</Provider>
)
+ await waitFor(() => null, { container })
expect(
- container.getElementsByClassName('consumptionview-content').item(0)
+ container.getElementsByTagName('mock-consumptionDetails').item(0)
).toBeInTheDocument()
expect(
- container.getElementsByTagName('mock-consumptionDetails').item(0)
+ container.getElementsByTagName('mock-konnectorViewerCard').item(0)
).toBeInTheDocument()
})
- // todo describe and add multiple fluids ?
- it('should render partner issue Modal', async () => {
- const updatedStatus = mockInitialEcolyoState.global.fluidStatus
- updatedStatus[0] = mockExpiredElec
- const store = createMockEcolyoStore({
- chart: mockChartStateShowOffline,
- global: {
- fluidStatus: updatedStatus,
- releaseNotes: mockInitialEcolyoState.global.releaseNotes,
- },
- modal: {
- ...mockModalState,
- partnersIssueModal: { enedis: false, grdf: false, egl: true },
- },
+ describe('Partner Issue Modal', () => {
+ it('should render partner issue Modal for electricity', async () => {
+ const updatedStatus = mockInitialEcolyoState.global.fluidStatus
+ updatedStatus[0] = { ...updatedStatus[0], maintenance: true }
+ const store = createMockEcolyoStore({
+ chart: mockChartStateShowOffline,
+ global: {
+ fluidStatus: updatedStatus,
+ releaseNotes: mockInitialEcolyoState.global.releaseNotes,
+ },
+ modal: {
+ ...mockModalState,
+ partnersIssueModal: { enedis: true, grdf: false, egl: false },
+ },
+ })
+ mockUpdateProfile.mockResolvedValue(mockTestProfile1)
+ const { container } = render(
+ <Provider store={store}>
+ <ConsumptionView fluidType={FluidType.ELECTRICITY} />
+ </Provider>
+ )
+ await waitFor(() => null, { container })
+ expect(
+ screen.getByRole('presentation', {
+ name: 'consumption.partner_issue_modal.accessibility_title',
+ })
+ ).toBeInTheDocument()
+ })
+
+ it('should render partner issue Modal for water', async () => {
+ const updatedStatus = mockInitialEcolyoState.global.fluidStatus
+ updatedStatus[1] = { ...updatedStatus[1], maintenance: true }
+ const store = createMockEcolyoStore({
+ chart: mockChartStateShowOffline,
+ global: {
+ fluidStatus: updatedStatus,
+ releaseNotes: mockInitialEcolyoState.global.releaseNotes,
+ },
+ modal: {
+ ...mockModalState,
+ partnersIssueModal: { enedis: false, grdf: false, egl: true },
+ },
+ })
+ mockUpdateProfile.mockResolvedValue(mockTestProfile1)
+ const { container } = render(
+ <Provider store={store}>
+ <ConsumptionView fluidType={FluidType.WATER} />
+ </Provider>
+ )
+ await waitFor(() => null, { container })
+ expect(
+ screen.getByRole('presentation', {
+ name: 'consumption.partner_issue_modal.accessibility_title',
+ })
+ ).toBeInTheDocument()
})
- mockUpdateProfile.mockResolvedValue(mockTestProfile1)
- render(
- <Provider store={store}>
- <ConsumptionView fluidType={FluidType.ELECTRICITY} />
- </Provider>
- )
- expect(screen.getByRole('dialog')).toBeInTheDocument()
})
it('should show expired modal when a GRDF consent is expired', () => {
const updatedStatus = mockInitialEcolyoState.global.fluidStatus
diff --git a/src/components/Consumption/ConsumptionView.tsx b/src/components/Consumption/ConsumptionView.tsx
index a8658aaf03e96f441098b87cd5ca1b0de822083f..5b13626490267657c865d676f9627973c77d2a73 100644
--- a/src/components/Consumption/ConsumptionView.tsx
+++ b/src/components/Consumption/ConsumptionView.tsx
@@ -1,4 +1,3 @@
-import classNames from 'classnames'
import ExpiredConsentModal from 'components/Connection/ExpiredConsentModal/ExpiredConsentModal'
import Content from 'components/Content/Content'
import CustomPopupModal from 'components/CustomPopup/CustomPopupModal'
@@ -8,13 +7,12 @@ import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import KonnectorViewerCard from 'components/Konnector/KonnectorViewerCard'
import KonnectorViewerList from 'components/Konnector/KonnectorViewerList'
-import Loader from 'components/Loader/Loader'
import PartnerIssueModal from 'components/PartnerIssue/PartnerIssueModal'
import ReleaseNotesModal from 'components/ReleaseNotesModal/ReleaseNotesModal'
import { useClient } from 'cozy-client'
-import { FluidType, TimeStep } from 'enums'
+import { FluidState, FluidType, TimeStep } from 'enums'
import { DateTime } from 'luxon'
-import React, { useCallback, useEffect, useState } from 'react'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
import { useNavigate } from 'react-router-dom'
import DateChartService from 'services/dateChart.service'
import ProfileService from 'services/profile.service'
@@ -35,50 +33,60 @@ import {
} from 'utils/utils'
import ConsumptionDetails from './ConsumptionDetails/ConsumptionDetails'
import FluidButtons from './FluidButtons/FluidButtons'
-import './consumptionView.scss'
const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
const navigate = useNavigate()
const client = useClient()
const dispatch = useAppDispatch()
- const isMulti = fluidType === FluidType.MULTIFLUID
const {
- chart: {
- currentTimeStep,
- loading,
- showOfflineData,
- selectedDate,
- currentIndex,
- },
+ chart: { currentTimeStep, showOfflineData, selectedDate, currentIndex },
global: { fluidStatus, releaseNotes },
modal: { partnersIssueModal, customPopupModal },
} = useAppSelector(state => state.ecolyo)
+ const isMulti = fluidType === FluidType.MULTIFLUID
+ const currentFluidStatus = fluidStatus[fluidType]
const dateChartService = new DateChartService()
+ /** Show wait consent screen when consent is "A valider" */
+ const isWaitingForConsent =
+ fluidType === FluidType.GAS &&
+ currentFluidStatus.status === FluidState.CHALLENGE_ASKED
+
+ const [openExpiredConsentModal, setOpenExpiredConsentModal] = useState(true)
const [openReleaseNoteModal, setOpenReleaseNoteModal] = useState<boolean>(
releaseNotes.show
)
-
- const [headerHeight, setHeaderHeight] = useState<number>(0)
- const [active, setActive] = useState<boolean>(false)
- const [openExpiredConsentModal, setOpenExpiredConsentModal] =
- useState<boolean>(true)
const [consentExpiredFluids, setConsentExpiredFluids] = useState<FluidType[]>(
[]
)
+ const profileService = useMemo(() => new ProfileService(client), [client])
+
const updateKey =
- fluidType !== FluidType.MULTIFLUID && fluidStatus[fluidType].lastDataDate
- ? `${fluidStatus[fluidType].lastDataDate!.toLocaleString()} + ${
- fluidStatus[fluidType].status + fluidType
+ !isMulti && currentFluidStatus.lastDataDate
+ ? `${currentFluidStatus.lastDataDate.toLocaleString()} + ${
+ currentFluidStatus.status + fluidType
}`
: ''
const lastDataDateKey =
- fluidType !== FluidType.MULTIFLUID && fluidStatus[fluidType].lastDataDate
- ? `${fluidStatus[fluidType].lastDataDate!.toLocaleString() + fluidType}`
+ !isMulti && currentFluidStatus.lastDataDate
+ ? `${currentFluidStatus.lastDataDate.toLocaleString() + fluidType}`
: ''
+ const getPartnerKey = (fluidType: FluidType): 'enedis' | 'egl' | 'grdf' => {
+ switch (fluidType) {
+ case FluidType.ELECTRICITY:
+ return 'enedis'
+ case FluidType.WATER:
+ return 'egl'
+ case FluidType.GAS:
+ return 'grdf'
+ default:
+ throw new Error('unknown fluidtype')
+ }
+ }
+
const handleCloseReleaseNoteModal = useCallback(() => {
setOpenReleaseNoteModal(false)
dispatch(
@@ -93,45 +101,27 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
}
}, [dispatch, navigate, releaseNotes.notes, releaseNotes.redirectLink])
- const getPartnerKey = (fluidType: FluidType): 'enedis' | 'egl' | 'grdf' => {
- switch (fluidType) {
- case FluidType.ELECTRICITY:
- return 'enedis'
- case FluidType.WATER:
- return 'egl'
- case FluidType.GAS:
- return 'grdf'
- default:
- throw new Error('unknown fluidtype')
- }
- }
-
- const handleClosePartnerIssueModal = useCallback(
- async (fluidType: FluidType) => {
- const profileService = new ProfileService(client)
- const profileValues = await profileService.getProfile()
- if (profileValues) {
- const updatedProfile = await profileService.updateProfile({
- partnersIssueSeenDate: {
- ...profileValues.partnersIssueSeenDate,
- [getPartnerKey(fluidType)]: getTodayDate(),
- },
- })
- if (updatedProfile) {
- dispatch(
- openPartnersModal({
- ...partnersIssueModal,
- [getPartnerKey(fluidType)]: false,
- })
- )
- }
+ const handleClosePartnerIssueModal = useCallback(async () => {
+ const profileValues = await profileService.getProfile()
+ if (profileValues) {
+ const updatedProfile = await profileService.updateProfile({
+ partnersIssueSeenDate: {
+ ...profileValues.partnersIssueSeenDate,
+ [getPartnerKey(fluidType)]: getTodayDate(),
+ },
+ })
+ if (updatedProfile) {
+ dispatch(
+ openPartnersModal({
+ ...partnersIssueModal,
+ [getPartnerKey(fluidType)]: false,
+ })
+ )
}
- },
- [client, dispatch, partnersIssueModal]
- )
+ }
+ }, [dispatch, fluidType, partnersIssueModal, profileService])
const handleCloseCustomPopupModal = async () => {
- const profileService = new ProfileService(client)
const updatedProfile = await profileService.updateProfile({
customPopupDate: getTodayDate(),
})
@@ -145,15 +135,18 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
}
}
- /** Handle time change */
- useEffect(() => {
- if (
- fluidType !== FluidType.ELECTRICITY &&
- currentTimeStep == TimeStep.HALF_AN_HOUR
- ) {
- dispatch(setCurrentTimeStep(TimeStep.WEEK))
- }
- }, [dispatch, fluidType, currentTimeStep])
+ useEffect(
+ /** Reset half-hour timestep for water & gas & multifluid */
+ function setDefaultTimeStep() {
+ if (
+ fluidType !== FluidType.ELECTRICITY &&
+ currentTimeStep == TimeStep.HALF_AN_HOUR
+ ) {
+ dispatch(setCurrentTimeStep(TimeStep.WEEK))
+ }
+ },
+ [dispatch, fluidType, currentTimeStep]
+ )
/**
* If fluid is not connected, display Connect components
@@ -164,10 +157,10 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
dispatch(setShowOfflineData(isFluidConnected))
}, [dispatch, fluidStatus, fluidType])
+ /** Check if some fluids have expired consent error */
useEffect(() => {
let subscribed = true
const expiredConsents: FluidType[] = []
- // Check if some fluids have expired consent error
for (const fluid of fluidStatus) {
const error = fluid.connection.triggerState?.last_error
if (error && getKonnectorUpdateError(error) === 'error_update_oauth') {
@@ -218,10 +211,7 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
return (
<>
<CozyBar titleKey="common.title_consumption" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_consumption"
- >
+ <Header desktopTitleKey="common.title_consumption">
<DateNavigator
disableNext={isLastDateReached(selectedDate, currentTimeStep)}
disablePrev={disablePrev}
@@ -231,64 +221,27 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
timeStep={currentTimeStep}
/>
</Header>
- <Content heightOffset={headerHeight}>
+ <Content>
<FluidButtons activeFluid={fluidType} key={updateKey} />
- {openReleaseNoteModal && (
- <ReleaseNotesModal
- open={openReleaseNoteModal}
- handleCloseClick={handleCloseReleaseNoteModal}
- />
- )}
- {showOfflineData && (
+ {showOfflineData && !isWaitingForConsent && (
<>
- {loading && (
- <div className="consumptionview-loading">
- <Loader fluidType={fluidType} />
- </div>
- )}
- <div
- className={classNames('consumptionview-content', {
- ['--hidden']: loading,
- })}
- >
- <FluidChart
- fluidType={fluidType}
- setActive={setActive}
- key={lastDataDateKey}
- />
- <ConsumptionDetails fluidType={fluidType} />
- </div>
- {!isMulti && (
- <div className="konnector-section">
- <KonnectorViewerCard
- fluidType={fluidType}
- isDisconnected={false}
- showOfflineData={true}
- setActive={setActive}
- active={active}
- key={fluidType}
- />
- </div>
- )}
+ <FluidChart fluidType={fluidType} key={lastDataDateKey} />
+ <ConsumptionDetails fluidType={fluidType} />
</>
)}
- {!showOfflineData && (
- <div className="konnector-section">
- {isMulti ? (
- <KonnectorViewerList />
- ) : (
- <KonnectorViewerCard
- fluidType={fluidType}
- isDisconnected={true}
- showOfflineData={false}
- setActive={setActive}
- active={active}
- />
- )}
- </div>
- )}
+ {!isMulti && <KonnectorViewerCard fluidType={fluidType} />}
+
+ {isMulti && !showOfflineData && <KonnectorViewerList />}
</Content>
+
+ {/* MODALS */}
+ {openReleaseNoteModal && (
+ <ReleaseNotesModal
+ open={openReleaseNoteModal}
+ handleCloseClick={handleCloseReleaseNoteModal}
+ />
+ )}
{/* Partner issue modals for individual fluids */}
{fluidStatus
.filter(fluid => fluid.maintenance)
@@ -306,17 +259,15 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
handleCloseClick={handleCloseCustomPopupModal}
/>
{Boolean(consentExpiredFluids.length) &&
- consentExpiredFluids.map(fluid => {
- return (
- <ExpiredConsentModal
- key={fluid}
- open={openExpiredConsentModal}
- handleCloseClick={() => setOpenExpiredConsentModal(false)}
- fluidType={fluid}
- toggleModal={() => setOpenExpiredConsentModal(prev => !prev)}
- />
- )
- })}
+ consentExpiredFluids.map(fluid => (
+ <ExpiredConsentModal
+ key={fluid}
+ open={openExpiredConsentModal}
+ handleCloseClick={() => setOpenExpiredConsentModal(false)}
+ fluidType={fluid}
+ toggleModal={() => setOpenExpiredConsentModal(prev => !prev)}
+ />
+ ))}
</>
)
}
diff --git a/src/components/Consumption/FluidButtons/FluidButton.spec.tsx b/src/components/Consumption/FluidButtons/FluidButton.spec.tsx
index 1c8fa5ea6e1821077906d7488b060d1a10013548..09d06751951cf026faba5835fd1c3c13ad34b78f 100644
--- a/src/components/Consumption/FluidButtons/FluidButton.spec.tsx
+++ b/src/components/Consumption/FluidButtons/FluidButton.spec.tsx
@@ -1,4 +1,4 @@
-import { render } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
import { FluidState, FluidType } from 'enums'
import { GlobalState } from 'models'
import React from 'react'
@@ -19,15 +19,14 @@ describe('FluidButton component', () => {
})
it('should render multifluidButton', () => {
- const { container } = render(
+ render(
<Provider store={store}>
<FluidButton fluidType={FluidType.MULTIFLUID} isActive={false} />
</Provider>
)
- const element = container.getElementsByClassName('multifluid').item(0)
- expect(element).toBeInTheDocument()
+ expect(screen.getByText('FLUID.MULTIFLUID.LABEL')).toBeInTheDocument()
})
- it('should render active button', () => {
+ it('should render active gas button', () => {
const { container } = render(
<Provider store={store}>
<FluidButton fluidType={FluidType.GAS} isActive={true} />
diff --git a/src/components/Consumption/FluidButtons/FluidButton.tsx b/src/components/Consumption/FluidButtons/FluidButton.tsx
index f68eaa2d10542bfcbe93bfa8351ea37d049ce2a5..cd08a99446f0f896133baeb5191830565b1f7c07 100644
--- a/src/components/Consumption/FluidButtons/FluidButton.tsx
+++ b/src/components/Consumption/FluidButtons/FluidButton.tsx
@@ -1,6 +1,7 @@
import { IconButton } from '@material-ui/core'
import ErrorNotif from 'assets/icons/ico/notif_error.svg'
import PartnerIssueNotif from 'assets/icons/ico/notif_maintenance.svg'
+import classNames from 'classnames'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidState, FluidType } from 'enums'
@@ -20,50 +21,42 @@ const FluidButton = ({ fluidType, isActive }: FluidButtonProps) => {
const navigate = useNavigate()
const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
const [showError, setShowError] = useState<boolean>(false)
+ const isMulti = fluidType === FluidType.MULTIFLUID
+ const fluidName = getFluidName(fluidType)
const isConnected = useCallback(() => {
- if (fluidType === FluidType.MULTIFLUID) {
- return true
- } else return isKonnectorActive(fluidStatus, fluidType)
- }, [fluidStatus, fluidType])
+ if (isMulti) return true
+ return isKonnectorActive(fluidStatus, fluidType)
+ }, [fluidStatus, fluidType, isMulti])
const isErrored = useCallback(() => {
if (
- (fluidType !== FluidType.MULTIFLUID &&
- fluidStatus[fluidType].status === FluidState.ERROR) ||
+ (!isMulti && fluidStatus[fluidType].status === FluidState.ERROR) ||
(fluidType !== FluidType.WATER &&
- fluidStatus[fluidType].status === FluidState.ERROR_LOGIN_FAILED)
+ fluidStatus[fluidType].status === FluidState.LOGIN_FAILED)
) {
return true
}
return false
- }, [fluidStatus, fluidType])
+ }, [fluidStatus, fluidType, isMulti])
const iconType = getNavPicto(fluidType, isActive, isConnected())
const goToFluid = useCallback(async () => {
- navigate(
- fluidType === FluidType.MULTIFLUID
- ? '/consumption'
- : `/consumption/${getFluidName(fluidType)}`
- )
- }, [navigate, fluidType])
+ navigate(isMulti ? '/consumption' : `/consumption/${fluidName}`)
+ }, [navigate, isMulti, fluidName])
const isFluidMaintenance = () => fluidStatus[fluidType]?.maintenance
useEffect(() => {
// Show errors only on connected konnectors that are in error, outdated, with no data (specific case), and not in multifluid
- if (fluidType !== FluidType.MULTIFLUID && isConnected() && isErrored()) {
+ if (!isMulti && isConnected() && isErrored()) {
setShowError(true)
}
- }, [fluidStatus, fluidType, isConnected, isErrored])
+ }, [fluidStatus, fluidType, isConnected, isErrored, isMulti])
+
return (
- <IconButton
- className={`fluid-title fluid-button ${FluidType[
- fluidType
- ].toLowerCase()}`}
- onClick={goToFluid}
- >
+ <IconButton className="fluid-title fluid-button" onClick={goToFluid}>
<StyledIcon
className="fluid-icon"
icon={iconType}
@@ -81,11 +74,11 @@ const FluidButton = ({ fluidType, isActive }: FluidButtonProps) => {
)
)}
<div
- className={`fluid-title ${getFluidName(fluidType)} ${
- isActive && 'active'
- } text-14-normal`}
+ className={classNames('fluid-title text-14-normal', {
+ active: isActive,
+ })}
>
- {t(`FLUID.${FluidType[fluidType]}.LABEL`)}
+ {t(`FLUID.${fluidName.toLocaleUpperCase()}.LABEL`)}
</div>
</IconButton>
)
diff --git a/src/components/Consumption/FluidButtons/__snapshots__/FluidButton.spec.tsx.snap b/src/components/Consumption/FluidButtons/__snapshots__/FluidButton.spec.tsx.snap
index fe1b616b62680d6c6b7ee1b248b93117710d356b..8c24c5c5e4a9ee60a15420631cef7af09d6dfdd7 100644
--- a/src/components/Consumption/FluidButtons/__snapshots__/FluidButton.spec.tsx.snap
+++ b/src/components/Consumption/FluidButtons/__snapshots__/FluidButton.spec.tsx.snap
@@ -3,7 +3,7 @@
exports[`FluidButton component should be rendered correctly 1`] = `
<div>
<button
- class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button electricity"
+ class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button"
tabindex="0"
type="button"
>
@@ -21,7 +21,7 @@ exports[`FluidButton component should be rendered correctly 1`] = `
/>
</svg>
<div
- class="fluid-title electricity false text-14-normal"
+ class="fluid-title text-14-normal"
>
FLUID.ELECTRICITY.LABEL
</div>
diff --git a/src/components/Consumption/FluidButtons/__snapshots__/FluidButtons.spec.tsx.snap b/src/components/Consumption/FluidButtons/__snapshots__/FluidButtons.spec.tsx.snap
index d7c42349c2df0fcf66d258cf58ac289aee11f4da..271a057e4ab171d41a738c46816f606037038603 100644
--- a/src/components/Consumption/FluidButtons/__snapshots__/FluidButtons.spec.tsx.snap
+++ b/src/components/Consumption/FluidButtons/__snapshots__/FluidButtons.spec.tsx.snap
@@ -9,7 +9,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
class="content"
>
<button
- class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button multifluid"
+ class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button"
tabindex="0"
type="button"
>
@@ -27,7 +27,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</svg>
<div
- class="fluid-title multifluid false text-14-normal"
+ class="fluid-title text-14-normal"
>
FLUID.MULTIFLUID.LABEL
</div>
@@ -37,7 +37,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</button>
<button
- class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button electricity"
+ class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button"
tabindex="0"
type="button"
>
@@ -55,7 +55,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</svg>
<div
- class="fluid-title electricity active text-14-normal"
+ class="fluid-title text-14-normal active"
>
FLUID.ELECTRICITY.LABEL
</div>
@@ -65,7 +65,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</button>
<button
- class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button water"
+ class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button"
tabindex="0"
type="button"
>
@@ -83,7 +83,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</svg>
<div
- class="fluid-title water false text-14-normal"
+ class="fluid-title text-14-normal"
>
FLUID.WATER.LABEL
</div>
@@ -93,7 +93,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</button>
<button
- class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button gas"
+ class="MuiButtonBase-root MuiIconButton-root fluid-title fluid-button"
tabindex="0"
type="button"
>
@@ -111,7 +111,7 @@ exports[`FluidButtons component should be rendered correctly 1`] = `
/>
</svg>
<div
- class="fluid-title gas false text-14-normal"
+ class="fluid-title text-14-normal"
>
FLUID.GAS.LABEL
</div>
diff --git a/src/components/Consumption/consumptionView.scss b/src/components/Consumption/consumptionView.scss
deleted file mode 100644
index ce636ccffbc6ca9efe5bd83c55e3a7eba6f8b436..0000000000000000000000000000000000000000
--- a/src/components/Consumption/consumptionView.scss
+++ /dev/null
@@ -1,29 +0,0 @@
-@import 'src/styles/base/breakpoint';
-@import 'src/styles/base/color';
-
-.consumptionview-loading {
- background-color: $default-background;
- height: 80vh;
- width: 100%;
- display: flex;
- justify-content: center;
- align-items: center;
-}
-.consumptionview-content {
- background-color: $default-background;
- &.--hidden {
- display: none;
- }
-}
-.konnector-section {
- background-color: $default-background;
- margin: 0 auto;
- box-sizing: border-box;
- padding-bottom: 1rem;
- max-width: 45.75rem;
- width: 100%;
- @media #{$large-phone} {
- padding-left: 1rem;
- padding-right: 1rem;
- }
-}
diff --git a/src/components/ConsumptionVisualizer/ConsumptionVisualizer.tsx b/src/components/ConsumptionVisualizer/ConsumptionVisualizer.tsx
index 3abf83ce6491136f93ef9c8e1b8c661eff2907ba..ab0e5d35ef66101aebf52175ca76c3c1f1b2779c 100644
--- a/src/components/ConsumptionVisualizer/ConsumptionVisualizer.tsx
+++ b/src/components/ConsumptionVisualizer/ConsumptionVisualizer.tsx
@@ -7,14 +7,7 @@ import { useAppSelector } from 'store/hooks'
import InfoDataConsumptionVisualizer from './InfoDataConsumptionVisualizer'
import './consumptionVisualizer.scss'
-interface ConsumptionVisualizerProps {
- fluidType: FluidType
- setActive: React.Dispatch<React.SetStateAction<boolean>>
-}
-const ConsumptionVisualizer = ({
- fluidType,
- setActive,
-}: ConsumptionVisualizerProps) => {
+const ConsumptionVisualizer = ({ fluidType }: { fluidType: FluidType }) => {
const {
chart: { currentDatachart, currentDatachartIndex },
global: { fluidStatus, fluidTypes },
@@ -53,7 +46,6 @@ const ConsumptionVisualizer = ({
fluidType={fluidType}
dataload={dataload}
compareDataload={compareDataload}
- setActive={setActive}
/>
<div className="consumptionvisualizer-info">
<InfoDataConsumptionVisualizer
diff --git a/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.spec.tsx b/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.spec.tsx
index b3c3b46eaefb8309acf47d6d73350e92f672bf24..e0afcdfbd52fa876d4cb2a597f6d8055a1021657 100644
--- a/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.spec.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.spec.tsx
@@ -51,7 +51,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.ELECTRICITY}
dataload={baseDataLoad}
compareDataload={baseDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -65,7 +64,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.ELECTRICITY}
dataload={null as unknown as Dataload}
compareDataload={baseDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -81,7 +79,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.ELECTRICITY}
dataload={{ ...baseDataLoad, date: DateTime.local(9999, 1, 1) }}
compareDataload={baseDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -99,7 +96,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.ELECTRICITY}
dataload={{ ...baseDataLoad, state: DataloadState.MISSING }}
compareDataload={baseDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -116,7 +112,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.MULTIFLUID}
dataload={baseMultiFluidDataLoad}
compareDataload={null}
- setActive={jest.fn()}
/>
</BrowserRouter>
</Provider>
@@ -135,7 +130,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.WATER}
dataload={baseDataLoad}
compareDataload={emptyDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -154,7 +148,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.WATER}
dataload={baseDataLoad}
compareDataload={baseDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -168,7 +161,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.MULTIFLUID}
dataload={dataLoadWithValueDetailEmpty}
compareDataload={emptyDataLoad}
- setActive={jest.fn()}
/>
</Provider>
)
@@ -191,7 +183,6 @@ describe('Dataload consumption visualizer component', () => {
fluidType={FluidType.MULTIFLUID}
dataload={dataLoadWithValueDetail}
compareDataload={emptyDataLoad}
- setActive={jest.fn()}
/>
</BrowserRouter>
</Provider>
diff --git a/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.tsx b/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.tsx
index b7bc960a35d140af1f14870a7c04f70b0006a962..6e38fa737e66acd5e9baa6ccac631f1b373ffe12 100644
--- a/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadConsumptionVisualizer.tsx
@@ -1,7 +1,7 @@
import { DataloadSectionType, DataloadState, FluidType } from 'enums'
import { DateTime } from 'luxon'
import { Dataload } from 'models'
-import React, { useCallback, useState } from 'react'
+import React, { useState } from 'react'
import { useAppSelector } from 'store/hooks'
import DataloadNoValue from './DataloadNoValue'
import DataloadSection from './DataloadSection'
@@ -12,19 +12,15 @@ interface DataloadConsumptionVisualizerProps {
fluidType: FluidType
dataload: Dataload
compareDataload: Dataload | null
- setActive: React.Dispatch<React.SetStateAction<boolean>>
}
const DataloadConsumptionVisualizer = ({
fluidType,
dataload,
compareDataload,
- setActive,
}: DataloadConsumptionVisualizerProps) => {
const { showCompare } = useAppSelector(state => state.ecolyo.chart)
const [openEstimationModal, setOpenEstimationModal] = useState<boolean>(false)
- const toggleEstimationModal = useCallback(() => {
- setOpenEstimationModal(prev => !prev)
- }, [])
+ const toggleEstimationModal = () => setOpenEstimationModal(prev => !prev)
if (!dataload || dataload.date > DateTime.local()) {
return <div className="dataloadvisualizer-root" />
@@ -39,11 +35,7 @@ const DataloadConsumptionVisualizer = ({
) {
return (
<div className="dataloadvisualizer-root">
- <DataloadNoValue
- dataload={dataload}
- setActive={setActive}
- fluidType={fluidType}
- />
+ <DataloadNoValue dataload={dataload} fluidType={fluidType} />
</div>
)
}
diff --git a/src/components/ConsumptionVisualizer/DataloadNoValue.spec.tsx b/src/components/ConsumptionVisualizer/DataloadNoValue.spec.tsx
index 4045300323387423250a533581a554488d9d6b0a..a270965bd3f07f817384b2ee62920df46f23bd5b 100644
--- a/src/components/ConsumptionVisualizer/DataloadNoValue.spec.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadNoValue.spec.tsx
@@ -1,18 +1,31 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { DataloadState, FluidType } from 'enums'
import React from 'react'
+import { Provider } from 'react-redux'
+import * as storeHooks from 'store/hooks'
import { baseDataLoad } from 'tests/__mocks__/chartData.mock'
+import { createMockEcolyoStore } from 'tests/__mocks__/store'
import DataloadNoValue from './DataloadNoValue'
+const mockDispatch = jest.fn()
+jest.spyOn(storeHooks, 'useAppDispatch').mockImplementation(() => mockDispatch)
+
describe('DataloadNoValue component', () => {
+ const store = createMockEcolyoStore()
+
+ beforeEach(() => {
+ jest.clearAllMocks()
+ })
+
it('should render correctly', () => {
const { container } = render(
- <DataloadNoValue
- dataload={baseDataLoad}
- fluidType={FluidType.ELECTRICITY}
- setActive={jest.fn()}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={baseDataLoad}
+ fluidType={FluidType.ELECTRICITY}
+ />
+ </Provider>
)
expect(container).toMatchSnapshot()
})
@@ -21,11 +34,12 @@ describe('DataloadNoValue component', () => {
it('case state EMPTY', () => {
const mockDataLoad = { ...baseDataLoad, state: DataloadState.EMPTY }
render(
- <DataloadNoValue
- dataload={mockDataLoad}
- fluidType={FluidType.ELECTRICITY}
- setActive={jest.fn()}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={mockDataLoad}
+ fluidType={FluidType.ELECTRICITY}
+ />
+ </Provider>
)
expect(
screen.getByText('consumption_visualizer.no_data')
@@ -34,11 +48,12 @@ describe('DataloadNoValue component', () => {
it('case state HOLE', () => {
const mockDataLoad = { ...baseDataLoad, state: DataloadState.HOLE }
render(
- <DataloadNoValue
- dataload={mockDataLoad}
- fluidType={FluidType.ELECTRICITY}
- setActive={jest.fn()}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={mockDataLoad}
+ fluidType={FluidType.ELECTRICITY}
+ />
+ </Provider>
)
expect(
screen.getByText('consumption_visualizer.no_data')
@@ -50,11 +65,12 @@ describe('DataloadNoValue component', () => {
state: DataloadState.AGGREGATED_EMPTY,
}
render(
- <DataloadNoValue
- dataload={mockDataLoad}
- fluidType={FluidType.MULTIFLUID}
- setActive={jest.fn()}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={mockDataLoad}
+ fluidType={FluidType.MULTIFLUID}
+ />
+ </Provider>
)
expect(
screen.getByText('consumption_visualizer.no_data')
@@ -66,11 +82,12 @@ describe('DataloadNoValue component', () => {
it('case state MISSING', () => {
const mockDataLoad = { ...baseDataLoad, state: DataloadState.MISSING }
render(
- <DataloadNoValue
- dataload={mockDataLoad}
- fluidType={FluidType.ELECTRICITY}
- setActive={jest.fn()}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={mockDataLoad}
+ fluidType={FluidType.ELECTRICITY}
+ />
+ </Provider>
)
expect(
screen.getByText('consumption_visualizer.missing_data')
@@ -82,11 +99,12 @@ describe('DataloadNoValue component', () => {
state: DataloadState.AGGREGATED_HOLE_OR_MISSING,
}
render(
- <DataloadNoValue
- dataload={mockDataLoad}
- fluidType={FluidType.MULTIFLUID}
- setActive={jest.fn()}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={mockDataLoad}
+ fluidType={FluidType.MULTIFLUID}
+ />
+ </Provider>
)
expect(
screen.getByText('consumption_visualizer.missing_data')
@@ -94,17 +112,23 @@ describe('DataloadNoValue component', () => {
})
})
- it('should call setActive when missing message is clicked', async () => {
- const mockSetActive = jest.fn()
- const mockDataLoad = { ...baseDataLoad, state: DataloadState.MISSING }
+ it('should call dispatch to show konnector details when missing message is clicked', async () => {
render(
- <DataloadNoValue
- dataload={mockDataLoad}
- fluidType={FluidType.ELECTRICITY}
- setActive={mockSetActive}
- />
+ <Provider store={store}>
+ <DataloadNoValue
+ dataload={{ ...baseDataLoad, state: DataloadState.MISSING }}
+ fluidType={FluidType.ELECTRICITY}
+ />
+ </Provider>
)
- await userEvent.click(screen.getByRole('button'))
- expect(mockSetActive).toHaveBeenCalledWith(true)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('consumption_visualizer.missing_data')
+ )
+ })
+ expect(mockDispatch).toHaveBeenCalledWith({
+ type: 'chart/setShowConnectionDetails',
+ payload: true,
+ })
})
})
diff --git a/src/components/ConsumptionVisualizer/DataloadNoValue.tsx b/src/components/ConsumptionVisualizer/DataloadNoValue.tsx
index 3c55e9ed03502b456ecf0c5de3a4923ac3c8cb5d..7598813152c06aaa5ab6fc6d841cc15c10b2af0f 100644
--- a/src/components/ConsumptionVisualizer/DataloadNoValue.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadNoValue.tsx
@@ -3,23 +3,23 @@ import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { DataloadState, FluidType } from 'enums'
import { Dataload } from 'models'
import React, { useCallback } from 'react'
+import { setShowConnectionDetails } from 'store/chart/chart.slice'
+import { useAppDispatch } from 'store/hooks'
+import { getFluidName } from 'utils/utils'
import './consumptionVisualizer.scss'
interface DataloadNoValueProps {
dataload: Dataload
fluidType: FluidType
- setActive: React.Dispatch<React.SetStateAction<boolean>>
}
-const DataloadNoValue = ({
- dataload,
- fluidType,
- setActive,
-}: DataloadNoValueProps) => {
+const DataloadNoValue = ({ dataload, fluidType }: DataloadNoValueProps) => {
const { t } = useI18n()
+ const dispatch = useAppDispatch()
+ const fluidName = getFluidName(fluidType)
- const handleToggleKonnectionCard = useCallback(() => {
- setActive(true)
+ const handleToggleKonnectorCard = useCallback(() => {
+ dispatch(setShowConnectionDetails(true))
const app = document.querySelector('.app-content')
const content = document.querySelector('.content-view')
if (content && app) {
@@ -37,7 +37,7 @@ const DataloadNoValue = ({
})
}, 300)
}
- }, [setActive])
+ }, [dispatch])
if (
dataload.state === DataloadState.EMPTY ||
@@ -47,11 +47,7 @@ const DataloadNoValue = ({
return (
<div className="dataloadvisualizer-content text-22-normal">
<div className="dataloadvisualizer-section">
- <div
- className={`dataloadvisualizer-value ${FluidType[
- fluidType
- ].toLowerCase()} upper`}
- >
+ <div className={`dataloadvisualizer-value ${fluidName} upper`}>
{t('consumption_visualizer.no_data')}
</div>
</div>
@@ -65,7 +61,7 @@ const DataloadNoValue = ({
) {
return (
<Button
- onClick={handleToggleKonnectionCard}
+ onClick={handleToggleKonnectorCard}
classes={{ root: 'btnText', label: 'text-22-normal' }}
>
{t('consumption_visualizer.missing_data')}
@@ -76,11 +72,7 @@ const DataloadNoValue = ({
return (
<div className="dataloadvisualizer-content text-22-normal">
<div className="dataloadvisualizer-section">
- <div
- className={`dataloadvisualizer-value ${FluidType[
- fluidType
- ].toLowerCase()} upper to-come`}
- >
+ <div className={`dataloadvisualizer-value ${fluidName} upper to-come`}>
{t('consumption_visualizer.data_to_come')}
</div>
</div>
diff --git a/src/components/ConsumptionVisualizer/DataloadSection.tsx b/src/components/ConsumptionVisualizer/DataloadSection.tsx
index 16d52ce901cad4382a9606699a12cc0853b53ba8..84a6185eefcd99189f94671696fb370539330759 100644
--- a/src/components/ConsumptionVisualizer/DataloadSection.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadSection.tsx
@@ -21,17 +21,17 @@ const DataloadSection = ({
toggleEstimationModal,
}: DataloadSectionProps) => {
const { t } = useI18n()
+ const isLeft = dataloadSectionType === DataloadSectionType.LEFT
+ const isRight = dataloadSectionType === DataloadSectionType.RIGHT
+ const noCompare = dataloadSectionType === DataloadSectionType.NO_COMPARE
+ const isMulti = fluidType === FluidType.MULTIFLUID
+ const fluidName = getFluidName(fluidType)
- if (
- dataload.value === -1 &&
- dataloadSectionType === DataloadSectionType.LEFT
- ) {
+ if (dataload.value === -1 && isLeft) {
return (
<div className="dataloadvisualizer-section dataloadvisualizer-section-left-novalue">
<div
- className={`dataloadvisualizer-novalue ${FluidType[
- fluidType
- ].toLowerCase()}-compare text-20-normal`}
+ className={`dataloadvisualizer-novalue ${fluidName}-compare text-20-normal`}
>
{t('consumption_visualizer.no_data')}
</div>
@@ -39,12 +39,6 @@ const DataloadSection = ({
)
}
- const isLeft = dataloadSectionType === DataloadSectionType.LEFT
- const isRight = dataloadSectionType === DataloadSectionType.RIGHT
- const noCompare = dataloadSectionType === DataloadSectionType.NO_COMPARE
- const isMulti = fluidType === FluidType.MULTIFLUID
- const fluidName = getFluidName(fluidType)
-
return (
<div
className={classNames('dataloadvisualizer-section', {
diff --git a/src/components/ConsumptionVisualizer/DataloadSectionValue.spec.tsx b/src/components/ConsumptionVisualizer/DataloadSectionValue.spec.tsx
index 4b9d037bbc525929eaa3ba0fa2b1cf77b3d9cdb0..3661724c30e2e89bb0dd5b32c13c437fae2dfab4 100644
--- a/src/components/ConsumptionVisualizer/DataloadSectionValue.spec.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadSectionValue.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { DataloadSectionType, FluidType } from 'enums'
import { Dataload } from 'models'
@@ -88,7 +88,11 @@ describe('DataloadSectionValue component', () => {
toggleEstimationModal={mockToggleEstimationModal}
/>
)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('consumption_visualizer.estimated')
+ )
+ })
expect(mockToggleEstimationModal).toHaveBeenCalled()
})
})
diff --git a/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx b/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx
index cfb77c138b854bcbd7d459aea4ffd44d84351c1a..77e227da2ad89bcde169a42729c620e712c8955a 100644
--- a/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx
+++ b/src/components/ConsumptionVisualizer/DataloadSectionValue.tsx
@@ -3,7 +3,7 @@ import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { DataloadSectionType, FluidType } from 'enums'
import { Dataload } from 'models'
import React from 'react'
-import { formatNumberValues } from 'utils/utils'
+import { formatNumberValues, getFluidName } from 'utils/utils'
interface DataloadSectionValueProps {
dataload: Dataload
@@ -19,13 +19,14 @@ const DataloadSectionValue = ({
toggleEstimationModal,
}: DataloadSectionValueProps) => {
const { t } = useI18n()
+ const FLUIDNAME = getFluidName(fluidType).toUpperCase()
if (fluidType === FluidType.MULTIFLUID) {
return (
<>
{formatNumberValues(dataload.value)}
<div className="text-18-normal euroUnit">
- {t(`FLUID.${FluidType[fluidType]}.UNIT`)}
+ {t(`FLUID.${FLUIDNAME}.UNIT`)}
</div>
{dataloadSectionType === DataloadSectionType.NO_COMPARE && (
<Button
@@ -43,27 +44,21 @@ const DataloadSectionValue = ({
)
}
- const formattedValue = formatNumberValues(
- dataload.value,
- FluidType[fluidType],
- true
- )
+ const formattedValue = formatNumberValues(dataload.value, FLUIDNAME, true)
return (
<>
{Number(formattedValue) >= 1000 ? (
<>
- {formatNumberValues(dataload.value, FluidType[fluidType])}
+ {formatNumberValues(dataload.value, FLUIDNAME)}
<span className="text-18-normal">
- {t(`FLUID.${FluidType[fluidType]}.MEGAUNIT`)}
+ {t(`FLUID.${FLUIDNAME}.MEGAUNIT`)}
</span>
</>
) : (
<>
{formatNumberValues(dataload.value)}
- <span className="text-18-normal">
- {t(`FLUID.${FluidType[fluidType]}.UNIT`)}
- </span>
+ <span className="text-18-normal">{t(`FLUID.${FLUIDNAME}.UNIT`)}</span>
</>
)}
</>
diff --git a/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.spec.tsx b/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.spec.tsx
index 5c2018b0bdf54affb32cc73edda5c72f6954ecb3..4c6660d40956aaa653649e0b93d0064038c68592 100644
--- a/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.spec.tsx
+++ b/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { DataloadState, FluidType } from 'enums'
import { DateTime } from 'luxon'
@@ -189,7 +189,7 @@ describe('InfoDataConsumptionVisualizer component', () => {
})
it('should click on last valid data date and move to it', async () => {
- const mockDataLoad = { ...baseDataLoad, state: DataloadState.EMPTY }
+ const mockDataLoad = { ...baseDataLoad, state: DataloadState.UPCOMING }
render(
<Provider store={store}>
<InfoDataConsumptionVisualizer
@@ -199,8 +199,12 @@ describe('InfoDataConsumptionVisualizer component', () => {
/>
</Provider>
)
- await userEvent.click(screen.getByRole('button'))
- expect(screen.getByRole('dialog')).toBeInTheDocument()
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('consumption_visualizer.last_available_data')
+ )
+ })
+ expect(mockAppDispatch).toHaveBeenCalled()
})
it('should click to display NoDataModal', async () => {
@@ -214,7 +218,11 @@ describe('InfoDataConsumptionVisualizer component', () => {
/>
</Provider>
)
- await userEvent.click(screen.getByRole('button'))
- expect(mockAppDispatch).toHaveBeenCalled()
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('consumption_visualizer.why_no_data')
+ )
+ })
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
})
})
diff --git a/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.tsx b/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.tsx
index f88a939c5fd228261016f74c02f0c3a674a14e70..c3a9b1a081b4970ac190095e3b995594a8d4ab08 100644
--- a/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.tsx
+++ b/src/components/ConsumptionVisualizer/InfoDataConsumptionVisualizer.tsx
@@ -1,12 +1,10 @@
import { Button } from '@material-ui/core'
+import { useMoveToLatestDate } from 'components/Hooks/useMoveToDate'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { DataloadState, FluidType } from 'enums'
import { DateTime } from 'luxon'
import { Dataload } from 'models'
-import React, { useCallback, useState } from 'react'
-import DateChartService from 'services/dateChart.service'
-import { setCurrentIndex, setSelectedDate } from 'store/chart/chart.slice'
-import { useAppDispatch, useAppSelector } from 'store/hooks'
+import React, { useState } from 'react'
import NoDataModal from './NoDataModal'
import './infoDataConsumptionVisualizer.scss'
@@ -22,25 +20,8 @@ const InfoDataConsumptionVisualizer = ({
lastDataDate,
}: InfoDataConsumptionVisualizerProps) => {
const { t } = useI18n()
- const dispatch = useAppDispatch()
- const { currentTimeStep } = useAppSelector(state => state.ecolyo.chart)
const [openNoDataModal, setOpenNoDataModal] = useState<boolean>(false)
-
- const toggleNoDataModal = useCallback(() => {
- setOpenNoDataModal(prev => !prev)
- }, [])
-
- const moveToDate = () => {
- if (lastDataDate) {
- const dateChartService = new DateChartService()
- const updatedIndex = dateChartService.defineDateIndex(
- currentTimeStep,
- lastDataDate
- )
- dispatch(setSelectedDate(lastDataDate))
- dispatch(setCurrentIndex(updatedIndex))
- }
- }
+ const { moveToLatestDate } = useMoveToLatestDate(lastDataDate)
if (!dataload) {
return <></>
@@ -60,7 +41,7 @@ const InfoDataConsumptionVisualizer = ({
? 'last_valid_data_multi'
: 'last_available_data'
return (
- <Button className="btnText" onClick={moveToDate}>
+ <Button className="btnText" onClick={moveToLatestDate}>
{t(`consumption_visualizer.${key}`, {
date: lastDate,
})}
@@ -75,14 +56,14 @@ const InfoDataConsumptionVisualizer = ({
) {
return (
<>
- <Button className="btnText" onClick={toggleNoDataModal}>
+ <Button className="btnText" onClick={() => setOpenNoDataModal(true)}>
<span className="text-16-normal underlined-error">
{t('consumption_visualizer.why_no_data')}
</span>
</Button>
<NoDataModal
open={openNoDataModal}
- handleCloseClick={toggleNoDataModal}
+ handleCloseClick={() => setOpenNoDataModal(false)}
/>
</>
)
diff --git a/src/components/Content/Content.tsx b/src/components/Content/Content.tsx
index c3674fab4235568755913bb00c4ff131373ea883..f30e26160617fbeb18479fcec8327522b93e548a 100644
--- a/src/components/Content/Content.tsx
+++ b/src/components/Content/Content.tsx
@@ -4,14 +4,12 @@ import React, { useEffect } from 'react'
import { changeScreenType } from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import './content.scss'
-interface ContentProps {
- children: React.ReactNode
- heightOffset?: number
-}
-const Content = ({ children, heightOffset = 0 }: ContentProps) => {
+const Content = ({ children }: { children: React.ReactNode }) => {
const dispatch = useAppDispatch()
- const { screenType } = useAppSelector(state => state.ecolyo.global)
+ const { screenType, headerHeight } = useAppSelector(
+ state => state.ecolyo.global
+ )
const cozyBarHeight = 48
const cozyNavHeight = 56
@@ -44,11 +42,11 @@ const Content = ({ children, heightOffset = 0 }: ContentProps) => {
<div
className="content-view"
style={{
- marginTop: heightOffset,
+ marginTop: headerHeight,
paddingBottom: 0,
minHeight:
screenType !== ScreenType.DESKTOP
- ? `calc(100vh - ${heightOffset}px - ${cozyBarHeight}px - ${cozyNavHeight}px - env(safe-area-inset-top) - env(safe-area-inset-bottom) - env(safe-area-inset-bottom))`
+ ? `calc(100vh - ${headerHeight}px - ${cozyBarHeight}px - ${cozyNavHeight}px - env(safe-area-inset-top) - env(safe-area-inset-bottom) - env(safe-area-inset-bottom))`
: `unset`,
}}
>
diff --git a/src/components/Content/__snapshots__/Content.spec.tsx.snap b/src/components/Content/__snapshots__/Content.spec.tsx.snap
index 9fc72e1b3ca438b10ddb746aec2a30352432ed49..608a28e19dae437364ac8de19f5e836218911dc5 100644
--- a/src/components/Content/__snapshots__/Content.spec.tsx.snap
+++ b/src/components/Content/__snapshots__/Content.spec.tsx.snap
@@ -4,7 +4,7 @@ exports[`Content component should match snapshot 1`] = `
<div>
<div
class="content-view"
- style="margin-top: 0px; padding-bottom: 0px; min-height: calc(100vh - 0px - 48px - 56px - env(safe-area-inset-top) - env(safe-area-inset-bottom) - env(safe-area-inset-bottom));"
+ style="margin-top: 62px; padding-bottom: 0px; min-height: calc(100vh - 62px - 48px - 56px - env(safe-area-inset-top) - env(safe-area-inset-bottom) - env(safe-area-inset-bottom));"
>
children
</div>
diff --git a/src/components/CustomPopup/CustomPopupModal.spec.tsx b/src/components/CustomPopup/CustomPopupModal.spec.tsx
index 357565d456e0d360ec9ad0730cafe63ed2b17ed4..5f3786a07ae9a3ee5fa7a06262232da12879cc40 100644
--- a/src/components/CustomPopup/CustomPopupModal.spec.tsx
+++ b/src/components/CustomPopup/CustomPopupModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import {
@@ -11,13 +11,14 @@ import CustomPopupModal from './CustomPopupModal'
const mockHandleClose = jest.fn()
describe('CustomPopupModal component', () => {
- it('should render correctly', () => {
- const { baseElement } = render(
+ it('should render correctly', async () => {
+ const { baseElement, container } = render(
<CustomPopupModal
customPopup={mockCustomPopup}
handleCloseClick={mockHandleClose}
/>
)
+ await waitFor(() => null, { container })
expect(baseElement).toMatchSnapshot()
})
@@ -36,24 +37,26 @@ describe('CustomPopupModal component', () => {
expect(screen.getByRole('img')).toBeInTheDocument()
})
- it('should not be rendered, popup not enabled', () => {
- render(
+ it('should not be rendered, popup not enabled', async () => {
+ const { container } = render(
<CustomPopupModal
customPopup={mockCustomPopupOff}
handleCloseClick={mockHandleClose}
/>
)
+ await waitFor(() => null, { container })
const modal = screen.queryByTestId('title')
expect(modal).not.toBeInTheDocument()
})
- it('should not be rendered, popup outdated', () => {
- render(
+ it('should not be rendered, popup outdated', async () => {
+ const { container } = render(
<CustomPopupModal
customPopup={mockCustomPopupOutdated}
handleCloseClick={mockHandleClose}
/>
)
+ await waitFor(() => null, { container })
const modal = screen.queryByTestId('title')
expect(modal).not.toBeInTheDocument()
})
@@ -65,9 +68,11 @@ describe('CustomPopupModal component', () => {
handleCloseClick={mockHandleClose}
/>
)
- await userEvent.click(
- screen.getByText('consumption.partner_issue_modal.ok')
- )
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('consumption.partner_issue_modal.ok')
+ )
+ })
expect(mockHandleClose).toHaveBeenCalled()
})
})
diff --git a/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap b/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap
index e145623144afc9a9613a33fdbb3d64e1874246a6..eaf9112489058b5343173335bd0e8254e9578380 100644
--- a/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap
+++ b/src/components/CustomPopup/__snapshots__/CustomPopupModal.spec.tsx.snap
@@ -71,7 +71,7 @@ exports[`CustomPopupModal component should render correctly 1`] = `
width="100"
>
<use
- xlink:href="#"
+ xlink:href="#test-file-stub"
/>
</svg>
<div
diff --git a/src/components/DateNavigator/DateNavigator.spec.tsx b/src/components/DateNavigator/DateNavigator.spec.tsx
index 1708d74e8b7efe019174f6b90eddb8126c5acab5..9d19aca3820b73cde756941e61b9b8c4535196ce 100644
--- a/src/components/DateNavigator/DateNavigator.spec.tsx
+++ b/src/components/DateNavigator/DateNavigator.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { TimeStep } from 'enums'
import { DateTime } from 'luxon'
@@ -44,11 +44,17 @@ describe('DateNavigator component', () => {
timeStep={TimeStep.MONTH}
/>
)
- const [prevIcon, nextIcon] = screen.getAllByRole('button')
- await userEvent.click(prevIcon)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('consumption.accessibility.button_previous_value')
+ )
+ })
expect(mockHandlePrevDate).toHaveBeenCalledTimes(1)
-
- await userEvent.click(nextIcon)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('consumption.accessibility.button_next_value')
+ )
+ })
expect(mockHandleNextDate).toHaveBeenCalledTimes(1)
})
@@ -63,8 +69,13 @@ describe('DateNavigator component', () => {
timeStep={TimeStep.MONTH}
/>
)
- const [prevIcon, nextButton] = screen.getAllByRole('button')
- expect(prevIcon).toBeDisabled()
- expect(nextButton).toBeDisabled()
+ const prev = screen.queryByLabelText(
+ 'consumption.accessibility.button_previous_value'
+ )
+ const next = screen.queryByLabelText(
+ 'consumption.accessibility.button_next_value'
+ )
+ expect(prev).toBeDisabled()
+ expect(next).toBeDisabled()
})
})
diff --git a/src/components/Duel/DuelChart/DuelBar.tsx b/src/components/Duel/DuelChart/DuelBar.tsx
index a23d20f574bc89df850b1a9ed20f4cdca8e53a2b..d90ebddcefa7d14d1763717c7768601a6f7bb6e9 100644
--- a/src/components/Duel/DuelChart/DuelBar.tsx
+++ b/src/components/Duel/DuelChart/DuelBar.tsx
@@ -1,7 +1,7 @@
import AxisBottom from 'components/Charts/AxisBottom'
import AxisRight from 'components/Charts/AxisRight'
import Bar from 'components/Charts/Bar'
-import UncomingBar from 'components/Charts/UncomingBar'
+import UpcomingBar from 'components/Charts/UpcomingBar'
import { scaleBand, ScaleBand, scaleLinear, ScaleLinear } from 'd3-scale'
import { FluidType, TimeStep } from 'enums'
import { DateTime } from 'luxon'
@@ -116,7 +116,7 @@ const DuelBar = ({
)
} else {
return (
- <UncomingBar
+ <UpcomingBar
key={d.date.toISO()}
index={index}
dataload={d}
diff --git a/src/components/Duel/DuelChart/DuelChart.tsx b/src/components/Duel/DuelChart/DuelChart.tsx
index 993328d4911ba67af59cc6318e38ef791c96301a..e0baa475bf6673b4d7b6e9b89fd305e2c0ecc8f7 100644
--- a/src/components/Duel/DuelChart/DuelChart.tsx
+++ b/src/components/Duel/DuelChart/DuelChart.tsx
@@ -1,7 +1,7 @@
import DuelBar from 'components/Duel/DuelChart/DuelBar'
import { TimeStep } from 'enums'
import { Dataload, UserChallenge } from 'models'
-import React, { useEffect, useState } from 'react'
+import React from 'react'
import './duelChart.scss'
interface DuelChartProps {
@@ -17,11 +17,8 @@ const DuelChart = ({
width,
height,
}: DuelChartProps) => {
- const [average, setAverage] = useState<number>(0)
-
- useEffect(() => {
- setAverage(userChallenge.duel.threshold / userChallenge.duel.duration.days)
- }, [userChallenge.duel.duration.days, userChallenge.duel.threshold])
+ const average =
+ userChallenge.duel.threshold / userChallenge.duel.duration.days
return (
<div className="fs-slide">
diff --git a/src/components/Duel/DuelEmptyValueModal/DuelEmptyValueModal.tsx b/src/components/Duel/DuelEmptyValueModal/DuelEmptyValueModal.tsx
index 70e1f0261ac08777fe51fd2e49d15184c91da5a0..dd86dc0108170aad9557cd376125248668685ba5 100644
--- a/src/components/Duel/DuelEmptyValueModal/DuelEmptyValueModal.tsx
+++ b/src/components/Duel/DuelEmptyValueModal/DuelEmptyValueModal.tsx
@@ -18,6 +18,7 @@ const DuelEmptyValueModal = ({
}: DuelEmptyValueModalProps) => {
const { t } = useI18n()
const [emptyIcon, setEmptyIcon] = useState<string>(defaultIcon)
+
useEffect(() => {
async function handleEcogestureIcon() {
const icon = await importIconById('emptyValue', 'duel')
diff --git a/src/components/Duel/DuelError/DuelError.tsx b/src/components/Duel/DuelError/DuelError.tsx
index 6d9f119e6740e2b8bda49f8c02c8652400a3a524..0580715cbf343fc7a447a99586c0fd0f9116e380 100644
--- a/src/components/Duel/DuelError/DuelError.tsx
+++ b/src/components/Duel/DuelError/DuelError.tsx
@@ -1,6 +1,6 @@
import Button from '@material-ui/core/Button'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import React, { useCallback } from 'react'
+import React from 'react'
import { useNavigate } from 'react-router-dom'
import './duelError.scss'
@@ -8,17 +8,13 @@ const DuelError = () => {
const { t } = useI18n()
const navigate = useNavigate()
- const goBack = useCallback(() => {
- navigate(-1)
- }, [navigate])
-
return (
<div className="duel-error-container">
<div className="duel-error-message">{t('duel.global_error')}</div>
<div className="duel-error-button">
<Button
aria-label={t('duel.accessibility.button_go_back')}
- onClick={goBack}
+ onClick={() => navigate(-1)}
className="btnSecondary"
>
{t('duel.button_go_back')}
diff --git a/src/components/Duel/DuelOngoing/DuelOngoing.tsx b/src/components/Duel/DuelOngoing/DuelOngoing.tsx
index d0ea2a2b03882d64ee2de72e8a864fcd7824626d..8dc0b7cbb6e73d47f36bf00b3188dfe581ed3761 100644
--- a/src/components/Duel/DuelOngoing/DuelOngoing.tsx
+++ b/src/components/Duel/DuelOngoing/DuelOngoing.tsx
@@ -58,7 +58,6 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
const average = formatNumberValues(userChallenge.duel.threshold).toString()
const setResult = useCallback(async () => {
- const challengeService = new ChallengeService(client)
const updatedChallenge = await challengeService.updateUserChallenge(
userChallenge,
winChallenge
@@ -74,7 +73,14 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
} else {
navigate('/challenges')
}
- }, [client, userChallenge, winChallenge, dispatch, isLastDuel, navigate])
+ }, [
+ challengeService,
+ userChallenge,
+ winChallenge,
+ dispatch,
+ isLastDuel,
+ navigate,
+ ])
useEffect(() => {
let subscribed = true
@@ -98,7 +104,7 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
let subscribed = true
async function populateData() {
if (isFinished) {
- const dataloads: Dataload[] =
+ const dataloads =
await challengeService.getUserChallengeDataload(userChallenge)
if (subscribed) {
setFinishedDataLoad(dataloads)
@@ -122,7 +128,7 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
: t('duel.goal_failed')}
</div>
) : (
- <div className="duel-goal text-18-normal">
+ <div className="duel-goal text-18-bold">
{t('duel.goal1', {
durationInDays: duel.duration.days,
})}
@@ -144,14 +150,14 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
height={height}
/>
</div>
- <div className="duel-chart-caption text-15-normal">
+ <div className="duel-chart-caption">
<div className="duel-caption">
<StyledIcon
className="caption-icon"
icon={CaptionAverageIcon}
size={25}
/>
- <div className="caption-label">{t('duel.caption_average')}</div>
+ <span>{t('duel.caption_average')}</span>
</div>
<div className="duel-caption">
<StyledIcon
@@ -159,7 +165,7 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
icon={CaptionConsumptionIcon}
size={25}
/>
- <div className="caption-label">{t('duel.caption_consumption')}</div>
+ <span>{t('duel.caption_consumption')}</span>
</div>
<div className="duel-caption">
<StyledIcon
@@ -167,7 +173,7 @@ const DuelOngoing = ({ userChallenge, isFinished }: DuelOngoingProps) => {
icon={CaptionIncomingIcon}
size={25}
/>
- <div className="caption-label">{t('duel.caption_incoming')}</div>
+ <span>{t('duel.caption_incoming')}</span>
</div>
</div>
</div>
diff --git a/src/components/Duel/DuelOngoing/__snapshots__/DuelOngoing.spec.tsx.snap b/src/components/Duel/DuelOngoing/__snapshots__/DuelOngoing.spec.tsx.snap
index f04488e4ae9cba174bae61d3bdba4812ef221d0d..fe911daa474b74f040df5c1ed6c79edcc1804936 100644
--- a/src/components/Duel/DuelOngoing/__snapshots__/DuelOngoing.spec.tsx.snap
+++ b/src/components/Duel/DuelOngoing/__snapshots__/DuelOngoing.spec.tsx.snap
@@ -11,7 +11,7 @@ exports[`DuelOngoing component should be rendered correctly 1`] = `
Title DUEL001
</div>
<div
- class="duel-goal text-18-normal"
+ class="duel-goal text-18-bold"
>
duel.goal1
<span>
@@ -39,7 +39,7 @@ exports[`DuelOngoing component should be rendered correctly 1`] = `
/>
</div>
<div
- class="duel-chart-caption text-15-normal"
+ class="duel-chart-caption"
>
<div
class="duel-caption"
@@ -54,11 +54,9 @@ exports[`DuelOngoing component should be rendered correctly 1`] = `
xlink:href="#test-file-stub"
/>
</svg>
- <div
- class="caption-label"
- >
+ <span>
duel.caption_average
- </div>
+ </span>
</div>
<div
class="duel-caption"
@@ -73,11 +71,9 @@ exports[`DuelOngoing component should be rendered correctly 1`] = `
xlink:href="#test-file-stub"
/>
</svg>
- <div
- class="caption-label"
- >
+ <span>
duel.caption_consumption
- </div>
+ </span>
</div>
<div
class="duel-caption"
@@ -92,11 +88,9 @@ exports[`DuelOngoing component should be rendered correctly 1`] = `
xlink:href="#test-file-stub"
/>
</svg>
- <div
- class="caption-label"
- >
+ <span>
duel.caption_incoming
- </div>
+ </span>
</div>
</div>
</div>
diff --git a/src/components/Duel/DuelOngoing/duelOngoing.scss b/src/components/Duel/DuelOngoing/duelOngoing.scss
index 27de1c0bfe3b85505e63a744e64b7d1ebbc0a43c..4e3d318dd8bcf65a1ab155d821501821fdeefed6 100644
--- a/src/components/Duel/DuelOngoing/duelOngoing.scss
+++ b/src/components/Duel/DuelOngoing/duelOngoing.scss
@@ -2,49 +2,42 @@
@import 'src/styles/base/breakpoint';
.duel-ongoing-container {
+ padding-top: 1rem;
+ padding-inline: 1rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
-}
-.duel-title {
- color: $soft-grey;
- margin-top: 1rem;
-}
-.duel-goal {
- color: $grey-bright;
- margin: 1rem 3rem;
- text-align: center;
-}
-.duel-consumption {
- color: $grey-bright;
- margin: 1rem auto;
- @media (max-width: $width-phone) {
- margin: 0.5rem auto -0.5rem;
+ gap: 1rem;
+
+ .duel-title {
+ color: $soft-grey;
}
- .consumption {
+
+ .duel-consumption .consumption {
color: $gold-light;
}
-}
-.duel-chart {
- height: 15.625rem;
- display: flex;
- align-items: center;
- justify-content: center;
- width: 80%;
-}
-.duel-chart-caption {
- display: flex;
- flex-direction: column;
- align-self: flex-start;
- .duel-caption {
+
+ .duel-chart {
+ height: 15.625rem;
display: flex;
- margin-top: 0.75rem;
- .caption-icon {
- margin: auto 1.5rem;
- }
- .caption-label {
- color: $grey-bright;
+ align-items: center;
+ justify-content: center;
+ width: 80%;
+ }
+ .duel-chart-caption {
+ display: flex;
+ flex-direction: column;
+ align-self: flex-start;
+ gap: 12px;
+ .duel-caption {
+ display: flex;
+ .caption-icon {
+ margin: auto 1.5rem;
+ }
+ span {
+ color: $grey-bright;
+ }
}
}
}
diff --git a/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx b/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx
index 2020acbf2463e81a138d16451c5542e727c618d3..60e1521ee5c96dc6b2864c1579b9e3d74da7aa67 100644
--- a/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx
+++ b/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { FluidType, UserChallengeUpdateFlag } from 'enums'
import React from 'react'
@@ -38,7 +38,7 @@ describe('DuelUnlocked component', () => {
screen.getByText(userChallengeData[1].duel.title)
).toBeInTheDocument()
expect(screen.getByText(description)).toBeInTheDocument()
- expect(screen.getByRole('button')).toBeInTheDocument()
+ expect(screen.getByText('duel.button_start')).toBeInTheDocument()
})
it('should update userChallenge when launching duel with configured fluid', async () => {
@@ -53,7 +53,9 @@ describe('DuelUnlocked component', () => {
<DuelUnlocked userChallenge={userChallengeData[0]} />
</Provider>
)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('duel.button_start'))
+ })
expect(mockUserChallengeUpdateFlag).toHaveBeenCalledWith(
userChallengeData[0],
UserChallengeUpdateFlag.DUEL_START
diff --git a/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx b/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx
index eb4ddcd86952d5ccb0eb188ceb51b8ec497ab27a..ad7693384a06ee8fcac0ac25b9e09d76896b5689 100644
--- a/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx
+++ b/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx
@@ -19,11 +19,9 @@ const DuelUnlocked = ({ userChallenge }: { userChallenge: UserChallenge }) => {
const dispatch = useAppDispatch()
const [duelIcon, setDuelIcon] = useState(defaultIcon)
- const average: string = formatNumberValues(
- userChallenge.duel.threshold
- ).toString()
- const duration: string = userChallenge.duel.duration.days.toString()
- const description: string = userChallenge.duel.description
+ const average = formatNumberValues(userChallenge.duel.threshold).toString()
+ const duration = userChallenge.duel.duration.days.toString()
+ const description = userChallenge.duel.description
.replace('#CONSUMPTION', average)
.replace('#DURATION', duration)
diff --git a/src/components/Duel/DuelView.tsx b/src/components/Duel/DuelView.tsx
index 1c60115ab09cdfac9793d86f43417f5f6763b3c2..b4004e0732b552ae5393eaa7b1ab0d8b32630ec3 100644
--- a/src/components/Duel/DuelView.tsx
+++ b/src/components/Duel/DuelView.tsx
@@ -3,7 +3,7 @@ import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import { UserDuelState } from 'enums'
import { UserChallenge } from 'models'
-import React, { useState } from 'react'
+import React from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import { useAppSelector } from 'store/hooks'
import DuelEmptyValueModal from './DuelEmptyValueModal/DuelEmptyValueModal'
@@ -14,7 +14,6 @@ import DuelUnlocked from './DuelUnlocked/DuelUnlocked'
const DuelView = () => {
const navigate = useNavigate()
const { userChallengeList } = useAppSelector(state => state.ecolyo.challenge)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const id = new URLSearchParams(useLocation().search).get('id')
const challengeToDisplay: UserChallenge | undefined = userChallengeList.find(
challenge => challenge.id === id
@@ -46,14 +45,8 @@ const DuelView = () => {
return (
<>
<CozyBar titleKey="common.title_duel" displayBackArrow={true} />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_duel"
- displayBackArrow={true}
- />
- <Content heightOffset={headerHeight}>
- {renderDuel(challengeToDisplay)}
- </Content>
+ <Header desktopTitleKey="common.title_duel" displayBackArrow={true} />
+ <Content>{renderDuel(challengeToDisplay)}</Content>
</>
)
}
diff --git a/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx b/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx
index 700c11a8efa8c5877468079223efc666210373b4..bb80e51c277159a6a86b66b005e075cc0867f08a 100644
--- a/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx
+++ b/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureEmptyList from './EcogestureEmptyList'
@@ -9,7 +9,6 @@ jest.mock('react-router-dom', () => ({
useNavigate: () => mockedNavigate,
}))
const mockChangeTab = jest.fn()
-const mockHandleClick = jest.fn()
describe('EcogestureEmptyList component', () => {
it('should be rendered correctly', () => {
@@ -18,7 +17,7 @@ describe('EcogestureEmptyList component', () => {
setTab={mockChangeTab}
isObjective={true}
isSelectionDone={false}
- handleReinitClick={mockHandleClick}
+ openResetEcogestureModal={jest.fn()}
/>
)
expect(container).toMatchSnapshot()
@@ -29,10 +28,12 @@ describe('EcogestureEmptyList component', () => {
setTab={mockChangeTab}
isObjective={false}
isSelectionDone={true}
- handleReinitClick={mockHandleClick}
+ openResetEcogestureModal={jest.fn()}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getByLabelText('ecogesture.emptyList.btn1'))
+ })
expect(mockChangeTab).toHaveBeenCalledTimes(1)
})
it('should launch ecogesture form', async () => {
@@ -41,10 +42,12 @@ describe('EcogestureEmptyList component', () => {
setTab={mockChangeTab}
isObjective={false}
isSelectionDone={false}
- handleReinitClick={mockHandleClick}
+ openResetEcogestureModal={jest.fn()}
/>
)
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(screen.getByLabelText('ecogesture.emptyList.btn2'))
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-form')
})
it('should render doing text with empty list on completed selection', () => {
@@ -53,7 +56,7 @@ describe('EcogestureEmptyList component', () => {
setTab={mockChangeTab}
isObjective={false}
isSelectionDone={true}
- handleReinitClick={mockHandleClick}
+ openResetEcogestureModal={jest.fn()}
/>
)
expect(
@@ -66,7 +69,7 @@ describe('EcogestureEmptyList component', () => {
setTab={mockChangeTab}
isObjective={true}
isSelectionDone={true}
- handleReinitClick={mockHandleClick}
+ openResetEcogestureModal={jest.fn()}
/>
)
expect(
diff --git a/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.tsx b/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.tsx
index b51c6f032edcc8c9b68cbd4b0fe82ea13d842e18..67fded06ba6c642247edc1f04b8a7696258674c3 100644
--- a/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.tsx
+++ b/src/components/Ecogesture/EcogestureEmptyList/EcogestureEmptyList.tsx
@@ -11,13 +11,13 @@ interface EcogestureEmptyListProps {
setTab: React.Dispatch<React.SetStateAction<number>>
isObjective: boolean
isSelectionDone: boolean
- handleReinitClick: () => void
+ openResetEcogestureModal: () => void
}
const EcogestureEmptyList = ({
setTab,
isObjective,
isSelectionDone,
- handleReinitClick,
+ openResetEcogestureModal,
}: EcogestureEmptyListProps) => {
const { t } = useI18n()
const navigate = useNavigate()
@@ -48,11 +48,11 @@ const EcogestureEmptyList = ({
{isSelectionDone && (
<Button
- aria-label={t('ecogesture.reinit')}
- onClick={handleReinitClick}
+ aria-label={t('ecogesture.reset')}
+ onClick={openResetEcogestureModal}
className="btnSecondary"
>
- {t('ecogesture.reinit')}
+ {t('ecogesture.reset')}
</Button>
)}
diff --git a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx
index 6ff90feae74098a6d7384f0306bebab7d0baa4ae..bd3c32ab029aa398f52dfd14ca47ef66466d871e 100644
--- a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx
+++ b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.spec.tsx
@@ -1,41 +1,54 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
+import { Provider } from 'react-redux'
+import * as storeHooks from 'store/hooks'
+import { createMockEcolyoStore } from 'tests/__mocks__/store'
import EcogestureInitModal from './EcogestureInitModal'
-const mockHandleClose = jest.fn()
-const mockHandleLaunchForm = jest.fn()
+const mockAppDispatch = jest.spyOn(storeHooks, 'useAppDispatch')
+
+const mockedNavigate = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useNavigate: () => mockedNavigate,
+}))
+
describe('EcogestureInitModal component', () => {
+ const store = createMockEcolyoStore()
+
+ beforeEach(() => {
+ jest.clearAllMocks()
+ })
it('should be rendered correctly', () => {
const { baseElement } = render(
- <EcogestureInitModal
- open={true}
- handleCloseClick={mockHandleClose}
- handleLaunchForm={mockHandleLaunchForm}
- />
+ <Provider store={store}>
+ <EcogestureInitModal />
+ </Provider>
)
expect(baseElement).toMatchSnapshot()
})
it('should close modal', async () => {
render(
- <EcogestureInitModal
- open={true}
- handleCloseClick={mockHandleClose}
- handleLaunchForm={mockHandleLaunchForm}
- />
+ <Provider store={store}>
+ <EcogestureInitModal />
+ </Provider>
)
- await userEvent.click(screen.getAllByRole('button')[2])
- expect(mockHandleClose).toHaveBeenCalledTimes(1)
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture.initModal.btn1'))
+ })
+ expect(mockAppDispatch).toHaveBeenCalledTimes(1)
})
it('should close modal and launch form', async () => {
render(
- <EcogestureInitModal
- open={true}
- handleCloseClick={mockHandleClose}
- handleLaunchForm={mockHandleLaunchForm}
- />
+ <Provider store={store}>
+ <EcogestureInitModal />
+ </Provider>
)
- await userEvent.click(screen.getAllByRole('button')[1])
- expect(mockHandleLaunchForm).toHaveBeenCalledTimes(1)
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture.initModal.btn2'))
+ })
+ expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-form?modal=false')
+ expect(mockAppDispatch).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx
index 4575d4809619dfd37401dbcb0342ce84baa10c47..c62517b095dbc4323fcf56e47ac52ca1acdbf5cf 100644
--- a/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx
+++ b/src/components/Ecogesture/EcogestureInitModal/EcogestureInitModal.tsx
@@ -4,24 +4,33 @@ import CloseIcon from 'assets/icons/ico/close.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import React from 'react'
+import { useNavigate } from 'react-router-dom'
+import { useAppDispatch, useAppSelector } from 'store/hooks'
+import { updateProfile } from 'store/profile/profile.slice'
import './ecogestureInitModal.scss'
-interface EcogestureInitModalProps {
- open: boolean
- handleCloseClick: () => void
- handleLaunchForm: () => void
-}
-
-const EcogestureInitModal = ({
- open,
- handleCloseClick,
- handleLaunchForm,
-}: EcogestureInitModalProps) => {
+const EcogestureInitModal = () => {
const { t } = useI18n()
+ const navigate = useNavigate()
+ const dispatch = useAppDispatch()
+ const { haveSeenEcogestureModal } = useAppSelector(
+ state => state.ecolyo.profile
+ )
+ const openEcogestureInitModal = !haveSeenEcogestureModal
+
+ const handleLaunchForm = () => {
+ dispatch(updateProfile({ haveSeenEcogestureModal: true }))
+ navigate('/ecogesture-form?modal=false')
+ }
+
+ const handleCloseEcogestureInitModal = () => {
+ dispatch(updateProfile({ haveSeenEcogestureModal: true }))
+ }
+
return (
<Dialog
- open={open}
- onClose={handleCloseClick}
+ open={openEcogestureInitModal}
+ onClose={handleCloseEcogestureInitModal}
aria-labelledby="accessibility-title"
classes={{
root: 'modal-root',
@@ -34,7 +43,7 @@ const EcogestureInitModal = ({
<IconButton
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
+ onClick={handleCloseEcogestureInitModal}
>
<Icon icon={CloseIcon} size={16} />
</IconButton>
@@ -54,7 +63,7 @@ const EcogestureInitModal = ({
</Button>
<Button
aria-label={t('ecogesture.initModal.btn1')}
- onClick={handleCloseClick}
+ onClick={handleCloseEcogestureInitModal}
className="btnSecondary"
>
{t('ecogesture.initModal.btn1')}
diff --git a/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx b/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx
index b230d0fd10a2a02fddb498042d9b629af2034c81..d512de1a43de39e438432c03f18509d0537eca23 100644
--- a/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx
+++ b/src/components/Ecogesture/EcogestureList/EcogestureList.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -19,7 +19,6 @@ jest.mock(
() => 'mock-ecogesturecard'
)
-const mockHandleReinit = jest.fn()
const updateEcogestureFilter = jest.fn()
const mockAppDispatch = jest.spyOn(storeHooks, 'useAppDispatch')
mockAppDispatch.mockImplementation(() => updateEcogestureFilter)
@@ -39,7 +38,7 @@ describe('EcogesturesList component', () => {
displaySelection={false}
selectionTotal={0}
selectionViewed={0}
- handleReinitClick={mockHandleReinit}
+ openResetEcogestureModal={jest.fn()}
/>
</BrowserRouter>
</Provider>
@@ -48,7 +47,7 @@ describe('EcogesturesList component', () => {
})
it('should open the filter menu and select all ecogesture', async () => {
- const { container } = render(
+ render(
<Provider store={store}>
<BrowserRouter>
<EcogestureList
@@ -60,14 +59,17 @@ describe('EcogesturesList component', () => {
</BrowserRouter>
</Provider>
)
- await waitFor(() => null, { container })
- await userEvent.click(screen.getAllByRole('button')[0])
- await userEvent.click(screen.getAllByRole('menuitem')[1])
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture.MENU_TITLE'))
+ })
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('menuitem')[1])
+ })
expect(updateEcogestureFilter).toHaveBeenCalledTimes(1)
})
it('should go to "/ecogesture-selection"', async () => {
- const { container } = render(
+ render(
<Provider store={store}>
<BrowserRouter>
<EcogestureList
@@ -79,8 +81,9 @@ describe('EcogesturesList component', () => {
</BrowserRouter>
</Provider>
)
- await waitFor(() => null, { container })
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture.button_selection'))
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-selection')
})
})
diff --git a/src/components/Ecogesture/EcogestureList/EcogestureList.tsx b/src/components/Ecogesture/EcogestureList/EcogestureList.tsx
index 35377c4fcb7bca2ef861c29dc220be1ff38a0c65..f46cc200bf12ef74854a11159f96e73e8fe3f608 100644
--- a/src/components/Ecogesture/EcogestureList/EcogestureList.tsx
+++ b/src/components/Ecogesture/EcogestureList/EcogestureList.tsx
@@ -18,7 +18,7 @@ interface EcogestureListProps {
displaySelection: boolean
selectionTotal: number
selectionViewed: number
- handleReinitClick?: () => void
+ openResetEcogestureModal?: () => void
}
const EcogestureList = ({
@@ -26,7 +26,7 @@ const EcogestureList = ({
displaySelection,
selectionTotal,
selectionViewed,
- handleReinitClick,
+ openResetEcogestureModal,
}: EcogestureListProps) => {
const { t } = useI18n()
const navigate = useNavigate()
@@ -155,9 +155,9 @@ const EcogestureList = ({
<div className="ecogesture-content">
{renderEcogestureContent()}
- {!displaySelection && handleReinitClick && (
- <Button onClick={handleReinitClick} className="btnSecondary">
- {t('ecogesture.reinit')}
+ {!displaySelection && openResetEcogestureModal && (
+ <Button onClick={openResetEcogestureModal} className="btnSecondary">
+ {t('ecogesture.reset')}
</Button>
)}
</div>
diff --git a/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap b/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap
index 73e301dfd68e276c7580c291e7a93f8ed16ec738..3a8441cc4fa2d6a2870de568ed168facf4296c51 100644
--- a/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureList/__snapshots__/EcogestureList.spec.tsx.snap
@@ -60,7 +60,7 @@ exports[`EcogesturesList component should be rendered correctly 1`] = `
<span
class="MuiButton-label"
>
- ecogesture.reinit
+ ecogesture.reset
</span>
<span
class="MuiTouchRipple-root"
diff --git a/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx b/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx
index 28d77f7ca042e4cd09c9c22769d48655913f13cc..2ca68993812bf704ba4c9caa6ca2024f649beb1b 100644
--- a/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx
+++ b/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureNotFound from './EcogestureNotFound'
@@ -22,7 +22,9 @@ describe('EcogestureNotFound component', () => {
})
it('should click on button and be redirected', async () => {
render(<EcogestureNotFound text="test" returnPage="ecogestures" />)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('error_page.back'))
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/ecogestures')
})
})
diff --git a/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.tsx b/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.tsx
index 78ef552bf893e62b384b11b20cb1274ab607098a..c4bf6436168bc290dd586869332eacff4c980af0 100644
--- a/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.tsx
+++ b/src/components/Ecogesture/EcogestureNotFound/EcogestureNotFound.tsx
@@ -5,7 +5,7 @@ import Content from 'components/Content/Content'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import React, { useState } from 'react'
+import React from 'react'
import { useNavigate } from 'react-router-dom'
import './ecogestureNotFound.scss'
@@ -18,16 +18,12 @@ const EcogestureNotFound = ({
}) => {
const { t } = useI18n()
const navigate = useNavigate()
- const [headerHeight, setHeaderHeight] = useState<number>(0)
return (
<>
<CozyBar titleKey="error_page.main" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="error_page.main"
- />
- <Content heightOffset={headerHeight}>
+ <Header desktopTitleKey="error_page.main" />
+ <Content>
<div className="error-container">
<StyledIcon className="profile-icon" icon={BearIcon} size={250} />
diff --git a/src/components/Ecogesture/EcogestureNotFound/__snapshots__/EcogestureNotFound.spec.tsx.snap b/src/components/Ecogesture/EcogestureNotFound/__snapshots__/EcogestureNotFound.spec.tsx.snap
index a991c215c20992f6faf548741dfa93c8fe97e850..c6390dcbde7545e575c73c7134cb4eac3b4bc6a4 100644
--- a/src/components/Ecogesture/EcogestureNotFound/__snapshots__/EcogestureNotFound.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureNotFound/__snapshots__/EcogestureNotFound.spec.tsx.snap
@@ -8,9 +8,7 @@ exports[`EcogestureNotFound component should be rendered correctly 1`] = `
<mock-header
desktoptitlekey="error_page.main"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="error-container"
>
diff --git a/src/components/Ecogesture/EcogestureReinitModal/EcogestureReinitModal.spec.tsx b/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.spec.tsx
similarity index 52%
rename from src/components/Ecogesture/EcogestureReinitModal/EcogestureReinitModal.spec.tsx
rename to src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.spec.tsx
index a37d0c48f64a214b5eddc8553bfaa81331dc50c6..f7140298cd585f51a9e7d82a45099c20d4287217 100644
--- a/src/components/Ecogesture/EcogestureReinitModal/EcogestureReinitModal.spec.tsx
+++ b/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.spec.tsx
@@ -1,14 +1,14 @@
import { render } from '@testing-library/react'
import React from 'react'
-import EcogestureReinitModal from './EcogestureReinitModal'
+import EcogestureResetModal from './EcogestureResetModal'
-describe('EcogestureReinitModal component', () => {
+describe('EcogestureResetModal component', () => {
it('should be rendered correctly', async () => {
const { baseElement } = render(
- <EcogestureReinitModal
+ <EcogestureResetModal
open={true}
- handleCloseClick={jest.fn()}
- handleLaunchReinit={jest.fn()}
+ closeEcogestureResetModal={jest.fn()}
+ handleConfirmReset={jest.fn()}
/>
)
expect(baseElement).toMatchSnapshot()
diff --git a/src/components/Ecogesture/EcogestureReinitModal/EcogestureReinitModal.tsx b/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx
similarity index 57%
rename from src/components/Ecogesture/EcogestureReinitModal/EcogestureReinitModal.tsx
rename to src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx
index 6fa3b3934dffa31e4bf02f7c1c259422ae54c2d9..afcbde8ffd0460edb97114e56e42aaf89a9d32e2 100644
--- a/src/components/Ecogesture/EcogestureReinitModal/EcogestureReinitModal.tsx
+++ b/src/components/Ecogesture/EcogestureResetModal/EcogestureResetModal.tsx
@@ -5,24 +5,24 @@ import warningIcon from 'assets/icons/ico/warn-orange.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import React from 'react'
-import './ecogestureReinitModal.scss'
+import './ecogestureResetModal.scss'
-interface EcogestureReinitModalProps {
+interface EcogestureResetModalProps {
open: boolean
- handleCloseClick: () => void
- handleLaunchReinit: () => void
+ closeEcogestureResetModal: () => void
+ handleConfirmReset: () => void
}
-const EcogestureReinitModal = ({
+const EcogestureResetModal = ({
open,
- handleCloseClick,
- handleLaunchReinit,
-}: EcogestureReinitModalProps) => {
+ closeEcogestureResetModal,
+ handleConfirmReset,
+}: EcogestureResetModalProps) => {
const { t } = useI18n()
return (
<Dialog
open={open}
- onClose={handleCloseClick}
+ onClose={closeEcogestureResetModal}
aria-labelledby="accessibility-title"
classes={{
root: 'modal-root',
@@ -35,46 +35,46 @@ const EcogestureReinitModal = ({
<IconButton
aria-label={t('feedback.accessibility.button_close')}
className="modal-paper-close-button"
- onClick={handleCloseClick}
+ onClick={closeEcogestureResetModal}
>
<Icon icon={CloseIcon} size={16} />
</IconButton>
- <div className="eg-reinit-modal">
+ <div className="eg-reset-modal">
<Icon icon={warningIcon} size={63} />
<div className="title text-20-bold">
- {t('ecogesture.reinitModal.title_part1')}
+ {t('ecogesture.resetModal.title_part1')}
<span className="warn-title">
- {t('ecogesture.reinitModal.title_part2')}
+ {t('ecogesture.resetModal.title_part2')}
</span>
- {t('ecogesture.reinitModal.title_part3')}
+ {t('ecogesture.resetModal.title_part3')}
<span className="warn-title">
- {t('ecogesture.reinitModal.title_part4')}
+ {t('ecogesture.resetModal.title_part4')}
</span>
- {t('ecogesture.reinitModal.title_part5')}
+ {t('ecogesture.resetModal.title_part5')}
<span className="warn-title">
- {t('ecogesture.reinitModal.title_part6')}
+ {t('ecogesture.resetModal.title_part6')}
</span>
</div>
<div className="text-16-normal text">
- {t('ecogesture.reinitModal.text1')}
+ {t('ecogesture.resetModal.text1')}
</div>
<div className="text-16-bold text">
- {t('ecogesture.reinitModal.text2')}
+ {t('ecogesture.resetModal.text2')}
</div>
<div className="buttons-container">
<Button
- aria-label={t('ecogesture.reinitModal.btn1')}
- onClick={handleCloseClick}
+ aria-label={t('ecogesture.resetModal.btn1')}
+ onClick={closeEcogestureResetModal}
className="btnSecondary"
>
- {t('ecogesture.reinitModal.btn1')}
+ {t('ecogesture.resetModal.btn1')}
</Button>
<Button
- aria-label={t('ecogesture.reinitModal.btn2')}
- onClick={handleLaunchReinit}
+ aria-label={t('ecogesture.resetModal.btn2')}
+ onClick={handleConfirmReset}
className="btnPrimary"
>
- {t('ecogesture.reinitModal.btn2')}
+ {t('ecogesture.resetModal.btn2')}
</Button>
</div>
</div>
@@ -82,4 +82,4 @@ const EcogestureReinitModal = ({
)
}
-export default EcogestureReinitModal
+export default EcogestureResetModal
diff --git a/src/components/Ecogesture/EcogestureReinitModal/__snapshots__/EcogestureReinitModal.spec.tsx.snap b/src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap
similarity index 83%
rename from src/components/Ecogesture/EcogestureReinitModal/__snapshots__/EcogestureReinitModal.spec.tsx.snap
rename to src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap
index 18d92802a010d3557aee5ec1a19713867e41f0d7..caa340983c1c203a1cc98b04429ea1c045f13798 100644
--- a/src/components/Ecogesture/EcogestureReinitModal/__snapshots__/EcogestureReinitModal.spec.tsx.snap
+++ b/src/components/Ecogesture/EcogestureResetModal/__snapshots__/EcogestureResetModal.spec.tsx.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`EcogestureReinitModal component should be rendered correctly 1`] = `
+exports[`EcogestureResetModal component should be rendered correctly 1`] = `
<body
style="padding-right: 0px; overflow: hidden;"
>
@@ -61,7 +61,7 @@ exports[`EcogestureReinitModal component should be rendered correctly 1`] = `
/>
</button>
<div
- class="eg-reinit-modal"
+ class="eg-reset-modal"
>
<svg
class="styles__icon___23x3R"
@@ -75,40 +75,40 @@ exports[`EcogestureReinitModal component should be rendered correctly 1`] = `
<div
class="title text-20-bold"
>
- ecogesture.reinitModal.title_part1
+ ecogesture.resetModal.title_part1
<span
class="warn-title"
>
- ecogesture.reinitModal.title_part2
+ ecogesture.resetModal.title_part2
</span>
- ecogesture.reinitModal.title_part3
+ ecogesture.resetModal.title_part3
<span
class="warn-title"
>
- ecogesture.reinitModal.title_part4
+ ecogesture.resetModal.title_part4
</span>
- ecogesture.reinitModal.title_part5
+ ecogesture.resetModal.title_part5
<span
class="warn-title"
>
- ecogesture.reinitModal.title_part6
+ ecogesture.resetModal.title_part6
</span>
</div>
<div
class="text-16-normal text"
>
- ecogesture.reinitModal.text1
+ ecogesture.resetModal.text1
</div>
<div
class="text-16-bold text"
>
- ecogesture.reinitModal.text2
+ ecogesture.resetModal.text2
</div>
<div
class="buttons-container"
>
<button
- aria-label="ecogesture.reinitModal.btn1"
+ aria-label="ecogesture.resetModal.btn1"
class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary"
tabindex="0"
type="button"
@@ -116,14 +116,14 @@ exports[`EcogestureReinitModal component should be rendered correctly 1`] = `
<span
class="MuiButton-label"
>
- ecogesture.reinitModal.btn1
+ ecogesture.resetModal.btn1
</span>
<span
class="MuiTouchRipple-root"
/>
</button>
<button
- aria-label="ecogesture.reinitModal.btn2"
+ aria-label="ecogesture.resetModal.btn2"
class="MuiButtonBase-root MuiButton-root MuiButton-text btnPrimary"
tabindex="0"
type="button"
@@ -131,7 +131,7 @@ exports[`EcogestureReinitModal component should be rendered correctly 1`] = `
<span
class="MuiButton-label"
>
- ecogesture.reinitModal.btn2
+ ecogesture.resetModal.btn2
</span>
<span
class="MuiTouchRipple-root"
diff --git a/src/components/Ecogesture/EcogestureReinitModal/ecogestureReinitModal.scss b/src/components/Ecogesture/EcogestureResetModal/ecogestureResetModal.scss
similarity index 94%
rename from src/components/Ecogesture/EcogestureReinitModal/ecogestureReinitModal.scss
rename to src/components/Ecogesture/EcogestureResetModal/ecogestureResetModal.scss
index d5f0ae349fb52fa9e1ccb1031db1ec374f864383..5b8d193b0808b173d131ff6e45684482c7ae2d69 100644
--- a/src/components/Ecogesture/EcogestureReinitModal/ecogestureReinitModal.scss
+++ b/src/components/Ecogesture/EcogestureResetModal/ecogestureResetModal.scss
@@ -1,6 +1,6 @@
@import 'src/styles/base/color';
-.eg-reinit-modal {
+.eg-reset-modal {
display: flex;
flex-direction: column;
gap: 1rem;
diff --git a/src/components/Ecogesture/EcogestureTabsView.spec.tsx b/src/components/Ecogesture/EcogestureTabsView.spec.tsx
index d9806f63d0fd7d4fb203a9ec11a604a4eaaa5704..92561d3dd52cca64fe62f0a3cb25b666ad025e39 100644
--- a/src/components/Ecogesture/EcogestureTabsView.spec.tsx
+++ b/src/components/Ecogesture/EcogestureTabsView.spec.tsx
@@ -1,16 +1,29 @@
import { render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import EcogestureTabsView from 'components/Ecogesture/EcogestureTabsView'
+import { Ecogesture } from 'models'
import React from 'react'
import { Provider } from 'react-redux'
import * as profileActions from 'store/profile/profile.slice'
-import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
+import { mockDoingEcogestures } from 'tests/__mocks__/ecogesturesData.mock'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
-const mockInitEcogesture = jest.fn().mockResolvedValue(mockedEcogesturesData)
+const mockInitEcogesture = jest
+ .fn<
+ Promise<{
+ ecogestureHash: string
+ ecogestureList: Ecogesture[]
+ }>,
+ []
+ >()
+ .mockResolvedValue({
+ ecogestureHash: 'hash',
+ ecogestureList: mockDoingEcogestures,
+ })
+const mockGetEcogesture = jest.fn().mockResolvedValue([])
jest.mock('services/ecogesture.service', () => {
return jest.fn(() => ({
- getEcogestureListByProfile: jest.fn().mockResolvedValue([]),
+ getEcogestureListByProfile: mockGetEcogesture,
initEcogesture: mockInitEcogesture,
}))
})
@@ -44,7 +57,7 @@ describe('EcogestureView component', () => {
jest.clearAllMocks()
})
- it('should be rendered correctly', async () => {
+ it('should be rendered correctly with 3 clickable tabs', async () => {
const { container } = render(
<Provider store={store}>
<EcogestureTabsView />
@@ -57,44 +70,20 @@ describe('EcogestureView component', () => {
it('should render ecogesture init modal', async () => {
const updateProfileSpy = jest.spyOn(profileActions, 'updateProfile')
-
- const { container } = render(
+ render(
<Provider store={store}>
<EcogestureTabsView />
</Provider>
)
- await waitFor(() => null, { container })
expect(screen.getByRole('dialog')).toBeInTheDocument()
- await userEvent.click(screen.getAllByRole('button')[0])
+
+ await waitFor(async () => {
+ await userEvent.click(
+ screen.getByLabelText('feedback.accessibility.button_close')
+ )
+ })
expect(updateProfileSpy).toHaveBeenCalledWith({
haveSeenEcogestureModal: true,
})
})
-
- it('should render empty list', async () => {
- mockInitEcogesture.mockResolvedValueOnce([])
- const { container } = render(
- <Provider store={store}>
- <EcogestureTabsView />
- </Provider>
- )
- await waitFor(() => null, { container })
- expect(
- container.getElementsByClassName('ec-empty-container').length
- ).toBeTruthy()
- })
-
- it('should change tab', async () => {
- const { container } = render(
- <Provider store={store}>
- <EcogestureTabsView />
- </Provider>
- )
- await waitFor(() => null, { container })
- await userEvent.click(screen.getAllByRole('button')[1])
- await waitFor(() => null, { container })
- expect(
- container.getElementsByClassName('ec-empty-container').length
- ).toBeTruthy()
- })
})
diff --git a/src/components/Ecogesture/EcogestureTabsView.tsx b/src/components/Ecogesture/EcogestureTabsView.tsx
index a0491c0974d72c455e4ef61e9ec607394e6a465a..d5327b447e067ca95eb3d8eaa1c46a2d0932d912 100644
--- a/src/components/Ecogesture/EcogestureTabsView.tsx
+++ b/src/components/Ecogesture/EcogestureTabsView.tsx
@@ -8,7 +8,7 @@ import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { EcogestureTab } from 'enums'
import { Ecogesture } from 'models'
-import React, { useCallback, useEffect, useState } from 'react'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import EcogestureService from 'services/ecogesture.service'
import { useAppDispatch, useAppSelector } from 'store/hooks'
@@ -16,7 +16,7 @@ import { updateProfile } from 'store/profile/profile.slice'
import EcogestureEmptyList from './EcogestureEmptyList/EcogestureEmptyList'
import EcogestureInitModal from './EcogestureInitModal/EcogestureInitModal'
import EcogestureList from './EcogestureList/EcogestureList'
-import EcogestureReinitModal from './EcogestureReinitModal/EcogestureReinitModal'
+import EcogestureResetModal from './EcogestureResetModal/EcogestureResetModal'
import './ecogestureTabsView.scss'
interface TabPanelProps {
@@ -47,55 +47,34 @@ const EcogestureTabsView = () => {
state => state.ecolyo
)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const [tabValue, setTabValue] = useState<EcogestureTab>(
tab ? parseInt(tab) : EcogestureTab.OBJECTIVE
)
const [isLoading, setIsLoading] = useState<boolean>(true)
- const [allEcogestureList, setAllEcogestureList] = useState<Ecogesture[]>([])
- const [doingEcogestureList, setDoingEcogestureList] = useState<Ecogesture[]>(
- []
- )
- const [objectiveEcogestureList, setObjectiveEcogestureList] = useState<
- Ecogesture[]
- >([])
+ const [openEcResetModal, setOpenEcResetModal] = useState(false)
+ const [ecogestures, setEcogestures] = useState<Ecogesture[]>([])
const [totalViewed, setTotalViewed] = useState<number>(0)
const [totalAvailable, setTotalAvailable] = useState<number>(0)
- const [openEcogestureInitModal, setOpenEcogestureInitModal] =
- useState<boolean>(!profile.haveSeenEcogestureModal)
- const [openEcogestureReinitModal, setOpenEcogestureReinitModal] =
- useState<boolean>(false)
- const handleReinitClick = useCallback(() => {
- setOpenEcogestureReinitModal(true)
- }, [])
+ const objective = ecogestures.filter(({ objective }) => objective)
+ const doing = ecogestures.filter(({ doing }) => doing)
- const handleLaunchForm = useCallback(async () => {
- dispatch(updateProfile({ haveSeenEcogestureModal: true }))
- setOpenEcogestureInitModal(false)
- navigate('/ecogesture-form?modal=false')
- }, [dispatch, navigate])
+ const ecogestureService = useMemo(
+ () => new EcogestureService(client),
+ [client]
+ )
- const handleCloseEcogestureInitModal = useCallback(async () => {
- dispatch(updateProfile({ haveSeenEcogestureModal: true }))
- setOpenEcogestureInitModal(false)
- }, [dispatch])
+ const openResetEcogestureModal = () => setOpenEcResetModal(true)
+ const closeEcogestureResetModal = () => setOpenEcResetModal(false)
- const handleLaunchReinit = useCallback(async () => {
- setOpenEcogestureReinitModal(false)
+ const handleConfirmReset = useCallback(async () => {
+ closeEcogestureResetModal()
setIsLoading(true)
- const ecogestureService = new EcogestureService(client)
- const reset = await ecogestureService.reinitAllEcogestures()
- if (reset) {
- setOpenEcogestureReinitModal(false)
- setIsLoading(false)
- navigate('/ecogesture-form?modal=true')
- }
- }, [client, navigate])
-
- const handleCloseEcogestureReinitModal = useCallback(() => {
- setOpenEcogestureReinitModal(false)
- }, [])
+ const reset = await ecogestureService.resetAllEcogestures()
+ if (!reset) return
+ setIsLoading(false)
+ navigate('/ecogesture-form?modal=true')
+ }, [ecogestureService, navigate])
const handleChange = useCallback(
(event: React.ChangeEvent<object>, newValue: number) => {
@@ -111,9 +90,9 @@ const EcogestureTabsView = () => {
const getTabLabel = useCallback(
(tab: EcogestureTab) => {
const tabCounts = {
- [EcogestureTab.OBJECTIVE]: objectiveEcogestureList.length,
- [EcogestureTab.DOING]: doingEcogestureList.length,
- [EcogestureTab.ALL]: allEcogestureList.length,
+ [EcogestureTab.OBJECTIVE]: objective.length,
+ [EcogestureTab.DOING]: doing.length,
+ [EcogestureTab.ALL]: ecogestures.length,
}
return (
@@ -124,19 +103,15 @@ const EcogestureTabsView = () => {
</>
)
},
- [
- allEcogestureList.length,
- doingEcogestureList.length,
- objectiveEcogestureList.length,
- t,
- ]
+ [doing.length, ecogestures.length, objective.length, t]
)
useEffect(() => {
let subscribed = true
async function loadEcogestures() {
- const ecogestureService = new EcogestureService(client)
-
+ const currentProfile = profile.isProfileTypeCompleted
+ ? profileType
+ : profileEcogesture
const { ecogestureList, ecogestureHash } =
await ecogestureService.initEcogesture(profile.ecogestureHash)
@@ -144,39 +119,38 @@ const EcogestureTabsView = () => {
dispatch(updateProfile({ ecogestureHash }))
}
- const availableList =
- await ecogestureService.getEcogestureListByProfile(profileEcogesture)
- const filteredList = availableList.filter(
- ecogesture => ecogesture.viewedInSelection === false
- )
- if (subscribed && ecogestureList) {
- const doing = ecogestureList.filter(
- ecogesture => ecogesture.doing === true
+ if (ecogestureList) {
+ const availableList =
+ await ecogestureService.getEcogestureListByProfile(currentProfile)
+ const notViewedList = availableList.filter(
+ ecogesture => ecogesture.viewedInSelection === false
)
- const objective = ecogestureList.filter(
- ecogesture => ecogesture.objective === true
- )
- setAllEcogestureList(ecogestureList)
- setObjectiveEcogestureList(objective)
- setDoingEcogestureList(doing)
+
+ setEcogestures(ecogestureList)
setTotalAvailable(availableList.length)
- setTotalViewed(availableList.length - filteredList.length)
+ setTotalViewed(availableList.length - notViewedList.length)
}
+
setIsLoading(false)
}
- loadEcogestures()
+
+ subscribed && loadEcogestures()
return () => {
subscribed = false
}
- }, [client, profileEcogesture, profileType, dispatch, profile.ecogestureHash])
+ }, [
+ profileEcogesture,
+ profileType,
+ dispatch,
+ profile.ecogestureHash,
+ profile.isProfileTypeCompleted,
+ ecogestureService,
+ ])
return (
<>
<CozyBar titleKey="common.title_ecogestures" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_ecogestures"
- >
+ <Header desktopTitleKey="common.title_ecogestures">
<Tabs
value={tabValue}
className="ecogestures-tabs"
@@ -215,7 +189,7 @@ const EcogestureTabsView = () => {
</Tabs>
</Header>
- <Content heightOffset={headerHeight}>
+ <Content>
{isLoading && (
<div className="loaderContainer">
<Loader text={t('ecogestures.loading')} />
@@ -225,21 +199,20 @@ const EcogestureTabsView = () => {
<>
<TabPanel value={tabValue} tab={EcogestureTab.OBJECTIVE}>
{profile.isProfileEcogestureCompleted &&
- (totalAvailable === totalViewed &&
- objectiveEcogestureList.length === 0 ? (
+ (totalAvailable === totalViewed && objective.length === 0 ? (
<EcogestureEmptyList
setTab={setTabValue}
isObjective={true}
isSelectionDone={true}
- handleReinitClick={handleReinitClick}
+ openResetEcogestureModal={openResetEcogestureModal}
/>
) : (
<EcogestureList
- list={objectiveEcogestureList}
+ list={objective}
displaySelection={totalAvailable !== totalViewed}
selectionTotal={totalAvailable}
selectionViewed={totalViewed}
- handleReinitClick={handleReinitClick}
+ openResetEcogestureModal={openResetEcogestureModal}
/>
))}
{!profile.isProfileEcogestureCompleted && (
@@ -247,28 +220,27 @@ const EcogestureTabsView = () => {
setTab={setTabValue}
isObjective={true}
isSelectionDone={false}
- handleReinitClick={handleReinitClick}
+ openResetEcogestureModal={openResetEcogestureModal}
/>
)}
</TabPanel>
<TabPanel value={tabValue} tab={EcogestureTab.DOING}>
{profile.isProfileEcogestureCompleted &&
- (totalAvailable === totalViewed &&
- doingEcogestureList.length === 0 ? (
+ (totalAvailable === totalViewed && doing.length === 0 ? (
<EcogestureEmptyList
setTab={setTabValue}
isObjective={false}
isSelectionDone={true}
- handleReinitClick={handleReinitClick}
+ openResetEcogestureModal={openResetEcogestureModal}
/>
) : (
<EcogestureList
- list={doingEcogestureList}
+ list={doing}
displaySelection={totalAvailable !== totalViewed}
selectionTotal={totalAvailable}
selectionViewed={totalViewed}
- handleReinitClick={handleReinitClick}
+ openResetEcogestureModal={openResetEcogestureModal}
/>
))}
{!profile.isProfileEcogestureCompleted && (
@@ -276,15 +248,15 @@ const EcogestureTabsView = () => {
setTab={setTabValue}
isObjective={false}
isSelectionDone={false}
- handleReinitClick={handleReinitClick}
+ openResetEcogestureModal={openResetEcogestureModal}
/>
)}
</TabPanel>
<TabPanel value={tabValue} tab={EcogestureTab.ALL}>
- {Boolean(allEcogestureList.length) && (
+ {Boolean(ecogestures.length) && (
<EcogestureList
- list={allEcogestureList}
+ list={ecogestures}
displaySelection={false}
selectionTotal={totalAvailable}
selectionViewed={totalViewed}
@@ -293,18 +265,13 @@ const EcogestureTabsView = () => {
</TabPanel>
</>
)}
- {openEcogestureInitModal && (
- <EcogestureInitModal
- open={openEcogestureInitModal}
- handleCloseClick={handleCloseEcogestureInitModal}
- handleLaunchForm={handleLaunchForm}
- />
- )}
- {openEcogestureReinitModal && (
- <EcogestureReinitModal
- open={openEcogestureReinitModal}
- handleCloseClick={handleCloseEcogestureReinitModal}
- handleLaunchReinit={handleLaunchReinit}
+ <EcogestureInitModal />
+
+ {openEcResetModal && (
+ <EcogestureResetModal
+ open={openEcResetModal}
+ closeEcogestureResetModal={closeEcogestureResetModal}
+ handleConfirmReset={handleConfirmReset}
/>
)}
</Content>
diff --git a/src/components/Ecogesture/SingleEcogestureView.spec.tsx b/src/components/Ecogesture/SingleEcogestureView.spec.tsx
index 5f89c46a40f1459f52cfd96a25921a9cfa704b22..2d42b995b77be45ca1d7fccafc9cb8f099876ed9 100644
--- a/src/components/Ecogesture/SingleEcogestureView.spec.tsx
+++ b/src/components/Ecogesture/SingleEcogestureView.spec.tsx
@@ -24,6 +24,9 @@ jest.mock('services/ecogesture.service', () => {
})
describe('SingleEcogesture component', () => {
+ beforeEach(() => {
+ jest.clearAllMocks()
+ })
const store = createMockEcolyoStore()
it('should be rendered correctly', async () => {
mockGetEcogesturesByIds.mockResolvedValue([mockedEcogesturesData[0]])
@@ -41,14 +44,14 @@ describe('SingleEcogesture component', () => {
const updatedEcogesture = { ...mockedEcogesturesData[0], objective: true }
mockUpdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
- const { container } = render(
+ render(
<Provider store={store}>
<SingleEcogestureView />
</Provider>
)
- await waitFor(() => null, { container })
- const [, objective] = screen.getAllByRole('button')
- await userEvent.click(objective)
+ await waitFor(async () => {
+ await userEvent.click(screen.getByText('ecogesture.objective'))
+ })
expect(mockUpdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
})
@@ -57,28 +60,27 @@ describe('SingleEcogesture component', () => {
const updatedEcogesture = { ...mockedEcogesturesData[0], doing: true }
mockUpdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
- const { container } = render(
+ render(
<Provider store={store}>
<SingleEcogestureView />
</Provider>
)
- await waitFor(() => null, { container })
- const [, , doing] = screen.getAllByRole('button')
- await userEvent.click(doing)
+ await waitFor(async () => {
+ await userEvent.click(screen.getByText('ecogesture.doing'))
+ })
expect(mockUpdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
})
it('should toggle more details', async () => {
mockGetEcogesturesByIds.mockResolvedValue([mockedEcogesturesData[0]])
-
- const { container } = render(
+ render(
<Provider store={store}>
<SingleEcogestureView />
</Provider>
)
- await waitFor(() => null, { container })
- const [showMore] = screen.getAllByRole('button')
- await userEvent.click(showMore)
+ await waitFor(async () => {
+ await userEvent.click(screen.getByText('ecogesture_modal.show_more'))
+ })
expect(screen.getByText('ecogesture_modal.show_less')).toBeInTheDocument()
})
})
diff --git a/src/components/Ecogesture/SingleEcogestureView.tsx b/src/components/Ecogesture/SingleEcogestureView.tsx
index 7f2c228dfa79fbf77c7a95633d6d9cd4c8211941..13a60e4be98f167cb1f61d86aaa102607d61a519 100644
--- a/src/components/Ecogesture/SingleEcogestureView.tsx
+++ b/src/components/Ecogesture/SingleEcogestureView.tsx
@@ -29,36 +29,30 @@ import './singleEcogestureView.scss'
const SingleEcogestureView = () => {
const { t } = useI18n()
const client = useClient()
+ const { currentChallenge } = useAppSelector(state => state.ecolyo.challenge)
+ const { ecogestureID } = useParams<{ ecogestureID: string }>()
+ const [isLoading, setIsLoading] = useState<boolean>(true)
const [ecogesture, setEcogesture] = useState<Ecogesture>()
const [ecogestureIcon, setEcogestureIcon] = useState<string>('')
const [showDetails, setShowDetails] = useState<boolean>(false)
- const [isDoing, setIsDoing] = useState<boolean>(false)
- const [isObjective, setIsObjective] = useState<boolean>(false)
- const [isLoading, setIsLoading] = useState<boolean>(true)
- const { ecogestureID } = useParams<{ ecogestureID: string }>()
+ const isDoing = ecogesture?.doing
+ const isObjective = ecogesture?.objective
const ecogestureService = useMemo(
() => new EcogestureService(client),
[client]
)
- const { currentChallenge } = useAppSelector(state => state.ecolyo.challenge)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const [, setValidExploration] = useExploration()
const updateEcogesture = useCallback(
- async (objective, doing) => {
+ async (objective: boolean, doing: boolean) => {
if (ecogesture) {
- const updates: Ecogesture = {
+ const result = await ecogestureService.updateEcogesture({
...ecogesture,
- objective: objective,
- doing: doing,
- }
- const result = await ecogestureService.updateEcogesture(updates)
- if (result) {
- setIsObjective(result.objective)
- setIsDoing(result.doing)
- setEcogesture(result)
- }
+ objective,
+ doing,
+ })
+ if (result) setEcogesture(result)
}
},
[ecogesture, ecogestureService]
@@ -82,8 +76,6 @@ const SingleEcogestureView = () => {
if (data?.[0]) {
setEcogesture(data[0])
// Prevent case this key doesn't exist in doctype
- setIsObjective(data[0].objective)
- setIsDoing(data[0].doing)
const icon = await importIconById(data[0].id, 'ecogesture')
if (subscribed) {
setEcogestureIcon(icon || defaultIcon)
@@ -115,11 +107,10 @@ const SingleEcogestureView = () => {
<>
<CozyBar titleKey="common.title_ecogesture" displayBackArrow={true} />
<Header
- setHeaderHeight={setHeaderHeight}
desktopTitleKey="common.title_ecogesture"
displayBackArrow={true}
/>
- <Content heightOffset={headerHeight}>
+ <Content>
{isLoading && (
<div className="loaderContainer">
<Loader />
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap
index e8ada2259dc01776e81f24afd7453e4054a9b768..7ccd151382e3967c0377207e3fe1b6bf5c066cc7 100644
--- a/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`EcogestureView component should be rendered correctly 1`] = `
+exports[`EcogestureView component should be rendered correctly with 3 clickable tabs 1`] = `
<div
aria-hidden="true"
>
@@ -56,7 +56,7 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
>
ecogesture.title_tab_1
<br />
- (0)
+ (2)
</span>
<span
class="MuiTouchRipple-root"
@@ -76,7 +76,7 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
>
ecogesture.title_tab_2
<br />
- (0)
+ (3)
</span>
<span
class="MuiTouchRipple-root"
@@ -90,9 +90,7 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
</div>
</div>
</mock-header>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
aria-labelledby="simple-tab-0"
id="simple-tabpanel-0"
@@ -223,7 +221,14 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
hidden=""
id="simple-tabpanel-2"
role="tabpanel"
- />
+ >
+ <mock-ecogesturelist
+ displayselection="false"
+ list="[object Object],[object Object],[object Object]"
+ selectiontotal="0"
+ selectionviewed="0"
+ />
+ </div>
</mock-content>
</div>
`;
diff --git a/src/components/Ecogesture/__snapshots__/SingleEcogestureView.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/SingleEcogestureView.spec.tsx.snap
index d5009811f16c175b7b06d0b1940e281c59c30564..e035305baaeb0458c5215c6fdfcca0a0defea995 100644
--- a/src/components/Ecogesture/__snapshots__/SingleEcogestureView.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/SingleEcogestureView.spec.tsx.snap
@@ -10,9 +10,7 @@ exports[`SingleEcogesture component should be rendered correctly 1`] = `
desktoptitlekey="common.title_ecogesture"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="single-ecogesture"
>
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.spec.tsx b/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.spec.tsx
index 59dfa2b6d36071b61298edabf1f48741dec0b365..2ad4b9d739e95b24815f3f3201351459419d3683 100644
--- a/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.spec.tsx
+++ b/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.spec.tsx
@@ -56,9 +56,7 @@ describe('EcogestureFormEquipment component', () => {
container.getElementsByClassName('icons-container').length
).toBeTruthy()
expect(
- screen.getByRole('button', {
- name: 'profile_type.accessibility.button_end',
- })
+ screen.getByLabelText('profile_type.accessibility.button_end')
).toBeDisabled()
})
})
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.tsx b/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.tsx
index 4852439abc3a8be68c3a3f3a5ac3afb51c3a4008..01a1093e44da5603cbeb41e4b3d401b219801e5a 100644
--- a/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.tsx
+++ b/src/components/EcogestureForm/EcogestureFormEquipment/EcogestureFormEquipment.tsx
@@ -34,10 +34,6 @@ const EcogestureFormEquipment = ({
isProfileEcogestureCompleted ? previousEquipments : []
)
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
-
const handleNext = useCallback(() => {
if (setNextStepProfileForm && currentProfileType) {
setNextStepProfileForm({
@@ -109,7 +105,7 @@ const EcogestureFormEquipment = ({
</div>
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disableNextButton={answer.length == 0}
isLastStep={true}
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment/__snapshots__/EcogestureFormEquipment.spec.tsx.snap b/src/components/EcogestureForm/EcogestureFormEquipment/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
index 61893059fa3c958e17c6ae4e4dc4d66c90fd1952..69febe91b1c98633b4b08d40e9cecfc9c52df63f 100644
--- a/src/components/EcogestureForm/EcogestureFormEquipment/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
+++ b/src/components/EcogestureForm/EcogestureFormEquipment/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
@@ -306,6 +306,25 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
class="MuiTouchRipple-root"
/>
</button>
+ <button
+ aria-label="ecogesture_profile.equipments.accessible_label"
+ class="MuiButtonBase-root MuiIconButton-root checkbox-equipment"
+ style="border-radius: 5px;"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <mock-equipment-icon
+ equipment="OUTSIDE"
+ ischecked="false"
+ />
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
</div>
</div>
</div>
diff --git a/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.spec.tsx b/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.spec.tsx
index b7e89d07dbfa9cbc95c18262d2831f73c54d511e..ae223e032303b4dcde387af005696795ed5240cd 100644
--- a/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.spec.tsx
+++ b/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -49,8 +49,11 @@ describe('EcogestureFormSingleChoice component', () => {
</Provider>
)
await userEvent.click(screen.getAllByRole('radio')[0])
- const [, next] = screen.getAllByRole('button')
- await userEvent.click(next)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('profile_type.accessibility.button_next')
+ )
+ })
expect(mockHandleNextStep).toHaveBeenCalledTimes(1)
})
it('should go back', async () => {
@@ -66,8 +69,11 @@ describe('EcogestureFormSingleChoice component', () => {
/>
</Provider>
)
- const [prev] = screen.getAllByRole('button')
- await userEvent.click(prev)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('profile_type.accessibility.button_previous')
+ )
+ })
expect(mockHandlePreviousStep).toHaveBeenCalledTimes(1)
})
it('should keep previous answer', async () => {
diff --git a/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.tsx b/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.tsx
index 21401195fa52659828157655c6669b9c9e41c349..5bafacadc17325471e9b481f95332591da58a019 100644
--- a/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.tsx
+++ b/src/components/EcogestureForm/EcogestureFormSingleChoice/EcogestureFormSingleChoice.tsx
@@ -38,10 +38,6 @@ const EcogestureFormSingleChoice = ({
: null
)
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
-
const handleNext = useCallback(() => {
setNextStep({ ...currentProfileEcogesture, [answerType.attribute]: answer })
}, [currentProfileEcogesture, setNextStep, answer, answerType.attribute])
@@ -83,7 +79,7 @@ const EcogestureFormSingleChoice = ({
})}
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disablePrevButton={step === EcogestureStepForm.HEATING_TYPE}
disableNextButton={answer === null}
diff --git a/src/components/EcogestureForm/EcogestureFormView.spec.tsx b/src/components/EcogestureForm/EcogestureFormView.spec.tsx
index 501a60176665575e4f897dc6c382aaefa39b5f99..d3aac9ddd9e08290b52c0a27f5dc03d1ec67bb5f 100644
--- a/src/components/EcogestureForm/EcogestureFormView.spec.tsx
+++ b/src/components/EcogestureForm/EcogestureFormView.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -69,24 +69,12 @@ describe('EcogestureFormView component', () => {
<EcogestureFormView />
</Provider>
)
- // await waitFor(() => null, { container })
- await userEvent.click(screen.getAllByRole('radio')[0])
- await userEvent.click(screen.getAllByRole('button')[1])
- expect(
- container.getElementsByClassName('ecogesture-form-single').length
- ).toBeTruthy()
- })
- it('should go to previous step', async () => {
- const { container } = render(
- <Provider store={store}>
- <EcogestureFormView />
- </Provider>
- )
-
- const [, next] = screen.getAllByRole('button')
- await userEvent.click(screen.getAllByRole('radio')[0])
- await userEvent.click(next)
-
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('radio')[0])
+ await userEvent.click(
+ screen.getByLabelText('profile_type.accessibility.button_next')
+ )
+ })
expect(
container.getElementsByClassName('ecogesture-form-single').length
).toBeTruthy()
@@ -112,7 +100,8 @@ describe('EcogestureFormView component', () => {
<EcogestureFormView />
</Provider>
)
- const [prev] = screen.getAllByRole('button')
- expect(prev).toBeDisabled()
+ expect(
+ screen.getByLabelText('profile_type.accessibility.button_previous')
+ ).toBeDisabled()
})
})
diff --git a/src/components/EcogestureForm/EcogestureFormView.tsx b/src/components/EcogestureForm/EcogestureFormView.tsx
index dc4e57379310b77bddf7fa3b1bf3f3f6011e298a..337592ae8141bb394a64e3f577b6c5ee1c384244 100644
--- a/src/components/EcogestureForm/EcogestureFormView.tsx
+++ b/src/components/EcogestureForm/EcogestureFormView.tsx
@@ -5,7 +5,7 @@ import Loader from 'components/Loader/Loader'
import ProfileTypeView from 'components/ProfileType/ProfileTypeView'
import { EcogestureStepForm, ProfileEcogestureAnswerType } from 'enums'
import { ProfileEcogesture, ProfileEcogestureAnswer } from 'models'
-import React, { useCallback, useEffect, useState } from 'react'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import ProfileEcogestureFormService from 'services/profileEcogestureForm.service'
import { useAppDispatch, useAppSelector } from 'store/hooks'
@@ -22,9 +22,9 @@ const EcogestureFormView = () => {
profile: { isProfileTypeCompleted },
profileEcogesture,
} = useAppSelector(state => state.ecolyo)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const shouldOpenModal = new URLSearchParams(useLocation().search).get('modal')
+
const [step, setStep] = useState<EcogestureStepForm>(
EcogestureStepForm.HEATING_TYPE
)
@@ -33,7 +33,6 @@ const EcogestureFormView = () => {
attribute: 'heating',
choices: [],
})
-
const [isLoading, setIsLoading] = useState<boolean>(true)
const [openLaunchModal, setOpenLaunchModal] = useState<boolean>(
shouldOpenModal !== 'false' ? true : false
@@ -41,10 +40,16 @@ const EcogestureFormView = () => {
const [viewedStep, setViewedStep] = useState<number>(-1)
const [currentProfileEcogesture, setCurrentProfileEcogesture] =
useState<ProfileEcogesture>(profileEcogesture)
+
+ /** ProfileEcogestureFormService */
+ const pefs = useMemo(
+ () => new ProfileEcogestureFormService(profileEcogesture),
+ [profileEcogesture]
+ )
+
const setNextStep = useCallback(
(_profileEcogesture: ProfileEcogesture) => {
setCurrentProfileEcogesture(_profileEcogesture)
- const pefs = new ProfileEcogestureFormService(_profileEcogesture)
const nextStep = pefs.getNextFormStep(step)
setIsLoading(true)
if (nextStep > viewedStep) {
@@ -55,17 +60,16 @@ const EcogestureFormView = () => {
setAnswerType(_answerType)
setStep(nextStep)
},
- [step, viewedStep]
+ [pefs, step, viewedStep]
)
const setPreviousStep = useCallback(() => {
- const pefs = new ProfileEcogestureFormService(currentProfileEcogesture)
const previousStep = pefs.getPreviousFormStep(step)
setIsLoading(true)
const _answerType =
ProfileEcogestureFormService.getAnswerForStep(previousStep)
setAnswerType(_answerType)
setStep(previousStep)
- }, [currentProfileEcogesture, step])
+ }, [pefs, step])
const handleEndForm = useCallback(() => {
dispatch(newProfileEcogestureEntry(currentProfileEcogesture))
@@ -91,11 +95,8 @@ const EcogestureFormView = () => {
return (
<>
<CozyBar titleKey="common.title_ecogestures" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_ecogestures"
- />
- <Content heightOffset={headerHeight}>
+ <Header desktopTitleKey="common.title_ecogestures" />
+ <Content>
{isLoading && (
<div className="loaderContainer">
<Loader />
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.spec.tsx b/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.spec.tsx
index be8c6d25ed9da77a23d42ded998b09c51d0d2d03..23c3651722ed024a9587a7de8950a35c3174c697 100644
--- a/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.spec.tsx
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureLaunchFormModal from './EcogestureLaunchFormModal'
@@ -21,7 +21,9 @@ describe('EcogestureLaunchFormModal component', () => {
handleCloseClick={mockHandleClose}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture.initModal.btn2'))
+ })
expect(mockHandleClose).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx b/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx
index d7254529856ff6b6a18f6e67ee9ed18d0efe9f09..d9ddbbe6d223a910b9acf6d08a890948ec4131c2 100644
--- a/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal/EcogestureLaunchFormModal.tsx
@@ -39,8 +39,8 @@ const EcogestureLaunchFormModal = ({
<div className="title text-20-bold">
{t('ecogesture.initModal.title')}
</div>
- <div className="text-16-normal text">
- {t('ecogesture.initModal.text3')}
+ <div className="text-16-normal">
+ {t('ecogesture.initModal.launchForm')}
</div>
<Button
aria-label={t('ecogesture.initModal.btn2')}
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap b/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
index 2516ca2ce6b53497a0feee3ebf63e36e4f00bcda..61719c7d1d9696ac0aaa3919968d039320d3cace 100644
--- a/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
@@ -69,9 +69,9 @@ exports[`EcogestureLaunchFormModal component should be rendered correctly 1`] =
ecogesture.initModal.title
</div>
<div
- class="text-16-normal text"
+ class="text-16-normal"
>
- ecogesture.initModal.text3
+ ecogesture.initModal.launchForm
</div>
<button
aria-label="ecogesture.initModal.btn2"
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap
index b759c1dabdb8f7bb39bb2352dfd9b5ce5e328f6a..843e5be16fa4073f91f44198153361d2f5bec129 100644
--- a/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap
@@ -8,9 +8,7 @@ exports[`EcogestureFormView component should be rendered correctly 1`] = `
<mock-header
desktoptitlekey="common.title_ecogestures"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="ecogesture-profile-container"
>
diff --git a/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.spec.tsx
index 4f5261c876fa60a9f14195280c7176826b2c7e7d..5608a326dbb4161f40386bff9d8e374be2603b14 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.spec.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
@@ -33,25 +33,35 @@ describe('EcogestureSelectionDetail component', () => {
})
it('should toggle more details', async () => {
- const [showMore] = screen.getAllByRole('button')
- await userEvent.click(showMore)
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture_modal.show_more'))
+ })
expect(screen.getByText('ecogesture_modal.show_less')).toBeInTheDocument()
})
it('should call validate with objective to true', async () => {
- const [, objective] = screen.getAllByRole('button')
- await userEvent.click(objective)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('ecogesture_selection.button_objective')
+ )
+ })
expect(mockValidate).toHaveBeenCalledWith(true, false)
})
it('should call validate with doing to true', async () => {
- const [, , doing] = screen.getAllByRole('button')
- await userEvent.click(doing)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('ecogesture_selection.button_doing')
+ )
+ })
expect(mockValidate).toHaveBeenCalledWith(false, true)
})
it('should call validate with objective and doing to false', async () => {
- const [, , , skip] = screen.getAllByRole('button')
- await userEvent.click(skip)
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('ecogesture_selection.button_skip')
+ )
+ })
expect(mockValidate).toHaveBeenCalledWith(false, false)
})
})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionEnd/EcogestureSelectionEnd.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionEnd/EcogestureSelectionEnd.spec.tsx
index bcf32fb5e275cd73f0aa02e926b606770626728b..b17eb56aa8c598a687b102eb3b88085a36071122 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionEnd/EcogestureSelectionEnd.spec.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionEnd/EcogestureSelectionEnd.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import EcogestureSelectionEnd from './EcogestureSelectionEnd'
@@ -21,7 +21,9 @@ describe('EcogestureSelectionEnd component', () => {
it('should close modal and update profile', async () => {
render(<EcogestureSelectionEnd />)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('ecogesture_selection.button_ok'))
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/ecogestures?tab=0')
})
})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.spec.tsx
index 11801f5c9df1a75ea26f7c6354b5bf5a05e43c49..6b72660464b8a92259ffd9acfa628856cec44276 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.spec.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionModal/EcogestureSelectionModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import EcogestureSelectionModal from './EcogestureSelectionModal'
@@ -22,7 +22,11 @@ describe('EcogestureInitModal component', () => {
handleCloseClick={mockHandleClose}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('ecogesture_selection.selectionModal.button_close')
+ )
+ })
expect(mockHandleClose).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.spec.tsx
index 0a5e78b1680da49a01b246af2f290c60ba4c1fb1..e8f57688cdabd241c507f523ee6b74cb2ad9c6e4 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.spec.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionRestart/EcogestureSelectionRestart.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import EcogestureSelectionRestart from './EcogestureSelectionRestart'
@@ -20,13 +20,21 @@ describe('EcogestureSelectionRestart component', () => {
it('should call go to the ecogesture view when user click on the button', async () => {
render(<EcogestureSelectionRestart listLength={10} restart={mockRestart} />)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('ecogesture_selection.button_go_to_ecogesture')
+ )
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/ecogestures?tab=0')
})
it('should call the restart when user click on the button', async () => {
render(<EcogestureSelectionRestart listLength={10} restart={mockRestart} />)
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('ecogesture_selection.button_continue')
+ )
+ })
expect(mockRestart).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionView.tsx b/src/components/EcogestureSelection/EcogestureSelectionView.tsx
index 749060770df62a29fd23f39092b29e6331b86dd1..df6806976153c93b8bfd98da3c1eda7d5ec3b3d4 100644
--- a/src/components/EcogestureSelection/EcogestureSelectionView.tsx
+++ b/src/components/EcogestureSelection/EcogestureSelectionView.tsx
@@ -19,15 +19,17 @@ const EcogestureSelectionView = () => {
const { t } = useI18n()
const client = useClient()
const navigate = useNavigate()
- const { profileEcogesture } = useAppSelector(state => state.ecolyo)
+ const {
+ profileType,
+ profileEcogesture,
+ profile: { isProfileTypeCompleted },
+ } = useAppSelector(state => state.ecolyo)
const [isLoading, setIsLoading] = useState(true)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const [indexEcogesture, setIndexEcogesture] = useState<number>(0)
const [ecogestureList, setEcogestureList] = useState<Ecogesture[]>([])
const [totalViewed, setTotalViewed] = useState<number>(0)
const [totalAvailable, setTotalAvailable] = useState<number>(0)
- const [openEcogestureSelectionModal, setOpenEcogestureSelectionModal] =
- useState(false)
+ const [openEcSelectionModal, setOpenEcSelectionModal] = useState(false)
const ecogestureService = useMemo(
() => new EcogestureService(client),
@@ -46,16 +48,17 @@ const EcogestureSelectionView = () => {
const validateChoice = useCallback(
async (objective: boolean, doing: boolean) => {
- const updatedEcogesture: Ecogesture =
- await ecogestureService.updateEcogesture({
- ...ecogestureList[indexEcogesture],
- objective: objective,
- doing: doing,
- viewedInSelection: true,
- })
- const updatedList: Ecogesture[] = ecogestureList
- updatedList[indexEcogesture] = updatedEcogesture
- setEcogestureList(updatedList)
+ const updatedEcogesture = await ecogestureService.updateEcogesture({
+ ...ecogestureList[indexEcogesture],
+ objective: objective,
+ doing: doing,
+ viewedInSelection: true,
+ })
+ setEcogestureList(prevList => {
+ const updatedList = [...prevList]
+ updatedList[indexEcogesture] = updatedEcogesture
+ return updatedList
+ })
setIndexEcogesture(prev => prev + 1)
},
[ecogestureList, ecogestureService, indexEcogesture]
@@ -63,33 +66,40 @@ const EcogestureSelectionView = () => {
const restartSelection = useCallback(async () => {
setIsLoading(true)
- const availableList: Ecogesture[] =
- await ecogestureService.getEcogestureListByProfile(profileEcogesture)
- const filteredList: Ecogesture[] = availableList.filter(
- (ecogesture: Ecogesture) => ecogesture.viewedInSelection === false
+ const profile = isProfileTypeCompleted ? profileType : profileEcogesture
+ const availableList =
+ await ecogestureService.getEcogestureListByProfile(profile)
+ const filteredList = availableList.filter(
+ ecogesture => ecogesture.viewedInSelection === false
)
const slicedFilteredList = filteredList.slice(0, 10)
setTotalViewed(availableList.length - filteredList.length)
setEcogestureList(slicedFilteredList)
setIndexEcogesture(0)
setIsLoading(false)
- }, [ecogestureService, profileEcogesture])
+ }, [
+ ecogestureService,
+ isProfileTypeCompleted,
+ profileEcogesture,
+ profileType,
+ ])
useEffect(() => {
let subscribed = true
async function getFilteredList() {
- const availableList: Ecogesture[] =
- await ecogestureService.getEcogestureListByProfile(profileEcogesture)
- const filteredList: Ecogesture[] = availableList.filter(
- (ecogesture: Ecogesture) => ecogesture.viewedInSelection === false
+ const profile = isProfileTypeCompleted ? profileType : profileEcogesture
+ const availableList =
+ await ecogestureService.getEcogestureListByProfile(profile)
+ const filteredList = availableList.filter(
+ ecogesture => ecogesture.viewedInSelection === false
)
const slicedFilteredList = filteredList.slice(0, 10)
if (subscribed) {
if (
- availableList.length === filteredList.length &&
+ availableList.length === slicedFilteredList.length &&
slicedFilteredList.length > 0
) {
- setOpenEcogestureSelectionModal(true)
+ setOpenEcSelectionModal(true)
}
setTotalAvailable(availableList.length)
setTotalViewed(availableList.length - filteredList.length)
@@ -98,11 +108,17 @@ const EcogestureSelectionView = () => {
setIsLoading(false)
}
}
+
getFilteredList()
return () => {
subscribed = false
}
- }, [ecogestureService, profileEcogesture])
+ }, [
+ ecogestureService,
+ profileType,
+ profileEcogesture,
+ isProfileTypeCompleted,
+ ])
const renderEcogestureSelection = () => {
if (indexEcogesture <= ecogestureList.length - 1) {
@@ -133,7 +149,6 @@ const EcogestureSelectionView = () => {
backFunction={() => navigate('/ecogestures')}
/>
<Header
- setHeaderHeight={setHeaderHeight}
desktopTitleKey="common.title_ecogestures_choice"
displayBackArrow={true}
>
@@ -143,7 +158,7 @@ const EcogestureSelectionView = () => {
: ''}
</div>
</Header>
- <Content heightOffset={headerHeight}>
+ <Content>
{isLoading && (
<div className="loaderContainer">
<Loader />
@@ -152,10 +167,10 @@ const EcogestureSelectionView = () => {
{!isLoading && (
<>
{renderEcogestureSelection()}
- {openEcogestureSelectionModal && (
+ {openEcSelectionModal && (
<EcogestureSelectionModal
- open={openEcogestureSelectionModal}
- handleCloseClick={() => setOpenEcogestureSelectionModal(false)}
+ open={openEcSelectionModal}
+ handleCloseClick={() => setOpenEcSelectionModal(false)}
/>
)}
</>
diff --git a/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionView.spec.tsx.snap b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionView.spec.tsx.snap
index d27b25cb74a62bbd1fb43d742645ba4059225031..b93b5cb8ea5343e60e55b3450120df58ffaf7ab9 100644
--- a/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionView.spec.tsx.snap
+++ b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionView.spec.tsx.snap
@@ -16,9 +16,7 @@ exports[`EcogestureSelection component should be rendered correctly 1`] = `
1/1
</div>
</mock-header>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<mock-ecogestureselectiondetail
ecogesture="[object Object]"
title="Bonhomme de neige"
diff --git a/src/components/Exploration/ExplorationFinished.spec.tsx b/src/components/Exploration/ExplorationFinished.spec.tsx
index 132eae2437c7893488c4f6a1b81d4c0edda1322a..8dc48fdbcde9eb7af951be0d7a5414cc81e3b824 100644
--- a/src/components/Exploration/ExplorationFinished.spec.tsx
+++ b/src/components/Exploration/ExplorationFinished.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -26,7 +26,9 @@ describe('ExplorationFinished', () => {
expect(
screen.getByText(userChallengeData[0].exploration.message_success)
).toBeInTheDocument()
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('exploration.button_confirm'))
+ })
expect(mockNavigate).toHaveBeenCalledWith(-1)
})
})
diff --git a/src/components/Exploration/ExplorationOngoing.tsx b/src/components/Exploration/ExplorationOngoing.tsx
index 850f4aabd717e9c86057be61e586670c49080ad6..347081ae2935b8ac21e527414341c2829c2d3059 100644
--- a/src/components/Exploration/ExplorationOngoing.tsx
+++ b/src/components/Exploration/ExplorationOngoing.tsx
@@ -26,9 +26,11 @@ const ExplorationOngoing = ({ userChallenge }: ExplorationOngoingProps) => {
const client = useClient()
const dispatch = useAppDispatch()
const navigate = useNavigate()
+
+ const challengeService = new ChallengeService(client)
+
const startExploration = async () => {
if (userChallenge.exploration.state !== UserExplorationState.ONGOING) {
- const challengeService = new ChallengeService(client)
const updatedChallenge = await challengeService.updateUserChallenge(
userChallenge,
UserChallengeUpdateFlag.EXPLORATION_START
@@ -39,7 +41,6 @@ const ExplorationOngoing = ({ userChallenge }: ExplorationOngoingProps) => {
}
const validExploration = async () => {
- const challengeService = new ChallengeService(client)
const updatedChallenge = await challengeService.updateUserChallenge(
userChallenge,
UserChallengeUpdateFlag.EXPLORATION_DONE
diff --git a/src/components/Exploration/ExplorationView.tsx b/src/components/Exploration/ExplorationView.tsx
index 54106238c9db76a3568939e1d8555de613288457..ccde8fdb71798e3b0d362c581504a822cdfee278 100644
--- a/src/components/Exploration/ExplorationView.tsx
+++ b/src/components/Exploration/ExplorationView.tsx
@@ -3,7 +3,7 @@ import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import { UserExplorationState } from 'enums'
import { UserChallenge } from 'models'
-import React, { useState } from 'react'
+import React from 'react'
import { useAppSelector } from 'store/hooks'
import ExplorationError from './ExplorationError'
import ExplorationFinished from './ExplorationFinished'
@@ -11,7 +11,6 @@ import ExplorationOngoing from './ExplorationOngoing'
const ExplorationView = () => {
const { currentChallenge } = useAppSelector(state => state.ecolyo.challenge)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const renderExploration = (challenge: UserChallenge) => {
switch (challenge.exploration.state) {
@@ -30,11 +29,10 @@ const ExplorationView = () => {
<>
<CozyBar titleKey="common.title_exploration" displayBackArrow={true} />
<Header
- setHeaderHeight={setHeaderHeight}
desktopTitleKey="common.title_exploration"
displayBackArrow={true}
/>
- <Content heightOffset={headerHeight}>
+ <Content>
{currentChallenge && renderExploration(currentChallenge)}
</Content>
</>
diff --git a/src/components/Feedback/FeedbackModal.spec.tsx b/src/components/Feedback/FeedbackModal.spec.tsx
index 3efbb966a636928f2319a6ce8d1e9190cf53a5e8..d4b8e53a77fbdfcd0a68e8f904621914dbaef3c8 100644
--- a/src/components/Feedback/FeedbackModal.spec.tsx
+++ b/src/components/Feedback/FeedbackModal.spec.tsx
@@ -1,9 +1,8 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import FeedbackModal from 'components/Feedback/FeedbackModal'
import React from 'react'
import { Provider } from 'react-redux'
-import * as storeHooks from 'store/hooks'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
// Value coming from jest.config
@@ -17,8 +16,6 @@ jest.mock('services/environment.service', () => {
jest.mock('components/Hooks/useExploration', () => () => ['', jest.fn()])
-const mockAppDispatch = jest.spyOn(storeHooks, 'useAppDispatch')
-
describe('FeedbackModal component', () => {
const store = createMockEcolyoStore({ modal: { isFeedbacksOpen: true } })
beforeEach(() => {
@@ -30,40 +27,21 @@ describe('FeedbackModal component', () => {
<FeedbackModal />
</Provider>
)
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
expect(baseElement).toMatchSnapshot()
})
- describe('FeedbackModal functionalities', () => {
- it('should close modal with the "x" button', async () => {
- render(
- <Provider store={store}>
- <FeedbackModal />
- </Provider>
- )
- await userEvent.click(screen.getAllByRole('button')[0])
- expect(mockAppDispatch).toHaveBeenCalledTimes(1)
- })
-
- it('should close modal with the "later" button', async () => {
- render(
- <Provider store={store}>
- <FeedbackModal />
- </Provider>
- )
- await userEvent.click(screen.getAllByRole('button')[1])
- expect(mockAppDispatch).toHaveBeenCalledTimes(1)
- })
-
- it('should open the SAU link', async () => {
- global.open = jest.fn()
- render(
- <Provider store={store}>
- <FeedbackModal />
- </Provider>
- )
- await userEvent.click(screen.getAllByRole('button')[2])
- expect(window.open).toHaveBeenCalledTimes(1)
- expect(global.open).toHaveBeenCalledWith(`${__SAU_LINK__}?version=0.0.0`)
+ it('should open the SAU link', async () => {
+ global.open = jest.fn()
+ render(
+ <Provider store={store}>
+ <FeedbackModal />
+ </Provider>
+ )
+ await act(async () => {
+ await userEvent.click(screen.getByText('feedback.lets_go'))
})
+ expect(window.open).toHaveBeenCalledTimes(1)
+ expect(global.open).toHaveBeenCalledWith(`${__SAU_LINK__}?version=0.0.0`)
})
})
diff --git a/src/components/FluidChart/FluidChart.tsx b/src/components/FluidChart/FluidChart.tsx
index 943c8f1558f6e5496527d093f50d92cabb68fb45..c03ea3ad25e1174fc717a7193223ccb7a4289fc5 100644
--- a/src/components/FluidChart/FluidChart.tsx
+++ b/src/components/FluidChart/FluidChart.tsx
@@ -3,6 +3,7 @@ import LegendComparisonIcon from 'assets/icons/ico/legendComparison.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import StyledSwitch from 'components/CommonKit/Switch/StyledSwitch'
import useExploration from 'components/Hooks/useExploration'
+import { useMoveToLatestDate } from 'components/Hooks/useMoveToDate'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType, TimeStep, UserExplorationID } from 'enums'
@@ -10,15 +11,8 @@ import { DateTime } from 'luxon'
import React, { useCallback, useEffect, useState } from 'react'
import { useNavigate } from 'react-router-dom'
import ConsumptionService from 'services/consumption.service'
-import DateChartService from 'services/dateChart.service'
-import {
- setCurrentIndex,
- setSelectedDate,
- setShowCompare,
- setShowOfflineData,
-} from 'store/chart/chart.slice'
+import { setShowCompare, setShowOfflineData } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
import { getFluidName, getKonnectorSlug, isKonnectorActive } from 'utils/utils'
import FluidChartSwipe from './FluidChartSwipe'
import HalfHourNoDataFailure from './HalfHourNoDataFailure/HalfHourNoDataFailure'
@@ -26,12 +20,7 @@ import HalfHourUpcoming from './HalfHourUpcoming/HalfHourUpcoming'
import TimeStepSelector from './TimeStepSelector/TimeStepSelector'
import './fluidChart.scss'
-interface FluidChartProps {
- fluidType: FluidType
- setActive: React.Dispatch<React.SetStateAction<boolean>>
-}
-
-const FluidChart = ({ fluidType, setActive }: FluidChartProps) => {
+const FluidChart = ({ fluidType }: { fluidType: FluidType }) => {
const { t } = useI18n()
const client = useClient()
const {
@@ -43,6 +32,9 @@ const FluidChart = ({ fluidType, setActive }: FluidChartProps) => {
const currentFluidStatus = fluidStatus[fluidType]
const isFluidConnected = isKonnectorActive(fluidStatus, fluidType)
+ const { moveToLatestDate } = useMoveToLatestDate(
+ currentFluidStatus?.lastDataDate
+ )
const [, setValidExploration] = useExploration()
const [containsHalfHourData, setContainsHalfHourData] =
useState<boolean>(false)
@@ -109,35 +101,23 @@ const FluidChart = ({ fluidType, setActive }: FluidChartProps) => {
[lowercaseFluidType, lowercaseTimeStep, t]
)
- // TODO if we keep this, use the same existing function
- const moveToDate = () => {
- if (currentFluidStatus?.lastDataDate) {
- const dateChartService = new DateChartService()
- const updatedIndex = dateChartService.defineDateIndex(
- currentTimeStep,
- currentFluidStatus.lastDataDate
- )
- dispatch(setSelectedDate(currentFluidStatus.lastDataDate))
- dispatch(setCurrentIndex(updatedIndex))
- }
- }
-
const toggleModalConnection = () => {
switch (fluidType) {
case FluidType.ELECTRICITY:
- navigate('/sge-connect')
+ navigate('/connect/electricity')
break
case FluidType.GAS:
+ navigate('/connect/gas')
+ break
case FluidType.WATER:
dispatch(setShowOfflineData(false))
- dispatch(openConnectionModal(true))
break
}
}
const LastDataValid = fluidType !== FluidType.MULTIFLUID && (
<div className="lastValidData">
- <Button className="btnText" onClick={moveToDate}>
+ <Button className="btnText" onClick={moveToLatestDate}>
{t('consumption_visualizer.last_valid_data', {
date: currentFluidStatus?.lastDataDate?.toFormat('dd/MM/yy') ?? '-',
})}
@@ -166,7 +146,7 @@ const FluidChart = ({ fluidType, setActive }: FluidChartProps) => {
return (
<>
<div className="fluidchart-content">
- <FluidChartSwipe fluidType={fluidType} setActive={setActive} />
+ <FluidChartSwipe fluidType={fluidType} />
</div>
{showCompare && currentTimeStep !== TimeStep.YEAR && (
<Slide direction="right" in={showCompare}>
diff --git a/src/components/FluidChart/FluidChartSlide.tsx b/src/components/FluidChart/FluidChartSlide.tsx
index 5be0634977f3cfdcd80bd50e2d7f6c64ed82559a..9a66f31ed68559e22efadc6a80a795e3a7ef0fc0 100644
--- a/src/components/FluidChart/FluidChartSlide.tsx
+++ b/src/components/FluidChart/FluidChartSlide.tsx
@@ -8,7 +8,7 @@ import { Datachart } from 'models'
import React, { useEffect, useState } from 'react'
import ConsumptionService from 'services/consumption.service'
import DateChartService from 'services/dateChart.service'
-import { setCurrentDataChart, setLoading } from 'store/chart/chart.slice'
+import { setCurrentDataChart } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import './fluidChartSlide.scss'
@@ -18,7 +18,6 @@ interface FluidChartSlideProps {
width: number
height: number
isSwitching: boolean
- setActive: React.Dispatch<React.SetStateAction<boolean>>
}
const FluidChartSlide = ({
@@ -27,7 +26,6 @@ const FluidChartSlide = ({
width,
height,
isSwitching,
- setActive,
}: FluidChartSlideProps) => {
const client = useClient()
const dispatch = useAppDispatch()
@@ -72,20 +70,19 @@ const FluidChartSlide = ({
),
])
const consumptionService = new ConsumptionService(client)
- const fluidTypeArray: FluidType[] =
- fluidType === FluidType.MULTIFLUID ? fluidTypes : [fluidType]
+ const isMulti = fluidType === FluidType.MULTIFLUID
+ const fluidTypeArray: FluidType[] = isMulti ? fluidTypes : [fluidType]
const graphData = await consumptionService.getGraphData(
timePeriod,
currentTimeStep,
fluidTypeArray,
fluidStatus,
compareTimePeriod,
- fluidType === FluidType.MULTIFLUID
+ isMulti
)
if (subscribed && graphData && graphData?.actualData.length > 0) {
setChartData(graphData)
setIsDataLoaded(true)
- dispatch(setLoading(false))
}
}
}
@@ -120,7 +117,7 @@ const FluidChartSlide = ({
</div>
) : (
<>
- <ConsumptionVisualizer fluidType={fluidType} setActive={setActive} />
+ <ConsumptionVisualizer fluidType={fluidType} />
<BarChart
chartData={chartData}
fluidType={fluidType}
diff --git a/src/components/FluidChart/FluidChartSwipe.tsx b/src/components/FluidChart/FluidChartSwipe.tsx
index 68c3ee7b2105658129224995389a0310f3f88fd9..846e0225eaeb34347e08c1439d64d14ccac4bcb0 100644
--- a/src/components/FluidChart/FluidChartSwipe.tsx
+++ b/src/components/FluidChart/FluidChartSwipe.tsx
@@ -12,15 +12,11 @@ import './fluidChartSwipe.scss'
const VirtualizeSwipeableViews = virtualize(SwipeableViews)
-interface FluidChartSwipeProps {
- fluidType: FluidType
- setActive: React.Dispatch<React.SetStateAction<boolean>>
-}
-
-const FluidChartSwipe = ({ fluidType, setActive }: FluidChartSwipeProps) => {
+const FluidChartSwipe = ({ fluidType }: { fluidType: FluidType }) => {
const dispatch = useAppDispatch()
- const { currentIndex, currentTimeStep, selectedDate, loading } =
- useAppSelector(state => state.ecolyo.chart)
+ const { currentIndex, currentTimeStep, selectedDate } = useAppSelector(
+ state => state.ecolyo.chart
+ )
const swipe = useRef<HTMLDivElement>(null)
const [isSwitching, setIsSwitching] = useState(false)
@@ -53,12 +49,12 @@ const FluidChartSwipe = ({ fluidType, setActive }: FluidChartSwipeProps) => {
dispatch(setCurrentIndex(updatedIndex))
}
- const { height, width } = useChartResize(swipe, loading)
+ const { height, width } = useChartResize(swipe, false)
useEffect(() => {
function initIndex() {
const dateChartService = new DateChartService()
- const updatedIndex: number = dateChartService.defineDateIndex(
+ const updatedIndex = dateChartService.defineDateIndex(
currentTimeStep,
selectedDate
)
@@ -75,7 +71,6 @@ const FluidChartSwipe = ({ fluidType, setActive }: FluidChartSwipeProps) => {
width={width}
height={height}
isSwitching={isSwitching}
- setActive={setActive}
/>
)
diff --git a/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx b/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx
index 60ddf0fedc7ea42905fcea16dbdd6798484559ad..91673e4f66235d9212d9dced10cabb021fbb674f 100644
--- a/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx
+++ b/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import TimeStepSelector from 'components/FluidChart/TimeStepSelector/TimeStepSelector'
import { FluidType, TimeStep } from 'enums'
@@ -66,7 +66,9 @@ describe('TimeStepSelector component', () => {
<TimeStepSelector fluidType={FluidType.WATER} />
</Provider>
)
- await userEvent.click(screen.getAllByRole('listitem')[2])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('listitem')[2])
+ })
expect(setCurrentTimeStepSpy).toHaveBeenCalledTimes(1)
expect(setCurrentTimeStepSpy).toHaveBeenCalledWith(TimeStep.DAY)
expect(setCurrentIndexSpy).toHaveBeenCalledTimes(1)
@@ -85,7 +87,9 @@ describe('TimeStepSelector component', () => {
<TimeStepSelector fluidType={FluidType.WATER} />
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getByText('timestep.today'))
+ })
expect(setCurrentTimeStepSpy).toHaveBeenCalledTimes(1)
expect(setCurrentTimeStepSpy).toHaveBeenCalledWith(TimeStep.WEEK)
expect(setCurrentIndexSpy).toHaveBeenCalledTimes(1)
diff --git a/src/components/Header/CozyBar.spec.tsx b/src/components/Header/CozyBar.spec.tsx
index 3f747796d146ce793df13cf8de468e548830188a..960d681051bc836eac1b1681b6c5615d73a58b05 100644
--- a/src/components/Header/CozyBar.spec.tsx
+++ b/src/components/Header/CozyBar.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import CozyBar from 'components/Header/CozyBar'
import { ScreenType } from 'enums'
@@ -44,7 +44,11 @@ describe('CozyBar component', () => {
</Provider>
)
expect(container).toMatchSnapshot()
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('header.accessibility.button_back')
+ )
+ })
expect(mockedNavigate).toHaveBeenCalled()
})
@@ -56,7 +60,11 @@ describe('CozyBar component', () => {
</Provider>
)
expect(container).toMatchSnapshot()
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('header.accessibility.button_back')
+ )
+ })
expect(mockBackFunction).toHaveBeenCalled()
})
})
@@ -68,7 +76,11 @@ describe('CozyBar component', () => {
</Provider>
)
const updateModalSpy = jest.spyOn(ModalAction, 'openFeedbackModal')
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('header.accessibility.button_open_feedbacks')
+ )
+ })
expect(updateModalSpy).toHaveBeenCalledWith(true)
})
diff --git a/src/components/Header/Header.spec.tsx b/src/components/Header/Header.spec.tsx
index d76305f56773119682e4e2174a3952d2363e121e..0e527784ddfeb7dc0be86ec364b97319f86e6830 100644
--- a/src/components/Header/Header.spec.tsx
+++ b/src/components/Header/Header.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import Header from 'components/Header/Header'
import React from 'react'
@@ -17,7 +17,7 @@ describe('Header component', () => {
it('should be rendered correctly', () => {
const { container } = render(
<Provider store={store}>
- <Header setHeaderHeight={jest.fn()} desktopTitleKey="mockKey" />
+ <Header desktopTitleKey="mockKey" />
</Provider>
)
expect(container).toMatchSnapshot()
@@ -28,26 +28,18 @@ describe('Header component', () => {
const key = 'titleKey'
render(
<Provider store={store}>
- <Header
- desktopTitleKey={key}
- displayBackArrow={true}
- setHeaderHeight={jest.fn()}
- />
+ <Header desktopTitleKey={key} displayBackArrow={true} />
</Provider>
)
expect(screen.getByText(key)).toBeInTheDocument()
expect(
- screen.getByRole('button', { name: 'header.accessibility.button_back' })
+ screen.getByLabelText('header.accessibility.button_back')
).toBeInTheDocument()
})
it('should NOT display back button when displayBackArrow is false', async () => {
render(
<Provider store={store}>
- <Header
- desktopTitleKey="test"
- displayBackArrow={false}
- setHeaderHeight={jest.fn()}
- />
+ <Header desktopTitleKey="test" displayBackArrow={false} />
</Provider>
)
expect(
@@ -61,14 +53,14 @@ describe('Header component', () => {
it('should call navigate -1 when back button is clicked with NO back fn', async () => {
render(
<Provider store={store}>
- <Header
- desktopTitleKey="KEY"
- displayBackArrow={true}
- setHeaderHeight={jest.fn()}
- />
+ <Header desktopTitleKey="KEY" displayBackArrow={true} />
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('header.accessibility.button_back')
+ )
+ })
expect(mockedNavigate).toHaveBeenCalled()
})
it('should call custom back fn when back button is clicked', async () => {
@@ -78,12 +70,15 @@ describe('Header component', () => {
<Header
desktopTitleKey="KEY"
displayBackArrow={true}
- setHeaderHeight={jest.fn()}
backFunction={mockBack}
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('header.accessibility.button_back')
+ )
+ })
expect(mockBack).toHaveBeenCalled()
})
})
@@ -91,11 +86,15 @@ describe('Header component', () => {
it('should call handleClickFeedbacks when feedback button is clicked', async () => {
render(
<Provider store={store}>
- <Header setHeaderHeight={jest.fn()} desktopTitleKey="mockKey" />
+ <Header desktopTitleKey="mockKey" />
</Provider>
)
const updateModalSpy = jest.spyOn(ModalAction, 'openFeedbackModal')
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('header.accessibility.button_open_feedbacks')
+ )
+ })
expect(updateModalSpy).toHaveBeenCalledWith(true)
})
})
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 9eba353d66a8156dd0a837e4a749c8b2271de4c3..b200f36a72621b30f136f0bc0c38706c9eb30129 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -6,6 +6,7 @@ import Icon from 'cozy-ui/transpiled/react/Icon'
import { ScreenType } from 'enums'
import React, { useCallback, useEffect, useRef } from 'react'
import { useNavigate } from 'react-router-dom'
+import { setHeaderHeight } from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import { openFeedbackModal } from 'store/modal/modal.slice'
import './header.scss'
@@ -16,7 +17,6 @@ interface HeaderProps {
displayBackArrow?: boolean
/** additional information to put below the main header */
children?: React.ReactNode
- setHeaderHeight(height: number): void
backFunction?: () => void
}
@@ -25,7 +25,6 @@ const Header = ({
desktopTitleKey,
displayBackArrow,
children,
- setHeaderHeight,
backFunction,
}: HeaderProps) => {
const { t } = useI18n()
@@ -50,8 +49,8 @@ const Header = ({
useEffect(() => {
const headerHeight = header.current?.clientHeight || 0
const adjustment = screenType === ScreenType.MOBILE ? cozyBarHeight : 0
- setHeaderHeight(headerHeight - adjustment)
- }, [screenType, children, setHeaderHeight])
+ dispatch(setHeaderHeight(headerHeight - adjustment))
+ }, [screenType, children, dispatch])
return (
<header ref={header}>
diff --git a/src/components/Hooks/useKonnectorAuth.tsx b/src/components/Hooks/useKonnectorAuth.tsx
index ce50e44044a4cc66403a78fd400233bdb32adcd4..9f1dcd0909c26853a619e1a628dc7d50e22c9a41 100644
--- a/src/components/Hooks/useKonnectorAuth.tsx
+++ b/src/components/Hooks/useKonnectorAuth.tsx
@@ -1,57 +1,105 @@
import * as Sentry from '@sentry/react'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { FluidSlugType, FluidType } from 'enums'
-import { AccountAuthData, AccountSgeData, FluidConnection } from 'models'
+import { FluidType } from 'enums'
+import {
+ AccountEGLData,
+ AccountGRDFData,
+ AccountSgeData,
+ FluidConnection,
+ SgeStore,
+} from 'models'
import { useState } from 'react'
import AccountService from 'services/account.service'
import ConnectionService from 'services/connection.service'
-import { setLoading } from 'store/chart/chart.slice'
import { updateFluidConnection } from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import logApp from 'utils/logger'
+/**
+ * Format local state data to a format expected by konnectors
+ */
+const formatAuthData = ({
+ eglAuthData,
+ grdfAuthData,
+ sgeAuthData,
+}: {
+ eglAuthData?: AccountEGLData
+ sgeAuthData?: SgeStore
+ grdfAuthData?: AccountGRDFData
+}): AccountEGLData | AccountSgeData | AccountGRDFData => {
+ if (eglAuthData) {
+ const konnectorFields: AccountEGLData = {
+ login: eglAuthData.login,
+ password: eglAuthData.password,
+ }
+ return konnectorFields
+ // TODO could be simplified with satisfies but parser error
+ } else if (grdfAuthData) {
+ const konnectorFields: AccountGRDFData = {
+ pce: grdfAuthData.pce,
+ email: grdfAuthData.email,
+ lastname: grdfAuthData.lastname,
+ firstname: grdfAuthData.firstname,
+ postalCode: grdfAuthData.postalCode,
+ }
+ return konnectorFields
+ } else if (sgeAuthData) {
+ const konnectorFields: AccountSgeData = {
+ pointId: sgeAuthData?.pdl?.toString() ?? '',
+ firstname: sgeAuthData?.firstName ?? '',
+ lastname: sgeAuthData?.lastName ?? '',
+ address: sgeAuthData?.address ?? '',
+ postalCode: sgeAuthData?.zipCode?.toString() ?? '',
+ city: sgeAuthData?.city ?? '',
+ }
+ return konnectorFields
+ } else {
+ throw new Error('Expected data but got none')
+ }
+}
+
const useKonnectorAuth = (
fluidType: FluidType,
- login?: string,
- password?: string
+ options: {
+ eglAuthData?: AccountEGLData
+ sgeAuthData?: SgeStore
+ grdfAuthData?: AccountGRDFData
+ }
): [() => Promise<null | undefined>, () => Promise<void>, string] => {
const client = useClient()
const { t } = useI18n()
const dispatch = useAppDispatch()
- const { sgeConnect, fluidStatus } = useAppSelector(
- state => state.ecolyo.global
- )
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
const currentFluidStatus = fluidStatus[fluidType]
- const konnectorSlug: FluidSlugType =
- currentFluidStatus.connection.konnectorConfig.slug
+ const konnectorSlug = currentFluidStatus.connection.konnectorConfig.slug
const [connectError, setConnectError] = useState<string>('')
const connect = async () => {
- const connectionService = new ConnectionService(client)
try {
- const { account: _account, trigger: _trigger } =
- konnectorSlug === FluidSlugType.WATER
- ? await connectionService.connectNewUser(konnectorSlug, {
- login: login ?? '',
- password: password,
- })
- : await connectionService.connectNewUser(
- konnectorSlug,
- undefined,
- sgeConnect
- )
- if (!_trigger || !_account) {
+ logApp('info', `useKonnectorAuth connect ${konnectorSlug}`)
+ const connectionService = new ConnectionService(client)
+ const accountAuthData = formatAuthData({
+ eglAuthData: options.eglAuthData,
+ grdfAuthData: options.grdfAuthData,
+ sgeAuthData: options.sgeAuthData,
+ })
+
+ const { account, trigger } = await connectionService.connectNewUser(
+ konnectorSlug,
+ accountAuthData
+ )
+
+ if (!trigger || !account) {
setConnectError(t('konnector_form.error_account_creation'))
return null
}
const updatedConnection: FluidConnection = {
...currentFluidStatus.connection,
- account: _account,
- trigger: _trigger,
+ account: account,
+ trigger: trigger,
shouldLaunchKonnector: true,
}
- setLoading(false)
dispatch(
updateFluidConnection({
fluidType: currentFluidStatus.fluidType,
@@ -59,45 +107,42 @@ const useKonnectorAuth = (
})
)
} catch (error) {
- setLoading(false)
logApp.error(error)
Sentry.captureException(error)
}
}
const update = async () => {
- if (currentFluidStatus.connection.account) {
- const _account = currentFluidStatus.connection.account
- let auth: AccountAuthData | AccountSgeData
- if (konnectorSlug === FluidSlugType.WATER) {
- auth = {
- login: login,
- password: password,
- } as AccountAuthData
- } else {
- auth = {
- pointId: sgeConnect.pdl ? sgeConnect.pdl.toString() : '',
- firstname: sgeConnect.firstName,
- lastname: sgeConnect.lastName,
- address: sgeConnect.address,
- postalCode: sgeConnect.zipCode ? sgeConnect.zipCode.toString() : '',
- city: sgeConnect.city,
- } as AccountSgeData
- }
- _account.auth = auth
- const accountService = new AccountService(client)
- const updatedAccount = await accountService.updateAccount(_account)
- const updatedConnection: FluidConnection = {
- ...currentFluidStatus.connection,
- account: updatedAccount,
- shouldLaunchKonnector: true,
- }
- dispatch(
- updateFluidConnection({
- fluidType: currentFluidStatus.fluidType,
- fluidConnection: updatedConnection,
+ try {
+ logApp('info', `useKonnectorAuth update ${konnectorSlug}`)
+ if (currentFluidStatus.connection.account) {
+ const accountAuthData = formatAuthData({
+ eglAuthData: options.eglAuthData,
+ grdfAuthData: options.grdfAuthData,
+ sgeAuthData: options.sgeAuthData,
})
- )
+
+ const newAccount = structuredClone(
+ currentFluidStatus.connection.account
+ )
+ newAccount.auth = accountAuthData
+ const accountService = new AccountService(client)
+ const updatedAccount = await accountService.updateAccount(newAccount)
+ const updatedConnection: FluidConnection = {
+ ...currentFluidStatus.connection,
+ account: updatedAccount,
+ shouldLaunchKonnector: true,
+ }
+ dispatch(
+ updateFluidConnection({
+ fluidType: currentFluidStatus.fluidType,
+ fluidConnection: updatedConnection,
+ })
+ )
+ }
+ } catch (error) {
+ logApp.error(error)
+ Sentry.captureException(error)
}
}
return [connect, update, connectError]
diff --git a/src/components/Hooks/useMoveToDate.tsx b/src/components/Hooks/useMoveToDate.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..d0a432540b4c12746a40043a270207fe8b38f2f0
--- /dev/null
+++ b/src/components/Hooks/useMoveToDate.tsx
@@ -0,0 +1,22 @@
+import { DateTime } from 'luxon'
+import DateChartService from 'services/dateChart.service'
+import { setCurrentIndex, setSelectedDate } from 'store/chart/chart.slice'
+import { useAppDispatch, useAppSelector } from 'store/hooks'
+
+export const useMoveToLatestDate = (lastDataDate: DateTime | null) => {
+ const dispatch = useAppDispatch()
+ const { currentTimeStep } = useAppSelector(state => state.ecolyo.chart)
+
+ const moveToLatestDate = () => {
+ if (!lastDataDate) return
+ const dateChartService = new DateChartService()
+ const updatedIndex = dateChartService.defineDateIndex(
+ currentTimeStep,
+ lastDataDate
+ )
+ dispatch(setSelectedDate(lastDataDate))
+ dispatch(setCurrentIndex(updatedIndex))
+ }
+
+ return { moveToLatestDate }
+}
diff --git a/src/components/Hooks/useUserInstanceSettings.tsx b/src/components/Hooks/useUserInstanceSettings.tsx
index 8868e24e1312dbf1de8c01807568eb030cdd23fa..5fe6bfdc2973de63ba118edfe9952021c1f80525 100644
--- a/src/components/Hooks/useUserInstanceSettings.tsx
+++ b/src/components/Hooks/useUserInstanceSettings.tsx
@@ -1,15 +1,30 @@
+import * as Sentry from '@sentry/react'
import { useClient } from 'cozy-client'
import get from 'lodash/get'
-import { UserInstanceSettings, UserInstanceSettingsAttributes } from 'models'
import { useEffect, useState } from 'react'
-const useUserInstanceSettings = (): UserInstanceSettings => {
+interface UserInstanceSettingsAttributes {
+ auth_mode?: string
+ auto_update?: boolean
+ context?: string
+ email?: string
+ locale?: string
+ oidc_id?: string
+ onboarding_finished?: boolean
+ public_name: string
+ tos?: string
+ tos_latest?: string
+ uuid?: string
+}
+
+const useUserInstanceSettings = (): {
+ instanceSettings: UserInstanceSettingsAttributes
+} => {
const client = useClient()
const [settings, setSettings] = useState<UserInstanceSettingsAttributes>({
// eslint-disable-next-line camelcase
public_name: '',
})
- const [fetchStatus, setFetchStatus] = useState<string>('idle')
useEffect(() => {
const fetchData = async () => {
@@ -18,17 +33,16 @@ const useUserInstanceSettings = (): UserInstanceSettings => {
.getStackClient()
.fetchJSON('GET', '/settings/instance')
setSettings(get(response, 'data.attributes'))
- setFetchStatus('loaded')
} catch (error) {
- setFetchStatus('failed')
+ console.error(error)
+ Sentry.captureException(error)
}
}
fetchData()
}, [client])
return {
- data: settings,
- fetchStatus,
+ instanceSettings: settings,
}
}
diff --git a/src/components/Konnector/ConnectionNotFound/ConnectionNotFound.spec.tsx b/src/components/Konnector/ConnectionNotFound/ConnectionNotFound.spec.tsx
index 1d4cf06cba60acf8e3a9e649986e10dd30811097..72388b748c22057ec7520884c6de66ef07bdd6ba 100644
--- a/src/components/Konnector/ConnectionNotFound/ConnectionNotFound.spec.tsx
+++ b/src/components/Konnector/ConnectionNotFound/ConnectionNotFound.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import ConnectionNotFound from './ConnectionNotFound'
@@ -16,8 +16,9 @@ describe('ConnectionNotFound component test', () => {
it('should open konnector url when button is clicked', async () => {
global.open = jest.fn()
render(<ConnectionNotFound konnectorSlug={konnectorSlug} />)
- await userEvent.click(screen.getByRole('button'))
-
+ await act(async () => {
+ await userEvent.click(screen.getByText('konnector_form.button_install'))
+ })
expect(global.open).toHaveBeenCalledWith(
'http://localhost/#/discover/enedissgegrandlyon',
'_blank'
diff --git a/src/components/Konnector/ConnectionResult/ConnectionResult.tsx b/src/components/Konnector/ConnectionResult/ConnectionResult.tsx
index 746c5878a3e628c2fc31626c46272bbf1605f4fd..232a418355a9ac57925d69043d25d7e8d4358818 100644
--- a/src/components/Konnector/ConnectionResult/ConnectionResult.tsx
+++ b/src/components/Konnector/ConnectionResult/ConnectionResult.tsx
@@ -2,18 +2,11 @@ import Button from '@material-ui/core/Button'
import warningDark from 'assets/icons/ico/warning-dark.svg'
import warningWhite from 'assets/icons/ico/warning-white.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import Loader from 'components/Loader/Loader'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { FluidType, KonnectorUpdate } from 'enums'
import { DateTime } from 'luxon'
-import {
- Account,
- AccountSgeData,
- FluidConnection,
- FluidStatus,
- Trigger,
-} from 'models'
+import { AccountSgeData, FluidConnection, FluidStatus } from 'models'
import React, { useCallback, useEffect, useState } from 'react'
import AccountService from 'services/account.service'
import DateChartService from 'services/dateChart.service'
@@ -25,7 +18,6 @@ import {
} from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import { getKonnectorUpdateError } from 'utils/utils'
-import DeleteGRDFAccountModal from '../../Connection/GRDFDeleteAccountModal/DeleteGRDFAccountModal'
import './connectionResult.scss'
interface ConnectionResultProps {
@@ -42,24 +34,17 @@ const ConnectionResult = ({
const dispatch = useAppDispatch()
const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
const currentFluidStatus = fluidStatus[fluidType]
- const account: Account | null = currentFluidStatus.connection.account
+ const account = currentFluidStatus.connection.account
const [deleting, setDeleting] = useState<boolean>(false)
- const [updating, setUpdating] = useState<boolean>(false)
const [lastExecutionDate, setLastExecutionDate] = useState<string | DateTime>(
'-'
)
const [konnectorError, setKonnectorError] = useState<string>('')
const [status, setStatus] = useState<string>('')
const [outDatedDataDays, setOutDatedDataDays] = useState<number | null>(null)
- const [openGRDFDeletionModal, setOpenGRDFDeletionModal] =
- useState<boolean>(false)
- const toggleGRDFDeletionModal = useCallback(() => {
- setOpenGRDFDeletionModal(prev => !prev)
- }, [])
const updateKonnector = async () => {
- setUpdating(true)
setStatus('')
setLastExecutionDate('-')
setKonnectorError('')
@@ -74,7 +59,6 @@ const ConnectionResult = ({
fluidConnection: updatedConnection,
})
)
- setUpdating(false)
}
const deleteAccountsAndTriggers = useCallback(async () => {
@@ -83,12 +67,11 @@ const ConnectionResult = ({
if (account) {
const accountService = new AccountService(client)
const triggerService = new TriggerService(client)
- const accounts: Account[] = await accountService.getAccountsByType(
+ const accounts = await accountService.getAccountsByType(
account.account_type
)
for (const _account of accounts) {
- const trigger: Trigger | null =
- await triggerService.getTriggerForAccount(_account)
+ const trigger = await triggerService.getTriggerForAccount(_account)
if (trigger) await triggerService.deleteTrigger(trigger)
await accountService.deleteAccount(_account)
}
@@ -123,37 +106,35 @@ const ConnectionResult = ({
}
}, [lastExecutionDate])
- const handleRefreshConsent = useCallback(
- (fluidType: FluidType) => {
- if (fluidType == FluidType.ELECTRICITY) {
- const accountData = currentFluidStatus.connection.account
- ?.auth as AccountSgeData
- // store the previous account data since the onDelete will remove account from DB
- dispatch(
- updateSgeStore({
- currentStep: 0,
- firstName: accountData.firstname,
- lastName: accountData.lastname,
- pdl: parseInt(accountData.pointId),
- address: accountData.address,
- zipCode: parseInt(accountData.postalCode),
- city: accountData.city,
- dataConsent: true,
- pdlConfirm: true,
- shouldLaunchAccount: true,
- })
- )
- dispatch(setShouldRefreshConsent(true))
- } else {
- deleteAccountsAndTriggers()
- }
- },
- [
- deleteAccountsAndTriggers,
- dispatch,
- currentFluidStatus.connection.account?.auth,
- ]
- )
+ const handleRefreshConsent = useCallback(() => {
+ if (fluidType == FluidType.ELECTRICITY) {
+ const accountData = currentFluidStatus.connection.account
+ ?.auth as AccountSgeData
+ // store the previous account data since the onDelete will remove account from DB
+ dispatch(
+ updateSgeStore({
+ currentStep: 0,
+ firstName: accountData.firstname,
+ lastName: accountData.lastname,
+ pdl: parseInt(accountData.pointId),
+ address: accountData.address,
+ zipCode: parseInt(accountData.postalCode),
+ city: accountData.city,
+ dataConsent: true,
+ pdlConfirm: true,
+ shouldLaunchAccount: true,
+ })
+ )
+ dispatch(setShouldRefreshConsent(true))
+ } else {
+ deleteAccountsAndTriggers()
+ }
+ }, [
+ fluidType,
+ currentFluidStatus.connection.account?.auth,
+ dispatch,
+ deleteAccountsAndTriggers,
+ ])
useEffect(() => {
if (currentFluidStatus.connection.triggerState?.last_success) {
@@ -175,9 +156,8 @@ const ConnectionResult = ({
)
)
}
- if (isOutdated()) {
- setOutDatedDataDays(isOutdated())
- }
+ const outdated = isOutdated()
+ if (outdated) setOutDatedDataDays(outdated)
}, [currentFluidStatus.connection.triggerState, isOutdated])
const getFluidTypeTranslation = (fluidType: FluidType) => {
@@ -191,9 +171,7 @@ const ConnectionResult = ({
}
}
- const consentError =
- konnectorError === KonnectorUpdate.ERROR_CONSENT_FORM_GAS ||
- konnectorError === KonnectorUpdate.ERROR_UPDATE_OAUTH
+ const consentError = konnectorError === KonnectorUpdate.ERROR_UPDATE_OAUTH
/**
* Get Konnector state, possible values:
@@ -206,15 +184,12 @@ const ConnectionResult = ({
// First check if there is partner error from backoffice
if (currentFluidStatus.maintenance) {
return (
- <div className="connection-caption text-16-normal">
- <div className="text-16-normal">
- <div className="connection-caption">
- {t('konnector_form.wait_end_issue')}
- </div>
- </div>
+ <div className="connection-caption">
+ {t('konnector_form.wait_end_issue')}
</div>
)
}
+
// Else check if konnector is in error state
if (status === 'errored') {
return (
@@ -246,63 +221,42 @@ const ConnectionResult = ({
)
}
+ const getErrorClassName = (): string => {
+ if (
+ status === 'errored' &&
+ !hasUpdatedToday() &&
+ !currentFluidStatus.maintenance
+ ) {
+ return 'connection-update-errored'
+ }
+ return ''
+ }
+
return (
<div className="connection-update-result">
- <div
- className={
- status === 'errored' &&
- !hasUpdatedToday() &&
- !currentFluidStatus.maintenance
- ? 'connection-update-errored'
- : ''
- }
- >
- {getConnectionStatus()}
- </div>
+ <div className={getErrorClassName()}>{getConnectionStatus()}</div>
<div className="inline-buttons">
{!consentError && (
<Button
aria-label={t('konnector_form.accessibility.button_disconnect')}
- onClick={
- fluidType === FluidType.GAS
- ? toggleGRDFDeletionModal
- : deleteAccountsAndTriggers
- }
- disabled={updating || deleting}
+ onClick={deleteAccountsAndTriggers}
+ disabled={deleting}
className="btnSecondary"
>
- {deleting
- ? t('konnector_form.loading')
- : t('konnector_form.button_disconnect')}
+ {t(`konnector_form.${deleting ? 'loading' : 'button_disconnect'}`)}
</Button>
)}
<Button
aria-label={t('konnector_form.accessibility.button_update')}
- onClick={
- consentError
- ? () => handleRefreshConsent(fluidType)
- : updateKonnector
- }
- disabled={updating || deleting}
+ onClick={consentError ? handleRefreshConsent : updateKonnector}
+ disabled={deleting}
className="btnPrimary"
>
- {updating && <Loader color="black" />}
- {!updating && (
- <div>
- {consentError
- ? t('konnector_form.button_oauth_reload')
- : t('konnector_form.button_update')}
- </div>
- )}
+ {consentError
+ ? t('konnector_form.button_oauth_reload')
+ : t('konnector_form.button_update')}
</Button>
</div>
- {fluidType === FluidType.GAS && (
- <DeleteGRDFAccountModal
- open={openGRDFDeletionModal}
- handleCloseClick={toggleGRDFDeletionModal}
- deleteAccount={deleteAccountsAndTriggers}
- />
- )}
</div>
)
}
diff --git a/src/components/Konnector/KonnectorModal.spec.tsx b/src/components/Konnector/KonnectorModal.spec.tsx
index cc72f6b71ae36a23d8600d26eecd55e8dcfacbc0..bd2f5cacac53519318ffdbdbc6cc4952b35729b3 100644
--- a/src/components/Konnector/KonnectorModal.spec.tsx
+++ b/src/components/Konnector/KonnectorModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { FluidType, KonnectorError } from 'enums'
import React from 'react'
@@ -18,12 +18,11 @@ describe('KonnectorModal component', () => {
<Provider store={store}>
<KonnectorModal
open={true}
- isUpdating={false}
state={null}
error={null}
fluidType={FluidType.ELECTRICITY}
handleCloseClick={mockHandleCloseClick}
- isLogging={false}
+ isVerifyingIdentity={false}
account={null}
handleAccountDeletion={jest.fn()}
/>
@@ -36,12 +35,11 @@ describe('KonnectorModal component', () => {
<Provider store={store}>
<KonnectorModal
open={true}
- isUpdating={true}
state={null}
error={null}
fluidType={FluidType.ELECTRICITY}
handleCloseClick={mockHandleCloseClick}
- isLogging={false}
+ isVerifyingIdentity={false}
account={null}
handleAccountDeletion={jest.fn()}
/>
@@ -56,18 +54,19 @@ describe('KonnectorModal component', () => {
<Provider store={store}>
<KonnectorModal
open={true}
- isUpdating={false}
state="errored"
error={null}
fluidType={FluidType.ELECTRICITY}
handleCloseClick={mockHandleCloseClick}
- isLogging={false}
+ isVerifyingIdentity={false}
account={null}
handleAccountDeletion={jest.fn()}
/>
</Provider>
)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('konnector_modal.button_validate'))
+ })
expect(mockHandleCloseClick).toHaveBeenCalled()
})
it('should render login error', async () => {
@@ -75,52 +74,47 @@ describe('KonnectorModal component', () => {
<Provider store={store}>
<KonnectorModal
open={true}
- isUpdating={false}
state="error"
error={KonnectorError.LOGIN_FAILED}
fluidType={FluidType.ELECTRICITY}
handleCloseClick={mockHandleCloseClick}
- isLogging={false}
+ isVerifyingIdentity={false}
account={null}
handleAccountDeletion={jest.fn()}
/>
</Provider>
)
expect(
- baseElement.getElementsByClassName('kce-picto-txt')[0]
+ baseElement.getElementsByClassName('headerError')[0]
).toBeInTheDocument()
})
it('should render unknown error', async () => {
- const { baseElement } = render(
+ render(
<Provider store={store}>
<KonnectorModal
open={true}
- isUpdating={false}
state="error"
error={null}
fluidType={FluidType.ELECTRICITY}
handleCloseClick={mockHandleCloseClick}
- isLogging={false}
+ isVerifyingIdentity={false}
account={null}
handleAccountDeletion={jest.fn()}
/>
</Provider>
)
- expect(
- baseElement.getElementsByClassName('err-data-2')[0]
- ).toBeInTheDocument()
+ expect(screen.getByText('konnector_modal.error_data_2')).toBeInTheDocument()
})
it('should render update error', async () => {
const { baseElement } = render(
<Provider store={store}>
<KonnectorModal
open={true}
- isUpdating={true}
state={null}
error={null}
fluidType={FluidType.WATER}
handleCloseClick={mockHandleCloseClick}
- isLogging={false}
+ isVerifyingIdentity={false}
account={null}
handleAccountDeletion={jest.fn()}
/>
@@ -130,4 +124,22 @@ describe('KonnectorModal component', () => {
baseElement.getElementsByClassName('waiting-text')[0]
).toBeInTheDocument()
})
+
+ it('should render nothing if error is CHALLENGE_ASKED on Gas', () => {
+ render(
+ <Provider store={store}>
+ <KonnectorModal
+ open={true}
+ state={null}
+ error={KonnectorError.CHALLENGE_ASKED}
+ fluidType={FluidType.GAS}
+ handleCloseClick={mockHandleCloseClick}
+ isVerifyingIdentity={false}
+ account={null}
+ handleAccountDeletion={jest.fn()}
+ />
+ </Provider>
+ )
+ expect(screen.queryByRole('dialog')).toBeNull()
+ })
})
diff --git a/src/components/Konnector/KonnectorModal.tsx b/src/components/Konnector/KonnectorModal.tsx
index 9817b2864295223d368ff67baa6611b879e6c72f..df53e6c64396724c7d187e5ee6500f9280165246 100644
--- a/src/components/Konnector/KonnectorModal.tsx
+++ b/src/components/Konnector/KonnectorModal.tsx
@@ -17,13 +17,15 @@ import { FluidType, KonnectorError } from 'enums'
import { shuffle } from 'lodash'
import { Account } from 'models'
import React, { useCallback, useEffect, useMemo, useState } from 'react'
+import { useAppSelector } from 'store/hooks'
+import { getFluidName } from 'utils/utils'
import KonnectorModalFooter from './KonnectorModalFooter'
import './konnectorModal.scss'
interface KonnectorModalProps {
open: boolean
- isUpdating: boolean
- isLogging: boolean
+ /** Only used for SGE when searching for user identity */
+ isVerifyingIdentity: boolean
state: string | null
error: KonnectorError | null
fluidType: FluidType
@@ -34,8 +36,7 @@ interface KonnectorModalProps {
const KonnectorModal = ({
open,
- isUpdating,
- isLogging,
+ isVerifyingIdentity,
state,
error,
fluidType,
@@ -44,26 +45,30 @@ const KonnectorModal = ({
account,
}: KonnectorModalProps) => {
const { t } = useI18n()
- const fluidName: string = FluidType[fluidType]
+ const fluidName = getFluidName(fluidType)
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+ const isUpdating = fluidStatus[fluidType].connection.isUpdating
const [index, setIndex] = useState<number>(0)
+ /** Only used for enedis to see common errors */
+ const [showCommonErrors, setShowCommonErrors] = useState(false)
+
const shuffledWaitingTexts = useMemo(() => {
if (fluidType) {
return shuffle(connectionWaitingText)
- } else {
- return connectionWaitingText
}
+ return connectionWaitingText
}, [fluidType])
+
const firstConnectionWaitingTexts = firstConnectionWaitingText.concat(
...shuffledWaitingTexts
)
- const [showCommonErrors, setShowCommonErrors] = useState(false)
const getUpdatingText = useCallback(() => {
return (
<div className="kmodal-waiting-text text-18-italic">
{shuffledWaitingTexts.map((text, idx) => (
<div
- key={text.second}
+ key={idx}
className={classNames('waiting-text', {
['show']: idx === index % shuffledWaitingTexts.length,
})}
@@ -79,12 +84,12 @@ const KonnectorModal = ({
const getConnectionText = useCallback(() => {
return (
<div className="kmodal-waiting-text text-18-italic">
- {isLogging ? (
+ {isVerifyingIdentity ? (
<p className="text-18-white">{t('konnector_modal.logging_txt')}</p>
) : (
firstConnectionWaitingTexts.map((text, idx) => (
<div
- key={text.second}
+ key={idx}
className={classNames('waiting-text', {
['show']: idx === index % firstConnectionWaitingTexts.length,
})}
@@ -96,29 +101,29 @@ const KonnectorModal = ({
)}
</div>
)
- }, [firstConnectionWaitingTexts, index, isLogging, t])
+ }, [firstConnectionWaitingTexts, index, isVerifyingIdentity, t])
/** Returns connection success contents, depending on the fluid and update status */
const connectionSuccessContent = () => (
<div className="konnector-config">
<Icon icon={successIcon} size={48} />
- <div className="kcs-picto-txt text-20-bold">
+ <div className="headerSuccess text-20-bold">
{t(`konnector_modal.success_${isUpdating ? 'update_' : ''}txt`)}
</div>
<b>
{t(
`konnector_modal.success_data_${
isUpdating ? 'update_' : ''
- }${fluidName.toLowerCase()}`
+ }${fluidName}`
)}
</b>
- <p
- style={{ fontWeight: 400 }}
+ <div
+ className="light"
dangerouslySetInnerHTML={{
__html: t(
`konnector_modal.success_data_additional_${
isUpdating ? 'update_' : ''
- }${fluidName.toLowerCase()}`
+ }${fluidName}`
),
}}
/>
@@ -136,6 +141,10 @@ const KonnectorModal = ({
}
}, [open, state])
+ if (fluidType === FluidType.GAS && error === KonnectorError.CHALLENGE_ASKED) {
+ return null
+ }
+
return (
<Dialog
open={open}
@@ -155,12 +164,13 @@ const KonnectorModal = ({
{t('konnector_modal.accessibility.window_title')}
</div>
<div className="kmodal-content">
- {open && !state ? (
+ {/* NEITHER ERROR NOR SUCCESS => LOADING */}
+ {!state ? (
<>
<Loader fluidType={fluidType} />
- {!isLogging && (
- <div className="kmodal-content-text kmodal-content-text-center text-16-normal">
- <div className="kc-wait text-16-bold">
+ {!isVerifyingIdentity && (
+ <div className="kmodal-content-text text-16-normal">
+ <div className="text-16-bold">
{t(
`konnector_modal.loading_data${isUpdating ? '_update' : ''}`
)}
@@ -172,6 +182,7 @@ const KonnectorModal = ({
</>
) : (
<>
+ {/* ERROR OR SUCCESS */}
<div className="kmodal-info">
{state === ERROR_EVENT && (
<>
@@ -179,35 +190,34 @@ const KonnectorModal = ({
// LOGIN FAILED FOR ENEDIS AND EGL
<div className="konnector-config">
<Icon icon={errorIcon} size={48} />
- <div className="kce-picto-txt text-20-bold">
+ <div className="headerError text-20-bold">
{t('konnector_modal.error_txt')}
</div>
<div>
{t(
`konnector_modal.error_credentials_${
isUpdating ? 'update_' : ''
- }${fluidName.toLowerCase()}`
+ }${fluidName}`
)}
</div>
{fluidType === FluidType.ELECTRICITY && !isUpdating && (
<div className="elec-fail">
{t(
- `konnector_modal.error_credentials_${fluidName.toLowerCase()}_2`
+ `konnector_modal.error_credentials_${fluidName}_2`
)}
</div>
)}
- {/* Show common errors */}
+ {/* Show common errors for enedis */}
{fluidType === FluidType.ELECTRICITY && (
<>
- {!showCommonErrors && (
+ {!showCommonErrors ? (
<Button
- className="btnText commonErrors"
+ className="btnText"
onClick={() => setShowCommonErrors(true)}
>
{t('konnector_modal.show_common_error')}
</Button>
- )}
- {showCommonErrors && (
+ ) : (
<div
className="commonErrorsList"
dangerouslySetInnerHTML={{
@@ -225,7 +235,7 @@ const KonnectorModal = ({
isUpdating &&
fluidType === FluidType.ELECTRICITY && (
// MISMATCH UPDATE ERROR ENEDIS
- <div className="kce-picto-txt konnector-config mismatch">
+ <div className="headerError konnector-config mismatch">
<Icon icon={EnedisIcon} width={120} height={80} />
<div className="title text-20-bold">
{t('konnector_modal.mismatch.title')}
@@ -241,44 +251,41 @@ const KonnectorModal = ({
</div>
</div>
)}
- {error === KonnectorError.CHALLENGE_ASKED &&
+ {error ===
+ KonnectorError.USER_ACTION_NEEDED_ACCOUNT_REMOVED &&
fluidType === FluidType.GAS && (
- // CONSENT FORM ERROR GRDF
<div className="konnector-config">
<Icon icon={errorIcon} size={48} />
- <div className="kce-picto-txt text-20-bold">
+ <div className="headerError text-20-bold">
{t('konnector_modal.error_txt')}
</div>
- <div className="title text-20-bold">
+ <div className="title text-16-bold">
{t('konnector_modal.error_consent_form_gas_title')}
</div>
- <div className="err-data-2">
- {t('konnector_modal.error_consent_form_gas_content')}
- </div>
- <div className="err-data-2">
- {t(
- 'konnector_modal.error_consent_form_gas_content_2'
- )}
+ <div className="light text-14-regular">
+ {t('konnector_modal.error_consent_form_gas_report')}
</div>
</div>
)}
+
{error !== KonnectorError.LOGIN_FAILED &&
error !== KonnectorError.TERMS_VERSION_MISMATCH &&
- error !== KonnectorError.CHALLENGE_ASKED && (
+ error !==
+ KonnectorError.USER_ACTION_NEEDED_ACCOUNT_REMOVED && (
// DEFAULT CASE
<div className="konnector-config">
<Icon icon={errorIcon} size={48} />
- <div className="kce-picto-txt text-20-bold">
+ <div className="headerError text-20-bold">
{t('konnector_modal.error_txt')}
</div>
- <div>
+ <div className="text-15-bold">
{t(
`konnector_modal.error_data_${
isUpdating ? 'update_' : ''
- }${fluidName.toLowerCase()}`
+ }${fluidName}`
)}
</div>
- <div className="err-data-2">
+ <div className="text-14-regular">
{t('konnector_modal.error_data_2')}
</div>
</div>
diff --git a/src/components/Konnector/KonnectorModalFooter.spec.tsx b/src/components/Konnector/KonnectorModalFooter.spec.tsx
index 60d45605aa18477f48d48b7f5171550cfcb8ea8d..42e3e61b7f0d93c4aaa63ae640775e09ce726a86 100644
--- a/src/components/Konnector/KonnectorModalFooter.spec.tsx
+++ b/src/components/Konnector/KonnectorModalFooter.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { ERROR_EVENT } from 'cozy-harvest-lib/dist/models/flowEvents'
import { KonnectorError } from 'enums'
@@ -92,22 +92,6 @@ describe('KonnectorModalFooter component', () => {
).toBeInTheDocument()
})
- it('should close the modal', async () => {
- render(
- <Provider store={store}>
- <KonnectorModalFooter
- state={ERROR_EVENT}
- error={KonnectorError.LOGIN_FAILED}
- handleCloseClick={mockClose}
- handleAccountDeletion={mockDelete}
- account={null}
- isUpdating={false}
- />
- </Provider>
- )
- await userEvent.click(screen.getByRole('button'))
- expect(mockClose).toHaveBeenCalled()
- })
it('should go back to login', async () => {
render(
<Provider store={store}>
@@ -121,7 +105,9 @@ describe('KonnectorModalFooter component', () => {
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(screen.getByText('konnector_modal.button_go'))
+ })
expect(mockDelete).toHaveBeenCalled()
expect(mockedNavigate).toHaveBeenCalledTimes(1)
})
@@ -138,7 +124,9 @@ describe('KonnectorModalFooter component', () => {
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(screen.getByText('konnector_modal.button_go'))
+ })
expect(mockDelete).toHaveBeenCalled()
expect(mockedNavigate).toHaveBeenCalledTimes(1)
})
@@ -155,7 +143,11 @@ describe('KonnectorModalFooter component', () => {
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('konnector_modal.button_check_info')
+ )
+ })
expect(mockedNavigate).toHaveBeenCalledTimes(1)
expect(mockDelete).toHaveBeenCalledTimes(0)
})
diff --git a/src/components/Konnector/KonnectorModalFooter.tsx b/src/components/Konnector/KonnectorModalFooter.tsx
index 836fb3397949bcd4205e765464ad7d135143402e..30d505fac0627dcde4fa12bfdcaeeb33c04625ab 100644
--- a/src/components/Konnector/KonnectorModalFooter.tsx
+++ b/src/components/Konnector/KonnectorModalFooter.tsx
@@ -1,9 +1,6 @@
import Button from '@material-ui/core/Button'
import { useClient } from 'cozy-client'
-import {
- ERROR_EVENT,
- SUCCESS_EVENT,
-} from 'cozy-harvest-lib/dist/models/flowEvents'
+import { SUCCESS_EVENT } from 'cozy-harvest-lib/dist/models/flowEvents'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { KonnectorError } from 'enums'
import { Account } from 'models'
@@ -12,6 +9,8 @@ import { useNavigate } from 'react-router-dom'
import AccountService from 'services/account.service'
import './konnectorModal.scss'
+declare let __SAU_ISSUE_DIRECT_LINK__: string
+
interface KonnectorModalFooterProps {
state: string | null
error: KonnectorError | null
@@ -32,87 +31,92 @@ const KonnectorModalFooter = ({
const { t } = useI18n()
const client = useClient()
const navigate = useNavigate()
- const handleSGELoginRetry = useCallback(() => {
+
+ const handleSGELoginRetry = () => {
handleCloseClick(state === SUCCESS_EVENT)
- navigate('/sge-connect')
- }, [handleCloseClick, navigate, state])
+ navigate('/connect/electricity')
+ }
const handleResetSGEAccount = useCallback(async () => {
if (account) {
const accountService = new AccountService(client)
await accountService.deleteAccount(account)
await handleAccountDeletion()
- navigate('/sge-connect')
+ navigate('/connect/electricity')
}
}, [account, client, handleAccountDeletion, navigate])
- const defaultButton = (
- <Button
- aria-label={t('konnector_modal.accessibility.button_close')}
- onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
- className="btnPrimary"
- >
- <div>{t('konnector_modal.button_validate')}</div>
- </Button>
- )
-
- const errorButtons = () => {
- switch (error) {
- case KonnectorError.USER_ACTION_NEEDED:
- // INSEE CODE ERROR ENEDIS
- return (
- <Button
- aria-label={t('konnector_modal.accessibility.button_close')}
- onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
- className="btnPrimary"
- >
- <div>{t('konnector_modal.button_understood')}</div>
- </Button>
- )
- case KonnectorError.LOGIN_FAILED:
- case KonnectorError.CHALLENGE_ASKED:
- // INCOMPLETE CONSENT FORM - GRDF
- return (
- <Button
- aria-label={t('konnector_modal.accessibility.button_close')}
- onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
- className="btnPrimary"
- >
- <div>{t('konnector_modal.button_try_again')}</div>
- </Button>
- )
- case KonnectorError.TERMS_VERSION_MISMATCH:
- return (
- <div className="buttons">
- <Button
- aria-label={t('konnector_modal.accessibility.button_close')}
- onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
- className="btnSecondary"
- >
- <div>{t('konnector_modal.button_later')}</div>
- </Button>
- <Button
- aria-label={t('konnector_modal.accessibility.button_close')}
- onClick={
- !isUpdating ? handleSGELoginRetry : handleResetSGEAccount
- }
- className="btnPrimary"
- >
- <div>
- {!isUpdating
- ? t('konnector_modal.button_check_info')
- : t('konnector_modal.button_go')}
- </div>
- </Button>
+ if (error === KonnectorError.USER_ACTION_NEEDED) {
+ // INSEE CODE ERROR ENEDIS
+ return (
+ <Button
+ aria-label={t('konnector_modal.accessibility.button_close')}
+ onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
+ className="btnPrimary"
+ >
+ <div>{t('konnector_modal.button_understood')}</div>
+ </Button>
+ )
+ } else if (error === KonnectorError.LOGIN_FAILED) {
+ // INCOMPLETE CONSENT FORM - GRDF // what is this comment ?
+ return (
+ <Button
+ aria-label={t('konnector_modal.accessibility.button_close')}
+ onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
+ className="btnPrimary"
+ >
+ <div>{t('konnector_modal.button_try_again')}</div>
+ </Button>
+ )
+ } else if (error === KonnectorError.TERMS_VERSION_MISMATCH) {
+ return (
+ <div className="buttons">
+ <Button
+ aria-label={t('konnector_modal.accessibility.button_close')}
+ onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
+ className="btnSecondary"
+ >
+ <div>{t('konnector_modal.button_later')}</div>
+ </Button>
+ <Button
+ aria-label={t('konnector_modal.accessibility.button_close')}
+ onClick={!isUpdating ? handleSGELoginRetry : handleResetSGEAccount}
+ className="btnPrimary"
+ >
+ <div>
+ {!isUpdating
+ ? t('konnector_modal.button_check_info')
+ : t('konnector_modal.button_go')}
</div>
- )
- default:
- // DEFAULT FOOTER BUTTONS
- return defaultButton
- }
+ </Button>
+ </div>
+ )
+ } else if (error === KonnectorError.USER_ACTION_NEEDED_ACCOUNT_REMOVED) {
+ return (
+ <Button
+ aria-label={t('konnector_modal.accessibility.button_close')}
+ onClick={() => {
+ window.open(
+ `${__SAU_ISSUE_DIRECT_LINK__}?version=${client.appMetadata.version}`
+ )
+ handleCloseClick(state === SUCCESS_EVENT)
+ }}
+ className="btnPrimary"
+ >
+ <div>{t('konnector_modal.button_contact')}</div>
+ </Button>
+ )
+ } else {
+ return (
+ <Button
+ aria-label={t('konnector_modal.accessibility.button_close')}
+ onClick={() => handleCloseClick(state === SUCCESS_EVENT)}
+ className="btnPrimary"
+ >
+ <div>{t('konnector_modal.button_validate')}</div>
+ </Button>
+ )
}
-
- return <>{state === ERROR_EVENT ? errorButtons() : defaultButton}</>
}
export default KonnectorModalFooter
diff --git a/src/components/Konnector/KonnectorViewerCard.tsx b/src/components/Konnector/KonnectorViewerCard.tsx
index ab157f8f05c9a190057025fdc323782e78679efe..fb011aed8836b721a8e74ece7acdafc14839543a 100644
--- a/src/components/Konnector/KonnectorViewerCard.tsx
+++ b/src/components/Konnector/KonnectorViewerCard.tsx
@@ -12,8 +12,7 @@ import OfflinePicto from 'assets/icons/visu/offline-param.svg'
import classNames from 'classnames'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import Connection from 'components/Connection/Connection'
-import ConnectionNotFound from 'components/Konnector/ConnectionNotFound/ConnectionNotFound'
-import ConnectionResult from 'components/Konnector/ConnectionResult/ConnectionResult'
+import { GrdfWaitConsent } from 'components/Connection/GRDFConnect/GrdfWaitConsent'
import KonnectorModal from 'components/Konnector/KonnectorModal'
import { useClient } from 'cozy-client'
import { isKonnectorRunning } from 'cozy-harvest-lib/dist/helpers/triggers'
@@ -34,15 +33,7 @@ import {
UserDuelState,
} from 'enums'
import { DateTime } from 'luxon'
-import {
- Account,
- AccountAuthData,
- FluidConnection,
- FluidStatus,
- Konnector,
- PartnersInfo,
- Trigger,
-} from 'models'
+import { AccountEGLData, FluidConnection, FluidStatus } from 'models'
import React, { useCallback, useEffect, useMemo, useState } from 'react'
import { useNavigate } from 'react-router-dom'
import AccountService from 'services/account.service'
@@ -51,7 +42,11 @@ import DateChartService from 'services/dateChart.service'
import FluidService from 'services/fluid.service'
import PartnersInfoService from 'services/partnersInfo.service'
import { setChallengeConsumption } from 'store/challenge/challenge.slice'
-import { setSelectedDate, setShowOfflineData } from 'store/chart/chart.slice'
+import {
+ setSelectedDate,
+ setShowConnectionDetails,
+ setShowOfflineData,
+} from 'store/chart/chart.slice'
import {
setFluidStatus,
setLastEpglLogin,
@@ -59,82 +54,75 @@ import {
updateFluidConnection,
} from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
-import { openConnectionModal } from 'store/modal/modal.slice'
+import logApp from 'utils/logger'
import { getParamPicto } from 'utils/picto'
import { getKonnectorSlug } from 'utils/utils'
+import ConnectionNotFound from './ConnectionNotFound/ConnectionNotFound'
+import ConnectionResult from './ConnectionResult/ConnectionResult'
import './konnectorViewerCard.scss'
-interface KonnectorViewerCardProps {
- isDisconnected: boolean
- showOfflineData: boolean
- active: boolean
- fluidType: FluidType
- setActive: React.Dispatch<React.SetStateAction<boolean>>
-}
-
const KonnectorViewerCard = ({
- isDisconnected,
- showOfflineData,
- active,
fluidType,
- setActive,
-}: KonnectorViewerCardProps) => {
+}: {
+ fluidType: Exclude<FluidType, FluidType.MULTIFLUID>
+}) => {
const { t } = useI18n()
const client = useClient()
- const dispatch = useAppDispatch()
const navigate = useNavigate()
+ const dispatch = useAppDispatch()
const {
+ chart: { showConnectionDetails, showOfflineData },
challenge: { currentChallenge },
global: { fluidStatus, shouldRefreshConsent, partnersInfo },
} = useAppSelector(state => state.ecolyo)
const currentFluidStatus = fluidStatus[fluidType]
const fluidSlug = currentFluidStatus.connection.konnectorConfig.slug
const fluidState = currentFluidStatus.status
- const konnector: Konnector | null = currentFluidStatus.connection.konnector
- const account: Account | null = currentFluidStatus.connection.account
- const trigger: Trigger | null = currentFluidStatus.connection.trigger
+ const { konnector, account, trigger } = currentFluidStatus.connection
+ const currentFluidName = FluidType[currentFluidStatus.fluidType].toLowerCase()
const [openModal, setOpenModal] = useState(false)
- const [isUpdating, setIsUpdating] = useState(false)
- const [isLogging, setIsLogging] = useState(fluidSlug !== FluidSlugType.GAS)
+ const [isVerifyingIdentity, setIsVerifyingIdentity] = useState(
+ fluidType === FluidType.ELECTRICITY
+ )
const [konnectorErrorDescription, setKonnectorErrorDescription] =
useState<KonnectorError | null>(null)
const [konnectorState, setKonnectorState] = useState<string | null>(null)
const [isOutdatedData, setIsOutdatedData] = useState<number | null>(null)
+
+ const isWaitingForConsent =
+ fluidType === FluidType.GAS &&
+ currentFluidStatus.status === FluidState.CHALLENGE_ASKED
+
const fluidService = useMemo(() => new FluidService(client), [client])
+ const accountService = useMemo(() => new AccountService(client), [client])
const partnersInfoService = useMemo(
() => new PartnersInfoService(client),
[client]
)
- const lastDataDate =
- fluidType !== FluidType.MULTIFLUID && currentFluidStatus.lastDataDate
- ? currentFluidStatus.lastDataDate.toLocaleString() + fluidType
- : fluidType
-
const iconType = getParamPicto(currentFluidStatus.fluidType)
const toggleAccordion = () => {
- setActive(prev => !prev)
+ dispatch(setShowConnectionDetails(!showConnectionDetails))
}
const updateGlobalFluidStatus = useCallback(async (): Promise<
FluidStatus[]
> => {
- const _updatedFluidStatus: FluidStatus[] =
- await fluidService.getFluidStatus()
+ const updatedFluidStatus = await fluidService.getFluidStatus()
const refDate = DateTime.fromISO('0001-01-01')
- let _lastDataDate: DateTime | null = DateTime.fromISO('0001-01-01')
- for (const fluid of _updatedFluidStatus) {
- if (fluid?.lastDataDate && fluid?.lastDataDate > _lastDataDate) {
- _lastDataDate = fluid.lastDataDate
+ let lastDataDate = DateTime.fromISO('0001-01-01')
+ for (const fluid of updatedFluidStatus) {
+ if (fluid?.lastDataDate && fluid?.lastDataDate > lastDataDate) {
+ lastDataDate = fluid.lastDataDate
}
}
- if (_lastDataDate > refDate) {
- dispatch(setSelectedDate(_lastDataDate))
+ if (lastDataDate > refDate) {
+ dispatch(setSelectedDate(lastDataDate))
}
- return _updatedFluidStatus
+ return updatedFluidStatus
}, [dispatch, fluidService])
const refreshChallengeState = useCallback(async () => {
@@ -164,100 +152,93 @@ const KonnectorViewerCard = ({
await refreshChallengeState()
const _updatedFluidStatus = await updateGlobalFluidStatus()
if (_updatedFluidStatus.length > 0) {
- const partnersInfo: PartnersInfo | undefined =
- await partnersInfoService.getPartnersInfo()
- const updatedFluidStatus: FluidStatus[] =
- await fluidService.getFluidStatus(partnersInfo)
+ const partnersInfo = await partnersInfoService.getPartnersInfo()
+ const updatedFluidStatus = await fluidService.getFluidStatus(partnersInfo)
dispatch(setFluidStatus(updatedFluidStatus))
}
- setActive(false)
+ dispatch(setShowConnectionDetails(false))
}, [
refreshChallengeState,
updateGlobalFluidStatus,
- setActive,
partnersInfoService,
fluidService,
dispatch,
])
+ /** Close modal, update fluid status and reset error state */
const handleConnectionEnd = useCallback(
async (isSuccess?: boolean) => {
+ const { account, isUpdating } = currentFluidStatus.connection
+
// CASE FOR GLOBAL LOGIN FAILED
const isGlobalLoginFailed =
konnectorErrorDescription === KonnectorError.LOGIN_FAILED ||
konnectorErrorDescription === KonnectorError.UNKNOWN_ERROR ||
- konnectorErrorDescription === KonnectorError.CHALLENGE_ASKED ||
konnectorErrorDescription === KonnectorError.CRITICAL ||
- konnectorErrorDescription === KonnectorError.MISSING_SECRET
+ konnectorErrorDescription === KonnectorError.MISSING_SECRET ||
+ konnectorErrorDescription ===
+ KonnectorError.USER_ACTION_NEEDED_ACCOUNT_REMOVED
// CASE FOR ENEDIS CODE INSEE ERROR
const isEnedisCodeInseeError =
!isUpdating && fluidType === FluidType.ELECTRICITY
+ const isGRDFError =
+ fluidType === FluidType.GAS &&
+ (konnectorErrorDescription === KonnectorError.MAINTENANCE ||
+ konnectorErrorDescription === KonnectorError.VENDOR_DOWN ||
+ konnectorErrorDescription ===
+ KonnectorError.USER_ACTION_NEEDED_CGU_FORM)
+
const shouldDeleteAccount =
account &&
!isSuccess &&
- currentFluidStatus &&
- currentFluidStatus.connection.account &&
- (isGlobalLoginFailed || isEnedisCodeInseeError)
+ (isGlobalLoginFailed || isEnedisCodeInseeError || isGRDFError)
if (shouldDeleteAccount) {
+ logApp('info', `shouldDeleteAccount`)
// KEEP LAST LOGIN FOR EPGL
- let lastEpglLogin = ''
- if (
- fluidSlug === FluidSlugType.WATER &&
- currentFluidStatus.connection.account?.auth
- ) {
- const auth = currentFluidStatus.connection.account
- .auth as AccountAuthData
- lastEpglLogin = auth.login
+ if (fluidSlug === FluidSlugType.WATER && account?.auth) {
+ const auth = account.auth as AccountEGLData
+ const lastEpglLogin = auth.login
+ dispatch(setLastEpglLogin(lastEpglLogin))
}
// DELETE ACCOUNT
- const accountService = new AccountService(client)
await accountService.deleteAccount(account)
await handleAccountDeletion()
-
- // RESTORE LAST KNOWN CREDENTIALS
- if (lastEpglLogin) {
- dispatch(setLastEpglLogin(lastEpglLogin))
- }
} else {
const updatedFluidStatus =
await fluidService.getFluidStatus(partnersInfo)
dispatch(setFluidStatus(updatedFluidStatus))
}
-
- setActive(false)
+ dispatch(setShowConnectionDetails(false))
setOpenModal(false)
- // TODO null state seems to be read before modal closing and display a success icon in modal
setKonnectorState(null)
setKonnectorErrorDescription(null)
},
[
- account,
konnectorErrorDescription,
- currentFluidStatus,
- isUpdating,
fluidType,
- setActive,
+ currentFluidStatus,
+ dispatch,
fluidSlug,
- client,
+ accountService,
handleAccountDeletion,
fluidService,
partnersInfo,
- dispatch,
]
)
const toggleModalConnection = useCallback(() => {
switch (fluidType) {
case FluidType.ELECTRICITY:
- navigate('/sge-connect')
+ navigate('/connect/electricity')
break
case FluidType.GAS:
+ navigate('/connect/gas')
+ break
case FluidType.WATER:
dispatch(setShowOfflineData(false))
- dispatch(openConnectionModal(true))
break
}
}, [dispatch, fluidType, navigate])
@@ -270,35 +251,35 @@ const KonnectorViewerCard = ({
</Button>
)
}
- if (fluidState === FluidState.KONNECTOR_NOT_FOUND && !isUpdating) {
+
+ if (
+ fluidState === FluidState.KONNECTOR_NOT_FOUND &&
+ !currentFluidStatus.connection.isUpdating
+ ) {
return <ConnectionNotFound konnectorSlug={fluidSlug} />
}
+
// Handle login failed for EGL
- else if (
- (fluidState === FluidState.ERROR_LOGIN_FAILED &&
- fluidType === FluidType.WATER) ||
+ if (
+ (fluidType === FluidType.WATER &&
+ fluidState === FluidState.LOGIN_FAILED) ||
(account && currentFluidStatus.status !== FluidState.NOT_CONNECTED)
) {
return (
<ConnectionResult
handleAccountDeletion={handleAccountDeletion}
fluidType={fluidType}
- key={lastDataDate}
/>
)
- } else {
- return <Connection fluidType={currentFluidStatus.fluidType} />
}
}, [
account,
- currentFluidStatus.fluidType,
+ currentFluidStatus.connection.isUpdating,
currentFluidStatus.status,
fluidSlug,
fluidState,
fluidType,
handleAccountDeletion,
- isUpdating,
- lastDataDate,
showOfflineData,
t,
toggleModalConnection,
@@ -317,75 +298,66 @@ const KonnectorViewerCard = ({
fluidConnection: updatedConnection,
})
)
- Promise.all([
+ const [, updatedFluidStatus] = await Promise.all([
await refreshChallengeState(),
await updateGlobalFluidStatus(),
])
- setKonnectorState(_state)
+
+ /**
+ * If waiting for consent, close Konnector modal first and handle connection closed
+ * Calling handleConnectionEnd here because it won't be called in the KonnectorModal since we don't show it
+ *
+ * Else set error for KonnectorModal
+ */
+ if (
+ fluidType === FluidType.GAS &&
+ updatedFluidStatus[2].status == FluidState.CHALLENGE_ASKED
+ ) {
+ await handleConnectionEnd(false)
+ } else {
+ setKonnectorState(_state)
+ }
}
},
[
- dispatch,
currentFluidStatus.connection,
currentFluidStatus.fluidType,
+ dispatch,
+ fluidType,
+ handleConnectionEnd,
refreshChallengeState,
updateGlobalFluidStatus,
]
)
- const getIconForStatus = (
- status: FluidState,
- maintenance: boolean,
- connection: FluidConnection,
- outdatedData: number | null
- ) => {
- if (maintenance) {
- return (
- <StyledIcon
- icon={PartnersIssueNotif}
- size={24}
- className="konnector-state-picto"
- />
- )
- }
+ /** Display konnector icon & its smaller status icon in upper left corner */
+ const displayKonnectorIcon = useCallback(() => {
+ const { maintenance, status, connection } = currentFluidStatus
+ let statusIcon = null
- if (
- (status === FluidState.ERROR ||
- status === FluidState.ERROR_LOGIN_FAILED) &&
+ if (maintenance) {
+ statusIcon = PartnersIssueNotif
+ } else if (
+ (status === FluidState.ERROR || status === FluidState.LOGIN_FAILED) &&
connection.account
) {
- return (
- <StyledIcon
- icon={ErrorNotif}
- size={24}
- className="konnector-state-picto"
- />
- )
- }
-
- if (outdatedData && outdatedData > 0) {
- return (
- <StyledIcon
- icon={WarningNotif}
- size={24}
- className="konnector-state-picto"
- />
- )
+ statusIcon = ErrorNotif
+ } else if (isOutdatedData && isOutdatedData > 0) {
+ statusIcon = WarningNotif
}
- }
- const displayKonnectorIcon = useCallback(() => {
return (
<div className="konnector-icon">
<Icon
icon={currentFluidStatus.connection.account ? iconType : OfflinePicto}
size={49}
/>
- {getIconForStatus(
- currentFluidStatus.status,
- currentFluidStatus.maintenance,
- currentFluidStatus.connection,
- isOutdatedData
+ {statusIcon && (
+ <StyledIcon
+ icon={statusIcon}
+ size={24}
+ className="konnector-state-picto"
+ />
)}
</div>
)
@@ -407,17 +379,13 @@ const KonnectorViewerCard = ({
</span>
)
} else if (currentFluidStatus.connection.account && !isOutdatedData) {
- return t(`FLUID.${FluidType[currentFluidStatus.fluidType]}.LABEL`)
+ return t(`FLUID.${currentFluidName.toUpperCase()}.LABEL`)
} else {
- return t(
- `konnector_options.label_offline_${FluidType[
- currentFluidStatus.fluidType
- ].toLowerCase()}`
- )
+ return t(`konnector_options.label_offline_${currentFluidName}`)
}
}, [
+ currentFluidName,
currentFluidStatus.connection.account,
- currentFluidStatus.fluidType,
currentFluidStatus.maintenance,
isOutdatedData,
t,
@@ -427,13 +395,12 @@ const KonnectorViewerCard = ({
useEffect(() => {
async function deleteAccountForConsentRefresh() {
if (shouldRefreshConsent && account) {
- const accountService = new AccountService(client)
await accountService.deleteAccount(account)
await handleAccountDeletion()
}
}
deleteAccountForConsentRefresh()
- }, [account, client, handleAccountDeletion, shouldRefreshConsent])
+ }, [account, accountService, handleAccountDeletion, shouldRefreshConsent])
useEffect(() => {
let subscribed = true
@@ -443,8 +410,9 @@ const KonnectorViewerCard = ({
!isKonnectorRunning(trigger)
) {
if (subscribed) {
- if (currentFluidStatus.connection.isUpdating) setIsUpdating(true)
setOpenModal(true)
+ // Reset any error that might have been set after handleConnectionEnd
+ setKonnectorErrorDescription(null)
const updatedConnection: FluidConnection = {
...currentFluidStatus.connection,
shouldLaunchKonnector: false,
@@ -458,12 +426,12 @@ const KonnectorViewerCard = ({
}
const connectionFlow = new ConnectionFlow(client, trigger, konnector)
await connectionFlow.launch()
- connectionFlow.jobWatcher.on(ERROR_EVENT, () => {
+ connectionFlow.jobWatcher.on(ERROR_EVENT, async () => {
+ await callbackResponse(ERROR_EVENT)
setKonnectorErrorDescription(connectionFlow.jobWatcher.on()._error)
- callbackResponse(ERROR_EVENT)
})
connectionFlow.jobWatcher.on(LOGIN_SUCCESS_EVENT, () => {
- setIsLogging(false)
+ setIsVerifyingIdentity(false)
})
connectionFlow.jobWatcher.on(SUCCESS_EVENT, () => {
callbackResponse(SUCCESS_EVENT)
@@ -496,26 +464,27 @@ const KonnectorViewerCard = ({
])
return (
- <>
- {!isDisconnected ? (
+ <div className="konnector-section-root">
+ {isWaitingForConsent && <GrdfWaitConsent />}
+ {!isWaitingForConsent && !showOfflineData && (
+ <Connection fluidType={fluidType} />
+ )}
+ {!isWaitingForConsent && showOfflineData && (
<Accordion
- expanded={active}
+ expanded={showConnectionDetails}
onChange={toggleAccordion}
classes={{
- root: `expansion-panel-root ${
- !currentFluidStatus.maintenance &&
- (currentFluidStatus.status === FluidState.ERROR ||
- currentFluidStatus.status === FluidState.ERROR_LOGIN_FAILED)
- ? 'red-border'
- : ''
- }`,
+ root: classNames('expansion-panel-root', {
+ ['red-border']:
+ !currentFluidStatus.maintenance &&
+ (currentFluidStatus.status === FluidState.ERROR ||
+ currentFluidStatus.status === FluidState.LOGIN_FAILED),
+ }),
}}
>
<AccordionSummary
aria-label={t(
- `konnector_options.accessibility.button_toggle_detail_${FluidType[
- currentFluidStatus.fluidType
- ].toLowerCase()}`
+ `konnector_options.accessibility.button_toggle_detail_${currentFluidName}`
)}
expandIcon={
<Icon icon={chevronDown} size={16} className="accordion-icon" />
@@ -528,9 +497,7 @@ const KonnectorViewerCard = ({
{displayKonnectorIcon()}
<div
className={classNames('text-16-bold konnector-title', {
- [`${FluidType[
- currentFluidStatus.fluidType
- ].toLowerCase()}-connected`]:
+ [`${currentFluidName}-connected`]:
currentFluidStatus.status !== FluidState.NOT_CONNECTED &&
!currentFluidStatus.maintenance,
})}
@@ -546,21 +513,18 @@ const KonnectorViewerCard = ({
{getConnectionCard()}
</AccordionDetails>
</Accordion>
- ) : (
- <AccordionDetails>{getConnectionCard()}</AccordionDetails>
)}
<KonnectorModal
open={openModal}
- isUpdating={isUpdating}
- isLogging={isLogging}
+ isVerifyingIdentity={isVerifyingIdentity}
state={konnectorState}
error={konnectorErrorDescription}
- fluidType={currentFluidStatus.fluidType}
+ fluidType={fluidType}
handleCloseClick={handleConnectionEnd}
handleAccountDeletion={handleAccountDeletion}
account={account}
/>
- </>
+ </div>
)
}
export default KonnectorViewerCard
diff --git a/src/components/Konnector/KonnectorViewerList.spec.tsx b/src/components/Konnector/KonnectorViewerList.spec.tsx
index 810bd21bbc68243dd8c51fc1405db101f94b022b..d1b3e7928c956e147b4925c503bd2f3710306cce 100644
--- a/src/components/Konnector/KonnectorViewerList.spec.tsx
+++ b/src/components/Konnector/KonnectorViewerList.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -28,7 +28,11 @@ describe('KonnectorViewerList component', () => {
<KonnectorViewerList />
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('konnector_options.label_connect_to_electricity')
+ )
+ })
expect(mockedNavigate).toHaveBeenCalled()
})
})
diff --git a/src/components/Konnector/KonnectorViewerList.tsx b/src/components/Konnector/KonnectorViewerList.tsx
index 7865473a25658a37d73e444dea7c78d4736d2069..152481df0a1011c53ff7b0a76440d155a106fb02 100644
--- a/src/components/Konnector/KonnectorViewerList.tsx
+++ b/src/components/Konnector/KonnectorViewerList.tsx
@@ -7,39 +7,42 @@ import { useNavigate } from 'react-router-dom'
import { useAppSelector } from 'store/hooks'
import { getAddPicto } from 'utils/picto'
import { getFluidName } from 'utils/utils'
-import './konnectorViewerList.scss'
+import './konnectorViewerCard.scss'
const KonnectorViewerList = () => {
const { t } = useI18n()
- const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
const navigate = useNavigate()
+ const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+
const goToFluid = (fluidType: FluidType) => {
navigate(`/consumption/${getFluidName(fluidType)}`)
}
return (
- <div className="konnectorsList">
- {fluidStatus.map(fluidStatusItem => (
- <StyledCard
- key={fluidStatusItem.fluidType}
- className="connection-card"
- onClick={() => goToFluid(fluidStatusItem.fluidType)}
- fluidType={fluidStatusItem.fluidType}
- >
- <Icon icon={getAddPicto(fluidStatusItem.fluidType)} size={36} />
- <div
- className={`konnector-title text-18-bold ${FluidType[
- fluidStatusItem.fluidType
- ].toLowerCase()}`}
+ <div className="konnector-section-root">
+ <div className="konnectorsList">
+ {fluidStatus.map(fluidStatusItem => (
+ <StyledCard
+ key={fluidStatusItem.fluidType}
+ className="connection-card"
+ onClick={() => goToFluid(fluidStatusItem.fluidType)}
+ fluidType={fluidStatusItem.fluidType}
>
- {t(
- `konnector_options.label_connect_to_${FluidType[
+ <Icon icon={getAddPicto(fluidStatusItem.fluidType)} size={36} />
+ <div
+ className={`konnector-title text-18-bold ${getFluidName(
fluidStatusItem.fluidType
- ].toLowerCase()}`
- )}
- </div>
- </StyledCard>
- ))}
+ )}`}
+ >
+ {t(
+ `konnector_options.label_connect_to_${getFluidName(
+ fluidStatusItem.fluidType
+ )}`
+ )}
+ </div>
+ </StyledCard>
+ ))}
+ </div>
</div>
)
}
diff --git a/src/components/Konnector/__snapshots__/KonnectorModal.spec.tsx.snap b/src/components/Konnector/__snapshots__/KonnectorModal.spec.tsx.snap
index e4f491c9845a8ee9dd936e89f86e8bdf7412c2ec..0afd9d36255efb8a46293bc32d038cedd180b19a 100644
--- a/src/components/Konnector/__snapshots__/KonnectorModal.spec.tsx.snap
+++ b/src/components/Konnector/__snapshots__/KonnectorModal.spec.tsx.snap
@@ -62,10 +62,10 @@ exports[`KonnectorModal component should be rendered correctly 1`] = `
</div>
</div>
<div
- class="kmodal-content-text kmodal-content-text-center text-16-normal"
+ class="kmodal-content-text text-16-normal"
>
<div
- class="kc-wait text-16-bold"
+ class="text-16-bold"
>
konnector_modal.loading_data
</div>
diff --git a/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap b/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap
index 8fd0a567d1583af4d3f71d49a5ced00da6b26630..102a761bc6b23ce140012667112e749b927d0bd5 100644
--- a/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap
+++ b/src/components/Konnector/__snapshots__/KonnectorViewerList.spec.tsx.snap
@@ -3,98 +3,102 @@
exports[`KonnectorViewerList component should be rendered correctly 1`] = `
<div>
<div
- class="konnectorsList"
+ class="konnector-section-root"
>
- <button
- class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card electricity"
- tabindex="0"
- type="button"
+ <div
+ class="konnectorsList"
>
- <div
- class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card electricity"
+ tabindex="0"
+ type="button"
>
- <svg
- class="styles__icon___23x3R"
- height="36"
- width="36"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
<div
- class="konnector-title text-18-bold electricity"
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
>
- konnector_options.label_connect_to_electricity
+ <svg
+ class="styles__icon___23x3R"
+ height="36"
+ width="36"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ <div
+ class="konnector-title text-18-bold electricity"
+ >
+ konnector_options.label_connect_to_electricity
+ </div>
</div>
- </div>
- <span
- class="MuiCardActionArea-focusHighlight"
- />
- <span
- class="MuiTouchRipple-root"
- />
- </button>
- <button
- class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card water"
- tabindex="0"
- type="button"
- >
- <div
- class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card water"
+ tabindex="0"
+ type="button"
>
- <svg
- class="styles__icon___23x3R"
- height="36"
- width="36"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
<div
- class="konnector-title text-18-bold water"
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
>
- konnector_options.label_connect_to_water
+ <svg
+ class="styles__icon___23x3R"
+ height="36"
+ width="36"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ <div
+ class="konnector-title text-18-bold water"
+ >
+ konnector_options.label_connect_to_water
+ </div>
</div>
- </div>
- <span
- class="MuiCardActionArea-focusHighlight"
- />
- <span
- class="MuiTouchRipple-root"
- />
- </button>
- <button
- class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card gas"
- tabindex="0"
- type="button"
- >
- <div
- class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 connection-card gas"
+ tabindex="0"
+ type="button"
>
- <svg
- class="styles__icon___23x3R"
- height="36"
- width="36"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
<div
- class="konnector-title text-18-bold gas"
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
>
- konnector_options.label_connect_to_gas
+ <svg
+ class="styles__icon___23x3R"
+ height="36"
+ width="36"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ <div
+ class="konnector-title text-18-bold gas"
+ >
+ konnector_options.label_connect_to_gas
+ </div>
</div>
- </div>
- <span
- class="MuiCardActionArea-focusHighlight"
- />
- <span
- class="MuiTouchRipple-root"
- />
- </button>
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ </div>
</div>
</div>
`;
diff --git a/src/components/Konnector/konnectorModal.scss b/src/components/Konnector/konnectorModal.scss
index 1c27774962d8e9e7537666e13136f84ba5fc309b..832aa7c48d32f01259eff7d255a2c4aadb34640c 100644
--- a/src/components/Konnector/konnectorModal.scss
+++ b/src/components/Konnector/konnectorModal.scss
@@ -22,10 +22,6 @@
min-height: 11.25rem;
text-align: center;
- .kc-wait {
- margin-bottom: 2rem;
- }
-
.waiting-text {
display: none;
@@ -38,16 +34,14 @@
}
}
- .kmodal-content-text-center {
- text-align: center;
- }
-
.kmodal-info {
padding: 1rem;
- text-align: center;
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
.buttons {
display: flex;
- gap: 0.825rem;
+ gap: 1rem;
}
.konnector-config {
align-items: center;
@@ -58,32 +52,22 @@
gap: 1rem;
.elec-fail {
color: $grey-bright;
- margin-top: 1rem;
}
&.mismatch {
.title {
color: $orange;
}
- div {
- margin-bottom: 1rem;
- }
.info {
color: $grey-bright;
}
}
- .kce-picto-txt {
- color: $red-primary;
- }
-
- .kcs-picto-txt {
+ .headerSuccess {
color: $multi-color;
}
-
- .commonErrors {
- text-decoration: underline;
- cursor: pointer;
- margin: 1rem auto 0.5rem;
+ .headerError {
+ color: $red-primary;
}
+
.commonErrorsList {
text-align: left;
span {
@@ -104,10 +88,10 @@
}
}
}
+ }
- button {
- margin-top: 1rem;
- }
+ .light {
+ color: $grey-bright;
}
}
diff --git a/src/components/Konnector/konnectorViewerCard.scss b/src/components/Konnector/konnectorViewerCard.scss
index 3eaa94ce1819ed36451695e766475733da0df6fb..7d2977f8d68d7c29d8e5e11cc9832557a2299502 100644
--- a/src/components/Konnector/konnectorViewerCard.scss
+++ b/src/components/Konnector/konnectorViewerCard.scss
@@ -1,6 +1,18 @@
@import 'src/styles/base/color';
@import 'src/styles/base/breakpoint';
+.konnector-section-root {
+ margin: 0 auto;
+ padding-bottom: 1rem;
+ max-width: 45.75rem;
+ width: 100%;
+ box-sizing: border-box;
+ @media #{$large-phone} {
+ padding-left: 1rem;
+ padding-right: 1rem;
+ }
+}
+
.konnector-icon {
margin-right: 1rem;
position: relative;
@@ -32,3 +44,22 @@
color: $grey-bright;
}
}
+
+.konnectorsList {
+ display: flex;
+ flex-direction: column;
+ gap: 1rem;
+ padding-top: 1rem;
+ button.connection-card {
+ height: 80px;
+ &.electricity {
+ border: 1px solid var(--elecColor40);
+ }
+ &.gas {
+ border: 1px solid var(--gasColor40);
+ }
+ &.water {
+ border: 1px solid var(--waterColor40);
+ }
+ }
+}
diff --git a/src/components/Konnector/konnectorViewerList.scss b/src/components/Konnector/konnectorViewerList.scss
deleted file mode 100644
index bb94bfef8f16e23af9058dbccff1244f001fa293..0000000000000000000000000000000000000000
--- a/src/components/Konnector/konnectorViewerList.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-@import 'src/styles/base/color';
-@import 'src/styles/base/breakpoint';
-
-.konnectorsList {
- display: flex;
- flex-direction: column;
- gap: 1rem;
- padding-top: 1rem;
- button.connection-card {
- height: 80px;
- &.electricity {
- border: 1px solid var(--elecColor40);
- }
- &.gas {
- border: 1px solid var(--gasColor40);
- }
- &.water {
- border: 1px solid var(--waterColor40);
- }
- }
-}
diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx
index 7fbb1d66fdf1829e508d2cc578d2837c6cefbedc..c343f110be6bf27f3ee8438118aca383f01ece31 100644
--- a/src/components/Navbar/Navbar.tsx
+++ b/src/components/Navbar/Navbar.tsx
@@ -98,7 +98,7 @@ const Navbar = () => {
</ul>
</nav>
<div role="contentinfo" className="logos-container">
- <img src={logos} alt="ensemble de logos" />
+ <img src={logos} alt={t(`common.funders_logo`)} />
</div>
</aside>
)
diff --git a/src/components/Options/ExportData/ExportData.tsx b/src/components/Options/ExportData/ExportData.tsx
index 5127480c547af8ada1f7bc66b8f6b3e3ce970038..94365745aab31c7f23204de092724fca3367fb8a 100644
--- a/src/components/Options/ExportData/ExportData.tsx
+++ b/src/components/Options/ExportData/ExportData.tsx
@@ -26,19 +26,13 @@ const ExportData = () => {
[client]
)
- const [isExportStartModal, setIsExportStartModal] = useState<boolean>(false)
- const [isExportLoadingModal, setIsExportLoadingModal] =
- useState<boolean>(false)
- const [isExportDoneModal, setIsExportDoneModal] = useState<boolean>(false)
- const [hasError, setHasError] = useState<boolean>(false)
+ const [showExportModal, setShowExportModal] = useState<
+ 'start' | 'loading' | 'done' | null
+ >(null)
+ const [hasError, setHasError] = useState(false)
const [exportableFluids, setExportableFluids] = useState<FluidType[]>([])
const [answer, setAnswer] = useState<FluidType[]>([])
-
- const [active, setActive] = useState<boolean>(false)
-
- const toggleAccordion = () => {
- setActive(prev => !prev)
- }
+ const [isExpanded, setIsExpanded] = useState(false)
const handleChange = (value: FluidType) => {
const tempAnswer = [...answer]
@@ -89,8 +83,7 @@ const ExportData = () => {
if (e) {
setHasError(true)
}
- setIsExportDoneModal(true)
- setIsExportLoadingModal(false)
+ setShowExportModal('done')
}
return (
@@ -98,8 +91,8 @@ const ExportData = () => {
<div className="export-option-root">
<div className="export-option-content">
<Accordion
- expanded={active}
- onChange={toggleAccordion}
+ expanded={isExpanded}
+ onChange={() => setIsExpanded(prev => !prev)}
classes={{
root: 'expansion-panel-root',
}}
@@ -134,7 +127,7 @@ const ExportData = () => {
{fluidCheckbox()}
<Button
aria-label={t('unsubscribe.button_accessibility')}
- onClick={() => setIsExportStartModal(true)}
+ onClick={() => setShowExportModal('start')}
className="btnSecondary"
disabled={answer.length === 0}
>
@@ -147,25 +140,20 @@ const ExportData = () => {
</div>
</div>
<ExportStartModal
- open={isExportStartModal}
- handleCloseClick={() => setIsExportStartModal(false)}
- handleDownloadClick={() => {
- setIsExportStartModal(false)
- setIsExportLoadingModal(true)
- }}
+ open={showExportModal === 'start'}
+ handleCloseClick={() => setShowExportModal(null)}
+ handleDownloadClick={() => setShowExportModal('loading')}
/>
<ExportLoadingModal
- open={isExportLoadingModal}
- handleCloseClick={() => {
- setIsExportLoadingModal(false)
- }}
+ open={showExportModal === 'loading'}
+ handleCloseClick={() => setShowExportModal(null)}
handleDone={e => handleDone(e)}
selectedFluids={answer}
/>
<ExportDoneModal
- open={isExportDoneModal}
+ open={showExportModal === 'done'}
error={hasError}
- handleCloseClick={() => setIsExportDoneModal(false)}
+ handleCloseClick={() => setShowExportModal(null)}
/>
</>
)
diff --git a/src/components/Options/ExportData/Modals/exportDoneModal.spec.tsx b/src/components/Options/ExportData/Modals/exportDoneModal.spec.tsx
index dc0bd5588f24e50858bd0f75a19d400d8ba6a26d..56cd7cac4a4229f25e985ebecba5e9045cb9cbb4 100644
--- a/src/components/Options/ExportData/Modals/exportDoneModal.spec.tsx
+++ b/src/components/Options/ExportData/Modals/exportDoneModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import ExportDoneModal from './exportDoneModal'
@@ -27,7 +27,9 @@ describe('exportDoneModal component', () => {
handleCloseClick={mockHandleClose}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getByText('export.modal_done.button_close'))
+ })
expect(mockHandleClose).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Options/ExportData/Modals/exportLoadingModal.spec.tsx b/src/components/Options/ExportData/Modals/exportLoadingModal.spec.tsx
index 06371f31aa2e375692f2e16e1b1e418b7116d42a..8fe1bce5b001c91dc854b98722a482ba50a95be7 100644
--- a/src/components/Options/ExportData/Modals/exportLoadingModal.spec.tsx
+++ b/src/components/Options/ExportData/Modals/exportLoadingModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { allFluids } from 'utils/utils'
@@ -27,7 +27,11 @@ describe('ExportLoadingModal component', () => {
selectedFluids={allFluids}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('export.modal_loading.button_cancel')
+ )
+ })
expect(mockHandleClose).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Options/ExportData/Modals/exportLoadingModal.tsx b/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
index f6058bed9c22a9a093ed02e7d276bbccecadb78e..f25b2e28cd389aa8e53eca6aa830f70f4979bf73 100644
--- a/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
+++ b/src/components/Options/ExportData/Modals/exportLoadingModal.tsx
@@ -12,7 +12,7 @@ import { Datachart, Dataload, TimePeriod } from 'models'
import React, { useCallback, useEffect } from 'react'
import ConsumptionDataManager from 'services/consumption.service'
import EnedisMonthlyAnalysisDataService from 'services/enedisMonthlyAnalysisData.service'
-import { formatTwoDigits } from 'utils/utils'
+import { formatTwoDigits, getFluidName } from 'utils/utils'
import * as XLSX from 'xlsx'
import './exportLoadingModal.scss'
@@ -65,12 +65,11 @@ const ExportLoadingModal = ({
fluidType: FluidType
): Promise<ExportDataRow> => {
const dataRow: ExportDataRow = {}
+ const fluidName = getFluidName(fluidType)
dataRow[t('export.month')] = formatTwoDigits(dataload.date.month)
dataRow[t('export.year')] = dataload.date.year
dataRow[
- `${t('export.consumption')} (${t(
- `FLUID.${FluidType[fluidType]}.UNIT`
- )})`
+ `${t('export.consumption')} (${t('FLUID.' + fluidName + '.UNIT')})`
] = dataload.value
if (fluidType === FluidType.ELECTRICITY) {
const emas = new EnedisMonthlyAnalysisDataService(client)
diff --git a/src/components/Options/ExportData/Modals/exportStartModal.spec.tsx b/src/components/Options/ExportData/Modals/exportStartModal.spec.tsx
index 36a16b1b1727c67cf391de45df4aeb0698dc74f1..a903a4151cdf312142c580be8e965d776c50966d 100644
--- a/src/components/Options/ExportData/Modals/exportStartModal.spec.tsx
+++ b/src/components/Options/ExportData/Modals/exportStartModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import ExportStartModal from './exportStartModal'
@@ -24,7 +24,11 @@ describe('exportStartModal component', () => {
handleDownloadClick={jest.fn()}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('export.modal_start.button_cancel')
+ )
+ })
expect(mockHandleClose).toHaveBeenCalledTimes(1)
})
})
diff --git a/src/components/Options/GCU/GCUView.tsx b/src/components/Options/GCU/GCUView.tsx
index d5d525e538062eb138d3f08c670643efef9337c3..9f4e06c97017ace8a703e8db29d4229e106b950a 100644
--- a/src/components/Options/GCU/GCUView.tsx
+++ b/src/components/Options/GCU/GCUView.tsx
@@ -2,20 +2,14 @@ import Content from 'components/Content/Content'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import GCUContent from 'components/Options/GCU/GCUContent'
-import React, { useState } from 'react'
+import React from 'react'
const GCUView = () => {
- const [headerHeight, setHeaderHeight] = useState<number>(0)
-
return (
<>
<CozyBar titleKey="common.title_gcu" displayBackArrow={true} />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_gcu"
- displayBackArrow={true}
- />
- <Content heightOffset={headerHeight}>
+ <Header desktopTitleKey="common.title_gcu" displayBackArrow={true} />
+ <Content>
<GCUContent />
</Content>
</>
diff --git a/src/components/Options/GCU/__snapshots__/GCUView.spec.tsx.snap b/src/components/Options/GCU/__snapshots__/GCUView.spec.tsx.snap
index f5c466c4d47f425be2d8979d1c5a2995a763982b..918984408f738a1e931094280581679954ed37ce 100644
--- a/src/components/Options/GCU/__snapshots__/GCUView.spec.tsx.snap
+++ b/src/components/Options/GCU/__snapshots__/GCUView.spec.tsx.snap
@@ -10,9 +10,7 @@ exports[`GCUView component should be rendered correctly 1`] = `
desktoptitlekey="common.title_gcu"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="gcu-content-root"
>
diff --git a/src/components/Options/LegalNotice/LegalNoticeView.tsx b/src/components/Options/LegalNotice/LegalNoticeView.tsx
index 4c68ee2a1b48cca408a1cae207e24ca4464cd182..660a1f14806934a8e5db9378dc5aed686b227709 100644
--- a/src/components/Options/LegalNotice/LegalNoticeView.tsx
+++ b/src/components/Options/LegalNotice/LegalNoticeView.tsx
@@ -1,22 +1,19 @@
import Content from 'components/Content/Content'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
-import React, { useState } from 'react'
+import React from 'react'
import LegalNoticeContent from './LegalNoticeContent'
import './legalNoticeView.scss'
const LegalNoticeView = () => {
- const [headerHeight, setHeaderHeight] = useState<number>(0)
-
return (
<>
<CozyBar titleKey="common.title_legal_notice" displayBackArrow={true} />
<Header
- setHeaderHeight={setHeaderHeight}
desktopTitleKey="common.title_legal_notice"
displayBackArrow={true}
/>
- <Content heightOffset={headerHeight}>
+ <Content>
<LegalNoticeContent />
</Content>
</>
diff --git a/src/components/Options/LegalNotice/__snapshots__/LegalNoticeView.spec.tsx.snap b/src/components/Options/LegalNotice/__snapshots__/LegalNoticeView.spec.tsx.snap
index f236decc8ad65984c4fd9640a1be5cb9915c238d..cfcafe24c35d3ffa8d738027f2c04c6107e1a8c2 100644
--- a/src/components/Options/LegalNotice/__snapshots__/LegalNoticeView.spec.tsx.snap
+++ b/src/components/Options/LegalNotice/__snapshots__/LegalNoticeView.spec.tsx.snap
@@ -10,9 +10,7 @@ exports[`LegalNoticeView component should be rendered correctly 1`] = `
desktoptitlekey="common.title_legal_notice"
displaybackarrow="true"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="legal-notice-root"
>
diff --git a/src/components/Options/OptionsView.tsx b/src/components/Options/OptionsView.tsx
index 8da4b6a0fb4b806e59c4fd3fd206f89c00333724..54e5e694ea399046539b9ed80c440aec418ae30d 100644
--- a/src/components/Options/OptionsView.tsx
+++ b/src/components/Options/OptionsView.tsx
@@ -2,7 +2,8 @@ import logos from 'assets/png/logos_partenaires.svg'
import Content from 'components/Content/Content'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
-import React, { useState } from 'react'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import React from 'react'
import Accessibility from './Accessibility/Accessibility'
import ExportData from './ExportData/ExportData'
import GCULink from './GCU/GCULink'
@@ -14,16 +15,13 @@ import ReportOptions from './ReportOptions/ReportOptions'
import Version from './Version/Version'
const OptionsView = () => {
- const [headerHeight, setHeaderHeight] = useState<number>(0)
+ const { t } = useI18n()
return (
<>
<CozyBar titleKey="common.title_options" />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_options"
- />
- <Content heightOffset={headerHeight}>
+ <Header desktopTitleKey="common.title_options" />
+ <Content>
<ProfileTypeOptions />
<ExportData />
<ReportOptions />
@@ -33,7 +31,7 @@ const OptionsView = () => {
<Accessibility />
<MatomoOptOut />
<div className="parameters-logos">
- <img src={logos} alt="ensemble de logos" />
+ <img src={logos} alt={t(`common.funders_logo`)} />
</div>
<Version />
</Content>
diff --git a/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx
index e5c67e980ecfea5869f0448492ae90c398bdb5f1..1ecad5c9a8a396d1ab3087f8c050d4b78cb3a2ac 100644
--- a/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx
+++ b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import ProfileTypeOptions from 'components/Options/ProfileTypeOptions/ProfileTypeOptions'
import {
@@ -31,7 +31,9 @@ describe('ProfileTypeOptions component', () => {
</Provider>
)
expect(container.getElementsByClassName('profile-icon').length).toBeTruthy()
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('profile_type.read_profile'))
+ })
expect(mockedNavigate).toHaveBeenCalled()
})
it('should be rendered when user complete profile type form', () => {
diff --git a/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.tsx b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.tsx
index d106bf4d1effb5d01f8104cd00bfbb6afd62cca8..d9ed1c828754438af9be7f61094272af105ecb4f 100644
--- a/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.tsx
+++ b/src/components/Options/ProfileTypeOptions/ProfileTypeOptions.tsx
@@ -29,13 +29,13 @@ const ProfileTypeOptions = () => {
const { t } = useI18n()
const navigate = useNavigate()
const [, setValidExploration] = useExploration()
- const [active, setActive] = useState<boolean>(false)
+ const [isExpanded, setIsExpanded] = useState<boolean>(false)
const toggleAccordion = () => {
- if (!active) {
+ if (!isExpanded) {
setValidExploration(UserExplorationID.EXPLORATION001)
}
- setActive(prev => !prev)
+ setIsExpanded(prev => !prev)
}
const goToForm = () => {
@@ -58,7 +58,7 @@ const ProfileTypeOptions = () => {
)}
{profile.isProfileTypeCompleted && (
<Accordion
- expanded={active}
+ expanded={isExpanded}
onChange={toggleAccordion}
classes={{
root: 'expansion-panel-root',
diff --git a/src/components/Options/ReportOptions/ReportOptions.spec.tsx b/src/components/Options/ReportOptions/ReportOptions.spec.tsx
index 008e755404fc612cda3a1c5c722377e7d0185da5..14752d0b242c4ba2333d151dca4fb41c539eaeac 100644
--- a/src/components/Options/ReportOptions/ReportOptions.spec.tsx
+++ b/src/components/Options/ReportOptions/ReportOptions.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import ReportOptions from 'components/Options/ReportOptions/ReportOptions'
import React from 'react'
@@ -41,7 +41,9 @@ describe('ReportOptions component', () => {
<ReportOptions />
</Provider>
)
- await userEvent.click(screen.getAllByRole('checkbox')[0])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('checkbox')[0])
+ })
expect(updateProfileSpy).toHaveBeenCalledTimes(1)
expect(updateProfileSpy).toHaveBeenCalledWith({
sendAnalysisNotification: false,
@@ -57,7 +59,9 @@ describe('ReportOptions component', () => {
<ReportOptions />
</Provider>
)
- await userEvent.click(screen.getAllByRole('checkbox')[0])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('checkbox')[0])
+ })
expect(updateProfileSpy).toHaveBeenCalledTimes(1)
expect(updateProfileSpy).toHaveBeenCalledWith({
sendAnalysisNotification: true,
@@ -76,7 +80,9 @@ describe('ReportOptions component', () => {
</Provider>
)
expect(screen.getAllByRole('checkbox')[1]).not.toBeChecked()
- await userEvent.click(screen.getAllByRole('checkbox')[1])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('checkbox')[1])
+ })
expect(updateProfileSpy).toHaveBeenCalledTimes(1)
expect(updateProfileSpy).toHaveBeenCalledWith({
sendConsumptionAlert: true,
diff --git a/src/components/Options/ReportOptions/ReportOptions.tsx b/src/components/Options/ReportOptions/ReportOptions.tsx
index 30dc6917cfcdb8abfe8516f5a3bf89101ffebb90..ab9bf280a489403943a040a97096087dce19943e 100644
--- a/src/components/Options/ReportOptions/ReportOptions.tsx
+++ b/src/components/Options/ReportOptions/ReportOptions.tsx
@@ -1,3 +1,4 @@
+import { OutlinedInput } from '@material-ui/core'
import StyledSwitch from 'components/CommonKit/Switch/StyledSwitch'
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -34,9 +35,11 @@ const ReportOptions = () => {
const isWaterConnected =
fluidStatus[FluidType.WATER].status !== FluidState.NOT_CONNECTED &&
fluidStatus[FluidType.WATER].status !== FluidState.KONNECTOR_NOT_FOUND &&
- fluidStatus[FluidType.WATER].status !== FluidState.ERROR_LOGIN_FAILED
+ fluidStatus[FluidType.WATER].status !== FluidState.LOGIN_FAILED
- const setWaterLimit = (e: React.ChangeEvent<HTMLInputElement>) => {
+ const setWaterLimit = (
+ e: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement, Element>
+ ) => {
if (e.target.value !== null && parseInt(e.target.value) > 0) {
dispatch(
updateProfile({
@@ -133,7 +136,7 @@ const ReportOptions = () => {
{t('profile.report.input_label_alert')}
</div>
<div className="switch-container-alert">
- <input
+ <OutlinedInput
className="inputNumber text-18"
type="number"
defaultValue={
@@ -142,6 +145,9 @@ const ReportOptions = () => {
: profile.waterDailyConsumptionLimit
}
onBlur={setWaterLimit}
+ inputProps={{
+ min: 0,
+ }}
aria-label={t(
'profile.accessibility.input_water_alert_report'
)}
diff --git a/src/components/Options/Unsubscribe/Unsubscribe.spec.tsx b/src/components/Options/Unsubscribe/Unsubscribe.spec.tsx
index a014ff8cb0b1b83f6483b2673a042a1391bf78be..9a9ac90550c1ace8b3d4adc06a97e27198e8eb61 100644
--- a/src/components/Options/Unsubscribe/Unsubscribe.spec.tsx
+++ b/src/components/Options/Unsubscribe/Unsubscribe.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import Unsubscribe from './Unsubscribe'
@@ -20,8 +20,9 @@ describe('Unsubscribe component', () => {
it('should click the subscribe button', async () => {
const { container } = render(<Unsubscribe />)
await waitFor(() => null, { container })
- const [subscribeBtn] = screen.getAllByRole('button')
- await userEvent.click(subscribeBtn)
+ await act(async () => {
+ await userEvent.click(screen.getByText('unsubscribe.button_subscribe'))
+ })
expect(mockUpdateProfile).toHaveBeenCalled()
// then should only display one button
diff --git a/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap b/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
index eee51c9ad1383e8c55bd7bbb53ab0d99fe3e5af1..6f2c8cedd1c0f04a3be025a71ea7c25d16c3cbf7 100644
--- a/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
+++ b/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
@@ -8,9 +8,7 @@ exports[`OptionsView component should be rendered correctly 1`] = `
<mock-header
desktoptitlekey="common.title_options"
/>
- <mock-content
- heightoffset="0"
- >
+ <mock-content>
<div
class="profile-type-root"
>
@@ -398,7 +396,7 @@ exports[`OptionsView component should be rendered correctly 1`] = `
class="parameters-logos"
>
<img
- alt="ensemble de logos"
+ alt="common.funders_logo"
src="test-file-stub"
/>
</div>
diff --git a/src/components/PartnerIssue/PartnerIssueModal.spec.tsx b/src/components/PartnerIssue/PartnerIssueModal.spec.tsx
index be3c840762990e6e96e63bab2833f5d69580dfd5..41789bf10ed7bf69f7abe1b9afc611921fb1f6a7 100644
--- a/src/components/PartnerIssue/PartnerIssueModal.spec.tsx
+++ b/src/components/PartnerIssue/PartnerIssueModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { FluidType } from 'enums'
import React from 'react'
@@ -49,7 +49,11 @@ describe('PartnerIssueModal component', () => {
issuedFluid={FluidType.ELECTRICITY}
/>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('consumption.partner_issue_modal.ok')
+ )
+ })
expect(mockHandleClose).toHaveBeenCalled()
})
diff --git a/src/components/PartnerIssue/PartnerIssueModal.tsx b/src/components/PartnerIssue/PartnerIssueModal.tsx
index 14549c0270cc6531bc3ad17783ccd3e39eeedb0a..d6158bd696ecd68900096f8994e68a8d3f8532e3 100644
--- a/src/components/PartnerIssue/PartnerIssueModal.tsx
+++ b/src/components/PartnerIssue/PartnerIssueModal.tsx
@@ -41,7 +41,7 @@ const PartnerIssueModal = ({
onClose={(event, reason): void => {
event && reason !== 'backdropClick' && handleCloseClick(issuedFluid)
}}
- aria-labelledby="accessibility-title"
+ aria-label={t('consumption.partner_issue_modal.accessibility_title')}
classes={{
root: 'modal-root',
paper: 'modal-paper',
diff --git a/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap b/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap
index c133766cab34b402c000f5244f9c4ec9c6aed62f..a0196786c26b18a6c58302c49e56c65b3c1a024b 100644
--- a/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap
+++ b/src/components/PartnerIssue/__snapshots__/PartnerIssueModal.spec.tsx.snap
@@ -8,6 +8,7 @@ exports[`PartnerIssueModal component should render correctly 1`] = `
aria-hidden="true"
/>
<div
+ aria-label="consumption.partner_issue_modal.accessibility_title"
class="MuiDialog-root modal-root"
role="presentation"
style="position: fixed; z-index: 1500; right: 0px; bottom: 0px; top: 0px; left: 0px;"
@@ -28,7 +29,6 @@ exports[`PartnerIssueModal component should render correctly 1`] = `
tabindex="-1"
>
<div
- aria-labelledby="accessibility-title"
class="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
role="dialog"
>
diff --git a/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx b/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx
index 402a3a0bffeea34b3b24e2479491759dbadf4bb7..129114f86fac29eaba1d227ef002015e062b966e 100644
--- a/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx
+++ b/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -45,7 +45,11 @@ describe('ProfileTypeFinished component', () => {
<ProfileTypeFinished profileType={mockProfileType} />
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByLabelText('profile_type.accessibility.button_validate')
+ )
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/ecogesture-selection')
})
})
diff --git a/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.tsx b/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.tsx
index c7de430773e7f8036822003100eaa29b1b9ebe8f..f32dd2d9d4b37c8253ddd97169bc1aafa6d39a3a 100644
--- a/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.tsx
+++ b/src/components/ProfileType/ProfileTypeFinished/ProfileTypeFinished.tsx
@@ -53,7 +53,7 @@ const ProfileTypeFinished = ({ profileType }: { profileType: ProfileType }) => {
}),
}
const profileTypeEntityService = new ProfileTypeEntityService(client)
- const myProfileTypes: ProfileType[] | null =
+ const myProfileTypes =
await profileTypeEntityService.getAllProfileTypes(chosenPeriod)
if (myProfileTypes !== null) {
const destroyPT =
diff --git a/src/components/ProfileType/ProfileTypeFormDateSelection/ProfileTypeFormDateSelection.tsx b/src/components/ProfileType/ProfileTypeFormDateSelection/ProfileTypeFormDateSelection.tsx
index c1e63fc33d4b952ce125fdb309376e1066800503..a3d7d056eb58991da159476a840d5e40b1edcecb 100644
--- a/src/components/ProfileType/ProfileTypeFormDateSelection/ProfileTypeFormDateSelection.tsx
+++ b/src/components/ProfileType/ProfileTypeFormDateSelection/ProfileTypeFormDateSelection.tsx
@@ -5,7 +5,7 @@ import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { ProfileTypeStepForm } from 'enums'
import { DateTime } from 'luxon'
import { ProfileType, ProfileTypeAnswer, ProfileTypeValues } from 'models'
-import React, { useCallback, useState } from 'react'
+import React, { useState } from 'react'
import { formatTwoDigits, getMonthFullName } from 'utils/utils'
interface ProfileTypeFormDateSelectionProps {
@@ -100,10 +100,6 @@ const ProfileTypeFormDateSelection = ({
selectYears.push(i)
}
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
-
const handleNext = () => {
setNextStep({ ...profileType, [answerType.attribute]: answer })
}
@@ -137,21 +133,6 @@ const ProfileTypeFormDateSelection = ({
</div>
{answer !== null && (
<div className="select-container">
- <div className="date-select">
- <Select
- labelId="selectYearDate"
- className="year"
- defaultValue={selectedYear}
- value={selectedYear}
- onChange={e => handleSelectYear(e)}
- >
- {selectYears.map(year => (
- <MenuItem value={year} key={year} className="date-option">
- {year}
- </MenuItem>
- ))}
- </Select>
- </div>
<div className="date-select">
<Select
labelId="selectMonthDate"
@@ -171,11 +152,26 @@ const ProfileTypeFormDateSelection = ({
))}
</Select>
</div>
+ <div className="date-select">
+ <Select
+ labelId="selectYearDate"
+ className="year"
+ defaultValue={selectedYear}
+ value={selectedYear}
+ onChange={e => handleSelectYear(e)}
+ >
+ {selectYears.map(year => (
+ <MenuItem value={year} key={year} className="date-option">
+ {year}
+ </MenuItem>
+ ))}
+ </Select>
+ </div>
</div>
)}
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disableNextButton={answer === ''}
isLastStep={true}
diff --git a/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.tsx b/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.tsx
index 2a3c9cfac0a6275e6c409c307dad16ed9ec734ad..07f1895e9dc293df45da3d0b99395d4207457680 100644
--- a/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.tsx
+++ b/src/components/ProfileType/ProfileTypeFormMultiChoice/ProfileTypeFormMultiChoice.tsx
@@ -52,10 +52,6 @@ const ProfileTypeFormMultiChoice = ({
return answer.includes(value)
}
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
-
const handleNext = useCallback(() => {
setNextStep({
...currentProfileType,
@@ -108,7 +104,7 @@ const ProfileTypeFormMultiChoice = ({
})}
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disableNextButton={answer.length < 1}
/>
diff --git a/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.tsx b/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.tsx
index e4d1bf390873b9d92424d7b165886f722980295e..321f73ee9dad17adcd437e17239d3ce06ff173cb 100644
--- a/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.tsx
+++ b/src/components/ProfileType/ProfileTypeFormNumber/ProfileTypeFormNumber.tsx
@@ -1,4 +1,5 @@
/* eslint-disable jsx-a11y/no-autofocus */
+import { InputAdornment, OutlinedInput } from '@material-ui/core'
import FormNavigation from 'components/CommonKit/FormNavigation/FormNavigation'
import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -30,10 +31,6 @@ const ProfileTypeFormNumber = ({
)
const [answer, setAnswer] = useState<ProfileTypeValues>('')
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
-
const handleNext = useCallback(() => {
setNextStep({ ...currentProfileType, [answerType.attribute]: answer })
}, [currentProfileType, setNextStep, answer, answerType.attribute])
@@ -54,7 +51,8 @@ const ProfileTypeFormNumber = ({
</div>
{answer != null && (
<label className="text">
- <input
+ <OutlinedInput
+ endAdornment={<InputAdornment position="end">m²</InputAdornment>}
type="number"
className="inputNumber"
value={answer.toString()}
@@ -63,12 +61,11 @@ const ProfileTypeFormNumber = ({
autoFocus
style={{ marginRight: '0.5rem' }}
/>
- m²
</label>
)}
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disableNextButton={answer === ''}
/>
diff --git a/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.tsx b/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.tsx
index be39d086fade19dd51fb266d8d5f3d33838ead41..06b84201e2e01bb60d1abaf69b3b1d89726861e9 100644
--- a/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.tsx
+++ b/src/components/ProfileType/ProfileTypeFormNumberSelection/ProfileTypeFormNumberSelection.tsx
@@ -1,4 +1,4 @@
-import { Button } from '@material-ui/core'
+import { Button, TextField } from '@material-ui/core'
import FormNavigation from 'components/CommonKit/FormNavigation/FormNavigation'
import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
@@ -41,10 +41,6 @@ const ProfileTypeFormNumberSelection = ({
setIndex(prev => prev + 1)
}
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
-
const handleNext = useCallback(() => {
setNextStep({ ...currentProfileType, [answerType.attribute]: answer })
}, [currentProfileType, setNextStep, answer, answerType.attribute])
@@ -82,12 +78,13 @@ const ProfileTypeFormNumberSelection = ({
>
-
</Button>
- <input
- type="number"
- className="inputNumber"
+ <TextField
+ variant="outlined"
+ type="tel"
+ className="inputNumberIncrements"
value={answer.toString()}
name={answerType.attribute}
- disabled={true}
+ size="small"
/>
<Button
onClick={() => increment()}
@@ -103,7 +100,7 @@ const ProfileTypeFormNumberSelection = ({
)}
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disableNextButton={answer === ''}
/>
diff --git a/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.tsx b/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.tsx
index 2fc81aa25bc284c25999e7b688f108426f99bf75..0f5216e8f7f333c02c64627bb3c0046e710f016d 100644
--- a/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.tsx
+++ b/src/components/ProfileType/ProfileTypeFormSingleChoice/ProfileTypeFormSingleChoice.tsx
@@ -36,9 +36,6 @@ const ProfileTypeFormSingleChoice = ({
} = useAppSelector(state => state.ecolyo)
const [answer, setAnswer] = useState<ProfileTypeValues>('')
- const handlePrevious = useCallback(() => {
- setPreviousStep()
- }, [setPreviousStep])
const handleNext = useCallback(() => {
setNextStep({ ...currentProfileType, [answerType.attribute]: answer })
@@ -103,7 +100,7 @@ const ProfileTypeFormSingleChoice = ({
})}
</div>
<FormNavigation
- handlePrevious={handlePrevious}
+ handlePrevious={setPreviousStep}
handleNext={handleNext}
disablePrevButton={step === ProfileTypeStepForm.HOUSING_TYPE}
disableNextButton={answer === '' || answer === undefined}
diff --git a/src/components/ProfileType/ProfileTypeView.spec.tsx b/src/components/ProfileType/ProfileTypeView.spec.tsx
index 77e2baebe8ea29e3184babe0745fed2a83d520ec..8b836fb4d73b0243f9c2b20f044efaca51ed26da 100644
--- a/src/components/ProfileType/ProfileTypeView.spec.tsx
+++ b/src/components/ProfileType/ProfileTypeView.spec.tsx
@@ -35,7 +35,8 @@ describe('ProfileTypeView component', () => {
<ProfileTypeView />
</Provider>
)
- const [prev] = screen.getAllByRole('button')
- expect(prev).toBeDisabled()
+ expect(
+ screen.getByLabelText('profile_type.accessibility.button_previous')
+ ).toBeDisabled()
})
})
diff --git a/src/components/ProfileType/ProfileTypeView.tsx b/src/components/ProfileType/ProfileTypeView.tsx
index 2436c5bd0203f363949993fd39c456cb4f2e632a..0e3369a047fba8d9cfe4a8108920b9730cf3885a 100644
--- a/src/components/ProfileType/ProfileTypeView.tsx
+++ b/src/components/ProfileType/ProfileTypeView.tsx
@@ -37,7 +37,6 @@ const ProfileTypeView = () => {
state => state.ecolyo
)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const [currentProfileType, setCurrentProfileType] = useState<ProfileType>({
updateDate: DateTime.local()
.setZone('utc', {
@@ -123,8 +122,7 @@ const ProfileTypeView = () => {
const profileTypeFormService = new ProfileTypeFormService(
currentProfileType
)
- const previousStep: ProfileTypeStepForm =
- profileTypeFormService.getPreviousFormStep(step)
+ const previousStep = profileTypeFormService.getPreviousFormStep(step)
setIsLoading(true)
setStep(previousStep)
}, [currentProfileType, step])
@@ -225,11 +223,10 @@ const ProfileTypeView = () => {
<>
<CozyBar titleKey="common.title_profiletype" displayBackArrow={true} />
<Header
- setHeaderHeight={setHeaderHeight}
desktopTitleKey="common.title_profiletype"
displayBackArrow={true}
/>
- <Content heightOffset={headerHeight}>
+ <Content>
<div className="profileType-view">
<div className="progressContainer">
<FormProgress
diff --git a/src/components/ProfileType/profileTypeForm.scss b/src/components/ProfileType/profileTypeForm.scss
index 9ebe653558a6026ed81aa611f69570526f0457c6..e2cd232b02acf1a17b4eaa4ab1ade48a63fd1825 100644
--- a/src/components/ProfileType/profileTypeForm.scss
+++ b/src/components/ProfileType/profileTypeForm.scss
@@ -110,6 +110,11 @@
border-color: $gold-shadow;
}
}
+
+ .inputNumberIncrements {
+ width: 80px;
+ }
+
.date-select {
margin: 0.5em;
border: 1px solid $gold-shadow;
diff --git a/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx b/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx
index aa5330b3cc9dc91ec28ac0ec48172a87e6f9e898..ccaf243e83620d21cffe47d48d5bc75187afdb2a 100644
--- a/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx
+++ b/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { UserChallengeUpdateFlag } from 'enums'
import React from 'react'
@@ -23,7 +23,9 @@ describe('QuizBegin component', () => {
</Provider>
)
expect(container.getElementsByClassName('quiz-icon')[0]).toBeInTheDocument()
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByText('duel.button_start'))
+ })
expect(mockUserChallengeUpdateFlag).toHaveBeenCalledWith(
userChallengeData[0],
UserChallengeUpdateFlag.QUIZ_START
diff --git a/src/components/Quiz/QuizExplanationModal/QuizExplanationModal.tsx b/src/components/Quiz/QuizExplanationModal/QuizExplanationModal.tsx
index 928940f0642c7398a5ddd3dbe4b0aa883c5ccd0a..2d84331434722f315a25f5fe8489f12bb180e19f 100644
--- a/src/components/Quiz/QuizExplanationModal/QuizExplanationModal.tsx
+++ b/src/components/Quiz/QuizExplanationModal/QuizExplanationModal.tsx
@@ -5,12 +5,12 @@ import wrongAnswer from 'assets/icons/ico/wrongAnswer.svg'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Icon from 'cozy-ui/transpiled/react/Icon'
import { QuestionEntity } from 'models'
-import React, { useEffect, useState } from 'react'
+import React from 'react'
import './quizExplanationModal.scss'
interface QuizExplanationModalProps {
open: boolean
- question: QuestionEntity | undefined
+ question: QuestionEntity
answerIndex: number
goNext: () => void
handleCloseClick: () => void
@@ -24,15 +24,9 @@ const QuizExplanationModal = ({
handleCloseClick,
}: QuizExplanationModalProps) => {
const { t } = useI18n()
- const [validAnswer, setValidAnswer] = useState<number>(0)
- useEffect(() => {
- if (question) {
- const resultIndex: number = question.answers.findIndex(
- answer => answer.isTrue
- )
- setValidAnswer(resultIndex)
- }
- }, [question])
+
+ const validAnswer = question.answers.findIndex(answer => answer.isTrue)
+
return (
<Dialog
open={open}
diff --git a/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx b/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx
index 8b2dc272d6852c08babfdb55b386e176f935185d..9bac2567e4a78b44b8dcf3cf0ee6234b2e75df6e 100644
--- a/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx
+++ b/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -28,7 +28,9 @@ describe('QuizFinish', () => {
</Provider>
)
expect(container.getElementsByClassName('quiz-icon')[0]).toBeInTheDocument()
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getByText('quiz.button_go_back'))
+ })
expect(mockUserChallengeUpdateFlag).toHaveBeenCalled()
expect(mockedNavigate).toHaveBeenCalledWith('/challenges')
})
diff --git a/src/components/Quiz/QuizFinish/QuizFinish.tsx b/src/components/Quiz/QuizFinish/QuizFinish.tsx
index 3603c0710a1201c2f4fc0c160a384f8a74833198..c2c1d8ebec6a7fa203fd2208fc38db4e75a389fa 100644
--- a/src/components/Quiz/QuizFinish/QuizFinish.tsx
+++ b/src/components/Quiz/QuizFinish/QuizFinish.tsx
@@ -17,10 +17,7 @@ const QuizFinish = ({ userChallenge }: { userChallenge: UserChallenge }) => {
const client = useClient()
const navigate = useNavigate()
const dispatch = useAppDispatch()
- const challengeService: ChallengeService = useMemo(
- () => new ChallengeService(client),
- [client]
- )
+ const challengeService = useMemo(() => new ChallengeService(client), [client])
const retryQuiz = useCallback(async () => {
const userChallengeUpdated = await challengeService.updateUserChallenge(
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestion.spec.tsx b/src/components/Quiz/QuizQuestion/QuizQuestion.spec.tsx
index 6abd2f50f97ab01603e316fce1d83ff8ddf201d8..311ec78e7b1f38a7711fd3a7df48b1bd8650c568 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestion.spec.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestion.spec.tsx
@@ -1,17 +1,18 @@
import { render, waitFor } from '@testing-library/react'
import { UserQuestionState } from 'enums'
+import { QuestionEntity } from 'models'
import React from 'react'
import { Provider } from 'react-redux'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock'
import QuizQuestion from './QuizQuestion'
+const mockGetCustomQuestion = jest.fn<Promise<QuestionEntity>, [string]>()
+
jest.mock('services/quiz.service', () => {
- return jest.fn(() => {
- return {
- getCustomQuestion: jest.fn(),
- }
- })
+ return jest.fn(() => ({
+ getCustomQuestion: mockGetCustomQuestion,
+ }))
})
jest.mock(
@@ -45,6 +46,21 @@ describe('QuizQuestion component', () => {
updateUserChallengeData.quiz.questions.forEach(
answer => (answer.result = UserQuestionState.CORRECT)
)
+ mockGetCustomQuestion.mockResolvedValue({
+ questionLabel: 'customQuestion',
+ explanation: 'explanation',
+ answers: [
+ {
+ answerLabel: 'answer1',
+ isTrue: true,
+ },
+ {
+ answerLabel: 'answer2',
+ isTrue: false,
+ },
+ ],
+ source: 'source',
+ })
const { container } = render(
<Provider store={store}>
<QuizQuestion userChallenge={updateUserChallengeData} />
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestion.tsx b/src/components/Quiz/QuizQuestion/QuizQuestion.tsx
index 25ff5662bdd27baa282c522037a2e2178f939c50..4838694dc56013f3fbaba7af56b402b2bae8cfc9 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestion.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestion.tsx
@@ -10,17 +10,15 @@ import './quizQuestion.scss'
const QuizQuestion = ({ userChallenge }: { userChallenge: UserChallenge }) => {
const client = useClient()
- const { fluidTypes } = useAppSelector(state => state.ecolyo.global)
const navigate = useNavigate()
- const questionsIsLocked: boolean = userChallenge.quiz.questions.some(
+ const { fluidTypes } = useAppSelector(state => state.ecolyo.global)
+
+ const questionsIsLocked = userChallenge.quiz.questions.some(
answer => answer.result == 0
)
- const [question, setQuestion] = useState<QuestionEntity>()
- const [isCustomQuest, setIsCustomQuest] = useState<boolean>(
- !questionsIsLocked
- )
- const [customQuestionLoading, setCustomQuestionLoading] =
- useState<boolean>(false)
+ const [customQuestion, setCustomQuestion] = useState<QuestionEntity>()
+ const [isCustomQuest, setIsCustomQuest] = useState(!questionsIsLocked)
+ const [customQuestionLoading, setCustomQuestionLoading] = useState(false)
const goBack = () => {
navigate('/challenges')
@@ -29,14 +27,13 @@ const QuizQuestion = ({ userChallenge }: { userChallenge: UserChallenge }) => {
useEffect(() => {
let subscribed = true
async function loadCustomQuestion() {
- const quizService: QuizService = new QuizService(client)
- const customQuestion: QuestionEntity =
- await quizService.getCustomQuestion(
- userChallenge.quiz.customQuestion,
- fluidTypes
- )
+ const quizService = new QuizService(client)
+ const customQuestion = await quizService.getCustomQuestion(
+ userChallenge.quiz.customQuestion,
+ fluidTypes
+ )
if (subscribed) {
- setQuestion(customQuestion)
+ setCustomQuestion(customQuestion)
setCustomQuestionLoading(false)
}
}
@@ -51,11 +48,11 @@ const QuizQuestion = ({ userChallenge }: { userChallenge: UserChallenge }) => {
return (
<>
- {isCustomQuest ? (
+ {isCustomQuest && customQuestion ? (
<QuizQuestionContentCustom
userChallenge={userChallenge}
goBack={goBack}
- question={question}
+ customQuestion={customQuestion}
isLoading={customQuestionLoading}
/>
) : (
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestionContent.spec.tsx b/src/components/Quiz/QuizQuestion/QuizQuestionContent.spec.tsx
index aa80b5f09caa65e5868dab46deb0908ccfcfb541..707db20c957bf13a88e956b40872912e4343738a 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestionContent.spec.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestionContent.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -51,7 +51,9 @@ describe('QuizQuestionContent component', () => {
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('button')[0])
+ })
expect(mockedNavigate).toHaveBeenCalledWith('/challenges')
})
})
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx b/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx
index 74a8effc665cf8a43225ae16b407d246c21f12fc..eb59925814374d01f1b630783c21b082cbb32db6 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestionContent.tsx
@@ -5,7 +5,7 @@ import QuizExplanationModal from 'components/Quiz/QuizExplanationModal/QuizExpla
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { UserChallengeUpdateFlag } from 'enums'
-import { Answer, UserChallenge, UserQuiz } from 'models'
+import { UserChallenge } from 'models'
import React, { Dispatch, SetStateAction, useCallback, useState } from 'react'
import ChallengeService from 'services/challenge.service'
import QuizService from 'services/quiz.service'
@@ -36,29 +36,28 @@ const QuizQuestionContent = ({
const [questionIndex, setQuestionIndex] =
useState<number>(questionIndexLocked)
- const quizService: QuizService = new QuizService(client)
- const challengeService: ChallengeService = new ChallengeService(client)
+ const quizService = new QuizService(client)
+ const challengeService = new ChallengeService(client)
const validateQuestion = async () => {
- const resultIndex: number = userChallenge.quiz.questions[
+ const resultIndex = userChallenge.quiz.questions[
questionIndex
].answers.findIndex(answer => answer.answerLabel === userChoice)
- const result: Answer[] = userChallenge.quiz.questions[
- questionIndex
- ].answers.filter(answer => answer.answerLabel === userChoice)
+ const result = userChallenge.quiz.questions[questionIndex].answers.filter(
+ answer => answer.answerLabel === userChoice
+ )
setAnswerIndex(resultIndex)
setOpenModal(true)
- const quizUpdated: UserQuiz = await quizService.updateUserQuiz(
+ const quizUpdated = await quizService.updateUserQuiz(
userChallenge.quiz,
result[0].isTrue,
questionIndex
)
- const userChallengeUpdated: UserChallenge =
- await challengeService.updateUserChallenge(
- userChallenge,
- UserChallengeUpdateFlag.QUIZ_UPDATE,
- quizUpdated
- )
+ const userChallengeUpdated = await challengeService.updateUserChallenge(
+ userChallenge,
+ UserChallengeUpdateFlag.QUIZ_UPDATE,
+ quizUpdated
+ )
dispatch(updateUserChallengeList(userChallengeUpdated))
}
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx b/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx
index 12809ef896773c3bc99e5b90f74c05926316ed62..f467eb0beb84762b48d9741ae55403f663e06c60 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -36,13 +36,15 @@ describe('QuizCustomQuestionContent component', () => {
<Provider store={store}>
<QuizQuestionContentCustom
userChallenge={userChallengeData[0]}
- question={questionEntity}
+ customQuestion={questionEntity}
goBack={mockHistoryPush('/challenges')}
isLoading={false}
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('button')[0])
+ })
expect(mockHistoryPush).toHaveBeenCalledWith('/challenges')
expect(screen.getByText(questionEntity.questionLabel)).toBeInTheDocument()
expect(screen.getAllByRole('radio').length).toBe(3)
@@ -52,7 +54,7 @@ describe('QuizCustomQuestionContent component', () => {
<Provider store={store}>
<QuizQuestionContentCustom
userChallenge={userChallengeData[0]}
- question={questionEntity}
+ customQuestion={questionEntity}
goBack={mockHistoryPush('/challenges')}
isLoading={true}
/>
@@ -67,14 +69,16 @@ describe('QuizCustomQuestionContent component', () => {
<Provider store={store}>
<QuizQuestionContentCustom
userChallenge={userChallengeData[0]}
- question={questionEntity}
+ customQuestion={questionEntity}
goBack={mockHistoryPush('/challenges')}
isLoading={false}
/>
</Provider>
)
- await userEvent.click(screen.getAllByRole('radio')[0])
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(screen.getAllByRole('radio')[0])
+ await userEvent.click(screen.getByText('quiz.button_validate'))
+ })
expect(mockUpdateUserQuiz).toHaveBeenCalledWith(
userChallengeData[0].quiz,
questionEntity.answers[0].isTrue
diff --git a/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.tsx b/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.tsx
index 72cf01ba2719b26e4da2132d41193389d67eaf70..8e08ef5adf4be828e82f3b7c35296e20dbc76f91 100644
--- a/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.tsx
+++ b/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.tsx
@@ -6,7 +6,7 @@ import QuizExplanationModal from 'components/Quiz/QuizExplanationModal/QuizExpla
import { useClient } from 'cozy-client'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { UserChallengeUpdateFlag } from 'enums'
-import { Answer, QuestionEntity, UserChallenge, UserQuiz } from 'models'
+import { QuestionEntity, UserChallenge } from 'models'
import React, { useState } from 'react'
import ChallengeService from 'services/challenge.service'
import QuizService from 'services/quiz.service'
@@ -17,14 +17,14 @@ import './quizQuestion.scss'
interface QuizQuestionContentCustomProps {
userChallenge: UserChallenge
goBack: () => void
- question: QuestionEntity | undefined
+ customQuestion: QuestionEntity
isLoading: boolean
}
const QuizQuestionContentCustom = ({
userChallenge,
goBack,
- question,
+ customQuestion,
isLoading,
}: QuizQuestionContentCustomProps) => {
const { t } = useI18n()
@@ -34,32 +34,29 @@ const QuizQuestionContentCustom = ({
const [userChoice, setUserChoice] = useState<string>('')
const [openModal, setOpenModal] = useState<boolean>(false)
const [answerIndex, setAnswerIndex] = useState<number>(0)
- const quizService: QuizService = new QuizService(client)
- const challengeService: ChallengeService = new ChallengeService(client)
+ const quizService = new QuizService(client)
+ const challengeService = new ChallengeService(client)
const validateQuestion = async () => {
- if (question) {
- const resultIndex: number = question.answers.findIndex(
- answer => answer.answerLabel === userChoice
- )
- setAnswerIndex(resultIndex)
- setOpenModal(true)
+ const resultIndex = customQuestion.answers.findIndex(
+ answer => answer.answerLabel === userChoice
+ )
+ setAnswerIndex(resultIndex)
+ setOpenModal(true)
- const result: Answer[] = question.answers.filter(
- answer => answer.answerLabel === userChoice
- )
- const quizUpdated: UserQuiz = await quizService.updateUserQuiz(
- userChallenge.quiz,
- result[0].isTrue
- )
- const userChallengeUpdated: UserChallenge =
- await challengeService.updateUserChallenge(
- userChallenge,
- UserChallengeUpdateFlag.QUIZ_UPDATE,
- quizUpdated
- )
- dispatch(updateUserChallengeList(userChallengeUpdated))
- }
+ const result = customQuestion.answers.filter(
+ answer => answer.answerLabel === userChoice
+ )
+ const quizUpdated = await quizService.updateUserQuiz(
+ userChallenge.quiz,
+ result[0].isTrue
+ )
+ const userChallengeUpdated = await challengeService.updateUserChallenge(
+ userChallenge,
+ UserChallengeUpdateFlag.QUIZ_UPDATE,
+ quizUpdated
+ )
+ dispatch(updateUserChallengeList(userChallengeUpdated))
}
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -68,11 +65,10 @@ const QuizQuestionContentCustom = ({
const finishQuiz = async () => {
setOpenModal(false)
- const userChallengeUpdated: UserChallenge =
- await challengeService.updateUserChallenge(
- userChallenge,
- UserChallengeUpdateFlag.QUIZ_DONE
- )
+ const userChallengeUpdated = await challengeService.updateUserChallenge(
+ userChallenge,
+ UserChallengeUpdateFlag.QUIZ_DONE
+ )
dispatch(updateUserChallengeList(userChallengeUpdated))
}
@@ -94,27 +90,25 @@ const QuizQuestionContentCustom = ({
<Loader />
</div>
) : (
- question && (
- <>
- <p className="question text-18-bold">{question.questionLabel}</p>
- {question.answers.map((answer, index) => {
- return (
- <div className="answer" key={index}>
- <input
- type="radio"
- id={`answer${index}`}
- value={answer.answerLabel}
- onChange={handleChange}
- checked={userChoice === answer.answerLabel}
- />
- <label htmlFor={`answer${index}`} className="text-16-bold">
- {answer.answerLabel}
- </label>
- </div>
- )
- })}
- </>
- )
+ <>
+ <p className="question text-18-bold">
+ {customQuestion.questionLabel}
+ </p>
+ {customQuestion.answers.map((answer, index) => (
+ <div className="answer" key={index}>
+ <input
+ type="radio"
+ id={`answer${index}`}
+ value={answer.answerLabel}
+ onChange={handleChange}
+ checked={userChoice === answer.answerLabel}
+ />
+ <label htmlFor={`answer${index}`} className="text-16-bold">
+ {answer.answerLabel}
+ </label>
+ </div>
+ ))}
+ </>
)}
</div>
<Button
@@ -129,7 +123,7 @@ const QuizQuestionContentCustom = ({
<QuizExplanationModal
open={openModal}
answerIndex={answerIndex}
- question={question}
+ question={customQuestion}
goNext={finishQuiz}
handleCloseClick={() => setOpenModal(false)}
/>
diff --git a/src/components/Quiz/QuizView.tsx b/src/components/Quiz/QuizView.tsx
index 380346fbe0fba125cf5b63b232dccee3b2f28b45..fc45df655cf53bcc4fc6851edb1b6ecb2d87a4b0 100644
--- a/src/components/Quiz/QuizView.tsx
+++ b/src/components/Quiz/QuizView.tsx
@@ -3,7 +3,7 @@ import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import { UserQuizState } from 'enums'
import { UserChallenge } from 'models'
-import React, { useState } from 'react'
+import React from 'react'
import { useAppSelector } from 'store/hooks'
import QuizBegin from './QuizBegin/QuizBegin'
import QuizFinish from './QuizFinish/QuizFinish'
@@ -11,7 +11,6 @@ import QuizQuestion from './QuizQuestion/QuizQuestion'
const QuizView = () => {
const { currentChallenge } = useAppSelector(state => state.ecolyo.challenge)
- const [headerHeight, setHeaderHeight] = useState<number>(0)
const renderQuiz = (challenge: UserChallenge) => {
switch (challenge.quiz.state) {
@@ -29,14 +28,8 @@ const QuizView = () => {
return (
<>
<CozyBar titleKey="common.title_quiz" displayBackArrow={true} />
- <Header
- setHeaderHeight={setHeaderHeight}
- desktopTitleKey="common.title_quiz"
- displayBackArrow={true}
- />
- <Content heightOffset={headerHeight}>
- {currentChallenge && renderQuiz(currentChallenge)}
- </Content>
+ <Header desktopTitleKey="common.title_quiz" displayBackArrow={true} />
+ <Content>{currentChallenge && renderQuiz(currentChallenge)}</Content>
</>
)
}
diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx
index 89d3a0590b6262642918b54382c2851aa3bf5fa6..a6cdf99bbd9d30ea9d8342544d664a61d6b70e0f 100644
--- a/src/components/Routes/Routes.tsx
+++ b/src/components/Routes/Routes.tsx
@@ -1,5 +1,6 @@
import ActionView from 'components/Action/ActionView'
import ChallengeView from 'components/Challenge/ChallengeView'
+import { GrdfConnectView } from 'components/Connection/GRDFConnect/GrdfConnectView'
import SgeConnectView from 'components/Connection/SGEConnect/SgeConnectView'
import DuelView from 'components/Duel/DuelView'
import EcogestureFormView from 'components/EcogestureForm/EcogestureFormView'
@@ -66,7 +67,8 @@ const AppRoutes = ({ termsStatus }: { termsStatus: TermsStatus }) => {
path="/consumption"
element={<ConsumptionView fluidType={FluidType.MULTIFLUID} />}
/>
- <Route path="/sge-connect" element={<SgeConnectView />} />
+ <Route path="/connect/electricity" element={<SgeConnectView />} />
+ <Route path="/connect/gas" element={<GrdfConnectView />} />
<Route path="/challenges/duel" element={<DuelView />} />
<Route path="/challenges/quiz" element={<QuizView />} />
<Route
diff --git a/src/components/Splash/SplashRoot.spec.tsx b/src/components/Splash/SplashRoot.spec.tsx
index a948480c9363206ed0cf6e0b31d2d78cade0a02e..3f57b513afae955128380a203e95c612e23b5b07 100644
--- a/src/components/Splash/SplashRoot.spec.tsx
+++ b/src/components/Splash/SplashRoot.spec.tsx
@@ -1,5 +1,4 @@
-import { render, screen, waitFor } from '@testing-library/react'
-import { userEvent } from '@testing-library/user-event'
+import { render, waitFor } from '@testing-library/react'
import React from 'react'
import { Provider } from 'react-redux'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
@@ -22,7 +21,7 @@ describe('SplashRoot component', () => {
expect(container).toMatchSnapshot()
})
- it('should render the error screen and click on the reload button', async () => {
+ it('should render the error screen', async () => {
const { container } = render(
<Provider store={store}>
<SplashRoot>children</SplashRoot>
@@ -30,6 +29,5 @@ describe('SplashRoot component', () => {
)
await waitFor(() => null, { container })
expect(container).toMatchSnapshot()
- await userEvent.click(screen.getByRole('button'))
})
})
diff --git a/src/components/Splash/SplashScreen.tsx b/src/components/Splash/SplashScreen.tsx
index 8a23eaa2b89f00dd3b71e7e6adb902c8fb441e91..e33ca2b88c1d6fb64870a10df5c959da7239ed4b 100644
--- a/src/components/Splash/SplashScreen.tsx
+++ b/src/components/Splash/SplashScreen.tsx
@@ -30,7 +30,7 @@ const SplashScreen = ({ initStep }: { initStep: InitSteps }) => {
{t(`splashscreen.step.${initStep}`)}
</div>
<div className="splash-logos-container">
- <img src={logos} alt="ensemble de logos" />
+ <img src={logos} alt={t(`common.funders_logo`)} />
</div>
</div>
)
diff --git a/src/components/Splash/SplashScreenError.spec.tsx b/src/components/Splash/SplashScreenError.spec.tsx
index fdc4e5fa594aaaf15732ef0aee420bf1b119dc23..2aefa0711d893cb9594977a0c7f9e51014649ae5 100644
--- a/src/components/Splash/SplashScreenError.spec.tsx
+++ b/src/components/Splash/SplashScreenError.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import { InitStepsErrors } from 'models/initialisationSteps.model'
import React from 'react'
@@ -24,7 +24,9 @@ describe('SplashScreenError component', () => {
})
it('should reload the page', async () => {
render(<SplashScreenError error={InitStepsErrors.CONSENT_ERROR} />)
- await userEvent.click(screen.getByRole('button'))
+ await act(async () => {
+ await userEvent.click(screen.getByRole('button'))
+ })
expect(window.location.reload).toHaveBeenCalled()
})
})
diff --git a/src/components/Splash/__snapshots__/SplashRoot.spec.tsx.snap b/src/components/Splash/__snapshots__/SplashRoot.spec.tsx.snap
index 4addaf3b692b89fdff97bc23f1eeef967277c2c7..1cc016b6bf9ee4e84abc6eba83474d49907a400e 100644
--- a/src/components/Splash/__snapshots__/SplashRoot.spec.tsx.snap
+++ b/src/components/Splash/__snapshots__/SplashRoot.spec.tsx.snap
@@ -41,7 +41,7 @@ exports[`SplashRoot component should be rendered correctly 1`] = `
class="splash-logos-container"
>
<img
- alt="ensemble de logos"
+ alt="common.funders_logo"
src="test-file-stub"
/>
</div>
@@ -50,7 +50,7 @@ exports[`SplashRoot component should be rendered correctly 1`] = `
</div>
`;
-exports[`SplashRoot component should render the error screen and click on the reload button 1`] = `
+exports[`SplashRoot component should render the error screen 1`] = `
<div>
<div
class="splash-root"
diff --git a/src/components/Splash/__snapshots__/SplashScreen.spec.tsx.snap b/src/components/Splash/__snapshots__/SplashScreen.spec.tsx.snap
index ac994b7876cf9d83b80f0744e268852520b9c52b..fee381e60a027c591bb21d19cc7a20a4f0d565cf 100644
--- a/src/components/Splash/__snapshots__/SplashScreen.spec.tsx.snap
+++ b/src/components/Splash/__snapshots__/SplashScreen.spec.tsx.snap
@@ -37,7 +37,7 @@ exports[`SplashScreen component should be rendered correctly 1`] = `
class="splash-logos-container"
>
<img
- alt="ensemble de logos"
+ alt="common.funders_logo"
src="test-file-stub"
/>
</div>
diff --git a/src/components/Terms/TermsView.spec.tsx b/src/components/Terms/TermsView.spec.tsx
index d5206d463f413f6f989b0453f49dc707c5a8e390..98d0aae76563e2cabe38caf2240088104e408396 100644
--- a/src/components/Terms/TermsView.spec.tsx
+++ b/src/components/Terms/TermsView.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -31,31 +31,65 @@ describe('TermsView component', () => {
jest.clearAllMocks()
})
- it('should be rendered correctly', () => {
+ it('should be rendered correctly', async () => {
const { container } = render(
<Provider store={store}>
<TermsView />
</Provider>
)
+ await waitFor(() => null, { container })
expect(container).toMatchSnapshot()
})
it('should be unable to click "validate" button first then enable checkboxes and valid consent', async () => {
mockCreateTerm.mockResolvedValueOnce(mockUpToDateTerm)
- render(
+ const { container } = render(
<Provider store={store}>
<TermsView />
</Provider>
)
+ await waitFor(() => null, { container })
- const acceptButton = screen.getAllByRole('button')[2]
+ const acceptButton = screen.getByLabelText(
+ 'dataShare.accessibility.button_accept'
+ )
expect(acceptButton).toBeDisabled()
expect(mockUpdateProfile).toHaveBeenCalledTimes(0)
const [boxGCU, boxLegal] = screen.getAllByRole('checkbox')
- await userEvent.click(boxGCU)
- await userEvent.click(boxLegal)
- await userEvent.click(acceptButton)
+ await act(async () => {
+ await userEvent.click(boxGCU)
+ await userEvent.click(boxLegal)
+ await userEvent.click(acceptButton)
+ })
expect(mockAppDispatch).toHaveBeenCalledTimes(3)
})
+
+ it('should open CGU modal', async () => {
+ render(
+ <Provider store={store}>
+ <TermsView />
+ </Provider>
+ )
+ await act(async () => {
+ await userEvent.click(
+ screen.getByRole('button', { name: 'dataShare.validCGU_button' })
+ )
+ })
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+ })
+
+ it('should open legal notice modal', async () => {
+ render(
+ <Provider store={store}>
+ <TermsView />
+ </Provider>
+ )
+ await act(async () => {
+ await userEvent.click(
+ screen.getByRole('button', { name: 'dataShare.validLegal_button' })
+ )
+ })
+ expect(screen.getByRole('dialog')).toBeInTheDocument()
+ })
})
diff --git a/src/components/Terms/TermsView.tsx b/src/components/Terms/TermsView.tsx
index 60c43630fc15d3c3c86ad8bd93c39da0da48ad09..d7262d8fc8f6677f3b65914683fed9701ce294e0 100644
--- a/src/components/Terms/TermsView.tsx
+++ b/src/components/Terms/TermsView.tsx
@@ -18,27 +18,10 @@ const TermsView = () => {
const navigate = useNavigate()
const dispatch = useAppDispatch()
const { termsStatus } = useAppSelector(state => state.ecolyo.global)
- const [GCUValidation, setGCUValidation] = useState<boolean>(false)
- const [dataConsentValidation, setDataConsentValidation] =
- useState<boolean>(false)
- const [openCGUModal, setOpenCGUModal] = useState<boolean>(false)
- const [openLegalNoticeModal, setOpenLegalNoticeModal] =
- useState<boolean>(false)
-
- const toggleCGUModal = () => {
- setOpenCGUModal(prev => !prev)
- }
-
- const toggleLegalNoticeModal = () => {
- setOpenLegalNoticeModal(prev => !prev)
- }
-
- const handleGCUValidate = useCallback(() => {
- setGCUValidation(prev => !prev)
- }, [])
- const handleDataConsentValidation = useCallback(() => {
- setDataConsentValidation(prev => !prev)
- }, [])
+ const [GCUValidation, setGCUValidation] = useState(false)
+ const [dataConsentValidation, setDataConsentValidation] = useState(false)
+ const [openCGUModal, setOpenCGUModal] = useState(false)
+ const [openLegalNoticeModal, setOpenLegalNoticeModal] = useState(false)
const handleTermValidate = useCallback(async () => {
const termsService = new TermsService(client)
@@ -66,7 +49,7 @@ const TermsView = () => {
type="checkbox"
name="Data-consent-validation"
className="inputCheckbox"
- onChange={handleDataConsentValidation}
+ onChange={e => setDataConsentValidation(e.target.checked)}
checked={dataConsentValidation}
/>
{t('dataShare.validDataConsent')}
@@ -77,7 +60,7 @@ const TermsView = () => {
type="checkbox"
name="GCU-validation"
className="inputCheckbox"
- onChange={handleGCUValidate}
+ onChange={e => setGCUValidation(e.target.checked)}
checked={GCUValidation}
/>
<div>
@@ -85,7 +68,7 @@ const TermsView = () => {
<Button
size="small"
className="btnText"
- onClick={toggleCGUModal}
+ onClick={() => setOpenCGUModal(true)}
>
{t('dataShare.validCGU_button')}
</Button>
@@ -94,7 +77,7 @@ const TermsView = () => {
<Button
size="small"
className="btnText"
- onClick={toggleLegalNoticeModal}
+ onClick={() => setOpenLegalNoticeModal(true)}
>
{t('dataShare.validLegal_button')}
</Button>
@@ -130,10 +113,13 @@ const TermsView = () => {
</>
)}
- <CGUModal open={openCGUModal} handleCloseClick={toggleCGUModal} />
+ <CGUModal
+ open={openCGUModal}
+ handleCloseClick={() => setOpenCGUModal(false)}
+ />
<LegalNoticeModal
open={openLegalNoticeModal}
- handleCloseClick={toggleLegalNoticeModal}
+ handleCloseClick={() => setOpenLegalNoticeModal(false)}
/>
</div>
)
diff --git a/src/components/WelcomeModal/WelcomeModal.spec.tsx b/src/components/WelcomeModal/WelcomeModal.spec.tsx
index f94a2e6f05297e5a25babbea00a54a3422e67aae..d05b9ee6d6fbae6ec6c4ea177bc63c33cd023b8b 100644
--- a/src/components/WelcomeModal/WelcomeModal.spec.tsx
+++ b/src/components/WelcomeModal/WelcomeModal.spec.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from '@testing-library/react'
+import { act, render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import React from 'react'
import { Provider } from 'react-redux'
@@ -8,7 +8,7 @@ import WelcomeModal from './WelcomeModal'
jest.mock('components/Hooks/useUserInstanceSettings', () => {
return jest.fn(() => ({
- data: {
+ instanceSettings: {
// eslint-disable-next-line camelcase
public_name: 'mocked_public_name',
},
@@ -70,7 +70,11 @@ describe('WelcomeModal component', () => {
)
})
it('should send mail and update profile when user click on the ok button', async () => {
- await userEvent.click(screen.getAllByRole('button')[1])
+ await act(async () => {
+ await userEvent.click(
+ screen.getByText('onboarding.welcomeModal.button_valid')
+ )
+ })
expect(mockSendMail).toHaveBeenCalled()
expect(updateProfileSpy).toHaveBeenCalledWith({
isFirstConnection: false,
@@ -81,7 +85,13 @@ describe('WelcomeModal component', () => {
})
it('should send mail and update profile when modal is closed by user', async () => {
- await userEvent.click(screen.getAllByRole('button')[0])
+ await act(async () => {
+ await userEvent.click(
+ screen.getAllByLabelText(
+ 'onboarding.welcomeModal.accessibility.button_valid'
+ )[0]
+ )
+ })
expect(mockSendMail).toHaveBeenCalled()
expect(updateProfileSpy).toHaveBeenCalledWith({
isFirstConnection: false,
diff --git a/src/components/WelcomeModal/WelcomeModal.tsx b/src/components/WelcomeModal/WelcomeModal.tsx
index 7af1db71548ac6f02d8f6d6ca6f2f19942df54f6..c61135791fcd1117de71f4923c99973b5ab691dd 100644
--- a/src/components/WelcomeModal/WelcomeModal.tsx
+++ b/src/components/WelcomeModal/WelcomeModal.tsx
@@ -19,7 +19,7 @@ const WelcomeModal = ({ open }: { open: boolean }) => {
const { t } = useI18n()
const client = useClient()
const dispatch = useAppDispatch()
- const { data: instanceSettings } = useUserInstanceSettings()
+ const { instanceSettings } = useUserInstanceSettings()
const setWelcomeModalViewed = useCallback(async () => {
const mailService = new MailService()
diff --git a/src/components/theme.ts b/src/components/theme.ts
index e1b9d32f0f4fe8779ed4cb7dde38eb4b572efb35..9f08839f031ef6da09636a558b98e59e6d0226f7 100644
--- a/src/components/theme.ts
+++ b/src/components/theme.ts
@@ -4,9 +4,11 @@ export const theme = createTheme({
palette: {
type: 'dark',
primary: {
+ main: '#F1C017',
'500': '#579eff',
},
},
+ typography: { fontFamily: ['Lato'].join(',') },
overrides: {
MuiButton: {
root: {
@@ -29,5 +31,10 @@ export const theme = createTheme({
backgroundColor: '#e3b82a',
},
},
+ MuiInputBase: {
+ input: {
+ color: '#e0e0e0',
+ },
+ },
},
})
diff --git a/src/constants/config.json b/src/constants/config.json
index 2c1c6e36aff92db90bd24d1907d93fe4f7cbac26..3ef9da6cd3182512e86758c38f7dcbd62662d263 100644
--- a/src/constants/config.json
+++ b/src/constants/config.json
@@ -36,7 +36,7 @@
"dataDelayOffset": 5,
"konnectorConfig": {
"name": "GRDF",
- "oauth": true,
+ "oauth": false,
"slug": "grdfgrandlyon",
"siteLink": "https://monespace.grdf.fr/creation-particulier",
"activation": ""
diff --git a/src/db/ecogestureData.json b/src/db/ecogestureData.json
index 7e148d5614d73bce385b84431b8d8fd1aecf7b9f..e1a60f1990ca028bfe811fc83a713c1f5b3427a5 100644
--- a/src/db/ecogestureData.json
+++ b/src/db/ecogestureData.json
@@ -9,7 +9,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -32,7 +32,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Eté",
"equipment": true,
"equipmentType": ["AIR_CONDITIONING"],
@@ -55,7 +55,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -78,7 +78,7 @@
"impactLevel": 5,
"efficiency": 2.5,
"difficulty": 1,
- "room": [1],
+ "room": ["BATHROOM"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -101,7 +101,7 @@
"impactLevel": 5,
"efficiency": 2.5,
"difficulty": 1,
- "room": [1],
+ "room": ["BATHROOM"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -124,7 +124,7 @@
"impactLevel": 4,
"efficiency": 2,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["COMPUTER"],
@@ -147,7 +147,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["MICROWAVE"],
@@ -170,7 +170,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -193,7 +193,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -216,7 +216,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 1,
- "room": [1, 2],
+ "room": ["BATHROOM", "KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -239,7 +239,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -262,7 +262,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -285,7 +285,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
@@ -308,7 +308,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR"],
@@ -331,7 +331,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [1, 2],
+ "room": ["BATHROOM", "KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -354,7 +354,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -377,7 +377,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -400,7 +400,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
@@ -423,7 +423,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["COOKING_PLATES"],
@@ -446,7 +446,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
@@ -469,7 +469,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["DRYER"],
@@ -492,7 +492,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
@@ -515,7 +515,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
@@ -538,7 +538,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["COOKING_PLATES"],
@@ -561,7 +561,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -584,7 +584,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -607,7 +607,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -630,7 +630,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR"],
@@ -653,7 +653,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["WASHING_MACHINE"],
@@ -676,7 +676,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR"],
@@ -699,7 +699,7 @@
"impactLevel": 10,
"efficiency": 5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -722,7 +722,7 @@
"impactLevel": 10,
"efficiency": 5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -745,7 +745,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -768,7 +768,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Eté",
"equipment": true,
"equipmentType": ["AIR_CONDITIONING", "FAN"],
@@ -791,7 +791,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Eté",
"equipment": true,
"equipmentType": ["AIR_CONDITIONING"],
@@ -814,7 +814,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -837,7 +837,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -860,7 +860,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -906,7 +906,7 @@
"impactLevel": 7,
"efficiency": 3.5,
"difficulty": 2,
- "room": [1],
+ "room": ["BATHROOM"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -929,7 +929,7 @@
"impactLevel": 7,
"efficiency": 3.5,
"difficulty": 2,
- "room": [1],
+ "room": ["BATHROOM"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -952,7 +952,7 @@
"impactLevel": 7,
"efficiency": 3.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -975,7 +975,7 @@
"impactLevel": 7,
"efficiency": 3.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Eté",
"equipment": false,
"equipmentType": [],
@@ -998,7 +998,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1024,7 +1024,7 @@
"room": [],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [],
+ "equipmentType": ["OUTSIDE"],
"equipmentInstallation": false,
"investment": "Seau/ Bac de récupération",
"action": false,
@@ -1044,7 +1044,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 2,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["BOILER"],
@@ -1067,7 +1067,7 @@
"impactLevel": 4,
"efficiency": 2,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["CURTAIN"],
@@ -1090,7 +1090,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["INTERNET_BOX"],
@@ -1113,7 +1113,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["MICROWAVE"],
@@ -1136,7 +1136,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["VENTILATION"],
@@ -1159,7 +1159,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1182,7 +1182,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [3],
+ "room": ["LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["DRYER"],
@@ -1205,7 +1205,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1228,7 +1228,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1251,7 +1251,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR", "FREEZER"],
@@ -1274,7 +1274,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1297,7 +1297,7 @@
"impactLevel": 3,
"efficiency": 1.5,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["VENTILATION"],
@@ -1320,7 +1320,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1343,7 +1343,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 2,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1366,7 +1366,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR", "FREEZER"],
@@ -1389,7 +1389,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR", "FREEZER"],
@@ -1412,7 +1412,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR"],
@@ -1435,7 +1435,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR", "FREEZER"],
@@ -1458,7 +1458,7 @@
"impactLevel": 1,
"efficiency": 0.5,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1481,7 +1481,7 @@
"impactLevel": 8,
"efficiency": 4,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -1504,7 +1504,7 @@
"impactLevel": 7,
"efficiency": 3.5,
"difficulty": 3,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1527,7 +1527,7 @@
"impactLevel": 7,
"efficiency": 3.5,
"difficulty": 3,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1550,7 +1550,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [1, 2, 3],
+ "room": ["BATHROOM", "KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["BOILER"],
@@ -1573,7 +1573,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1596,7 +1596,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["HYDRAULIC_HEATING"],
@@ -1619,7 +1619,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": [],
@@ -1642,7 +1642,7 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["HYDRAULIC_HEATING"],
@@ -1665,7 +1665,7 @@
"impactLevel": 5,
"efficiency": 2.5,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["HYDRAULIC_HEATING"],
@@ -1688,7 +1688,7 @@
"impactLevel": 5,
"efficiency": 2.5,
"difficulty": 3,
- "room": [4],
+ "room": ["TOILET"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1711,7 +1711,7 @@
"impactLevel": 5,
"efficiency": 2.5,
"difficulty": 3,
- "room": [1],
+ "room": ["BATHROOM"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1734,7 +1734,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 3,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": ["REFREGIRATOR"],
@@ -1757,7 +1757,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 3,
- "room": [3],
+ "room": ["LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1773,14 +1773,14 @@
{
"_id": "ECOGESTURE0078",
"usage": 6,
- "fluidTypes": [0,2],
+ "fluidTypes": [0, 2],
"shortName": "Du tout cuit",
"longName": "J'éteins mon four avant la fin de la cuisson.",
"longDescription": "Lorsque votre plat arrive en fin de cuisson, éteignez le four. Il continuera de cuire grâce à la chaleur gardée par le four. Vous pouvez économiser jusqu'à 10 % d'électricité en prenant cette habitude !",
"impactLevel": 1,
"efficiency": 2,
"difficulty": 1,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1803,7 +1803,7 @@
"impactLevel": 2,
"efficiency": 1,
"difficulty": 1,
- "room": [2,3],
+ "room": ["KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1826,10 +1826,10 @@
"impactLevel": 5,
"efficiency": 3,
"difficulty": 2,
- "room": [0],
+ "room": ["OUTSIDE"],
"season": "Eté",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["OUTSIDE"],
"equipmentInstallation": false,
"investment": null,
"action": false,
@@ -1849,7 +1849,7 @@
"impactLevel": 3,
"efficiency": 2,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1872,10 +1872,10 @@
"impactLevel": 4,
"efficiency": 1,
"difficulty": 2,
- "room": [0],
+ "room": ["OUTSIDE"],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["OUTSIDE"],
"equipmentInstallation": false,
"investment": null,
"action": false,
@@ -1895,7 +1895,7 @@
"impactLevel": 3,
"efficiency": 2,
"difficulty": 2,
- "room": [2],
+ "room": ["KITCHEN"],
"season": "Sans saison",
"equipment": false,
"equipmentType": [],
@@ -1911,14 +1911,14 @@
{
"_id": "ECOGESTURE0084",
"usage": 1,
- "fluidTypes": [0,2],
+ "fluidTypes": [0, 2],
"shortName": "Défense d'entrer",
"longName": " J’isole les coffrets des volets roulants.",
"longDescription": "Un coffre de volets roulants mal isolé engendre la formation de ponts thermiques, pouvant donc laisser l'air froid s’infiltrer. Pour empêcher cela, mieux vaut les isoler avec de la laine de roche ou de la mousse multicouche, par exemple.",
"impactLevel": 7,
"efficiency": 2,
"difficulty": 3,
- "room": [0],
+ "room": ["ALL"],
"season": "Hiver",
"equipment": false,
"equipmentType": [],
@@ -1934,14 +1934,14 @@
{
"_id": "ECOGESTURE0085",
"usage": 4,
- "fluidTypes": [0,2],
+ "fluidTypes": [0, 2],
"shortName": "Ballon au Chaud",
"longName": "J'isole mon ballon d'eau chaude.",
"longDescription": "Pour éviter un maximum les pertes de chaleur, vous pouvez vous munir d'un matériau isolant, comme la laine de roche ou la mousse de polyuréthane. Il vous suffira d'entourer votre ballon d'eau chaude avec celui-ci.",
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [2,3],
+ "room": ["KITCHEN", "LAUNDRY"],
"season": "Sans saison",
"equipment": true,
"equipmentType": ["BOILER"],
@@ -1964,10 +1964,10 @@
"impactLevel": 6,
"efficiency": 3,
"difficulty": 3,
- "room": [0],
+ "room": ["OUTSIDE"],
"season": "Eté",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["OUTSIDE"],
"equipmentInstallation": true,
"investment": "Pluviomètre",
"action": false,
diff --git a/src/db/profileTypeData.json b/src/db/profileTypeData.json
index beda4cf31df9df296467c0c40364b27506faf464..63b94873cec67f27366b8d0095e9dd892ac01630 100644
--- a/src/db/profileTypeData.json
+++ b/src/db/profileTypeData.json
@@ -12,7 +12,6 @@
"coldWater": "individual",
"hotWater": "individual",
"individualInsulationWork": ["window_replacement"],
- "facilitiesInstallation": "none",
"hotWaterEquipment": "solar",
"hasInstalledVentilation": "unknown",
"hasReplacedHeater": "unknown",
diff --git a/src/doctypes/remote/org.ecolyo.avg_temperature.ts b/src/doctypes/remote/org.ecolyo.avg_temperature.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5173322d251b4bc78026874bf70ef11bed665271
--- /dev/null
+++ b/src/doctypes/remote/org.ecolyo.avg_temperature.ts
@@ -0,0 +1,2 @@
+export const REMOTE_ORG_ECOLYO_AVG_TEMPERATURE =
+ '/remote/org.ecolyo.avg_temperature'
diff --git a/src/enums/ecogesture.enum.ts b/src/enums/ecogesture.enum.ts
index c43e069b0065a9f0d1e09ddbcd0ce474c8efdda1..5bcaa0ab43bf4ea131053bbc51e9e70cef43a96d 100644
--- a/src/enums/ecogesture.enum.ts
+++ b/src/enums/ecogesture.enum.ts
@@ -9,11 +9,12 @@ export enum Usage {
}
export enum Room {
- ALL = 0,
- BATHROOM = 1,
- KITCHEN = 2,
- LAUNDRY = 3,
- TOILET = 4,
+ ALL = 'ALL',
+ BATHROOM = 'BATHROOM',
+ KITCHEN = 'KITCHEN',
+ LAUNDRY = 'LAUNDRY',
+ TOILET = 'TOILET',
+ OUTSIDE = 'OUTSIDE',
}
export enum Season {
@@ -38,6 +39,7 @@ export enum EquipmentType {
FREEZER = 'FREEZER',
BOILER = 'BOILER',
HYDRAULIC_HEATING = 'HYDRAULIC_HEATING',
+ OUTSIDE = 'OUTSIDE',
}
export enum EcogestureTab {
diff --git a/src/enums/fluid.enum.ts b/src/enums/fluid.enum.ts
index e62cd529ed496bf0b6c157c4d59c82b5ac04f3d4..4ebd4f94525810c87fda0386281482ef393b0a4b 100644
--- a/src/enums/fluid.enum.ts
+++ b/src/enums/fluid.enum.ts
@@ -5,10 +5,12 @@ export enum FluidType {
MULTIFLUID = 3,
}
+/** Application state for fluid, managed by the FluidService */
export enum FluidState {
- KONNECTOR_NOT_FOUND = 0,
- NOT_CONNECTED = 1,
- DONE = 200,
- ERROR = 300,
- ERROR_LOGIN_FAILED = 301,
+ KONNECTOR_NOT_FOUND = 'KONNECTOR_NOT_FOUND',
+ NOT_CONNECTED = 'NOT_CONNECTED',
+ DONE = 'DONE',
+ ERROR = 'ERROR',
+ LOGIN_FAILED = 'LOGIN_FAILED',
+ CHALLENGE_ASKED = 'CHALLENGE_ASKED',
}
diff --git a/src/enums/konnectorStatus.enum.ts b/src/enums/konnectorStatus.enum.ts
index 4e8543316bd8de24d6cf05a1843e1e2a88371467..4ff5dad28d62214d0acf6e009c3f95577ea2ea26 100644
--- a/src/enums/konnectorStatus.enum.ts
+++ b/src/enums/konnectorStatus.enum.ts
@@ -1,3 +1,4 @@
+/** Raw errors from konnector */
export enum KonnectorError {
LOGIN_FAILED = 'LOGIN_FAILED',
USER_ACTION_NEEDED = 'USER_ACTION_NEEDED',
@@ -6,11 +7,14 @@ export enum KonnectorError {
UNKNOWN_ERROR = 'UNKNOWN_ERROR',
CRITICAL = 'exit status 1',
MISSING_SECRET = "Cannot read property 'secret' of null",
+ USER_ACTION_NEEDED_ACCOUNT_REMOVED = 'USER_ACTION_NEEDED.ACCOUNT_REMOVED',
+ USER_ACTION_NEEDED_CGU_FORM = 'USER_ACTION_NEEDED.CGU_FORM',
+ VENDOR_DOWN = 'VENDOR_DOWN',
+ MAINTENANCE = 'MAINTENANCE',
}
export enum KonnectorUpdate {
ERROR_UPDATE = 'error_update',
ERROR_UPDATE_OAUTH = 'error_update_oauth',
LOGIN_FAILED = 'login_failed',
- ERROR_CONSENT_FORM_GAS = 'error_consent_form_gas',
}
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 76f03a79a7decd59d0d64236ea70a7df2a51a76f..1461baf42e08e0f77dca3a5a0c9435931248d802 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -17,9 +17,11 @@
"title_gcu": "Conditions générales d’utilisation",
"title_accessibility": "Accessibilité : non conforme",
"title_sge_connect": "Connexion à l'électricité",
+ "title_gas_connect": "Connexion au gaz",
"accessibility": {
"loading": "Chargement"
- }
+ },
+ "funders_logo": "Logo des financeurs : Métropole de Lyon, Etat via la Banque des Territoires et son programme France 2030, Union Européenne"
},
"navigation": {
"consumption": "Conso",
@@ -104,6 +106,18 @@
"title": "Comparateur",
"month_tab": "Comparer au mois dernier",
"year_tab": "Comparer à l'année dernière"
+ },
+ "temperature_comparison": {
+ "unit": "°C",
+ "comparison": "par rapport à ",
+ "info_button": "Information sur l'indice météo",
+ "modal": {
+ "title": "Indice météo",
+ "month_comparison": "Écart de température moyenne entre le mois observé et le mois précédent.",
+ "year_comparison": "Écart de température moyenne entre le mois observé et le même mois de l'année précédente.",
+ "data_info": "Données Météo France issues de la station météo Lyon Bron.",
+ "close": "Fermer la fenêtre"
+ }
}
},
"analysis_error_modal": {
@@ -140,15 +154,15 @@
"window_title": "electricity-info-modal",
"button_close": "close-modal"
},
- "title1": "Qu’est-ce que la consommation minimum\u00a0?",
- "text1-1": "Elle correspond à votre plus petite consommation du mois sur un créneau d'une demi-heure.",
- "text1-2": "Nous extrapolons cette consommation sur 1 mois afin vous donner un aperçu de la consommation de vos consommations électriques en veille (box, télé, chargeurs, ...) ou encore de celle, incompressible, de vos appareils de froid (frigo, congélateur).",
- "title2": "Qu’est-ce que la puissance maximum\u00a0?",
- "text2-1": "C’est la puissance maximum délivrée par tous les appareils fonctionnant au même moment dans votre logement.",
- "text2-2": "Vous avez choisi une puissance maximum dans votre offre d’électricité (3, 6 ou 9 kVA...) que vous ne devez pas dépasser pour ne pas faire sauter votre compteur. ",
- "text2-3": "Cette puissance varie d'un mois à l'autre, regardez cette valeur sur l'ensemble de l'année pour vérifier si votre puissance souscrite correspond bien à votre usage.",
- "title3": "Sur quelle base est calculé mon ratio Heures Pleines / Heures Creuses\u00a0?",
- "text3-1": "D'après Enedis, vos plages d'heures creuses sont les suivantes : %{offPeakHours}. Nous avons donc simplement calculé, à l'aide vos consommations à la demi-heure, quelle part de votre consommation est réalisée sur vos heures creuses."
+ "maxPowerTitle": "Qu’est-ce que la puissance maximum\u00a0?",
+ "maxPowerDetails-1": "C’est la puissance maximum délivrée par tous les appareils fonctionnant au même moment dans votre logement.",
+ "maxPowerDetails-2": "Vous avez choisi une puissance maximum dans votre offre d’électricité (3, 6 ou 9 kVA...) que vous ne devez pas dépasser pour ne pas faire sauter votre compteur. ",
+ "maxPowerDetails-3": "Cette puissance varie d'un mois à l'autre, regardez cette valeur sur l'ensemble de l'année pour vérifier si votre puissance souscrite correspond bien à votre usage.",
+ "offPeakTitle": "Sur quelle base est calculé mon ratio Heures Pleines / Heures Creuses\u00a0?",
+ "offPeakDetails-1": "D'après Enedis, vos plages d'heures creuses sont les suivantes : %{offPeakHours}. Nous avons donc simplement calculé, à l'aide vos consommations à la demi-heure, quelle part de votre consommation est réalisée sur vos heures creuses.",
+ "minPowerTitle": "Qu’est-ce que la consommation minimum\u00a0?",
+ "minPowerDetails-1": "Elle correspond à votre plus petite consommation du mois sur un créneau d'une demi-heure.",
+ "minPowerDetails-2": "Nous extrapolons cette consommation sur 1 mois afin vous donner un aperçu de la consommation de vos consommations électriques en veille (box, télé, chargeurs, ...) ou encore de celle, incompressible, de vos appareils de froid (frigo, congélateur)."
},
"auth": {
"enedissgegrandlyon": {
@@ -179,7 +193,7 @@
"zipCode": "Code postal",
"city": "Ville",
"headConsent": "En acceptant de partager vos données, celles-ci seront directement transférées à Ecolyo à l’intérieur de votre cloud personnel, sans que la Métropole n’y accède ni ne les visualise.",
- "textConsent": "Afin de vous offrir des fonctionnalités de visualisation et d'analyse, Ecolyo a besoin des données suivantes\u00a0: ",
+ "textConsent": "Afin de vous offrir des fonctionnalités de visualisation et d'analyse, Ecolyo a besoin des données suivantes\u00a0: ",
"consentLi1": "L'historique et le relevé de vos consommations quotidiennes en kWh",
"consentLi2": "L'historique et le relevé de vos consommations au pas de temps 30 minutes",
"consentLi3": "Les puissances maximales atteintes quotidiennement",
@@ -188,35 +202,40 @@
"consentCheck2": "J’atteste être le titulaire du point de livraison (PDL) renseigné à l’étape précédente"
},
"grdfgrandlyon": {
+ "title": "Ecolyo doit se connecter au gaz",
"bill": "Munissez-vous d’une <span>facture de gaz</span> pour valider la connexion",
"connect": "Je me connecte au gaz",
"accessibility": {
"connect": "Se connecter"
},
- "connect_form": {
- "label": "Je donne mon accord via mon compte GRDF"
- },
- "no_account": {
- "title": "Ecolyo doit se connecter au gaz"
- },
- "with_account": {
- "title": "Votre compte GRDF a bien été créé\u00a0?",
- "subtitle1": "Plus qu’à donner votre accord pour connecter votre compteur de gaz et Ecolyo\u00a0!"
- },
- "step1": {
- "info1": "Un <span>compte chez GRDF</span> est nécessaire pour vous connecter au gaz <span>quelque soit votre fournisseur de gaz</span>.",
- "info2": "<p>GRDF est le gestionnaire de réseau. C'est lui qui est responsable de votre compteur Gazpar et de la collecte des données de consommation.</p>",
- "info3": "Possédez-vous un <span>compte GRDF</span>\u00a0?"
- },
- "step2": {
- "info1": "Une fois votre compte créé, <span>n'oubliez pas de revenir sur Ecolyo</span> pour finaliser la connexion."
- },
- "step3": {
- "info1": "La visualisation de vos données sur Ecolyo demande l'activation du <span>partage de toutes les données.</span>",
- "info2": "Pour une expérience optimale, <span>une période de consentement de 1 an</span> est recommandée à partir d’aujourd’hui.",
- "info3": "<p>Veillez également à indiquer une date antérieure pour l'historique (1er calendrier) afin de pouvoir récupérer jusqu'à 3 ans d'historique.</p>"
+ "identityTitle": "Nom inscrit sur la facture",
+ "firstName": "Prénom",
+ "lastName": "Nom",
+ "email": "Email",
+ "zipCode": "Code postal",
+ "pceTitle": "Numéro de votre compteur de gaz (PCE)",
+ "pceLabel": "N° (14 chiffres)",
+ "pceHint": "Où trouver le numéro de PCE\u00a0?",
+ "pceModal": {
+ "title": "Où trouver le n° de PCE\u00a0?",
+ "txt1": "Votre numéro de <span>PCE</span> - ou <span>Point de comptage et d'estimation</span> - se trouve sur votre facture au niveau de vos informations contractuelles (parfois en 1ère page... parfois en dernière !)<br/><br/> C'est un identifiant à 14 chiffres.",
+ "button": "J'ai compris",
+ "accessibility": "Titre de la modale",
+ "button-accessibility": "Bouton valider"
},
- "button_go_to_partner_site": "Aller sur GRDF"
+ "headConsent": "Vous allez partager vos données à la Métropole de Lyon. Elles seront directement transférées à Ecolyo à l'intérieur de votre cloud personnel, sans que la Métropole n'y accède ni ne les visualise.",
+ "textConsent": "Afin de vous offrir des fonctionnalités de visualisation et d'analyse, Ecolyo a besoin des données suivantes\u00a0:",
+ "consentLi1": "L'historique de vos consommations (jusqu’à 36 mois) et le relevé quotidien de vos consommations",
+ "consentLi2": "Les données contractuelles (type de compteur, date de début de contrat)",
+ "consentCheck1": "Je consens à partager les données personnelles ci-dessus pour une durée d'<span>un\u00a0an</span>",
+ "consentCheck2": "J’atteste être le titulaire du point de livraison (PCE) renseigné à l’étape précédente",
+ "waiting": {
+ "mailSent": "Un mail vous a été envoyé...",
+ "mailDelay": "La réception du mail peut prendre 15min, l'envoi des mails se faisant tous les 1/4 d'heure",
+ "validate": "Merci de valider l'autorisation d'accès à vos données",
+ "comeback": "Une fois ce clic effectué, revenez ici pour accéder à vos données",
+ "button_done": "C’est fait !"
+ }
},
"eglgrandlyon": {
"bill": "Munissez-vous d’une <span>facture d'eau</span> pour valider la connexion",
@@ -321,6 +340,7 @@
},
"partner_issue_modal": {
"title": "Attention\u00a0!",
+ "accessibility_title": "Modale de maintenance partenaire",
"error_connect_gaz": "La connexion à vos données de <span class='gaz'>gaz</span> est actuellement dysfonctionnelle (Maintenance chez notre partenaire <span class='gaz'>GRDF</span> ou dans notre service)",
"error_connect_elec": "La connexion à vos données d'<span class='elec'>électricité</span> est actuellement dysfonctionnelle (Maintenance chez notre partenaire <span class='elec'>Enedis</span> ou dans notre service)",
"error_connect_water": "La connexion à vos données d'<span class='water'>eau</span> est actuellement dysfonctionnelle (Maintenance chez notre partenaire <span class='water'>Eau Publique du Grand Lyon</span> ou dans notre service)",
@@ -361,7 +381,7 @@
"list1": " : 1 kWh = %{elecPrice} €TTC (il correspond au tarif réglementé d’EDF au %{elecPriceStartDate} pour une puissance souscrite de 3 ou 6 kVA et hors offre heure pleine/heure creuse)",
"list2": " : 1 kWh = %{gasPrice} €TTC (Prix repère de vente de gaz publié par la Commission de Régulation de l'Energie au %{gasPriceStartDate} pour un consommateur \"Cuisson/Eau Chaude\")",
"list3": " : 1 litre d’eau = %{waterPrice} € TTC (prix constaté au %{waterPriceStartDate} pour un abonnement et une consommation de 120 m3/an sur la Métropole de Lyon)",
- "part3": "Le coût de votre abonnement n'est pas pris en compte dans Ecolyo pour l'électricité et le gaz."
+ "part3": "Le coût de votre abonnement n'est pas pris en compte pour l'électricité."
},
"release_notes_modal": {
"title": "Du nouveau sur Ecolyo !",
@@ -474,12 +494,12 @@
"title": "Sélectionner mes astuces",
"text1": "Les astuces présentées sont des actions qui vous permettent de réduire vos consommations et donc vos factures. On parle parfois d’écogestes ",
"text2": "Vous pouvez sélectionner celles à mettre en objectifs et celles que vous appliquez déjà .",
- "text3": "Afin de pré-sélectionner les astuces correspondant à votre consommation, merci de répondre à quelques rapides questions.",
+ "launchForm": "Afin de pré-sélectionner les astuces correspondant à votre consommation, merci de répondre à quelques rapides questions.",
"btn1": "Plus tard",
"btn2": "C'est parti !"
},
- "reinit": "Réinitialiser ma sélection",
- "reinitModal": {
+ "reset": "Réinitialiser ma sélection",
+ "resetModal": {
"title_part1": "Cette action",
"title_part2": "supprimera votre liste d’astuces",
"title_part3": "sélectionnées dans",
@@ -556,7 +576,7 @@
"washing_machine": "Lave-linge",
"dishwasher": "Lave-vaisselle",
"cooking_plates": "Plaques électriques",
- "garden": "Jardin",
+ "outside": "Extérieur",
"dryer": "Sèche-linge",
"refregirator": "Réfrigérateur",
"fan": "Ventilateur",
@@ -760,7 +780,6 @@
"error_login_failed": "Identifiants invalides",
"error_update": "Un problème est survenu lors du rapatriement de vos données.",
"error_update_oauth": "Votre autorisation pour afficher vos données %{fluid} a expiré.",
- "error_consent_form_gas": "Vos données ne peuvent être récupérées car vous n'avez pas coché l'autorisation d'accès aux données informatives lors de votre partage de consentement.",
"button_oauth_reload": "Redonner mon consentement",
"OK": "Ok",
"konnector_delta": {
@@ -815,18 +834,17 @@
"text2": "Reconfigurer mon connecteur\u00a0?",
"text3": "La reconfiguration de votre connecteur passe par sa suppression et sa nouvelle installation. Vos données seront conservées."
},
- "error_data_electricity": "Un problème est survenu. Vos données de consommation d’électricité ne seront pas chargées.",
- "error_data_water": "Un problème est survenu. Vos données de consommation d’eau ne seront pas chargées.",
"error_credentials_water": "Une erreur s'est glissée dans vos identifiants de connexion. Veuillez vérifier ces éléments et tenter de vous reconnecter. L'identifiant est un numéro à 7 chiffres (différent de votre numéro de contrat).",
"error_credentials_electricity": "Il semblerait que les nom(s) et adresse ne concordent pas avec le numéro de votre compteur.",
"error_credentials_electricity_2": "Nous ne pouvons vous donner accès aux données de consommation.",
"error_credentials_update_water": "Une erreur s'est glissée dans vos identifiants de connexion. Veuillez vérifier ces éléments et tenter de vous reconnecter.",
"error_credentials_update_electricity": "Un problème a lieu lors de la récupération de vos données. Merci de supprimer votre connecteur et vous reconnecter.",
"error_credentials_update_gas": "Un problème a lieu lors de la récupération de vos données. Merci de supprimer votre connecteur et vous reconnecter.",
- "error_data_gas": "Un problème est survenu. Vos données de consommation de gaz ne seront pas chargées.",
- "error_consent_form_gas_title": "Nous n'avons pas pu connecter vos données de consommation de gaz à Ecolyo.",
- "error_consent_form_gas_content": "En effet, le partage de vos données de consommation de gaz \"informatives\" doit être accepté.",
- "error_consent_form_gas_content_2": "Merci de cocher \"OUI\" au partage de vos données de consommation de gaz, et à \"Autoriser l'accès à mes données informatives\".",
+ "error_consent_form_gas_title": "L'accès à vos données a été bloqué par GRDF suite à un consentement précédemment supprimé par vos soins.",
+ "error_consent_form_gas_report": "Merci de nous signaler le problème.",
+ "error_data_electricity": "Un problème est survenu. Vos données de consommation d’électricité ne seront pas chargées.",
+ "error_data_water": "Un problème est survenu. Vos données de consommation d’eau ne seront pas chargées.",
+ "error_data_gas": "Il semblerait que le service de connexion à vos données de gaz soit momentanément en panne.",
"error_data_update_electricity": "Un problème est survenu. Vos données de consommation d’électricité n’ont pas été mises à jour.",
"error_data_update_water": "Un problème est survenu. Vos données de consommation d’eau n’ont pas été mises à jour.",
"error_data_update_gas": "Un problème est survenu. Vos données de consommation de gaz n’ont pas été mises à jour.",
@@ -834,6 +852,7 @@
"button_validate": "Ok",
"button_understood": "J'ai compris",
"button_try_again": "Réessayer",
+ "button_contact": "Nous contacter",
"button_check_info": "Vérifier les infos",
"button_go": "J'y vais",
"button_later": "Plus tard",
@@ -847,28 +866,21 @@
"consent_outdated": {
"title": {
"0": "Votre autorisation pour afficher vos données d’électricité a expiré",
- "2": "Votre autorisation pour afficher vos données de gaz a expiré"
+ "2": "Aïe !"
},
"text1": {
"0": "Veuillez re-donner votre consentement pour la transmission et la reconnexion de vos données ENEDIS à Ecolyo.",
- "2": "Veuillez re-donner votre accord pour que GRDF nous transmette vos données de consommation."
+ "2": "L'accès à vos données de consommation de gaz a expiré."
},
"text2": {
"0": "Souhaitez-vous renouveler votre accord dès maintenant pour un an\u00a0?",
- "2": "Voulez-vous donner votre accord sur votre compte GRDF maintenant\u00a0?"
+ "2": "Merci de redonner votre consentement pour y accéder."
},
"later": "Plus tard",
"go": "J'y vais",
"no": "Non",
"yes": "Oui"
},
- "delete_grdf_modal": {
- "text1": "La suppression de la connexion avec GRDF s’accompagne de la suppression de votre consentement à partager vos données gaz avec Ecolyo.",
- "text2": "Si vous souhaitez vous reconnecter, il vous faudra re-donner votre accord pour que GRDF nous transmette vos données de consommation.",
- "text3": "Voulez-vous supprimer votre connexion et votre consentement à GRDF\u00a0?",
- "cancel": "Plus tard",
- "go": "Oui"
- },
"legal": {
"read_legal": "Lire les mentions légales",
"title_legal": "Mentions légales & CGU",
diff --git a/src/migrations/migration.data.ts b/src/migrations/migration.data.ts
index abaf259e49dc579d75feda279dceb962c988d873..650fce8de0a109e7405dd8dbf12e19fa152e8b0a 100644
--- a/src/migrations/migration.data.ts
+++ b/src/migrations/migration.data.ts
@@ -1,5 +1,6 @@
import { Client } from 'cozy-client'
import {
+ ECOGESTURE_DOCTYPE,
EGL_DAY_DOCTYPE,
EGL_MONTH_DOCTYPE,
EGL_YEAR_DOCTYPE,
@@ -17,7 +18,14 @@ import {
} from 'doctypes'
import { UserQuizState } from 'enums'
import { DateTime } from 'luxon'
-import { DataloadEntity, Profile, ProfileType, UserChallenge } from 'models'
+import {
+ DataloadEntity,
+ Ecogesture,
+ Profile,
+ ProfileType,
+ UserChallenge,
+} from 'models'
+import ecogestureData from '../db/ecogestureData.json'
import { Migration } from './migration.type'
export const SCHEMA_INITIAL_VERSION = 0
@@ -585,4 +593,26 @@ export const migrations: Migration[] = [
})
},
},
+ {
+ baseSchemaVersion: 23,
+ targetSchemaVersion: 24,
+ appVersion: '3.0.0',
+ description: 'Add garden room & equipment type',
+ releaseNotes: null,
+ docTypes: ECOGESTURE_DOCTYPE,
+ run: async (_client: Client, ecogestures: Ecogesture[]) => {
+ return ecogestures.map(ecogesture => {
+ const ecData = ecogestureData.find(
+ ec => ec._id === ecogesture.id
+ ) as Ecogesture
+
+ if (!ecData) return ecogesture
+
+ ecogesture.room = ecData.room
+ ecogesture.equipmentType = ecData.equipmentType
+
+ return ecogesture
+ })
+ },
+ },
]
diff --git a/src/models/account.model.ts b/src/models/account.model.ts
index 329d7a37703d855da6c15ecc76bfff6a508020ba..bb125bcc9db89a4a5485e39a40b12188d19fd36e 100644
--- a/src/models/account.model.ts
+++ b/src/models/account.model.ts
@@ -1,4 +1,12 @@
-/* eslint-disable camelcase */
+export interface AccountAttributes {
+ account_type: string
+ auth?: AccountEGLData | AccountSgeData | AccountGRDFData
+ identifier?: string
+ state?: string | null
+ name?: string
+ data?: SgeAccountData
+}
+
export interface Account extends AccountAttributes {
_id: string
id?: string
@@ -12,28 +20,18 @@ export interface SgeAccountData {
offPeakHours?: string
}
-export interface AccountAttributes {
- account_type: string
- auth?: AccountAuthData | AccountSgeData
- oauth?: AccountOAuthData
- identifier?: string
- state?: string | null
- name?: string
- data?: SgeAccountData
- oauth_callback_results?: Record<string, any>
-}
-
-export interface AccountAuthData {
+export interface AccountEGLData {
login: string
credentials_encrypted?: string
password?: string
}
-export interface AccountOAuthData {
- access_token: string
- refresh_token: string
- expires_at?: string
- token_type?: string
+export interface AccountGRDFData {
+ pce: string
+ email: string
+ lastname: string
+ firstname: string
+ postalCode: string
}
export interface AccountSgeData {
diff --git a/src/models/avgTemperature.model.ts b/src/models/avgTemperature.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..74429edbb9071f6e7c0fefc7abde894a468c4ea7
--- /dev/null
+++ b/src/models/avgTemperature.model.ts
@@ -0,0 +1,13 @@
+export interface AvgTemperatureResult {
+ fields: string[]
+ layer_name: string
+ nb_results: number
+ table_href: string
+ values: AvgTemperatureMeasure[]
+}
+
+interface AvgTemperatureMeasure {
+ month: string
+ average_measurement: number
+ identifiant: string
+}
diff --git a/src/models/chart.model.ts b/src/models/chart.model.ts
index 96fa843eb8d5fb4f190d2e46a740ea4315f866d1..b0e24c8de78daa13a4f5c917ecb356f52fd8f64e 100644
--- a/src/models/chart.model.ts
+++ b/src/models/chart.model.ts
@@ -7,8 +7,9 @@ export interface ChartState {
currentDatachartIndex: number
currentIndex: number
currentTimeStep: TimeStep
- loading: boolean
selectedDate: DateTime
showCompare: boolean
showOfflineData: boolean
+ /** For KonnectorViewerCard Accordion */
+ showConnectionDetails: boolean
}
diff --git a/src/models/dju.model.ts b/src/models/dju.model.ts
index f5f43d6484755320aa4ed6411aee6cf434626dc6..19d2c423bff15875f4d2bf92500dcaab8dc96b59 100644
--- a/src/models/dju.model.ts
+++ b/src/models/dju.model.ts
@@ -1,13 +1,13 @@
export interface DjuResult {
fields: string[]
layer_name: string
- nb_result: number
+ nb_results: number
table_href: string
values: DjuMeasure[]
}
interface DjuMeasure {
month: string
- average_measurement: number
+ sum_measurement: number
identifiant: string
}
diff --git a/src/models/ecogesture.model.ts b/src/models/ecogesture.model.ts
index d885795ce1c40b929c147f61ec196a1bdac7fc40..caf04939d8541bd71995fc22eaeb2e3ee8b6b86d 100644
--- a/src/models/ecogesture.model.ts
+++ b/src/models/ecogesture.model.ts
@@ -25,4 +25,6 @@ export interface Ecogesture {
_id: string
_rev?: string
_type?: string
+ /** computed value with efficiency, difficulty and current season */
+ score?: number
}
diff --git a/src/models/fluid.model.ts b/src/models/fluid.model.ts
index a99af34eb156a60a32ba5ba763421c78c326b0c9..d8ba653c6723780a77904288d76998a1705b2c00 100644
--- a/src/models/fluid.model.ts
+++ b/src/models/fluid.model.ts
@@ -3,8 +3,19 @@ import { DateTime } from 'luxon'
import { Account, Konnector, KonnectorConfig, Trigger } from 'models'
import { TriggerState } from './trigger.model'
+export interface FluidStatus {
+ fluidType: FluidType
+ status: FluidState
+ maintenance: boolean
+ firstDataDate: DateTime | null
+ lastDataDate: DateTime | null
+ connection: FluidConnection
+}
+
export interface FluidConnection {
+ /** This toggles the launch of the konnector when set to true */
shouldLaunchKonnector: boolean
+ /** When enabled, alters the texts of Konnector Modal */
isUpdating: boolean
konnector: Konnector | null
account: Account | null
@@ -12,11 +23,3 @@ export interface FluidConnection {
triggerState: TriggerState | null
konnectorConfig: KonnectorConfig
}
-export interface FluidStatus {
- fluidType: FluidType
- status: FluidState
- maintenance: boolean
- firstDataDate: DateTime | null
- lastDataDate: DateTime | null
- connection: FluidConnection
-}
diff --git a/src/models/global.model.ts b/src/models/global.model.ts
index 8885c78cd72d5debe8c04da2c799feef04e131c2..d0542952106660c0f2531adef5293c390a2a96b6 100644
--- a/src/models/global.model.ts
+++ b/src/models/global.model.ts
@@ -20,4 +20,5 @@ export interface GlobalState {
partnersInfo: PartnersInfo
ecogestureFilter: Usage
lastEpglLogin: string
+ headerHeight: number
}
diff --git a/src/models/index.ts b/src/models/index.ts
index 99412717d6e8d8ea01c96ebeea6beb395ffc6cf5..d59ad6f52a57536fd73d1037425f89d2b7e7bfd1 100644
--- a/src/models/index.ts
+++ b/src/models/index.ts
@@ -1,6 +1,7 @@
export * from './account.model'
export * from './action.model'
export * from './analysis.model'
+export * from './avgTemperature.model'
export * from './challenge.model'
export * from './chart.model'
export * from './config.model'
@@ -34,4 +35,3 @@ export * from './term.model'
export * from './timePeriod.model'
export * from './trigger.model'
export * from './usageEvent.model'
-export * from './userInstanceSettings.model'
diff --git a/src/models/modal.model.ts b/src/models/modal.model.ts
index 019051d00c75129a4462867115947247dea66030..1fbb95c7b7f754863a0af07dd9ab8ddace94d562 100644
--- a/src/models/modal.model.ts
+++ b/src/models/modal.model.ts
@@ -2,7 +2,6 @@ import { CustomPopup } from 'models'
export interface ModalState {
customPopupModal: CustomPopup
- isConnectionModalOpen: boolean
isFeedbacksOpen: boolean
partnersIssueModal: {
enedis: boolean
diff --git a/src/models/relation.model.ts b/src/models/relation.model.ts
index 8cb5ea239e444cae73f19cc36c3e00fdab5f00ed..be75b5665bac3b963e9c97587dc9dbca286b931a 100644
--- a/src/models/relation.model.ts
+++ b/src/models/relation.model.ts
@@ -9,7 +9,3 @@ export interface RelationEntitiesObject {
quizEntityRelation: Relation
explorationEntityRelation: Relation[]
}
-
-export interface GetRelationshipsReturn {
- [relName: string]: Array<Relation>
-}
diff --git a/src/models/userInstanceSettings.model.ts b/src/models/userInstanceSettings.model.ts
deleted file mode 100644
index 4202bb58fae14c72c0c7b7068bc306bd66821f26..0000000000000000000000000000000000000000
--- a/src/models/userInstanceSettings.model.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-/* eslint-disable camelcase */
-export interface UserInstanceSettingsAttributes {
- auth_mode?: string
- auto_update?: boolean
- context?: string
- email?: string
- locale?: string
- oidc_id?: string
- onboarding_finished?: boolean
- public_name: string
- tos?: string
- tos_latest?: string
- uuid?: string
-}
-
-export interface UserInstanceSettings {
- data: UserInstanceSettingsAttributes
- fetchStatus: string
-}
diff --git a/src/services/account.service.spec.ts b/src/services/account.service.spec.ts
index 6dad879e0bd469b416ac9a20516eaf3016ec7406..5eef808b36786a1191a1f7224ecbd08010c36d70 100644
--- a/src/services/account.service.spec.ts
+++ b/src/services/account.service.spec.ts
@@ -1,7 +1,7 @@
/* eslint-disable camelcase */
import { QueryResult } from 'cozy-client'
import * as harvestLibAccounts from 'cozy-harvest-lib/dist/connections/accounts'
-import { Account, AccountAuthData } from 'models'
+import { Account, AccountEGLData } from 'models'
import { accountsData } from 'tests/__mocks__/accountsData.mock'
import mockClient from 'tests/__mocks__/client.mock'
import { konnectorsData } from 'tests/__mocks__/konnectorsData.mock'
@@ -10,7 +10,7 @@ import { triggersEnedisData } from 'tests/__mocks__/triggersData.mock'
import AccountService from './account.service'
jest.mock('cozy-harvest-lib/dist/connections/accounts')
-const mockHavestLibAccounts = harvestLibAccounts
+const mockHarvestLibAccounts = harvestLibAccounts
const mockGetTriggerForAccount = jest.fn()
jest.mock('./triggers.service', () => {
@@ -24,8 +24,10 @@ describe('Account service', () => {
describe('createAccount method', () => {
it('should return created account for login type', async () => {
- mockHavestLibAccounts.createAccount.mockResolvedValueOnce(accountsData[2])
- const mockAuthData: AccountAuthData = {
+ mockHarvestLibAccounts.createAccount.mockResolvedValueOnce(
+ accountsData[2]
+ )
+ const mockAuthData: AccountEGLData = {
login: 'login',
password: 'password', // NOSONAR
}
@@ -39,14 +41,14 @@ describe('Account service', () => {
describe('getAccount method', () => {
it('should return account', async () => {
- mockHavestLibAccounts.fetchAccount.mockResolvedValueOnce(accountsData[2])
+ mockHarvestLibAccounts.fetchAccount.mockResolvedValueOnce(accountsData[2])
const mockId = 'io.cozy.konnectors/eglgrandlyon'
const result = await accountService.getAccount(mockId)
expect(result).toBe(accountsData[2])
})
it('should throw error when fetchAccount unsuccessfully', async () => {
- mockHavestLibAccounts.fetchAccount.mockRejectedValueOnce(new Error())
+ mockHarvestLibAccounts.fetchAccount.mockRejectedValueOnce(new Error())
const mockId = 'io.cozy.konnectors/eglgrandlyon'
const error = await getError(async () =>
accountService.getAccount(mockId)
@@ -121,13 +123,15 @@ describe('Account service', () => {
describe('updateAccount method', () => {
it('should return updated account when updateAccount successfully', async () => {
- mockHavestLibAccounts.updateAccount.mockResolvedValueOnce(accountsData[2])
+ mockHarvestLibAccounts.updateAccount.mockResolvedValueOnce(
+ accountsData[2]
+ )
const result = await accountService.updateAccount(accountsData[2])
expect(result).toEqual(accountsData[2])
})
it('should throw error when updateAccount unsuccessfully', async () => {
- mockHavestLibAccounts.updateAccount.mockRejectedValueOnce(new Error())
+ mockHarvestLibAccounts.updateAccount.mockRejectedValueOnce(new Error())
const error = await getError(async () =>
accountService.updateAccount(accountsData[2])
)
@@ -137,13 +141,15 @@ describe('Account service', () => {
describe('deleteAccount method', () => {
it('should return true when destroy successfully', async () => {
- mockHavestLibAccounts.deleteAccount.mockResolvedValueOnce(accountsData[2])
+ mockHarvestLibAccounts.deleteAccount.mockResolvedValueOnce(
+ accountsData[2]
+ )
const result = await accountService.deleteAccount(accountsData[2])
expect(result).toBe(true)
})
it('should throw error when destroy unsuccessfully', async () => {
- mockHavestLibAccounts.deleteAccount.mockRejectedValueOnce(new Error())
+ mockHarvestLibAccounts.deleteAccount.mockRejectedValueOnce(new Error())
const error = await getError(async () =>
accountService.deleteAccount(accountsData[2])
)
diff --git a/src/services/account.service.ts b/src/services/account.service.ts
index 3ed4c8bfc6e40c851b566fdc8ff51041e4828fa5..3f3c782df013c3a84d670bb751526369e09dd119 100644
--- a/src/services/account.service.ts
+++ b/src/services/account.service.ts
@@ -14,7 +14,8 @@ import { DateTime } from 'luxon'
import {
Account,
AccountAttributes,
- AccountAuthData,
+ AccountEGLData,
+ AccountGRDFData,
AccountSgeData,
Konnector,
Trigger,
@@ -31,21 +32,11 @@ export default class AccountService {
this._client = _client
}
- private buildAccountAttributes(
- konnector: Konnector,
- authData: AccountAuthData | AccountSgeData
- ): AccountAttributes {
- return build(konnector, authData)
- }
-
public async createAccount(
konnector: Konnector,
- accountAuthData: AccountAuthData | AccountSgeData
+ authData: AccountEGLData | AccountSgeData | AccountGRDFData
): Promise<Account> {
- const accountAttributes = this.buildAccountAttributes(
- konnector,
- accountAuthData
- )
+ const accountAttributes: AccountAttributes = build(konnector, authData)
return createAccount(this._client, konnector, accountAttributes)
}
@@ -78,7 +69,7 @@ export default class AccountService {
triggerService.getTriggerForAccount(_account)
)
)
- // Keep the accountid which have the older trigger
+ // Keep the accountId which have the older trigger
let olderDate: DateTime = DateTime.now()
let olderAccountId: string | null = null
for (const _trigger of triggers) {
diff --git a/src/services/action.service.ts b/src/services/action.service.ts
index cf27a1fa83e416d012f2a13b6184551d973c78dd..644197d670f148d9f95189f18b40fdf3e03d2ec6 100644
--- a/src/services/action.service.ts
+++ b/src/services/action.service.ts
@@ -29,8 +29,7 @@ export default class ActionService {
public async getAvailableActionList(): Promise<Ecogesture[]> {
const userChallenges: UserChallenge[] =
await this._challengeService.getAllUserChallengeEntities()
- const ecogestures: Ecogesture[] =
- await this._ecogestureService.getAllEcogestures()
+ const ecogestures = await this._ecogestureService.getAllEcogestures()
const actionsListIds: string[] = ecogestures
.filter(ecogesture => ecogesture.action === true)
.map(action => action._id)
@@ -48,7 +47,7 @@ export default class ActionService {
}
})
}
- const actionsList: Ecogesture[] =
+ const actionsList =
await this._ecogestureService.getEcogesturesByIds(actionsListIds)
return actionsList
}
@@ -67,7 +66,7 @@ export default class ActionService {
public async keepListComplete(
actionList: Ecogesture[]
): Promise<Ecogesture[]> {
- const defaultActions: Ecogesture[] = await this.getDefaultActions()
+ const defaultActions = await this.getDefaultActions()
let i = 0
while (actionList.length < 3) {
actionList.push(defaultActions[i])
@@ -125,11 +124,11 @@ export default class ActionService {
public async getCustomActions(
connectedFluids: FluidType[]
): Promise<Ecogesture[]> {
- const availableActions: Ecogesture[] = await this.getAvailableActionList()
- const filteredByFluid: Ecogesture[] = availableActions.filter(action =>
+ const availableActions = await this.getAvailableActionList()
+ const filteredByFluid = availableActions.filter(action =>
action.fluidTypes.some(fluid => connectedFluids.includes(fluid))
)
- let filteredBySeason: Ecogesture[] = this.filterBySeason(filteredByFluid)
+ let filteredBySeason = this.filterBySeason(filteredByFluid)
if (filteredBySeason.length > 3) {
filteredBySeason = filteredBySeason.slice(0, 3)
@@ -137,7 +136,7 @@ export default class ActionService {
filteredBySeason = await this.keepListComplete(filteredBySeason)
}
- const sortedByDifficultyAndEfficiency: Ecogesture[] = orderBy(
+ const sortedByDifficultyAndEfficiency = orderBy(
filteredBySeason,
[
action => {
diff --git a/src/services/connection.service.spec.ts b/src/services/connection.service.spec.ts
index 445efa37ffd5330e4e4f23b02ca88105b548f1fb..6494c5b7d38b4832ce5fdd8706ce5a75b5f7a0fd 100644
--- a/src/services/connection.service.spec.ts
+++ b/src/services/connection.service.spec.ts
@@ -1,4 +1,4 @@
-import { AccountAuthData } from 'models'
+import { AccountEGLData } from 'models'
import { accountsData } from 'tests/__mocks__/accountsData.mock'
import mockClient from 'tests/__mocks__/client.mock'
import { konnectorsData } from 'tests/__mocks__/konnectorsData.mock'
@@ -26,7 +26,7 @@ jest.mock('./triggers.service', () => {
}))
})
-const mockEGLAuthData: AccountAuthData = {
+const mockEGLAuthData: AccountEGLData = {
login: 'login',
password: 'password',
}
diff --git a/src/services/connection.service.ts b/src/services/connection.service.ts
index b37854fb64c6cf4434eb0f84d4ae253f4ae1e863..86f5da837bb72668a3a7cc1424e3249680e1e2ac 100644
--- a/src/services/connection.service.ts
+++ b/src/services/connection.service.ts
@@ -3,10 +3,9 @@ import { Client } from 'cozy-client'
import logger from 'cozy-logger'
import {
Account,
- AccountAuthData,
+ AccountEGLData,
+ AccountGRDFData,
AccountSgeData,
- Konnector,
- SgeStore,
Trigger,
} from 'models'
import AccountService from 'services/account.service'
@@ -25,13 +24,11 @@ export default class ConnectionService {
public async connectNewUser(
konnectorId: string,
- eglAuthData?: AccountAuthData,
- sgeAuthData?: SgeStore
+ authData: AccountEGLData | AccountSgeData | AccountGRDFData
): Promise<{ account: Account; trigger: Trigger }> {
// Retrieve konnector
const konnectorService = new KonnectorService(this._client)
- const konnector: Konnector | null =
- await konnectorService.getKonnector(konnectorId)
+ const konnector = await konnectorService.getKonnector(konnectorId)
if (!konnector?.slug) {
const errorMessage = `Could not find konnector for ${konnectorId}`
logStack('error', errorMessage)
@@ -39,29 +36,9 @@ export default class ConnectionService {
Sentry.captureException(errorMessage)
throw new Error(errorMessage)
}
- // Creation of the account linked to the konnector retrieved
- let accountAuthData: AccountAuthData | AccountSgeData
- if (eglAuthData) {
- accountAuthData = {
- login: eglAuthData.login,
- password: eglAuthData.password,
- } as AccountAuthData
- } else {
- // No login and password for Sge account
- accountAuthData = {
- pointId: sgeAuthData?.pdl ? sgeAuthData.pdl.toString() : '',
- firstname: sgeAuthData?.firstName,
- lastname: sgeAuthData?.lastName,
- address: sgeAuthData?.address,
- postalCode: sgeAuthData?.zipCode ? sgeAuthData.zipCode.toString() : '',
- city: sgeAuthData?.city,
- } as AccountSgeData
- }
+
const accountService = new AccountService(this._client)
- const account: Account = await accountService.createAccount(
- konnector,
- accountAuthData
- )
+ const account = await accountService.createAccount(konnector, authData)
if (!account?._id) {
const errorMessage = `Error during account creation`
logStack('error', errorMessage)
@@ -71,10 +48,7 @@ export default class ConnectionService {
}
// creation of the trigger for the konnector retrieve and the created account
const triggersServices = new TriggerService(this._client)
- const trigger: Trigger = await triggersServices.createTrigger(
- account,
- konnector
- )
+ const trigger = await triggersServices.createTrigger(account, konnector)
if (!trigger) {
const errorMessage = `Error during trigger creation`
logStack('error', errorMessage)
diff --git a/src/services/consumption.service.ts b/src/services/consumption.service.ts
index b6565ff740072fd5396b760f8c84122651a26223..57ccc0eb33b970a7634eee1983bcdeb40d89907a 100644
--- a/src/services/consumption.service.ts
+++ b/src/services/consumption.service.ts
@@ -1,9 +1,13 @@
+import * as Sentry from '@sentry/react'
import { Client, Q, QueryDefinition, QueryResult } from 'cozy-client'
import { Doctype } from 'cozy-client/types/types'
+import logger from 'cozy-logger'
import { ENEDIS_MINUTE_DOCTYPE } from 'doctypes'
+import { REMOTE_ORG_ECOLYO_AVG_TEMPERATURE } from 'doctypes/remote/org.ecolyo.avg_temperature'
import { DataloadState, FluidType, TimeStep } from 'enums'
import { DateTime } from 'luxon'
import {
+ AvgTemperatureResult,
Datachart,
Dataload,
DataloadEntity,
@@ -17,12 +21,16 @@ import ConsumptionFormatterService from 'services/consumptionFormatter.service'
import ConsumptionValidatorService from 'services/consumptionValidator.service'
import ConverterService from 'services/converter.service'
import QueryRunnerService from 'services/queryRunner.service'
+import logApp from 'utils/logger'
+import { formatTwoDigits } from 'utils/utils'
interface ISingleFluidChartData {
chartData: Datachart | null
chartFluid: FluidType
}
+const logStack = logger.namespace('consumptionService')
+
export default class ConsumptionDataManager {
private readonly _client: Client
private readonly _consumptionFormatterService: ConsumptionFormatterService
@@ -36,17 +44,7 @@ export default class ConsumptionDataManager {
this._consumptionValidatorService = new ConsumptionValidatorService()
}
- /**
- * Get graph data according on timeStep and fluidType
- * @param timePeriod TimePeriod
- * @param timeStep TimeStep
- * @param fluidTypes FluidType[]
- * @param fluidStatus FluidStatus[]
- * @param compareTimePeriod - Optional TimePeriod
- * @param isHome - Optional boolean
- * @param isExport - Optional boolean
- * @returns DataChart | null
- */
+ /** Get graph data according on timeStep and fluidType */
public async getGraphData(
timePeriod: TimePeriod,
timeStep: TimeStep,
@@ -56,28 +54,24 @@ export default class ConsumptionDataManager {
isHome?: boolean,
isExport?: boolean
): Promise<Datachart | null> {
- const InputisValid: boolean =
- this._consumptionValidatorService.ValidateGetGraphData(
+ const InputIsValid = this._consumptionValidatorService.ValidateGetGraphData(
+ timePeriod,
+ timeStep,
+ fluidTypes,
+ compareTimePeriod,
+ isExport
+ )
+ if (!InputIsValid) return null
+ if (fluidTypes.length === 1 && !isHome) {
+ const fluidType: FluidType = fluidTypes[0]
+ const fetchedData = await this.fetchSingleFluidGraphData(
timePeriod,
timeStep,
- fluidTypes,
- compareTimePeriod,
- isExport
+ fluidType,
+ compareTimePeriod
)
- if (!InputisValid) return null
- if (fluidTypes.length === 1 && !isHome) {
- const fluidType: FluidType = fluidTypes[0]
- // running the query
- const fetchedData: Datachart | null =
- await this.fetchSingleFluidGraphData(
- timePeriod,
- timeStep,
- fluidType,
- compareTimePeriod
- )
- // formatting data
- const formattedData: Datachart | null = this.formatGraphDataManager(
+ const formattedData = this.formatGraphDataManager(
fetchedData,
timeStep,
timePeriod,
@@ -110,8 +104,7 @@ export default class ConsumptionDataManager {
chartFluid: fluidType,
})
}
- const aggregatedData: Datachart | null =
- this.aggregateGraphData(toBeAggregatedData)
+ const aggregatedData = this.aggregateGraphData(toBeAggregatedData)
return aggregatedData
} else return null
}
@@ -148,7 +141,7 @@ export default class ConsumptionDataManager {
}
}
- // fetch last dataload available for a given fluid - return the daily data
+ /** get last dataload available for a given fluid - return the daily data */
public async getLastDataload(
fluidTypes: FluidType
): Promise<Dataload[] | null> {
@@ -452,7 +445,6 @@ export default class ConsumptionDataManager {
private aggregateGraphData(
singleFluidCharts: ISingleFluidChartData[]
- // ,withComparison: boolean = true
): Datachart | null {
if (singleFluidCharts[0]?.chartData) {
const converterService = new ConverterService()
@@ -580,11 +572,6 @@ export default class ConsumptionDataManager {
return null
}
- /**
- * getLastHourData
- * @param {number} month number
- * @returns {Promise<DataloadEntity[]>} usageEvent added
- */
public async getLastHourData(
client: Client,
month: number
@@ -641,6 +628,39 @@ export default class ConsumptionDataManager {
return data.data[0]
}
+ /**
+ * Try to fetch average temperature from remote doctype
+ * @returns {Promise<number | null>} avg-temperature
+ */
+ public fetchAvgTemperature = async (
+ year: number,
+ month: number
+ ): Promise<number | null> => {
+ const bronStationId = '69123002'
+ const avgTemperatureDate = `${year}-${formatTwoDigits(month)}`
+ try {
+ const result: AvgTemperatureResult = await this._client
+ .getStackClient()
+ .fetchJSON(
+ 'GET',
+ `${REMOTE_ORG_ECOLYO_AVG_TEMPERATURE}?identifiant=${bronStationId}&month=${avgTemperatureDate}`
+ )
+ if (result && result.nb_results !== 0) {
+ return result.values[0].average_measurement
+ } else {
+ throw new Error(
+ `No average temperature found for ${avgTemperatureDate}`
+ )
+ }
+ } catch (error) {
+ const errorMessage = `fetchAvgTemperature error : ${error}`
+ logStack('error', errorMessage)
+ logApp.error(errorMessage)
+ Sentry.captureException(error)
+ return null
+ }
+ }
+
/**
* Save one doc
* @param {DataloadEntity} consumptionDoc - Doc to save
diff --git a/src/services/ecogesture.service.spec.ts b/src/services/ecogesture.service.spec.ts
index 29518141e36a29ab38afeb3a6ed685cbefc5e3bd..d04e0116ba03cc6c37e8374d7974f7a9cda2d8c6 100644
--- a/src/services/ecogesture.service.spec.ts
+++ b/src/services/ecogesture.service.spec.ts
@@ -1,6 +1,11 @@
import { QueryResult } from 'cozy-client'
import ecogestureData from 'db/ecogestureData.json'
-import { EquipmentType, IndividualOrCollective, WarmingType } from 'enums'
+import {
+ EquipmentType,
+ IndividualOrCollective,
+ Season,
+ WarmingType,
+} from 'enums'
import { Ecogesture } from 'models'
import { ProfileEcogesture } from 'models/profileEcogesture.model'
import mockClient from 'tests/__mocks__/client.mock'
@@ -10,9 +15,11 @@ import {
ecogesturesECSData,
ecogesturesHeatingData,
mockedEcogesturesData,
+ mockedEcogesturesSortedData,
} from 'tests/__mocks__/ecogesturesData.mock'
import { mockProfileEcogesture } from 'tests/__mocks__/profileEcogesture.mock'
import { getError } from 'tests/__mocks__/testUtils'
+import * as dateUtils from 'utils/date'
import { hashFile } from 'utils/hash'
import EcogestureService from './ecogesture.service'
@@ -33,6 +40,13 @@ const mockQueryResultMockedEcogestures: QueryResult<Ecogesture[]> = {
skip: 0,
}
+const mockQueryResultMockedSortedEcogestures: QueryResult<Ecogesture[]> = {
+ data: mockedEcogesturesSortedData,
+ bookmark: '',
+ next: false,
+ skip: 0,
+}
+
const mockQueryResultEmpty: QueryResult<Ecogesture[]> = {
data: [],
bookmark: '',
@@ -44,9 +58,11 @@ describe('Ecogesture service', () => {
const ecogestureService = new EcogestureService(mockClient)
describe('getAllEcogestures', () => {
it('should return all ecogestures', async () => {
- mockClient.query.mockResolvedValueOnce(mockQueryResultMockedEcogestures)
+ mockClient.query.mockResolvedValueOnce(
+ mockQueryResultMockedSortedEcogestures
+ )
const result = await ecogestureService.getAllEcogestures()
- expect(result).toEqual(mockedEcogesturesData)
+ expect(result).toEqual(mockedEcogesturesSortedData)
})
it('should return empty array when no ecogestures stored', async () => {
mockClient.query.mockResolvedValueOnce(mockQueryResultEmpty)
@@ -75,22 +91,22 @@ describe('Ecogesture service', () => {
)
})
})
- describe('reinitAllEcogestures', () => {
+ describe('resetAllEcogestures', () => {
it('should return true when 3 ecogestures stored', async () => {
mockClient.query.mockResolvedValueOnce(mockQueryResultMockedEcogestures)
- const result = await ecogestureService.reinitAllEcogestures()
+ const result = await ecogestureService.resetAllEcogestures()
expect(mockClient.save).toHaveBeenCalledTimes(3)
expect(result).toBe(true)
})
it('should return true when no ecogestures stored', async () => {
mockClient.query.mockResolvedValueOnce(mockQueryResultEmpty)
- const result = await ecogestureService.reinitAllEcogestures()
+ const result = await ecogestureService.resetAllEcogestures()
expect(result).toBe(true)
})
- it('should throw exception when error happened on reinit', async () => {
+ it('should throw exception when error happened on reset', async () => {
mockClient.save.mockRejectedValue(new Error())
mockClient.query.mockResolvedValueOnce(mockQueryResultMockedEcogestures)
- await expect(ecogestureService.reinitAllEcogestures()).rejects.toThrow(
+ await expect(ecogestureService.resetAllEcogestures()).rejects.toThrow(
new Error()
)
})
@@ -181,22 +197,80 @@ describe('Ecogesture service', () => {
expect(result.includes(BoilerEcogestureFalse[0])).toBeTruthy()
})
})
- describe('getEcogestureListByProfile', () => {
- it('should return ecogesture list according to profile ecogesture, sorted and filtered', async () => {
- const mockProfileEcogestureFull: ProfileEcogesture = {
- ...mockProfileEcogesture,
- equipments: [EquipmentType.WASHING_MACHINE, EquipmentType.DISHWASHER],
- }
+ describe('getEcogestureListByProfile', () => {
+ const mockProfileEcogestureFull: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ equipments: [
+ EquipmentType.WASHING_MACHINE,
+ EquipmentType.DISHWASHER,
+ EquipmentType.AIR_CONDITIONING,
+ ],
+ }
+ it('should return ecogesture list according to profile ecogesture, sorted and filtered, for SUMMER season', async () => {
mockClient.query.mockResolvedValueOnce(mockQueryResultMockedEcogestures)
-
+ jest.spyOn(dateUtils, 'getCurrentSeason').mockReturnValue(Season.SUMMER)
+ const result = await ecogestureService.getEcogestureListByProfile(
+ mockProfileEcogestureFull
+ )
+ expect(result[0]).toBe(mockedEcogesturesData[1])
+ expect(result[1]).toBe(mockedEcogesturesData[2])
+ expect(result[2]).toBe(mockedEcogesturesData[0])
+ })
+ it('should return ecogesture list according to profile ecogesture, sorted and filtered, for WINTER season', async () => {
+ mockClient.query.mockResolvedValueOnce(mockQueryResultMockedEcogestures)
+ jest.spyOn(dateUtils, 'getCurrentSeason').mockReturnValue(Season.WINTER)
const result = await ecogestureService.getEcogestureListByProfile(
mockProfileEcogestureFull
)
- expect(result.length).toBe(2)
expect(result[0]).toBe(mockedEcogesturesData[0])
+ expect(result[1]).toBe(mockedEcogesturesData[2])
+ expect(result[2]).toBe(mockedEcogesturesData[1])
+ })
+ it('should return ecogesture list according to profile ecogesture, sorted and filtered, for NO season', async () => {
+ mockClient.query.mockResolvedValueOnce(mockQueryResultMockedEcogestures)
+ jest.spyOn(dateUtils, 'getCurrentSeason').mockReturnValue(null)
+ const result = await ecogestureService.getEcogestureListByProfile(
+ mockProfileEcogestureFull
+ )
+ expect(result[0]).toBe(mockedEcogesturesData[0])
+ expect(result[1]).toBe(mockedEcogesturesData[1])
+ expect(result[2]).toBe(mockedEcogesturesData[2])
})
})
+
+ describe('calculateScore', () => {
+ it('should return correct scores for each ecogesture for SUMMER season', () => {
+ jest.spyOn(dateUtils, 'getCurrentSeason').mockReturnValue(Season.SUMMER)
+ const scores = mockedEcogesturesData.map(ecogesture =>
+ ecogestureService.calculateScore(ecogesture)
+ )
+ expect(scores[0]).toBe(0)
+ expect(scores[1]).toBe(8)
+ expect(scores[2]).toBe(1)
+ })
+
+ it('should return correct scores for each ecogesture for WINTER season', () => {
+ jest.spyOn(dateUtils, 'getCurrentSeason').mockReturnValue(Season.WINTER)
+ const scores = mockedEcogesturesData.map(ecogesture =>
+ ecogestureService.calculateScore(ecogesture)
+ )
+ expect(scores[0]).toBe(8)
+ expect(scores[1]).toBe(0)
+ expect(scores[2]).toBe(1)
+ })
+
+ it('should return correct scores for each ecogesture for NO season', () => {
+ jest.spyOn(dateUtils, 'getCurrentSeason').mockReturnValue(null)
+ const scores = mockedEcogesturesData.map(ecogesture =>
+ ecogestureService.calculateScore(ecogesture)
+ )
+ expect(scores[0]).toBe(7)
+ expect(scores[1]).toBe(7)
+ expect(scores[2]).toBe(1)
+ })
+ })
+
describe('getEcogesturesByIds', () => {
it('Should return corresponding ecogestures', async () => {
const mockQueryResult: QueryResult<Ecogesture[]> = {
diff --git a/src/services/ecogesture.service.ts b/src/services/ecogesture.service.ts
index 4f56d58fdfa0a4052b71d124bb97f3c75621cb9a..ce07f6f1d934b81f63bd4de27142850714ce78cb 100644
--- a/src/services/ecogesture.service.ts
+++ b/src/services/ecogesture.service.ts
@@ -12,6 +12,7 @@ import {
} from 'enums'
import { orderBy } from 'lodash'
import { Ecogesture, ProfileEcogesture } from 'models'
+import { getCurrentSeason, getOppositeSeason } from 'utils/date'
import { logDuration } from 'utils/duration'
import { hashFile } from 'utils/hash'
import logApp from 'utils/logger'
@@ -36,7 +37,7 @@ export default class EcogestureService {
}> {
const startTime = performance.now()
const hashEcogestureType = hashFile(ecogestureData)
- const ecogestures = await this.getAllEcogestures(undefined, true)
+ const ecogestures = await this.getAllEcogestures(true)
if (!ecogestures || ecogestures?.length === 0) {
// Populate data if none ecogesture exists
@@ -115,18 +116,36 @@ export default class EcogestureService {
}
}
- // TODO add default params
- public async getAllEcogestures(
- seasonFilter?: Season,
- orderByID?: boolean
- ): Promise<Ecogesture[]> {
+ /**
+ * Calculate Ecogesture score from efficiency and difficulty
+ *
+ * Base score = efficiency * 2 - difficulty
+ * - If current season, Score + 1
+ * - If opposite season, Score = 0
+ * - If no season, base score
+ */
+ public calculateScore(ecogesture: Ecogesture): number {
+ const score = ecogesture.efficiency * 2 - ecogesture.difficulty
+
+ const currentSeason = getCurrentSeason()
+
+ if (ecogesture.season !== Season.NONE) {
+ if (ecogesture.season === currentSeason) {
+ return score + 1
+ } else if (
+ currentSeason &&
+ ecogesture.season === getOppositeSeason(currentSeason)
+ ) {
+ return 0
+ }
+ }
+ return score
+ }
+
+ public async getAllEcogestures(orderByID?: boolean): Promise<Ecogesture[]> {
let query: QueryDefinition = Q(ECOGESTURE_DOCTYPE)
- if (seasonFilter && seasonFilter !== Season.NONE) {
- query = query
- .where({ season: { $ne: seasonFilter } })
- .indexFields(['season'])
- .sortBy([{ season: 'desc' }])
- } else if (orderByID) {
+
+ if (orderByID) {
query = query
.where({})
.indexFields(['_id'])
@@ -141,17 +160,13 @@ export default class EcogestureService {
const { data: ecogestures }: QueryResult<Ecogesture[]> =
await this._client.query(query)
- if (seasonFilter && seasonFilter !== Season.NONE) {
- const { data: ecogesturesWithSeason }: QueryResult<Ecogesture[]> =
- await this._client.query(
- Q(ECOGESTURE_DOCTYPE)
- .where({ season: { $eq: seasonFilter } })
- .indexFields(['season'])
- .sortBy([{ season: 'asc' }])
- )
- return [...ecogesturesWithSeason, ...ecogestures]
+ for (const ecogesture of ecogestures) {
+ const score = this.calculateScore(ecogesture)
+ ecogesture.score = score
}
- return ecogestures
+
+ const sortedByScoreDesc = orderBy(ecogestures, 'score', 'desc')
+ return sortedByScoreDesc
}
/**
@@ -182,7 +197,7 @@ export default class EcogestureService {
}
}
- public async reinitAllEcogestures(): Promise<boolean> {
+ public async resetAllEcogestures(): Promise<boolean> {
const ecogestures = await this.getAllEcogestures()
try {
for (const ecogesture of ecogestures) {
@@ -195,9 +210,7 @@ export default class EcogestureService {
}
return true
} catch (error) {
- const errorMessage = `Error reinitAllEcogestures: ${JSON.stringify(
- error
- )}`
+ const errorMessage = `Error resetAllEcogestures: ${JSON.stringify(error)}`
logStack('error', errorMessage)
logApp.error(errorMessage)
Sentry.captureException(error)
@@ -212,7 +225,7 @@ export default class EcogestureService {
ecogestureList: Ecogesture[],
profileEcogesture: ProfileEcogesture
): Ecogesture[] {
- const filteredByUsage: Ecogesture[] = ecogestureList.filter(ecogesture => {
+ const filteredByUsage = ecogestureList.filter(ecogesture => {
switch (ecogesture.usage) {
case Usage.HEATING:
if (
@@ -252,17 +265,14 @@ export default class EcogestureService {
ecogestureList: Ecogesture[],
profileEcogesture: ProfileEcogesture
): Ecogesture[] {
- for (const ecogesture of ecogestureList) {
- if (ecogesture.equipment === true) {
- for (const equipmentType of ecogesture.equipmentType) {
- if (!profileEcogesture.equipments.includes(equipmentType)) {
- const index = ecogestureList.indexOf(ecogesture)
- ecogestureList.splice(index, 1)
- }
- }
+ return ecogestureList.filter(ecogesture => {
+ if (ecogesture.equipmentType.length === 0) {
+ return true
}
- }
- return ecogestureList
+ return ecogesture.equipmentType.some(type =>
+ profileEcogesture.equipments.includes(type)
+ )
+ })
}
/**
@@ -271,35 +281,33 @@ export default class EcogestureService {
public async getEcogestureListByProfile(
profileEcogesture: ProfileEcogesture
): Promise<Ecogesture[]> {
- const ecogestureList: Ecogesture[] = await this.getAllEcogestures()
- const filteredByUsage: Ecogesture[] = this.filterByUsage(
+ const ecogestureList = await this.getAllEcogestures()
+
+ const filteredByUsage = this.filterByUsage(
ecogestureList,
profileEcogesture
)
- const filteredByEquipment: Ecogesture[] = this.filterByEquipment(
+
+ const filteredByEquipment = this.filterByEquipment(
filteredByUsage,
profileEcogesture
)
- const filteredFlaggedEcogesture: Ecogesture[] = filteredByEquipment.filter(
- (ecogesture: Ecogesture) =>
+
+ const filteredFlaggedEcogesture = filteredByEquipment.filter(
+ ecogesture =>
(ecogesture.objective === false &&
ecogesture.doing === false &&
ecogesture.viewedInSelection === false) ||
ecogesture.viewedInSelection === true
)
- const sortedByDifficultyAndEfficiency: Ecogesture[] = orderBy(
+
+ const sortedByScoreDesc = orderBy(
filteredFlaggedEcogesture,
- [
- ecogesture => {
- return ecogesture.difficulty
- },
- ecogesture => {
- return ecogesture.efficiency
- },
- ],
- ['asc', 'desc']
+ 'score',
+ 'desc'
)
- return sortedByDifficultyAndEfficiency
+
+ return sortedByScoreDesc
}
/**
diff --git a/src/services/fluid.service.spec.ts b/src/services/fluid.service.spec.ts
index a21c59d1b82087d3d46a3a7c6cf55d8080cb5eed..8de4bf3ba466ab01c64883ba3becd9418b7ff858 100644
--- a/src/services/fluid.service.spec.ts
+++ b/src/services/fluid.service.spec.ts
@@ -128,7 +128,7 @@ describe('Fluid service', () => {
isUpdating: false,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
@@ -217,7 +217,7 @@ describe('Fluid service', () => {
isUpdating: false,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
@@ -306,7 +306,7 @@ describe('Fluid service', () => {
isUpdating: false,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
@@ -395,7 +395,7 @@ describe('Fluid service', () => {
isUpdating: false,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
@@ -485,7 +485,7 @@ describe('Fluid service', () => {
isUpdating: false,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
diff --git a/src/services/fluid.service.ts b/src/services/fluid.service.ts
index b8a31df14e9814b17769180832839cb597619955..f22c17dc550c959396a9838018e09139865a5837 100644
--- a/src/services/fluid.service.ts
+++ b/src/services/fluid.service.ts
@@ -1,13 +1,6 @@
import { Client } from 'cozy-client'
import { FluidState, FluidType } from 'enums'
-import {
- Account,
- FluidStatus,
- Konnector,
- PartnersInfo,
- Trigger,
- TriggerState,
-} from 'models'
+import { FluidStatus, Konnector, PartnersInfo, TriggerState } from 'models'
import AccountService from 'services/account.service'
import ConsumptionService from 'services/consumption.service'
import ConfigService from 'services/fluidConfig.service'
@@ -27,19 +20,21 @@ export default class FluidService {
state: TriggerState | null
): FluidState => {
if (!konnector) return FluidState.KONNECTOR_NOT_FOUND
- if (!state) {
- return FluidState.NOT_CONNECTED
- } else {
- switch (state.status) {
- case 'done':
- return FluidState.DONE
- case 'errored':
- if (state?.last_error === 'LOGIN_FAILED')
- return FluidState.ERROR_LOGIN_FAILED
- else return FluidState.ERROR
- default:
- return FluidState.NOT_CONNECTED
- }
+ if (!state) return FluidState.NOT_CONNECTED
+ switch (state.status) {
+ case 'done':
+ return FluidState.DONE
+ case 'errored':
+ if (state?.last_error === 'LOGIN_FAILED') {
+ return FluidState.LOGIN_FAILED
+ }
+ if (state?.last_error === 'CHALLENGE_ASKED') {
+ return FluidState.CHALLENGE_ASKED
+ }
+ return FluidState.ERROR
+
+ default:
+ return FluidState.NOT_CONNECTED
}
}
@@ -61,51 +56,47 @@ export default class FluidService {
): Promise<FluidStatus[]> => {
const fluidConfig = new ConfigService().getFluidConfig()
const accountService = new AccountService(this._client)
- const [elecAccount, waterAccount, gasAccount]: (Account | null)[] =
- await Promise.all([
- accountService.getAccountByType(
- fluidConfig[FluidType.ELECTRICITY].konnectorConfig.slug
- ),
- accountService.getAccountByType(
- fluidConfig[FluidType.WATER].konnectorConfig.slug
- ),
- accountService.getAccountByType(
- fluidConfig[FluidType.GAS].konnectorConfig.slug
- ),
- ])
+ const [elecAccount, waterAccount, gasAccount] = await Promise.all([
+ accountService.getAccountByType(
+ fluidConfig[FluidType.ELECTRICITY].konnectorConfig.slug
+ ),
+ accountService.getAccountByType(
+ fluidConfig[FluidType.WATER].konnectorConfig.slug
+ ),
+ accountService.getAccountByType(
+ fluidConfig[FluidType.GAS].konnectorConfig.slug
+ ),
+ ])
const konnectorService = new KonnectorService(this._client)
- const [elecKonnector, waterKonnector, gasKonnector]: (Konnector | null)[] =
- await Promise.all([
- konnectorService.getKonnector(
- fluidConfig[FluidType.ELECTRICITY].konnectorConfig.slug
- ),
- konnectorService.getKonnector(
- fluidConfig[FluidType.WATER].konnectorConfig.slug
- ),
- konnectorService.getKonnector(
- fluidConfig[FluidType.GAS].konnectorConfig.slug
- ),
- ])
+ const [elecKonnector, waterKonnector, gasKonnector] = await Promise.all([
+ konnectorService.getKonnector(
+ fluidConfig[FluidType.ELECTRICITY].konnectorConfig.slug
+ ),
+ konnectorService.getKonnector(
+ fluidConfig[FluidType.WATER].konnectorConfig.slug
+ ),
+ konnectorService.getKonnector(
+ fluidConfig[FluidType.GAS].konnectorConfig.slug
+ ),
+ ])
const triggerService = new TriggerService(this._client)
- const [elecTrigger, waterTrigger, gasTrigger]: (Trigger | null)[] =
- await Promise.all([
- elecAccount && elecKonnector
- ? triggerService.getTrigger(elecAccount, elecKonnector)
- : null,
- waterAccount && waterKonnector
- ? triggerService.getTrigger(waterAccount, waterKonnector)
- : null,
- gasAccount && gasKonnector
- ? triggerService.getTrigger(gasAccount, gasKonnector)
- : null,
- ])
+ const [elecTrigger, waterTrigger, gasTrigger] = await Promise.all([
+ elecAccount && elecKonnector
+ ? triggerService.getTrigger(elecAccount, elecKonnector)
+ : null,
+ waterAccount && waterKonnector
+ ? triggerService.getTrigger(waterAccount, waterKonnector)
+ : null,
+ gasAccount && gasKonnector
+ ? triggerService.getTrigger(gasAccount, gasKonnector)
+ : null,
+ ])
const consumptionService = new ConsumptionService(this._client)
- const [elecStatus, waterStatus, gasStatus]: (TriggerState | null)[] =
- await Promise.all([
- elecTrigger ? triggerService.fetchTriggerState(elecTrigger) : null,
- waterTrigger ? triggerService.fetchTriggerState(waterTrigger) : null,
- gasTrigger ? triggerService.fetchTriggerState(gasTrigger) : null,
- ])
+ const [elecStatus, waterStatus, gasStatus] = await Promise.all([
+ elecTrigger ? triggerService.fetchTriggerState(elecTrigger) : null,
+ waterTrigger ? triggerService.fetchTriggerState(waterTrigger) : null,
+ gasTrigger ? triggerService.fetchTriggerState(gasTrigger) : null,
+ ])
const firstDataDates =
await consumptionService.fetchAllFirstDateData(allFluids)
const lastDataDates =
diff --git a/src/services/profileType.service.spec.ts b/src/services/profileType.service.spec.ts
index 3c52e9a655addf1f419ac934f4a33e1436802060..d7d7fa389282e6be3d99dbe9575fb04a9106c3ea 100644
--- a/src/services/profileType.service.spec.ts
+++ b/src/services/profileType.service.spec.ts
@@ -533,11 +533,10 @@ describe('ProfileType service', () => {
DateTime.fromISO('2021-01-01T00:00:00.000Z', { zone: 'utc' })
)
- const expectedResult = {
+ const expectedResult: ProfileType = {
...mockProfile,
warmingFluid: null,
individualInsulationWork: [],
- facilitiesInstallation: [],
hotWaterFluid: null,
hotWaterEquipment: HotWaterEquipment.OTHER,
}
@@ -551,25 +550,25 @@ describe('ProfileType service', () => {
const mockDjuResult: DjuResult = {
fields: [],
layer_name: '',
- nb_result: 1,
+ nb_results: 1,
table_href: '',
values: [
{
month: '2024-01',
- average_measurement: 10.5,
+ sum_measurement: 10.5,
identifiant: '69029001',
},
],
}
mockClient.getStackClient().fetchJSON.mockResolvedValueOnce(mockDjuResult)
const result = await profileTypeService.fetchDJU(2023, 2)
- expect(result).toEqual(mockDjuResult.values[0].average_measurement)
+ expect(result).toEqual(mockDjuResult.values[0].sum_measurement)
})
it('should return default dju if remote doctype returns no value', async () => {
const mockDjuResult: DjuResult = {
fields: [],
layer_name: '',
- nb_result: 0,
+ nb_results: 0,
table_href: '',
values: [],
}
diff --git a/src/services/profileType.service.ts b/src/services/profileType.service.ts
index 814a340ed146f2527c8dad96544b56c2742961f0..91d05dd9f578793ea94fd35b7b687962266110be 100644
--- a/src/services/profileType.service.ts
+++ b/src/services/profileType.service.ts
@@ -451,8 +451,8 @@ export default class ProfileTypeService {
const result: DjuResult = await this._client
.getStackClient()
.fetchJSON('GET', `${REMOTE_ORG_ECOLYO_DJU}?month=${djuDate}`)
- if (result && result.nb_result !== 0) {
- return result.values[0].average_measurement
+ if (result && result.nb_results !== 0) {
+ return result.values[0].sum_measurement
} else {
return heatingData.dju_average_by_month[month - 1]
}
@@ -479,7 +479,6 @@ export default class ProfileTypeService {
if (profileType.heating === IndividualOrCollective.COLLECTIVE) {
profileType.warmingFluid = null
profileType.individualInsulationWork = []
- profileType.facilitiesInstallation = []
}
if (profileType.hotWater === IndividualOrCollective.COLLECTIVE) {
profileType.hotWaterFluid = null
diff --git a/src/services/queryRunner.service.spec.ts b/src/services/queryRunner.service.spec.ts
index 656180de012107559449b5f0b7a78ed61419aa5a..bf9dc310c125935eb9266ce5bdd1094edff7414a 100644
--- a/src/services/queryRunner.service.spec.ts
+++ b/src/services/queryRunner.service.spec.ts
@@ -1132,12 +1132,11 @@ describe('queryRunner service', () => {
skip: 0,
}
mockClient.query.mockResolvedValue(mockQueryResult)
- const result: number | Dataload | null =
- await queryRunner.fetchFluidMaxData(
- mockTimePeriod,
- TimeStep.DAY,
- FluidType.ELECTRICITY
- )
+ const result = await queryRunner.fetchFluidMaxData(
+ mockTimePeriod,
+ TimeStep.DAY,
+ FluidType.ELECTRICITY
+ )
expect(result).toBe(30.33)
})
@@ -1165,12 +1164,11 @@ describe('queryRunner service', () => {
mockClient.query
.mockResolvedValueOnce(mockQueryResult)
.mockResolvedValueOnce(mockQueryResult2)
- const result: number | Dataload | null =
- await queryRunner.fetchFluidMaxData(
- mockTimePeriod,
- TimeStep.HALF_AN_HOUR,
- FluidType.ELECTRICITY
- )
+ const result = await queryRunner.fetchFluidMaxData(
+ mockTimePeriod,
+ TimeStep.HALF_AN_HOUR,
+ FluidType.ELECTRICITY
+ )
expect(result).toBe(7.82)
})
@@ -1198,12 +1196,11 @@ describe('queryRunner service', () => {
mockClient.query
.mockResolvedValueOnce(mockQueryResult)
.mockResolvedValueOnce(mockQueryResult2)
- const result: number | Dataload | null =
- await queryRunner.fetchFluidMaxData(
- mockTimePeriod,
- TimeStep.HALF_AN_HOUR,
- FluidType.ELECTRICITY
- )
+ const result = await queryRunner.fetchFluidMaxData(
+ mockTimePeriod,
+ TimeStep.HALF_AN_HOUR,
+ FluidType.ELECTRICITY
+ )
expect(result).toBe(0)
})
@@ -1217,12 +1214,11 @@ describe('queryRunner service', () => {
}),
}
mockClient.query.mockRejectedValue(new Error())
- const result: number | Dataload | null =
- await queryRunner.fetchFluidMaxData(
- mockTimePeriod,
- TimeStep.DAY,
- FluidType.ELECTRICITY
- )
+ const result = await queryRunner.fetchFluidMaxData(
+ mockTimePeriod,
+ TimeStep.DAY,
+ FluidType.ELECTRICITY
+ )
expect(result).toBeNull()
})
@@ -1235,12 +1231,11 @@ describe('queryRunner service', () => {
zone: 'utc',
}),
}
- const result: number | Dataload | null =
- await queryRunner.fetchFluidMaxData(
- mockTimePeriod,
- TimeStep.DAY,
- unknownFluidType
- )
+ const result = await queryRunner.fetchFluidMaxData(
+ mockTimePeriod,
+ TimeStep.DAY,
+ unknownFluidType
+ )
expect(result).toBeNull()
})
@@ -1253,12 +1248,11 @@ describe('queryRunner service', () => {
zone: 'utc',
}),
}
- const result: number | Dataload | null =
- await queryRunner.fetchFluidMaxData(
- mockTimePeriod,
- unknownTimeStep,
- FluidType.ELECTRICITY
- )
+ const result = await queryRunner.fetchFluidMaxData(
+ mockTimePeriod,
+ unknownTimeStep,
+ FluidType.ELECTRICITY
+ )
expect(result).toBeNull()
})
})
diff --git a/src/services/quiz.service.ts b/src/services/quiz.service.ts
index ffc47a65192bb41959922668371673eac095e95e..26271500527efae3b6cb4a890b3983a3673a7db7 100644
--- a/src/services/quiz.service.ts
+++ b/src/services/quiz.service.ts
@@ -260,7 +260,7 @@ export default class QuizService {
*/
public async getCustomQuestion(
customQuestionEntity: CustomQuestionEntity,
- fluidType: FluidType[]
+ fluidTypes: FluidType[]
): Promise<QuestionEntity> {
let answers: Answer[]
const explanation =
@@ -269,22 +269,22 @@ export default class QuizService {
customQuestionEntity.interval,
customQuestionEntity.period.weekday ? {} : customQuestionEntity.period
)
- let useFluidType: FluidType[] = fluidType
+ let useFluidTypes: FluidType[] = fluidTypes
let questionLabel: string = customQuestionEntity.questionLabel
let unit = '€'
if (customQuestionEntity.singleFluid === true) {
let unitLabel = 'kWh'
let fluidLabel = "d'électricité"
// Define the right fluidType
- if (fluidType.includes(FluidType.ELECTRICITY)) {
- useFluidType = [FluidType.ELECTRICITY]
+ if (fluidTypes.includes(FluidType.ELECTRICITY)) {
+ useFluidTypes = [FluidType.ELECTRICITY]
unit = 'kWh'
- } else if (fluidType.includes(FluidType.GAS)) {
- useFluidType = [FluidType.GAS]
+ } else if (fluidTypes.includes(FluidType.GAS)) {
+ useFluidTypes = [FluidType.GAS]
unit = 'kWh'
fluidLabel = 'de gaz'
} else {
- useFluidType = [FluidType.WATER]
+ useFluidTypes = [FluidType.WATER]
unit = 'L'
unitLabel = 'litre'
fluidLabel = "d'eau"
@@ -295,12 +295,11 @@ export default class QuizService {
}
if (customQuestionEntity.type === CustomQuestionType.DATE) {
// Interval
- const intervalAsnwer: IntervalAnswer =
- await this.getMaxLoadOnLastInterval(
- customQuestionEntity.timeStep,
- finalInterval,
- useFluidType
- )
+ const intervalAsnwer = await this.getMaxLoadOnLastInterval(
+ customQuestionEntity.timeStep,
+ finalInterval,
+ useFluidTypes
+ )
answers = this.getAnswersForInterval(
intervalAsnwer.date,
customQuestionEntity.timeStep,
@@ -312,7 +311,7 @@ export default class QuizService {
let maxLoad = await consumptionService.getMaxLoad(
finalInterval,
customQuestionEntity.timeStep,
- useFluidType,
+ useFluidTypes,
undefined,
!customQuestionEntity.singleFluid
)
@@ -320,10 +319,10 @@ export default class QuizService {
answers = this.getAnswersForNumberValue(maxLoad as number, unit)
} else {
// average
- const averageLoad: number = await this.getAverageOnGivenPeriod(
+ const averageLoad = await this.getAverageOnGivenPeriod(
customQuestionEntity.timeStep,
finalInterval,
- useFluidType,
+ useFluidTypes,
customQuestionEntity.period.weekday
? customQuestionEntity.period.weekday
: undefined,
diff --git a/src/store/chart/chart.slice.spec.ts b/src/store/chart/chart.slice.spec.ts
index 9015e59e329b09ed494600f00def39203bac9ad5..02f68b6399afa66dbb82ff070c10dc8d082dbdb1 100644
--- a/src/store/chart/chart.slice.spec.ts
+++ b/src/store/chart/chart.slice.spec.ts
@@ -8,9 +8,9 @@ import {
setCurrentDataChartIndex,
setCurrentIndex,
setCurrentTimeStep,
- setLoading,
setSelectedDate,
setShowCompare,
+ setShowConnectionDetails,
} from './chart.slice'
describe('chart reducer', () => {
@@ -100,22 +100,25 @@ describe('chart reducer', () => {
})
})
- describe('setLoading', () => {
- it('should handle setLoading with payload', () => {
- const state = chartSlice.reducer(mockChartState, setLoading(false))
+ describe('setShowCompare', () => {
+ it('should handle setShowCompare', () => {
+ const state = chartSlice.reducer(mockChartState, setShowCompare(true))
expect(state).toEqual({
...mockChartState,
- loading: false,
+ showCompare: true,
})
})
})
- describe('setShowCompare', () => {
- it('should handle setShowCompare', () => {
- const state = chartSlice.reducer(mockChartState, setShowCompare(true))
+ describe('setShowConnectionDetails', () => {
+ it('should handle setShowConnectionDetails', () => {
+ const state = chartSlice.reducer(
+ mockChartState,
+ setShowConnectionDetails(true)
+ )
expect(state).toEqual({
...mockChartState,
- showCompare: true,
+ showConnectionDetails: true,
})
})
})
diff --git a/src/store/chart/chart.slice.ts b/src/store/chart/chart.slice.ts
index 60f4790d601c1edbfcf6bf9b35e61af23320d940..558e752a338575e15d2b4fa6896f8845330f975f 100644
--- a/src/store/chart/chart.slice.ts
+++ b/src/store/chart/chart.slice.ts
@@ -11,9 +11,9 @@ const initialState: ChartState = {
currentIndex: 0,
currentDatachart: { actualData: [], comparisonData: null },
currentDatachartIndex: 0,
- loading: true,
showCompare: false,
showOfflineData: false,
+ showConnectionDetails: false,
}
export const chartSlice = createSlice({
@@ -35,9 +35,6 @@ export const chartSlice = createSlice({
state.showCompare = false
}
},
- setLoading: (state, action: PayloadAction<boolean>) => {
- state.loading = action.payload
- },
setSelectedDate: (state, action: PayloadAction<DateTime>) => {
state.selectedDate = action.payload
},
@@ -47,6 +44,9 @@ export const chartSlice = createSlice({
setShowOfflineData: (state, action: PayloadAction<boolean>) => {
state.showOfflineData = action.payload
},
+ setShowConnectionDetails: (state, action: PayloadAction<boolean>) => {
+ state.showConnectionDetails = action.payload
+ },
},
})
@@ -55,8 +55,8 @@ export const {
setCurrentDataChartIndex,
setCurrentIndex,
setCurrentTimeStep,
- setLoading,
setSelectedDate,
setShowCompare,
setShowOfflineData,
+ setShowConnectionDetails,
} = chartSlice.actions
diff --git a/src/store/global/global.slice.spec.ts b/src/store/global/global.slice.spec.ts
index b4fc3d507a4612d127f3e2196de7e5012c5bdd2d..3df92c909f3204595518c0ae66e6a7d913b0e440 100644
--- a/src/store/global/global.slice.spec.ts
+++ b/src/store/global/global.slice.spec.ts
@@ -11,6 +11,7 @@ import {
changeScreenType,
globalSlice,
setFluidStatus,
+ setHeaderHeight,
setLastEpglLogin,
setPartnersInfo,
setShouldRefreshConsent,
@@ -44,7 +45,7 @@ const fluidStatus: FluidStatus[] = [
isUpdating: false,
konnectorConfig: {
name: 'Enedis',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.ELECTRICITY,
siteLink: 'https://mon-compte-particulier.enedis.fr/donnees/',
activation: 'https://mon-compte-particulier.enedis.fr/donnees/',
@@ -88,7 +89,7 @@ const fluidStatus: FluidStatus[] = [
isUpdating: false,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
@@ -113,6 +114,13 @@ describe('globalSlice', () => {
screenType: ScreenType.DESKTOP,
})
})
+ it('should handle setHeaderHeight', () => {
+ const state = globalSlice.reducer(mockGlobalState, setHeaderHeight(100))
+ expect(state).toEqual({
+ ...mockGlobalState,
+ headerHeight: 100,
+ })
+ })
it('should handle toggleChallengeExplorationNotification', () => {
const state = globalSlice.reducer(
mockGlobalState,
@@ -276,7 +284,7 @@ describe('globalSlice', () => {
firstDataDate: null,
lastDataDate: null,
maintenance: false,
- status: 0,
+ status: FluidState.KONNECTOR_NOT_FOUND,
connection: {
shouldLaunchKonnector: true,
isUpdating: true,
diff --git a/src/store/global/global.slice.ts b/src/store/global/global.slice.ts
index f251ba453ab9d70ae6008aa7156ba6695c49aa98..f93aada9ec5f5ef8d0d77b340694d312f902b06b 100644
--- a/src/store/global/global.slice.ts
+++ b/src/store/global/global.slice.ts
@@ -12,6 +12,7 @@ import {
} from 'models'
const initialState: GlobalState = {
+ headerHeight: 62,
screenType: ScreenType.MOBILE,
releaseNotes: {
show: false,
@@ -138,9 +139,9 @@ const getFluidTypesFromStatus = (fluidStatus: FluidStatus[]): FluidType[] => {
if (
(fluid.status !== FluidState.KONNECTOR_NOT_FOUND &&
fluid.status !== FluidState.NOT_CONNECTED &&
- fluid.status !== FluidState.ERROR_LOGIN_FAILED) ||
+ fluid.status !== FluidState.LOGIN_FAILED) ||
// Handle Login Error case for oauth konnectors
- (fluid.status === FluidState.ERROR_LOGIN_FAILED &&
+ (fluid.status === FluidState.LOGIN_FAILED &&
fluid.fluidType !== FluidType.WATER)
) {
fluidTypes.push(fluid.fluidType)
@@ -153,6 +154,9 @@ export const globalSlice = createSlice({
name: 'global',
initialState,
reducers: {
+ setHeaderHeight: (state, action: PayloadAction<number>) => {
+ state.headerHeight = action.payload
+ },
changeScreenType: (state, action: PayloadAction<ScreenType>) => {
state.screenType = action.payload
},
@@ -200,6 +204,7 @@ export const globalSlice = createSlice({
) => {
state.fluidStatus[fluidType].connection = fluidConnection
},
+ /** Restore last known credentials */
setLastEpglLogin: (state, action: PayloadAction<string>) => {
state.lastEpglLogin = action.payload
},
@@ -213,6 +218,7 @@ export const globalSlice = createSlice({
})
export const {
+ setHeaderHeight,
changeScreenType,
setFluidStatus,
setLastEpglLogin,
diff --git a/src/store/modal/modal.slice.spec.ts b/src/store/modal/modal.slice.spec.ts
index f9f98b9a361882b03d822a27eb47db29a16dab92..3ff8dd684ed589fb048e37ba1bbecc078be2f3e4 100644
--- a/src/store/modal/modal.slice.spec.ts
+++ b/src/store/modal/modal.slice.spec.ts
@@ -3,7 +3,6 @@ import { mockCustomPopup } from 'tests/__mocks__/customPopup.mock'
import { mockModalState } from 'tests/__mocks__/store'
import {
modalSlice,
- openConnectionModal,
openFeedbackModal,
openPartnersModal,
setCustomPopup,
@@ -78,16 +77,6 @@ describe('modal reducer', () => {
}
expect(state).toEqual(expectedResult)
})
- it('should handle openConnectionModal', () => {
- const state = modalSlice.reducer(
- mockModalState,
- openConnectionModal(true)
- )
- expect(state).toEqual({
- ...mockModalState,
- isConnectionModalOpen: true,
- })
- })
})
describe('customPopup', () => {
diff --git a/src/store/modal/modal.slice.ts b/src/store/modal/modal.slice.ts
index 7efe8c5a3c5d0e1e97b42f384428149ddf2664d2..e4e75f81a643b100073d0c312765a8542a48113d 100644
--- a/src/store/modal/modal.slice.ts
+++ b/src/store/modal/modal.slice.ts
@@ -9,7 +9,6 @@ const initialState: ModalState = {
description: '',
endDate: '',
},
- isConnectionModalOpen: false,
isFeedbacksOpen: false,
partnersIssueModal: {
enedis: false,
@@ -34,18 +33,12 @@ export const modalSlice = createSlice({
openPartnersModal: (state, action: OpenPartnersModalAction) => {
state.partnersIssueModal = action.payload
},
- openConnectionModal: (state, action: PayloadAction<boolean>) => {
- state.isConnectionModalOpen = action.payload
- },
+
setCustomPopup: (state, action: PayloadAction<CustomPopup>) => {
state.customPopupModal = action.payload
},
},
})
-export const {
- openFeedbackModal,
- openPartnersModal,
- setCustomPopup,
- openConnectionModal,
-} = modalSlice.actions
+export const { openFeedbackModal, openPartnersModal, setCustomPopup } =
+ modalSlice.actions
diff --git a/src/styles/base/_layout.scss b/src/styles/base/_layout.scss
index 688abe38d86d2d8e3e76df9400246a5ca30cd1bb..9ff9de10a8f6304dd59a7b9f5556118704e8c5e7 100644
--- a/src/styles/base/_layout.scss
+++ b/src/styles/base/_layout.scss
@@ -9,6 +9,7 @@ html {
body {
background: $dark-light-2;
overflow: unset !important;
+ color: $grey-bright;
}
.column {
diff --git a/src/styles/base/_typo-variables.scss b/src/styles/base/_typo-variables.scss
index 3e357c1bf88b39ad0cd8b334a1635c84dd5675fa..18bf2b8ee347f14e2d64b3c487376b0eca5779ca 100644
--- a/src/styles/base/_typo-variables.scss
+++ b/src/styles/base/_typo-variables.scss
@@ -1,5 +1,18 @@
$text-font: Lato, sans-serif;
-$text-size: '10' 0.625rem, '13' 0.8125rem, '14' 0.875rem, '15' 0.938rem,
- '16' 1rem, '18' 1.125rem, '19' 1.188rem, '20' 1.25rem, '21' 1.313rem,
- '22' 1.375rem, '24' 1.5rem, '26' 1.625rem, '28' 1.75rem, '36' 2.25rem;
+$text-size:
+ '10' 0.625rem,
+ '12' 0.75rem,
+ '13' 0.8125rem,
+ '14' 0.875rem,
+ '15' 0.938rem,
+ '16' 1rem,
+ '18' 1.125rem,
+ '19' 1.188rem,
+ '20' 1.25rem,
+ '21' 1.313rem,
+ '22' 1.375rem,
+ '24' 1.5rem,
+ '26' 1.625rem,
+ '28' 1.75rem,
+ '36' 2.25rem;
diff --git a/src/styles/components/_barchart.scss b/src/styles/components/_barchart.scss
index 209e00d3bfa361fa0a0decfb44d9acf7a072bcb3..16fdf31cd70c22b952979b857ebfb9a3cb0b342d 100644
--- a/src/styles/components/_barchart.scss
+++ b/src/styles/components/_barchart.scss
@@ -127,7 +127,7 @@
}
}
}
-.bar-UNCOMING {
+.bar-UPCOMING {
fill: $grey-dark;
opacity: 0.6;
&.selected {
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 0539cbb69643b6e28d1e5366ebd1b0f0aac7439f..b0eaaab45d4fe6daf09d9c927721c53c023d98da 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -85,3 +85,11 @@
height: 36px !important;
background-color: $dark-light-3 !important;
}
+
+// autofill fix
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+input:-webkit-autofill:active {
+ -webkit-box-shadow: 0 0 0 30px $dark-2 inset !important;
+}
diff --git a/src/targets/services/aggregatorUsageEvents.ts b/src/targets/services/aggregatorUsageEvents.ts
index f54542bdd4b6ab97fbc94bc198e6fcafc696c819..36beffe25a1f122a126fba16ff2bdab6f2dd8120 100644
--- a/src/targets/services/aggregatorUsageEvents.ts
+++ b/src/targets/services/aggregatorUsageEvents.ts
@@ -11,7 +11,7 @@ import {
} from 'enums'
import { uniq } from 'lodash'
import { DateTime } from 'luxon'
-import { FluidStatus, PerformanceIndicator, UsageEvent } from 'models'
+import { PerformanceIndicator, UsageEvent } from 'models'
import ConsumptionService from 'services/consumption.service'
import EnvironmentService from 'services/environment.service'
import FluidService from 'services/fluid.service'
@@ -19,7 +19,7 @@ import ProfileService from 'services/profile.service'
import ProfileTypeEntityService from 'services/profileTypeEntity.service'
import TermsService from 'services/terms.service'
import UsageEventService from 'services/usageEvent.service'
-import { getFluidType } from 'utils/utils'
+import { getFluidName } from 'utils/utils'
import { runService } from './service'
const logStack = logger.namespace('aggregatorUsageEvents')
@@ -121,8 +121,8 @@ const getConnectedKonnectorSlug = (
}
const calculateConnectedKonnectorPerDay = async (client: Client) => {
- const fluidService: FluidService = new FluidService(client)
- const fluidStatus: FluidStatus[] = await fluidService.getFluidStatus()
+ const fluidService = new FluidService(client)
+ const fluidStatus = await fluidService.getFluidStatus()
const connectedKonnectors = fluidStatus.filter(
fluid => fluid.status === FluidState.DONE
)
@@ -266,7 +266,7 @@ const calculateConsumptionVariation = async (client: Client) => {
FluidType.GAS,
FluidType.WATER,
])
- for (const fluidType in [
+ for (const fluidType of [
FluidType.ELECTRICITY,
FluidType.GAS,
FluidType.WATER,
@@ -287,14 +287,11 @@ const calculateConsumptionVariation = async (client: Client) => {
? consumptionData[fluidType].percentageVariation
: 0, // in percent
// eslint-disable-next-line camelcase
- group1: { fluid_type: FluidType[fluidType].toLowerCase() },
+ group1: { fluid_type: getFluidName(fluidType) },
group2: { seniority: Math.round(seniority).toString() },
group3: {
// eslint-disable-next-line camelcase
- fluid_usage: await buildProfileWithFluidType(
- client,
- getFluidType(FluidType[fluidType])
- ),
+ fluid_usage: await buildProfileWithFluidType(client, fluidType),
},
}
diff --git a/src/utils/date.spec.ts b/src/utils/date.spec.ts
index a1028add5844625ad644a9bd30cdacc365924758..1211870ea45c7af7833c5de84cffd1c79f7aac43 100644
--- a/src/utils/date.spec.ts
+++ b/src/utils/date.spec.ts
@@ -1,4 +1,4 @@
-import { FluidType, TimeStep } from 'enums'
+import { FluidType, Season, TimeStep } from 'enums'
import { DateTime } from 'luxon'
import { Dataload } from 'models'
import { graphData } from 'tests/__mocks__/chartData.mock'
@@ -7,6 +7,7 @@ import {
convertDateToMonthYearString,
convertDateToShortDateString,
getActualAnalysisDate,
+ getCurrentSeason,
getLagDays,
isLastDateReached,
isLastPeriodReached,
@@ -436,4 +437,50 @@ describe('date utils', () => {
expect(result).toEqual(mockDate)
})
})
+
+ describe('getCurrentSeason test', () => {
+ beforeEach(() => {
+ jest.clearAllMocks()
+ })
+ it('should return Season.SUMMER if the current month is between summer dates', () => {
+ const now = DateTime.local().setZone('utc', {
+ keepLocalTime: true,
+ })
+ jest
+ .spyOn(DateTime, 'local')
+ .mockReturnValue(now.set({ month: 9, day: 21 }))
+ const currentSeason = getCurrentSeason()
+ expect(currentSeason).toEqual(Season.SUMMER)
+ })
+ it('should return Season.WINTER if the current month is between winter dates', () => {
+ const now = DateTime.local().setZone('utc', {
+ keepLocalTime: true,
+ })
+ jest
+ .spyOn(DateTime, 'local')
+ .mockReturnValue(now.set({ month: 3, day: 31 }))
+ const currentSeason = getCurrentSeason()
+ expect(currentSeason).toEqual(Season.WINTER)
+ })
+ it('should return null if the current month is between summer and winter dates', () => {
+ const now = DateTime.local().setZone('utc', {
+ keepLocalTime: true,
+ })
+ jest
+ .spyOn(DateTime, 'local')
+ .mockReturnValue(now.set({ month: 10, day: 2, year: 2024 }))
+ const currentSeason = getCurrentSeason()
+ expect(currentSeason).toBeNull()
+ })
+ it('should return null if the current month is between winter and summer dates', () => {
+ const now = DateTime.local().setZone('utc', {
+ keepLocalTime: true,
+ })
+ jest
+ .spyOn(DateTime, 'local')
+ .mockReturnValue(now.set({ month: 4, day: 20 }))
+ const currentSeason = getCurrentSeason()
+ expect(currentSeason).toBeNull()
+ })
+ })
})
diff --git a/src/utils/date.ts b/src/utils/date.ts
index e474fdd4923b6b7b8393ae80baac318783b7c447..434975bc19903b67813df3b1867bcd20dcfc8940 100644
--- a/src/utils/date.ts
+++ b/src/utils/date.ts
@@ -1,8 +1,20 @@
-import { FluidType, TimeStep } from 'enums'
+import { FluidType, Season, TimeStep } from 'enums'
import { DateTime } from 'luxon'
import { Dataload } from 'models'
import { getMonthNameWithPrep } from './utils'
+/** Between 21st of June and 20th of September */
+export const SUMMER_WEEK_DATES = {
+ start: 25,
+ end: 38,
+} as const
+
+/** Between 31st of October and 30th of March */
+const WINTER_WEEK_DATES = {
+ start: 44,
+ end: 13,
+} as const
+
export function compareDates(dateA: DateTime, dateB: DateTime) {
return dateA < dateB ? -1 : 1
}
@@ -144,3 +156,36 @@ export const getActualAnalysisDate = (): DateTime => {
return now.set({ day: 3, month: now.month })
}
}
+
+/**
+ * Determines the current season based on the month of the year.
+ * @returns
+ * - Returns Season.SUMMER if the current month is between summer dates,
+ * - Returns Season.WINTER if the current month is between winter dates,
+ * - Otherwise returns null.
+ */
+export function getCurrentSeason() {
+ const weekNumber = DateTime.local().weekNumber
+ if (
+ weekNumber >= SUMMER_WEEK_DATES.start &&
+ weekNumber <= SUMMER_WEEK_DATES.end
+ ) {
+ return Season.SUMMER
+ } else if (
+ weekNumber >= WINTER_WEEK_DATES.start ||
+ weekNumber <= WINTER_WEEK_DATES.end
+ ) {
+ return Season.WINTER
+ }
+ return null
+}
+
+export function getOppositeSeason(currentSeason: Season): Season {
+ if (currentSeason === Season.WINTER) {
+ return Season.SUMMER
+ } else if (currentSeason === Season.SUMMER) {
+ return Season.WINTER
+ } else {
+ throw new Error('Invalid current season.')
+ }
+}
diff --git a/src/utils/hash.spec.ts b/src/utils/hash.spec.ts
index 0edc793c186e28d821bc301fadb7ddb7a2f5dd34..cd4a4d02c8a416016bceb54d98f71f1df89334f7 100644
--- a/src/utils/hash.spec.ts
+++ b/src/utils/hash.spec.ts
@@ -5,7 +5,7 @@ describe('hash utils test', () => {
describe('hashFile test', () => {
it('should return the correct hash of the file', () => {
const result = hashFile(mockedEcogesturesData)
- expect(result).toBe('21c72fc0b67b0393ee457a25956703ef17b5b724')
+ expect(result).toBe('bc5a72e07c44368c1841021ef0d42d9ed61de250')
})
})
})
diff --git a/src/utils/utils.spec.ts b/src/utils/utils.spec.ts
index 3fd5c09ab54600a8af02d745bd5cde7390449d59..e36db9b7ba1b1f7afa0529b9a1bca3f8fb6e3a65 100644
--- a/src/utils/utils.spec.ts
+++ b/src/utils/utils.spec.ts
@@ -14,12 +14,13 @@ import {
formatTwoDigits,
getChallengeTitleWithLineReturn,
getFluidName,
- getFluidType,
+ getFluidTypeTranslation,
getKonnectorSlug,
getKonnectorUpdateError,
getMonthFullName,
getMonthName,
getMonthNameWithPrep,
+ getPartnerKey,
getSeason,
isKonnectorActive,
isValidOffPeakHours,
@@ -29,22 +30,6 @@ import {
} from './utils'
describe('utils test', () => {
- describe('getFluidType test', () => {
- it('should the electricity fluid type', () => {
- const result = getFluidType('eLectRicity')
- expect(result).toBe(FluidType.ELECTRICITY)
- })
-
- it('should the water fluid type', () => {
- const result = getFluidType('WatER')
- expect(result).toBe(FluidType.WATER)
- })
-
- it('should the gas fluid type', () => {
- const result = getFluidType('gas')
- expect(result).toBe(FluidType.GAS)
- })
- })
describe('getKonnectorSlug', () => {
it('should return correct slug for elec', () => {
const slug = getKonnectorSlug(FluidType.ELECTRICITY)
@@ -58,6 +43,11 @@ describe('utils test', () => {
const slug = getKonnectorSlug(FluidType.GAS)
expect(slug).toBe(FluidSlugType.GAS)
})
+ it('should throw error for invalid fluid type', () => {
+ expect(() => getKonnectorSlug(99 as FluidType.GAS)).toThrow(
+ 'unknown fluidtype'
+ )
+ })
})
describe('getKonnectorUpdateError', () => {
it('should return KonnectorUpdate.ERROR_UPDATE_OAUTH for USER_ACTION_NEEDED.OAUTH_OUTDATED', () => {
@@ -70,9 +60,9 @@ describe('utils test', () => {
const result = getKonnectorUpdateError('LOGIN_FAILED')
expect(result).toBe(KonnectorUpdate.LOGIN_FAILED)
})
- it('should return KonnectorUpdate.ERROR_CONSENT_FORM_GAS for CHALLENGE_ASKED', () => {
+ it('should return KonnectorUpdate.ERROR_UPDATE for CHALLENGE_ASKED', () => {
const result = getKonnectorUpdateError('CHALLENGE_ASKED')
- expect(result).toBe(KonnectorUpdate.ERROR_CONSENT_FORM_GAS)
+ expect(result).toBe(KonnectorUpdate.ERROR_UPDATE)
})
it('should return KonnectorUpdate.ERROR_UPDATE for an unknown type', () => {
const result = getKonnectorUpdateError('UNKNOWN_TYPE')
@@ -125,7 +115,7 @@ describe('utils test', () => {
fluidType: FluidType.ELECTRICITY,
},
{ status: FluidState.ERROR, fluidType: FluidType.WATER },
- { status: FluidState.ERROR_LOGIN_FAILED, fluidType: FluidType.GAS },
+ { status: FluidState.LOGIN_FAILED, fluidType: FluidType.GAS },
] as FluidStatus[]
expect(isKonnectorActive(fluidStatus, FluidType.ELECTRICITY)).toBe(true)
expect(isKonnectorActive(fluidStatus, FluidType.GAS)).toBe(true)
@@ -235,6 +225,42 @@ describe('utils test', () => {
})
})
+ describe('getFluidTypeTranslation', () => {
+ it('should return electricity', () => {
+ expect(getFluidTypeTranslation(FluidType.ELECTRICITY)).toBe(
+ "d'électricité"
+ )
+ })
+ it('should return water', () => {
+ expect(getFluidTypeTranslation(FluidType.WATER)).toBe("d'eau")
+ })
+ it('should return gas', () => {
+ expect(getFluidTypeTranslation(FluidType.GAS)).toBe('de gaz')
+ })
+ it('should throw error for invalid fluid type', () => {
+ expect(() => getFluidTypeTranslation(99 as FluidType.GAS)).toThrow(
+ 'unexpected fluidtype'
+ )
+ })
+ })
+
+ describe('getPartnerKey', () => {
+ it('should return enedis', () => {
+ expect(getPartnerKey(FluidType.ELECTRICITY)).toBe('enedis')
+ })
+ it('should return egl', () => {
+ expect(getPartnerKey(FluidType.WATER)).toBe('egl')
+ })
+ it('should return grdf', () => {
+ expect(getPartnerKey(FluidType.GAS)).toBe('grdf')
+ })
+ it('should throw error for invalid fluid type', () => {
+ expect(() => getPartnerKey(99 as FluidType.GAS)).toThrow(
+ 'unknown fluidtype'
+ )
+ })
+ })
+
describe('formatListWithAnd', () => {
it('should return empty string', () => {
expect(formatListWithAnd([])).toBe('')
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index 834c7463d74b9489b3aa142199de9e224d1d05d7..fc5bf7edee928e76d7a0bfbb1fb64decbdda30a3 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -8,25 +8,15 @@ import {
} from 'enums'
import get from 'lodash/get'
import { DateTime, Interval } from 'luxon'
-import { FluidStatus, GetRelationshipsReturn, Relation } from 'models'
+import { FluidStatus, Relation } from 'models'
import challengeData from '../db/challengeEntity.json'
/** Array of elec, water & gas */
export const allFluids = [FluidType.ELECTRICITY, FluidType.WATER, FluidType.GAS]
-export function getFluidType(type: string) {
- switch (type.toUpperCase()) {
- case 'ELECTRICITY':
- return FluidType.ELECTRICITY
- case 'WATER':
- return FluidType.WATER
- case 'GAS':
- return FluidType.GAS
- default:
- return FluidType.ELECTRICITY
- }
-}
-export function getKonnectorSlug(fluidType: FluidType) {
+export function getKonnectorSlug(
+ fluidType: Exclude<FluidType, FluidType.MULTIFLUID>
+) {
switch (fluidType) {
case FluidType.ELECTRICITY:
return FluidSlugType.ELECTRICITY
@@ -46,14 +36,41 @@ export function getFluidName(fluidType: FluidType) {
return FluidType[fluidType].toLowerCase()
}
+export const getFluidTypeTranslation = (
+ fluidType: Exclude<FluidType, FluidType.MULTIFLUID>
+) => {
+ switch (fluidType) {
+ case FluidType.GAS:
+ return 'de gaz'
+ case FluidType.ELECTRICITY:
+ return "d'électricité"
+ case FluidType.WATER:
+ return "d'eau"
+ default:
+ throw new Error('unexpected fluidtype')
+ }
+}
+
+export const getPartnerKey = (fluidType: FluidType) => {
+ switch (fluidType) {
+ case FluidType.ELECTRICITY:
+ return 'enedis'
+ case FluidType.WATER:
+ return 'egl'
+ case FluidType.GAS:
+ return 'grdf'
+ default:
+ throw new Error('unknown fluidtype')
+ }
+}
+
export function getKonnectorUpdateError(type: string) {
switch (type.toUpperCase()) {
case 'USER_ACTION_NEEDED.OAUTH_OUTDATED':
+ case 'USER_ACTION_NEEDED.SCA_REQUIRED':
return KonnectorUpdate.ERROR_UPDATE_OAUTH
case 'LOGIN_FAILED':
return KonnectorUpdate.LOGIN_FAILED
- case 'CHALLENGE_ASKED':
- return KonnectorUpdate.ERROR_CONSENT_FORM_GAS
default:
return KonnectorUpdate.ERROR_UPDATE
}
@@ -121,20 +138,6 @@ export function getRelationshipHasMany<D>(doc: D, relName: string): Relation[] {
return get(doc, `relationships.${relName}.data`, [])
}
-/**
- * Get many relations in doc
- * @param {object} doc - DocumentEntity
- * @param relNameList - Array of name of the relations
- */
-export function getRelationships<D>(
- doc: D,
- relNameList: Array<string>
-): GetRelationshipsReturn {
- return relNameList.map(relName => ({
- [relName]: get(doc, `relationships.${relName}.data`, []),
- }))[0]
-}
-
/**
* Import a svg file with format : id.svg
*/
diff --git a/tests/__mocks__/accountsData.mock.ts b/tests/__mocks__/accountsData.mock.ts
index 7775e8b618daa1705c820cedd3c6ce13ca193a9b..911835bf0dfad32f72a0b5622aea9dce6a99ec6c 100644
--- a/tests/__mocks__/accountsData.mock.ts
+++ b/tests/__mocks__/accountsData.mock.ts
@@ -7,23 +7,24 @@ export const accountsData: Account[] = [
_rev: '1-88e68b8450cee09fe2f077610901094d',
account_type: 'enedissgegrandlyon',
name: '',
- oauth: {
- access_token: 'MY_ACCESS_TOKEN',
- expires_at: '2020-10-09T08:00:00.285910671+02:00',
- refresh_token: '',
- token_type: 'Bearer',
- },
- oauth_callback_results: {
- issued_at: '1592232569642',
- refresh_token_issued_at: '1592232569642',
- scope: '/my_enedis_scope',
- usage_points_id: '',
- },
cozyMetadata: {
createdAt: '2020-11-10T16:42:11.132Z',
metadataVersion: 1,
updatedAt: '2020-11-10T16:42:11.132Z',
},
+ auth: {
+ address: '6 Rue Vaillant Couturier',
+ city: 'Vénissieux',
+ firstname: 'Jane',
+ lastname: 'Doe',
+ pointId: '19170766804121',
+ postalCode: '69200',
+ },
+ data: {
+ consentId: 43,
+ expirationDate: '2023-09-26',
+ offPeakHours: '22H00-6H00',
+ },
},
{
_id: '90e68b8450cee09fe2f077610901094d',
@@ -51,16 +52,13 @@ export const accountsData: Account[] = [
_rev: '1-89e68b8450cee09fe2f077610901094d',
account_type: 'grdfgrandlyon',
name: '',
- oauth: {
- access_token: 'MY_ACCESS_TOKEN',
- expires_at: '2020-10-09T08:00:00.285910671+02:00',
- refresh_token: '',
- token_type: 'Bearer',
- },
- oauth_callback_results: {
- id_token: 'MY_ID_TOKEN',
- pce: '12345678987654',
- scope: '/my_grdf_scope',
+ identifier: 'email',
+ auth: {
+ email: 'jane@grandlyon.com',
+ firstname: 'Jane',
+ lastname: 'Doe',
+ pce: '12345678901234',
+ postalCode: '69003',
},
cozyMetadata: {
createdAt: '2020-11-10T16:42:11.132Z',
diff --git a/tests/__mocks__/actionData.mock.ts b/tests/__mocks__/actionData.mock.ts
index c2a5d716ce300507c3dab2b34a7d7e8deafe53f3..b48522f5b32977717ba9ac17ccafa518ffa637d0 100644
--- a/tests/__mocks__/actionData.mock.ts
+++ b/tests/__mocks__/actionData.mock.ts
@@ -1,4 +1,4 @@
-import { EquipmentType, Season } from 'enums'
+import { EquipmentType, Room, Season } from 'enums'
import { Ecogesture } from 'models'
export const defaultEcogestureData: Ecogesture[] = [
@@ -14,7 +14,7 @@ export const defaultEcogestureData: Ecogesture[] = [
impactLevel: 3,
efficiency: 1.5,
difficulty: 1,
- room: [1, 2],
+ room: [Room.BATHROOM, Room.KITCHEN],
season: Season.NONE,
equipment: false,
equipmentType: [],
@@ -40,7 +40,7 @@ export const defaultEcogestureData: Ecogesture[] = [
impactLevel: 2,
efficiency: 1,
difficulty: 1,
- room: [2],
+ room: [Room.KITCHEN],
season: Season.NONE,
equipment: false,
@@ -68,7 +68,7 @@ export const defaultEcogestureData: Ecogesture[] = [
impactLevel: 1,
efficiency: 0.5,
difficulty: 1,
- room: [2],
+ room: [Room.KITCHEN],
season: Season.NONE,
equipment: false,
equipmentType: [],
@@ -96,7 +96,7 @@ export const ecogestureDefault: Ecogesture = {
impactLevel: 3,
efficiency: 1.5,
difficulty: 1,
- room: [1, 2],
+ room: [Room.BATHROOM, Room.KITCHEN],
season: Season.NONE,
equipment: false,
equipmentType: [],
@@ -124,7 +124,7 @@ export const AllEcogestureData: Ecogesture[] = [
impactLevel: 8,
efficiency: 5,
difficulty: 1,
- room: [0],
+ room: [Room.ALL],
season: Season.WINTER,
equipment: false,
equipmentType: [],
@@ -149,7 +149,7 @@ export const AllEcogestureData: Ecogesture[] = [
impactLevel: 8,
efficiency: 1,
difficulty: 1,
- room: [0],
+ room: [Room.ALL],
season: Season.SUMMER,
equipment: true,
equipmentType: [EquipmentType.AIR_CONDITIONING],
@@ -175,7 +175,7 @@ export const AllEcogestureData: Ecogesture[] = [
impactLevel: 8,
efficiency: 5,
difficulty: 2,
- room: [0],
+ room: [Room.ALL],
season: Season.WINTER,
equipment: false,
equipmentType: [],
@@ -201,7 +201,7 @@ export const AllEcogestureData: Ecogesture[] = [
impactLevel: 5,
efficiency: 2.5,
difficulty: 1,
- room: [1],
+ room: [Room.BATHROOM],
season: Season.NONE,
equipment: false,
equipmentType: [],
@@ -226,7 +226,7 @@ export const AllEcogestureData: Ecogesture[] = [
impactLevel: 5,
efficiency: 2.5,
difficulty: 1,
- room: [1],
+ room: [Room.BATHROOM],
season: Season.NONE,
equipment: false,
equipmentType: [],
@@ -251,7 +251,7 @@ export const AllEcogestureData: Ecogesture[] = [
impactLevel: 3,
efficiency: 1.5,
difficulty: 1,
- room: [0],
+ room: [Room.ALL],
season: Season.WINTER,
equipment: false,
equipmentType: [],
diff --git a/tests/__mocks__/ecogesturesData.mock.ts b/tests/__mocks__/ecogesturesData.mock.ts
index c7a61cc907cfa7af7a4a2301c09c276d97aff0fe..c72c461c3c39c50fb934b4b4aabe63c86c23b0a1 100644
--- a/tests/__mocks__/ecogesturesData.mock.ts
+++ b/tests/__mocks__/ecogesturesData.mock.ts
@@ -53,7 +53,6 @@ export const mockedEcogesturesData: Ecogesture[] = [
doing: false,
objective: false,
viewedInSelection: false,
-
_id: 'ECOGESTURE002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -65,7 +64,7 @@ export const mockedEcogesturesData: Ecogesture[] = [
"Utilisez la température la plus basse possible : de nombreux produits nettoyants sont efficaces à froid et un cycle à 90 °C consomme 3 fois plus d'énergie qu'un lavage à 40 °C. En effet, 80 % de l'énergie consommée par un lave-linge ou un lave-vaisselle sert au chauffage de l'eau ! Que ce soit pour la vaisselle ou le linge, les programmes de lavage intensif consomment jusqu'à 40 % de plus. Si possible, rincez à l'eau froide : la température de rinçage n'a pas d'effet sur le nettoyage du linge ou de la vaisselle. Attention cependant avec les tissus qui peuvent rétrécir : ce qui fait rétrécir, c'est le passage d'une température à une autre. Mieux vaut alors faire le cycle complet à l'eau froide pour les premiers lavages de tissus sensibles. Pour du linge ou de la vaisselle peu sales, utilisez la touche \"Eco\". Elle réduit la température de lavage et allonge sa durée (c’est le chauffage de l’eau qui consomme le plus). Vous économiserez jusqu’à 45 % par rapport aux cycles longs. Néanmoins, pour vous prémunir contre les bouchons de graisse dans les canalisations, faites quand même un cycle à chaud une fois par mois environ.",
longName:
'J’utilise le plus souvent les cycles courts à basse température pour laver le linge et la vaisselle.',
- shortName: 'Accelerateur de particules',
+ shortName: 'Accélérateur de particules',
usage: Usage.ELECTRICITY_SPECIFIC,
impactLevel: 2,
efficiency: 1,
@@ -89,6 +88,98 @@ export const mockedEcogesturesData: Ecogesture[] = [
},
]
+export const mockDoingEcogestures: Ecogesture[] = [
+ { ...mockedEcogesturesData[0], doing: true, viewedInSelection: true },
+ { ...mockedEcogesturesData[1], doing: false, viewedInSelection: true },
+ { ...mockedEcogesturesData[2], doing: true, viewedInSelection: true },
+]
+
+export const mockedEcogesturesSortedData: Ecogesture[] = [
+ {
+ fluidTypes: [FluidType.ELECTRICITY],
+ id: 'ECOGESTURE0002',
+ longDescription:
+ "Cela permet de garder la fraîcheur à l'intérieur. Le climatiseur n'est pas là pour refroidir la rue mais bien la pièce.",
+ longName: 'Je ferme mes fenêtres quand la climatisation est en marche',
+ shortName: 'Portique thermique',
+ usage: Usage.AIR_CONDITIONING,
+ impactLevel: 8,
+ efficiency: 4,
+ difficulty: 1,
+ room: [Room.ALL],
+ season: Season.SUMMER,
+ equipment: true,
+ equipmentType: [EquipmentType.AIR_CONDITIONING],
+ equipmentInstallation: true,
+ investment: null,
+ action: false,
+ actionName: null,
+ actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
+ _id: 'ECOGESTURE0002',
+ _rev: '19-9b604bcf7e55f8650e2be4f676fddaf0',
+ _type: 'com.grandlyon.ecolyo.ecogesture',
+ },
+ {
+ fluidTypes: [FluidType.ELECTRICITY],
+ id: 'ECOGESTURE0035',
+ longDescription:
+ 'Réglez votre climatisation au plus bas à 26 °C et veillez à ce qu’il n’y ait jamais plus de 5 à 7 °C de différence entre l’intérieur et l’extérieur. Attention aux grands écarts de température qui peuvent provoquer des chocs thermiques.',
+ longName:
+ 'Je règle ma climatisation au plus bas à 26°C en veillant à ce qu’il n’y ait pas jamais plus de 5°C à 7°C de différence entre l’intérieur et l’extérieur.',
+ shortName: "La Juste Clim'",
+ usage: Usage.AIR_CONDITIONING,
+ impactLevel: 8,
+ efficiency: 4,
+ difficulty: 2,
+ room: [Room.ALL],
+ season: Season.SUMMER,
+ equipment: true,
+ equipmentType: [EquipmentType.AIR_CONDITIONING],
+ equipmentInstallation: true,
+ investment: null,
+ action: false,
+ actionName: null,
+ actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
+ _id: 'ECOGESTURE0035',
+ _rev: '17-666648f24f6c797443470a54785322c5',
+ _type: 'com.grandlyon.ecolyo.ecogesture',
+ },
+ {
+ fluidTypes: [FluidType.ELECTRICITY],
+ id: 'ECOGESTURE0034',
+ longDescription:
+ "Cela permet d'évite des consommations inutiles. Le froid ne restera pas dans la pièce. Donc il est préférable d'allumer le ventilateur ou climatiseur seulement quand des personnes sont présentes dans la pièce.",
+ longName:
+ 'Je ne fais pas fonctionner mon ventilateur ou la climatisation dans les pièces non occupées',
+ shortName: 'Bulles-Ã -part',
+ usage: Usage.AIR_CONDITIONING,
+ impactLevel: 8,
+ efficiency: 4,
+ difficulty: 2,
+ room: [Room.ALL],
+ season: Season.SUMMER,
+ equipment: true,
+ equipmentType: [EquipmentType.AIR_CONDITIONING, EquipmentType.FAN],
+ equipmentInstallation: true,
+ investment: null,
+ action: false,
+ actionName: null,
+ actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
+ _id: 'ECOGESTURE0034',
+ _rev: '25-75810c7b375dcf2742f0b225fda7c6d6',
+ _type: 'com.grandlyon.ecolyo.ecogesture',
+ },
+]
+
export const ecogesturesHeatingData: Ecogesture[] = [
{
fluidTypes: [FluidType.ELECTRICITY],
diff --git a/tests/__mocks__/enedisMonthlyAnalysisData.mock.ts b/tests/__mocks__/enedisMonthlyAnalysisData.mock.ts
index bba9d3cc07c5222e83525b1e029b4752ec3acf3c..e980d11b4023dd69cd3f5a3ef53d46c32c995458 100644
--- a/tests/__mocks__/enedisMonthlyAnalysisData.mock.ts
+++ b/tests/__mocks__/enedisMonthlyAnalysisData.mock.ts
@@ -13,6 +13,7 @@ export const mockEnedisMonthlyAnalysis: EnedisMonthlyAnalysisData = {
year: 2021,
minimumLoad: 3,
maxPower: 2,
+ offPeakHoursRatio: null,
}
export const mockEnedisMonthlyAnalysisArray: EnedisMonthlyAnalysisData[] = [
@@ -23,6 +24,7 @@ export const mockEnedisMonthlyAnalysisArray: EnedisMonthlyAnalysisData[] = [
year: 2021,
minimumLoad: 3,
maxPower: 2,
+ offPeakHoursRatio: null,
},
{
weekDaysHalfHourAverageValues: [0.35, 0.34, 0.33, 0.32, 0.31, 0.3],
@@ -31,6 +33,7 @@ export const mockEnedisMonthlyAnalysisArray: EnedisMonthlyAnalysisData[] = [
year: 2021,
minimumLoad: 3,
maxPower: 2,
+ offPeakHoursRatio: null,
},
{
weekDaysHalfHourAverageValues: [0.35, 0.34, 0.33, 0.32, 0.31, 0.3],
@@ -39,6 +42,7 @@ export const mockEnedisMonthlyAnalysisArray: EnedisMonthlyAnalysisData[] = [
year: 2021,
minimumLoad: 3,
maxPower: 2,
+ offPeakHoursRatio: null,
},
{
weekDaysHalfHourAverageValues: [0.35, 0.34, 0.33, 0.32, 0.31, 0.3],
@@ -47,6 +51,7 @@ export const mockEnedisMonthlyAnalysisArray: EnedisMonthlyAnalysisData[] = [
year: 2021,
minimumLoad: 3,
maxPower: 2,
+ offPeakHoursRatio: null,
},
]
diff --git a/tests/__mocks__/fluidPrice.mock.ts b/tests/__mocks__/fluidPrice.mock.ts
index 63f6b6f5685891810c323a7a27d012aef1357956..b93fac787143fc494cb5e6f1b53dcf392aee787b 100644
--- a/tests/__mocks__/fluidPrice.mock.ts
+++ b/tests/__mocks__/fluidPrice.mock.ts
@@ -7,6 +7,7 @@ export const fluidPrices: FluidPrice[] = [
fluidType: 0,
price: 0.1429,
startDate: '2020-08-01T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -14,6 +15,7 @@ export const fluidPrices: FluidPrice[] = [
fluidType: 0,
price: 0.1529,
startDate: '2021-01-01T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -21,6 +23,7 @@ export const fluidPrices: FluidPrice[] = [
fluidType: 0,
price: 0.1329,
startDate: '2021-10-10T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -28,6 +31,7 @@ export const fluidPrices: FluidPrice[] = [
fluidType: 1,
price: 0.0039,
startDate: '2013-08-01T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -35,6 +39,7 @@ export const fluidPrices: FluidPrice[] = [
fluidType: 2,
price: 1.029,
startDate: '2013-08-01T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -42,6 +47,7 @@ export const fluidPrices: FluidPrice[] = [
fluidType: 2,
price: 1.029,
startDate: '2014-11-01T00:00:00.000Z',
+ UpdatedAt: '',
},
]
@@ -52,6 +58,7 @@ export const allLastFluidPrices: FluidPrice[] = [
fluidType: 0,
price: 0.1329,
startDate: '2021-10-10T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -59,6 +66,7 @@ export const allLastFluidPrices: FluidPrice[] = [
fluidType: 1,
price: 0.0039,
startDate: '2013-08-01T00:00:00.000Z',
+ UpdatedAt: '',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
@@ -66,5 +74,6 @@ export const allLastFluidPrices: FluidPrice[] = [
fluidType: 2,
price: 1.029,
startDate: '2014-11-01T00:00:00.000Z',
+ UpdatedAt: '',
},
]
diff --git a/tests/__mocks__/fluidStatusData.mock.ts b/tests/__mocks__/fluidStatusData.mock.ts
index b9e9880732e2e22c19f93b99906c0326ab0a6394..e7762e79fc050a29ec3e69d2f8123e984b84d1f6 100644
--- a/tests/__mocks__/fluidStatusData.mock.ts
+++ b/tests/__mocks__/fluidStatusData.mock.ts
@@ -167,7 +167,7 @@ export const fluidStatusConnectedData: FluidStatus[] = [
triggerState: null,
konnectorConfig: {
name: '',
- oauth: true,
+ oauth: false,
slug: FluidSlugType.GAS,
siteLink: '',
activation: '',
@@ -194,18 +194,6 @@ export const SgeStatusWithAccount: FluidStatus = {
_rev: '1-88e68b8450cee09fe2f077610901094d',
account_type: 'enedissgegrandlyon',
name: '',
- oauth: {
- access_token: 'MY_ACCESS_TOKEN',
- expires_at: '2020-10-09T08:00:00.285910671+02:00',
- refresh_token: '',
- token_type: 'Bearer',
- },
- oauth_callback_results: {
- issued_at: '1592232569642',
- refresh_token_issued_at: '1592232569642',
- scope: '/my_enedis_scope',
- usage_points_id: '',
- },
cozyMetadata: {
createdAt: '2020-11-10T16:42:11.132Z',
metadataVersion: 1,
@@ -227,7 +215,7 @@ export const SgeStatusWithAccount: FluidStatus = {
export const mockExpiredElec: FluidStatus = {
fluidType: FluidType.ELECTRICITY,
status: FluidState.KONNECTOR_NOT_FOUND,
- maintenance: true,
+ maintenance: false,
firstDataDate: null,
lastDataDate: null,
connection: {
@@ -264,7 +252,7 @@ export const mockExpiredElec: FluidStatus = {
export const mockExpiredGas: FluidStatus = {
fluidType: FluidType.GAS,
- status: FluidState.ERROR_LOGIN_FAILED,
+ status: FluidState.LOGIN_FAILED,
maintenance: false,
firstDataDate: null,
lastDataDate: null,
diff --git a/tests/__mocks__/mockConfig.mock.ts b/tests/__mocks__/mockConfig.mock.ts
index 65d5dfe2a1e22424bcb1d552a6be64a2622fbedc..e4b7ccdf785f0918e59830f4aeeaf49b8c1d058b 100644
--- a/tests/__mocks__/mockConfig.mock.ts
+++ b/tests/__mocks__/mockConfig.mock.ts
@@ -4,12 +4,11 @@ const mockConfig = {
fluidTypeId: 0,
name: 'enedis',
coefficient: 0.174,
-
startDate: '2021-08-01T00:00:00.000',
dataDelayOffset: 3,
konnectorConfig: {
name: 'Enedis',
- oauth: true,
+ oauth: false,
slug: 'enedissgegrandlyon',
siteLink: 'https://mon-compte-client.enedis.fr/',
activation: 'https://mon-compte-particulier.enedis.fr/donnees/',
@@ -37,7 +36,7 @@ const mockConfig = {
dataDelayOffset: 5,
konnectorConfig: {
name: 'GRDF',
- oauth: true,
+ oauth: false,
slug: 'grdfgrandlyon',
siteLink: 'https://monespace.grdf.fr/creation-particulier',
activation: '',
diff --git a/tests/__mocks__/profileData.mock.ts b/tests/__mocks__/profileData.mock.ts
deleted file mode 100644
index 82a92073ab89b9f5aed02680d149d039b8d5bdb3..0000000000000000000000000000000000000000
--- a/tests/__mocks__/profileData.mock.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import { DateTime } from 'luxon'
-import { Profile } from 'models'
-
-// TODO to remove ?
-export const profileData: Profile = {
- _id: '4d9403218ef13e65b2e3a8ad1700bc41',
- _rev: '16-57473da4fc26315247c217083175dfa0',
- id: '4d9403218ef13e65b2e3a8ad1700bc41',
- ecogestureHash: '9798a0aaccb47cff906fc4931a2eff5f9371dd8b',
- challengeHash: '1136feb6185c7643e071d14180c0e95782aa4ba3',
- duelHash: '1136feb6185c7643e071d14180c0e95782aa4ba3',
- quizHash: '1136feb6185c7643e071d14180c0e95782aa4ba3',
- explorationHash: '1136feb6185c7643e071d14180c0e95782aa4ba3',
- isFirstConnection: true,
- sendConsumptionAlert: false,
- waterDailyConsumptionLimit: 0,
- mailToken: '',
- lastConnectionDate: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- haveSeenLastAnalysis: true,
- monthlyAnalysisDate: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- sendAnalysisNotification: false,
- isProfileTypeCompleted: false,
- onboarding: {
- isWelcomeSeen: false,
- },
- haveSeenEcogestureModal: false,
- isProfileEcogestureCompleted: false,
- activateHalfHourDate: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- customPopupDate: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- partnersIssueSeenDate: {
- enedis: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- egl: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- grdf: DateTime.fromISO('2020-11-03T00:00:00.000Z', {
- zone: 'utc',
- }),
- },
-}
diff --git a/tests/__mocks__/store/chart.state.mock.ts b/tests/__mocks__/store/chart.state.mock.ts
index df355ad572383eb3e1d9e627a43808852e5fe909..76b75c5991de8c41b1cd7d7fe1070b8260f617aa 100644
--- a/tests/__mocks__/store/chart.state.mock.ts
+++ b/tests/__mocks__/store/chart.state.mock.ts
@@ -10,7 +10,7 @@ export const mockChartState: ChartState = {
currentIndex: 0,
currentDatachart: { actualData: [], comparisonData: null },
currentDatachartIndex: 0,
- loading: true,
showCompare: false,
showOfflineData: false,
+ showConnectionDetails: false,
}
diff --git a/tests/__mocks__/store/global.state.mock.ts b/tests/__mocks__/store/global.state.mock.ts
index ddc0d309f58fab3acdb351c8541b654f6df8e8a6..3c19efac32e4edefa90cb524f770d0c4d5b496f8 100644
--- a/tests/__mocks__/store/global.state.mock.ts
+++ b/tests/__mocks__/store/global.state.mock.ts
@@ -3,6 +3,7 @@ import { FluidSlugType, FluidState, FluidType, ScreenType, Usage } from 'enums'
import { GlobalState } from 'models'
export const mockGlobalState: GlobalState = {
+ headerHeight: 62,
screenType: ScreenType.MOBILE,
challengeExplorationNotification: false,
challengeActionNotification: false,
diff --git a/tests/__mocks__/store/modal.state.mock.ts b/tests/__mocks__/store/modal.state.mock.ts
index db9bdb4a10e2193464256b0b73dd1b0618af745c..1b568aaaf882b98c8ae2a102ca9870ed2fe891bc 100644
--- a/tests/__mocks__/store/modal.state.mock.ts
+++ b/tests/__mocks__/store/modal.state.mock.ts
@@ -8,7 +8,6 @@ export const mockModalState: ModalState = {
description: '',
endDate: '',
},
- isConnectionModalOpen: false,
isFeedbacksOpen: false,
partnersIssueModal: {
enedis: false,
diff --git a/yarn.lock b/yarn.lock
index 421f54db99ad4410a9d3fd5ba71b3b365eb6a2b4..e326bfeaff94289bdd793d14851f8c491942d637 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7,10 +7,10 @@
resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf"
integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
-"@adobe/css-tools@^4.3.1":
- version "4.3.1"
- resolved "https://registry.yarnpkg.com/@adobe/css-tools/-/css-tools-4.3.1.tgz#abfccb8ca78075a2b6187345c26243c1a0842f28"
- integrity sha512-/62yikz7NLScCGAAST5SHdnjaDJQBDq0M2muyRTpf2VQhw6StBg2ALiu73zSJQ4fMVLA+0uBhBHAle7Wg+2kSg==
+"@adobe/css-tools@^4.3.2":
+ version "4.3.3"
+ resolved "https://registry.yarnpkg.com/@adobe/css-tools/-/css-tools-4.3.3.tgz#90749bde8b89cd41764224f5aac29cd4138f75ff"
+ integrity sha512-rE0Pygv0sEZ4vBWHlAgJLGDU7Pm8xoO6p3wsEceb7GYAjScrOHpEo8KK/eVkAcnSM+slAEtXjA2JpdjLp4fJQQ==
"@alloc/types@^1.2.1":
version "1.3.0"
@@ -55,7 +55,15 @@
dependencies:
"@babel/highlight" "^7.18.6"
-"@babel/code-frame@^7.10.4", "@babel/code-frame@^7.22.13":
+"@babel/code-frame@^7.10.4":
+ version "7.24.2"
+ resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.24.2.tgz#718b4b19841809a58b29b68cde80bc5e1aa6d9ae"
+ integrity sha512-y5+tLQyV8pg3fsiln67BVLD1P13Eg4lh5RW9mF0zUuvLrv9uIQ4MCL+CRT+FTsBlBjcIan6PGsLcBN0m3ClUyQ==
+ dependencies:
+ "@babel/highlight" "^7.24.2"
+ picocolors "^1.0.0"
+
+"@babel/code-frame@^7.22.13":
version "7.22.13"
resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.13.tgz#e3c1c099402598483b7a8c46a721d1038803755e"
integrity sha512-XktuhWlJ5g+3TJXc5upd9Ks1HutSArik6jf2eAjYFyIOf4ej3RN+184cZbzDvbPnuTJIUhPKKJE3cIsYTiAT3w==
@@ -565,14 +573,15 @@
chalk "^2.0.0"
js-tokens "^4.0.0"
-"@babel/highlight@^7.22.13":
- version "7.22.20"
- resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.22.20.tgz#4ca92b71d80554b01427815e06f2df965b9c1f54"
- integrity sha512-dkdMCN3py0+ksCgYmGG8jKeGA/8Tk+gJwSYYlFGxG5lmhfKNoAy004YpLxpS1W2J8m/EK2Ew+yOs9pVRwO89mg==
+"@babel/highlight@^7.22.13", "@babel/highlight@^7.24.2":
+ version "7.24.2"
+ resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.24.2.tgz#3f539503efc83d3c59080a10e6634306e0370d26"
+ integrity sha512-Yac1ao4flkTxTteCDZLEvdxg2fZfz1v8M4QpaGypq/WPDqg3ijHYbDfs+LG5hvzSoqaSZ9/Z9lKSP3CjZjv+pA==
dependencies:
"@babel/helper-validator-identifier" "^7.22.20"
chalk "^2.4.2"
js-tokens "^4.0.0"
+ picocolors "^1.0.0"
"@babel/parser@^7.0.0", "@babel/parser@^7.1.0", "@babel/parser@^7.14.7", "@babel/parser@^7.18.6", "@babel/parser@^7.2.2", "@babel/parser@^7.7.0":
version "7.18.6"
@@ -1554,7 +1563,7 @@
dependencies:
regenerator-runtime "^0.12.0"
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.0", "@babel/runtime@^7.12.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.14.6", "@babel/runtime@^7.15.4", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.0", "@babel/runtime@^7.12.0", "@babel/runtime@^7.13.10", "@babel/runtime@^7.14.6", "@babel/runtime@^7.15.4", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
version "7.18.6"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.18.6.tgz#6a1ef59f838debd670421f8c7f2cbb8da9751580"
integrity sha512-t9wi7/AW6XtKahAe20Yw0/mMljKq0B1r2fPdvaAdV/KPDZewFXdaaa6K7lxmZBZ8FBNpCiAT6iHPmd6QO9bKfQ==
@@ -1568,6 +1577,13 @@
dependencies:
regenerator-runtime "^0.13.11"
+"@babel/runtime@^7.12.5":
+ version "7.24.4"
+ resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.24.4.tgz#de795accd698007a66ba44add6cc86542aff1edd"
+ integrity sha512-dkxf7+hn8mFBwKjs9bvBlArzLVxVbS8usaPUDd5p2a9JCL9tB8OaOVN1isD4+Xyk4ns89/xeOmbQvgdK7IIVdA==
+ dependencies:
+ regenerator-runtime "^0.14.0"
+
"@babel/runtime@^7.16.3":
version "7.18.9"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.18.9.tgz#b4fcfce55db3d2e5e080d2490f608a3b9f407f4a"
@@ -2679,7 +2695,21 @@
dependencies:
"@sinonjs/commons" "^1.7.0"
-"@testing-library/dom@^9.0.0", "@testing-library/dom@^9.3.3":
+"@testing-library/dom@^9.0.0":
+ version "9.3.4"
+ resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-9.3.4.tgz#50696ec28376926fec0a1bf87d9dbac5e27f60ce"
+ integrity sha512-FlS4ZWlp97iiNWig0Muq8p+3rVDjRiYE+YKGbAqXOu9nwJFFOdL00kFpz42M+4huzYi86vAK1sOOfyOG45muIQ==
+ dependencies:
+ "@babel/code-frame" "^7.10.4"
+ "@babel/runtime" "^7.12.5"
+ "@types/aria-query" "^5.0.1"
+ aria-query "5.1.3"
+ chalk "^4.1.0"
+ dom-accessibility-api "^0.5.9"
+ lz-string "^1.5.0"
+ pretty-format "^27.0.2"
+
+"@testing-library/dom@^9.3.3":
version "9.3.3"
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-9.3.3.tgz#108c23a5b0ef51121c26ae92eb3179416b0434f5"
integrity sha512-fB0R+fa3AUqbLHWyxXa2kGVtf1Fe1ZZFr0Zp6AIbIAzXb2mKbEXl+PCQNUOaq5lbTab5tfctfXRNsWXxa2f7Aw==
@@ -2693,33 +2723,33 @@
lz-string "^1.5.0"
pretty-format "^27.0.2"
-"@testing-library/jest-dom@^6.1.4":
- version "6.1.4"
- resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-6.1.4.tgz#cf0835c33bc5ef00befb9e672b1e3e6a710e30e3"
- integrity sha512-wpoYrCYwSZ5/AxcrjLxJmCU6I5QAJXslEeSiMQqaWmP2Kzpd1LvF/qxmAIW2qposULGWq2gw30GgVNFLSc2Jnw==
+"@testing-library/jest-dom@^6.4.2":
+ version "6.4.2"
+ resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-6.4.2.tgz#38949f6b63722900e2d75ba3c6d9bf8cffb3300e"
+ integrity sha512-CzqH0AFymEMG48CpzXFriYYkOjk6ZGPCLMhW9e9jg3KMCn5OfJecF8GtGW7yGfR/IgCe3SX8BSwjdzI6BBbZLw==
dependencies:
- "@adobe/css-tools" "^4.3.1"
+ "@adobe/css-tools" "^4.3.2"
"@babel/runtime" "^7.9.2"
aria-query "^5.0.0"
chalk "^3.0.0"
css.escape "^1.5.1"
- dom-accessibility-api "^0.5.6"
+ dom-accessibility-api "^0.6.3"
lodash "^4.17.15"
redent "^3.0.0"
-"@testing-library/react@^14.1.2":
- version "14.1.2"
- resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-14.1.2.tgz#a2b9e9ee87721ec9ed2d7cfc51cc04e474537c32"
- integrity sha512-z4p7DVBTPjKM5qDZ0t5ZjzkpSNb+fZy1u6bzO7kk8oeGagpPCAtgh4cx1syrfp7a+QWkM021jGqjJaxJJnXAZg==
+"@testing-library/react@^14.3.0":
+ version "14.3.0"
+ resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-14.3.0.tgz#8183eb5a5f465b5b8cc495fcbd9bad0a16b8dd3b"
+ integrity sha512-AYJGvNFMbCa5vt1UtDCa/dcaABrXq8gph6VN+cffIx0UeA0qiGqS+sT60+sb+Gjc8tGXdECWYQgaF0khf8b+Lg==
dependencies:
"@babel/runtime" "^7.12.5"
"@testing-library/dom" "^9.0.0"
"@types/react-dom" "^18.0.0"
-"@testing-library/user-event@^14.5.1":
- version "14.5.1"
- resolved "https://registry.yarnpkg.com/@testing-library/user-event/-/user-event-14.5.1.tgz#27337d72046d5236b32fd977edee3f74c71d332f"
- integrity sha512-UCcUKrUYGj7ClomOo2SpNVvx4/fkd/2BbIHDCle8A0ax+P3bU7yJwDBDrS6ZwdTMARWTGODX1hEsCcO+7beJjg==
+"@testing-library/user-event@^14.5.2":
+ version "14.5.2"
+ resolved "https://registry.yarnpkg.com/@testing-library/user-event/-/user-event-14.5.2.tgz#db7257d727c891905947bd1c1a99da20e03c2ebd"
+ integrity sha512-YAh82Wh4TIrxYLmfGcixwD18oIjyC1pFQC2Y01F2lzV2HTMiYrI0nze0FD0ocB//CKS/7jIUgae+adPqxK5yCQ==
"@tokenizer/token@^0.3.0":
version "0.3.0"
@@ -2732,9 +2762,9 @@
integrity sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw==
"@types/aria-query@^5.0.1":
- version "5.0.2"
- resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-5.0.2.tgz#6f1225829d89794fd9f891989c9ce667422d7f64"
- integrity sha512-PHKZuMN+K5qgKIWhBodXzQslTo5P+K/6LqeKXS6O/4liIDdZqaX5RXrCK++LAw+y/nptN48YmUMFiQHRSWYwtQ==
+ version "5.0.4"
+ resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-5.0.4.tgz#1a31c3d378850d2778dabb6374d036dcba4ba708"
+ integrity sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==
"@types/babel__core@^7.0.0", "@types/babel__core@^7.1.7":
version "7.1.19"
@@ -3121,9 +3151,9 @@
integrity sha512-ymZk3LEC/fsut+/Q5qejp6R9O1rMxz3XaRHDV6kX8MrGAhOSPqVARbDi+EZvInBpw+BnCX3TD240byVkOfQsHg==
"@types/prop-types@*":
- version "15.7.5"
- resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
- integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==
+ version "15.7.12"
+ resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.12.tgz#12bb1e2be27293c1406acb6af1c3f3a1481d98c6"
+ integrity sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==
"@types/q@^1.5.1":
version "1.5.5"
@@ -3131,9 +3161,9 @@
integrity sha512-L28j2FcJfSZOnL1WBjDYp2vUHCeIFlyYI/53EwD/rKUBQ7MtUUfbQWiyKJGpcnv4/WgrhWsFKrcPstcAt/J0tQ==
"@types/react-dom@^18.0.0":
- version "18.2.17"
- resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.2.17.tgz#375c55fab4ae671bd98448dcfa153268d01d6f64"
- integrity sha512-rvrT/M7Df5eykWFxn6MYt5Pem/Dbyc1N8Y0S9Mrkw2WFCRiqUgw9P7ul2NpwsXCSM1DVdENzdG9J5SreqfAIWg==
+ version "18.2.24"
+ resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.2.24.tgz#8dda8f449ae436a7a6e91efed8035d4ab03ff759"
+ integrity sha512-cN6upcKd8zkGy4HU9F1+/s98Hrp6D4MOcippK4PoE8OZRngohHZpbJn1GsaDLz87MqvHNoT13nHvNqM9ocRHZg==
dependencies:
"@types/react" "*"
@@ -3169,12 +3199,11 @@
"@types/react" "*"
"@types/react@*":
- version "18.0.14"
- resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.14.tgz#e016616ffff51dba01b04945610fe3671fdbe06d"
- integrity sha512-x4gGuASSiWmo0xjDLpm5mPb52syZHJx02VKbqUKdLmKtAwIh63XClGsiTI1K6DO5q7ox4xAsQrU+Gl3+gGXF9Q==
+ version "18.2.74"
+ resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.74.tgz#2d52eb80e4e7c4ea8812c89181d6d590b53f958c"
+ integrity sha512-9AEqNZZyBx8OdZpxzQlaFEVCSFUM2YXJH46yPOiOpm078k6ZLOCcuAzGum/zK8YBwY+dbahVNbHrbgrAwIRlqw==
dependencies:
"@types/prop-types" "*"
- "@types/scheduler" "*"
csstype "^3.0.2"
"@types/react@^18.2.25":
@@ -3194,9 +3223,9 @@
redux "^4.0.5"
"@types/scheduler@*":
- version "0.16.2"
- resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39"
- integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==
+ version "0.23.0"
+ resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.23.0.tgz#0a6655b3e2708eaabca00b7372fafd7a792a7b09"
+ integrity sha512-YIoDCTH3Af6XM5VuwGG/QL/CJqga1Zm3NkU3HZ4ZHK2fRMPYP1VczsTUqtsf43PH/iJNVlPHAo2oWX7BSdB2Hw==
"@types/semver@^7.3.12":
version "7.3.13"
@@ -3850,12 +3879,12 @@ arr-union@^3.1.0:
integrity sha512-sKpyeERZ02v1FeCZT8lrfJq5u6goHCtpTAzPwJYe7c8SPFOboNjNg1vz2L4VTn9T4PQxEx13TbXLmYUcS6Ug7Q==
array-buffer-byte-length@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz#fabe8bc193fea865f317fe7807085ee0dee5aead"
- integrity sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==
+ version "1.0.1"
+ resolved "https://registry.yarnpkg.com/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz#1e5583ec16763540a27ae52eed99ff899223568f"
+ integrity sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==
dependencies:
- call-bind "^1.0.2"
- is-array-buffer "^3.0.1"
+ call-bind "^1.0.5"
+ is-array-buffer "^3.0.4"
array-flatten@1.1.1:
version "1.1.1"
@@ -4131,10 +4160,12 @@ autoprefixer@9.7.6:
postcss "^7.0.27"
postcss-value-parser "^4.0.3"
-available-typed-arrays@^1.0.5:
- version "1.0.5"
- resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz#92f95616501069d07d10edb2fc37d3e1c65123b7"
- integrity sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==
+available-typed-arrays@^1.0.5, available-typed-arrays@^1.0.7:
+ version "1.0.7"
+ resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz#a5cc375d6a03c2efc87a553f3e0b1522def14846"
+ integrity sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==
+ dependencies:
+ possible-typed-array-names "^1.0.0"
aws-sign2@~0.7.0:
version "0.7.0"
@@ -4889,13 +4920,16 @@ cache-base@^1.0.1:
union-value "^1.0.0"
unset-value "^1.0.0"
-call-bind@^1.0.0, call-bind@^1.0.2:
- version "1.0.2"
- resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
- integrity sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==
+call-bind@^1.0.0, call-bind@^1.0.2, call-bind@^1.0.7:
+ version "1.0.7"
+ resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.7.tgz#06016599c40c56498c18769d2730be242b6fa3b9"
+ integrity sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==
dependencies:
- function-bind "^1.1.1"
- get-intrinsic "^1.0.2"
+ es-define-property "^1.0.0"
+ es-errors "^1.3.0"
+ function-bind "^1.1.2"
+ get-intrinsic "^1.2.4"
+ set-function-length "^1.2.1"
call-bind@^1.0.4, call-bind@^1.0.5:
version "1.0.5"
@@ -6289,10 +6323,10 @@ cozy-stack-client@^40.2.1:
mime "^2.4.0"
qs "^6.7.0"
-cozy-ui@81.9.0:
- version "81.9.0"
- resolved "https://registry.yarnpkg.com/cozy-ui/-/cozy-ui-81.9.0.tgz#ad6e79cb608851676cf1f80093df500a943f06bf"
- integrity sha512-f++0oOvAt1JNRrmiilFFu9ZdhnYl8Iv6x+fBTyw8ertRhTg5YdFHdYsrK6lDjnm6AxXNU1mpnKX4GvrKlaV46A==
+cozy-ui@^86.0.0:
+ version "86.3.0"
+ resolved "https://registry.yarnpkg.com/cozy-ui/-/cozy-ui-86.3.0.tgz#02df54285e043c03489a53c9c83f7a49f47d5328"
+ integrity sha512-eUnkIWY4hszVYB5qMQ5U7wxagFPzpvIlpA+7ke52fjcs2Z8uJ5vsbNfHjIgwxDn+hzOm09nUkwjDmQXIbO33bA==
dependencies:
"@babel/runtime" "^7.3.4"
"@material-ui/core" "4.12.3"
@@ -6313,7 +6347,7 @@ cozy-ui@81.9.0:
piwik-react-router "0.12.1"
react-chartjs-2 "4.1.0"
react-markdown "^4.0.8"
- react-pdf "^4.0.5"
+ react-pdf "^5.7.2"
react-popper "^2.2.3"
react-remove-scroll "^2.4.0"
react-select "^4.3.0"
@@ -6562,9 +6596,9 @@ csstype@^2.5.2:
integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
csstype@^3.0.2:
- version "3.1.0"
- resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.0.tgz#4ddcac3718d787cf9df0d1b7d15033925c8f29f2"
- integrity sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==
+ version "3.1.3"
+ resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81"
+ integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
csswring@7.0.0:
version "7.0.0"
@@ -6949,14 +6983,14 @@ deep-equal@^1.0.1:
regexp.prototype.flags "^1.2.0"
deep-equal@^2.0.5:
- version "2.2.2"
- resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-2.2.2.tgz#9b2635da569a13ba8e1cc159c2f744071b115daa"
- integrity sha512-xjVyBf0w5vH0I42jdAZzOKVldmPgSulmiyPRywoyq7HXC9qdgo17kxJE+rdnif5Tz6+pIrpJI8dCpMNLIGkUiA==
+ version "2.2.3"
+ resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-2.2.3.tgz#af89dafb23a396c7da3e862abc0be27cf51d56e1"
+ integrity sha512-ZIwpnevOurS8bpT4192sqAowWM76JDKSHYzMLty3BZGSswgq6pBaH3DhCSW5xVAZICZyKdOBPjwww5wfgT/6PA==
dependencies:
array-buffer-byte-length "^1.0.0"
- call-bind "^1.0.2"
+ call-bind "^1.0.5"
es-get-iterator "^1.1.3"
- get-intrinsic "^1.2.1"
+ get-intrinsic "^1.2.2"
is-arguments "^1.1.1"
is-array-buffer "^3.0.2"
is-date-object "^1.0.5"
@@ -6966,11 +7000,11 @@ deep-equal@^2.0.5:
object-is "^1.1.5"
object-keys "^1.1.1"
object.assign "^4.1.4"
- regexp.prototype.flags "^1.5.0"
+ regexp.prototype.flags "^1.5.1"
side-channel "^1.0.4"
which-boxed-primitive "^1.0.2"
which-collection "^1.0.1"
- which-typed-array "^1.1.9"
+ which-typed-array "^1.1.13"
deep-equal@~0.2.1:
version "0.2.2"
@@ -7025,14 +7059,14 @@ defaults@^1.0.3:
dependencies:
clone "^1.0.2"
-define-data-property@^1.0.1:
- version "1.1.0"
- resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.0.tgz#0db13540704e1d8d479a0656cf781267531b9451"
- integrity sha512-UzGwzcjyv3OtAvolTj1GoyNYzfFR+iqbGjcnBEENZVCpM4/Ng1yhGNvS3lR/xDS74Tb2wGG9WzNSNIOS9UVb2g==
+define-data-property@^1.0.1, define-data-property@^1.1.4:
+ version "1.1.4"
+ resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.4.tgz#894dc141bb7d3060ae4366f6a0107e68fbe48c5e"
+ integrity sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==
dependencies:
- get-intrinsic "^1.2.1"
+ es-define-property "^1.0.0"
+ es-errors "^1.3.0"
gopd "^1.0.1"
- has-property-descriptors "^1.0.0"
define-data-property@^1.1.1:
version "1.1.1"
@@ -7053,7 +7087,7 @@ define-lazy-prop@^3.0.0:
resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz#dbb19adfb746d7fc6d734a06b72f4a00d021255f"
integrity sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==
-define-properties@^1.1.2, define-properties@^1.1.3, define-properties@^1.1.4:
+define-properties@^1.1.2:
version "1.1.4"
resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.4.tgz#0b14d7bd7fbeb2f3572c3a7eda80ea5d57fb05b1"
integrity sha512-uckOqKcfaVvtBdsVkdPv3XjveQJsNQqmhXgRi8uhvWWuPYZCNlzT8qAyblUgNoXdHdjMTzAqeGjAoli8f+bzPA==
@@ -7061,7 +7095,7 @@ define-properties@^1.1.2, define-properties@^1.1.3, define-properties@^1.1.4:
has-property-descriptors "^1.0.0"
object-keys "^1.1.1"
-define-properties@^1.2.0, define-properties@^1.2.1:
+define-properties@^1.1.3, define-properties@^1.1.4, define-properties@^1.2.0, define-properties@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.2.1.tgz#10781cc616eb951a80a034bafcaa7377f6af2b6c"
integrity sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==
@@ -7245,11 +7279,16 @@ doctrine@^3.0.0:
dependencies:
esutils "^2.0.2"
-dom-accessibility-api@^0.5.6, dom-accessibility-api@^0.5.9:
+dom-accessibility-api@^0.5.9:
version "0.5.16"
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz#5a7429e6066eb3664d911e33fb0e45de8eb08453"
integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==
+dom-accessibility-api@^0.6.3:
+ version "0.6.3"
+ resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz#993e925cc1d73f2c662e7d75dd5a5445259a8fd8"
+ integrity sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==
+
dom-converter@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@@ -7679,6 +7718,18 @@ es-array-method-boxes-properly@^1.0.0:
resolved "https://registry.yarnpkg.com/es-array-method-boxes-properly/-/es-array-method-boxes-properly-1.0.0.tgz#873f3e84418de4ee19c5be752990b2e44718d09e"
integrity sha512-wd6JXUmyHmt8T5a2xreUwKcGPq6f1f+WwIJkijUqiGcJz1qqnZgP6XIK+QyIWU5lT7imeNxUll48bziG+TSYcA==
+es-define-property@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/es-define-property/-/es-define-property-1.0.0.tgz#c7faefbdff8b2696cf5f46921edfb77cc4ba3845"
+ integrity sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==
+ dependencies:
+ get-intrinsic "^1.2.4"
+
+es-errors@^1.3.0:
+ version "1.3.0"
+ resolved "https://registry.yarnpkg.com/es-errors/-/es-errors-1.3.0.tgz#05f75a25dab98e4fb1dcd5e1472c0546d5057c8f"
+ integrity sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==
+
es-get-iterator@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/es-get-iterator/-/es-get-iterator-1.1.3.tgz#3ef87523c5d464d41084b2c3c9c214f1199763d6"
@@ -8695,6 +8746,14 @@ file-loader@3.0.1:
loader-utils "^1.0.2"
schema-utils "^1.0.0"
+file-loader@^6.0.0:
+ version "6.2.0"
+ resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-6.2.0.tgz#baef7cf8e1840df325e4390b4484879480eebe4d"
+ integrity sha512-qo3glqyTa61Ytg4u73GultjHGjdRyig3tG6lPtyX/jOEJvHif9uB0/OCI2Kif6ctF3caQTW2G5gym21oAsI4pw==
+ dependencies:
+ loader-utils "^2.0.0"
+ schema-utils "^3.0.0"
+
file-saver@^2.0.5:
version "2.0.5"
resolved "https://registry.yarnpkg.com/file-saver/-/file-saver-2.0.5.tgz#d61cfe2ce059f414d899e9dd6d4107ee25670c38"
@@ -9015,12 +9074,7 @@ fsevents@^2.0.6, fsevents@^2.1.2, fsevents@~2.3.2:
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
-function-bind@^1.1.1:
- version "1.1.1"
- resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
- integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
-
-function-bind@^1.1.2:
+function-bind@^1.1.1, function-bind@^1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
@@ -9076,7 +9130,7 @@ get-caller-file@^2.0.1, get-caller-file@^2.0.5:
resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
-get-intrinsic@^1.0.2, get-intrinsic@^1.1.0, get-intrinsic@^1.1.1:
+get-intrinsic@^1.1.0:
version "1.1.2"
resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.1.2.tgz#336975123e05ad0b7ba41f152ee4aadbea6cf598"
integrity sha512-Jfm3OyCxHh9DJyc28qGk+JmfkpO41A4XkneDSujN9MDXrm4oDKdHvndhZ2dN94+ERNfkYJWDclW6k2L/ZGHjXA==
@@ -9085,24 +9139,16 @@ get-intrinsic@^1.0.2, get-intrinsic@^1.1.0, get-intrinsic@^1.1.1:
has "^1.0.3"
has-symbols "^1.0.3"
-get-intrinsic@^1.1.3, get-intrinsic@^1.2.0:
- version "1.2.0"
- resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.0.tgz#7ad1dc0535f3a2904bba075772763e5051f6d05f"
- integrity sha512-L049y6nFOuom5wGyRc3/gdTLO94dySVKRACj1RmJZBQXlbTMhtNIgkWkUHq+jYmZvKf14EW1EoJnnjbmoHij0Q==
- dependencies:
- function-bind "^1.1.1"
- has "^1.0.3"
- has-symbols "^1.0.3"
-
-get-intrinsic@^1.2.1:
- version "1.2.1"
- resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.1.tgz#d295644fed4505fc9cde952c37ee12b477a83d82"
- integrity sha512-2DcsyfABl+gVHEfCOaTrWgyt+tb6MSEGmKq+kI5HwLbIYgjgmMcV8KQ41uaKz1xxUcn9tJtgFbQUEVcEbd0FYw==
+get-intrinsic@^1.1.1, get-intrinsic@^1.1.3, get-intrinsic@^1.2.0, get-intrinsic@^1.2.1, get-intrinsic@^1.2.4:
+ version "1.2.4"
+ resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.4.tgz#e385f5a4b5227d449c3eabbad05494ef0abbeadd"
+ integrity sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==
dependencies:
- function-bind "^1.1.1"
- has "^1.0.3"
+ es-errors "^1.3.0"
+ function-bind "^1.1.2"
has-proto "^1.0.1"
has-symbols "^1.0.3"
+ hasown "^2.0.0"
get-intrinsic@^1.2.2:
version "1.2.2"
@@ -9466,29 +9512,29 @@ has-flag@^4.0.0:
resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
-has-property-descriptors@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.0.tgz#610708600606d36961ed04c196193b6a607fa861"
- integrity sha512-62DVLZGoiEBDHQyqG4w9xCuZ7eJEwNmJRWw2VY84Oedb7WFcA27fiEVe8oUQx9hAUJ4ekurquucTGwsyO1XGdQ==
+has-property-descriptors@^1.0.0, has-property-descriptors@^1.0.2:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz#963ed7d071dc7bf5f084c5bfbe0d1b6222586854"
+ integrity sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==
dependencies:
- get-intrinsic "^1.1.1"
+ es-define-property "^1.0.0"
has-proto@^1.0.1:
- version "1.0.1"
- resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.1.tgz#1885c1305538958aff469fef37937c22795408e0"
- integrity sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==
+ version "1.0.3"
+ resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.3.tgz#b31ddfe9b0e6e9914536a6ab286426d0214f77fd"
+ integrity sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==
has-symbols@^1.0.1, has-symbols@^1.0.2, has-symbols@^1.0.3:
version "1.0.3"
resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.3.tgz#bb7b2c4349251dce87b125f7bdf874aa7c8b39f8"
integrity sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==
-has-tostringtag@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.0.tgz#7e133818a7d394734f941e73c3d3f9291e658b25"
- integrity sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==
+has-tostringtag@^1.0.0, has-tostringtag@^1.0.2:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.2.tgz#2cdc42d40bef2e5b4eeab7c01a73c54ce7ab5abc"
+ integrity sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==
dependencies:
- has-symbols "^1.0.2"
+ has-symbols "^1.0.3"
has-value@^0.3.1:
version "0.3.1"
@@ -9522,11 +9568,9 @@ has-values@^1.0.0:
kind-of "^4.0.0"
has@^1.0.3:
- version "1.0.3"
- resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796"
- integrity sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==
- dependencies:
- function-bind "^1.1.1"
+ version "1.0.4"
+ resolved "https://registry.yarnpkg.com/has/-/has-1.0.4.tgz#2eb2860e000011dae4f1406a86fe80e530fb2ec6"
+ integrity sha512-qdSAmqLF6209RFj4VVItywPMbm3vWylknmB3nvNiUIs72xAimcM8nVYxYr7ncvZq5qzk9MKIZR8ijqD/1QuYjQ==
hash-base@^3.0.0:
version "3.1.0"
@@ -10061,7 +10105,16 @@ internal-slot@^1.0.3:
has "^1.0.3"
side-channel "^1.0.4"
-internal-slot@^1.0.4, internal-slot@^1.0.5:
+internal-slot@^1.0.4:
+ version "1.0.7"
+ resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.7.tgz#c06dcca3ed874249881007b0a5523b172a190802"
+ integrity sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==
+ dependencies:
+ es-errors "^1.3.0"
+ hasown "^2.0.0"
+ side-channel "^1.0.4"
+
+internal-slot@^1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.5.tgz#f2a2ee21f668f8627a4667f309dc0f4fb6674986"
integrity sha512-Y+R5hJrzs52QCG2laLn4udYVnxsfny9CpOhNhUvk/SSSVyF6T27FzRbF0sroPidSu3X8oEAkOn2K804mjpt6UQ==
@@ -10152,14 +10205,13 @@ is-arguments@^1.0.4, is-arguments@^1.1.1:
call-bind "^1.0.2"
has-tostringtag "^1.0.0"
-is-array-buffer@^3.0.1, is-array-buffer@^3.0.2:
- version "3.0.2"
- resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.2.tgz#f2653ced8412081638ecb0ebbd0c41c6e0aecbbe"
- integrity sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==
+is-array-buffer@^3.0.2, is-array-buffer@^3.0.4:
+ version "3.0.4"
+ resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.4.tgz#7a1f92b3d61edd2bc65d24f130530ea93d7fae98"
+ integrity sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==
dependencies:
call-bind "^1.0.2"
- get-intrinsic "^1.2.0"
- is-typed-array "^1.1.10"
+ get-intrinsic "^1.2.1"
is-arrayish@^0.2.1:
version "0.2.1"
@@ -10389,10 +10441,10 @@ is-inside-container@^1.0.0:
dependencies:
is-docker "^3.0.0"
-is-map@^2.0.1, is-map@^2.0.2:
- version "2.0.2"
- resolved "https://registry.yarnpkg.com/is-map/-/is-map-2.0.2.tgz#00922db8c9bf73e81b7a335827bc2a43f2b91127"
- integrity sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==
+is-map@^2.0.2, is-map@^2.0.3:
+ version "2.0.3"
+ resolved "https://registry.yarnpkg.com/is-map/-/is-map-2.0.3.tgz#ede96b7fe1e270b3c4465e3a465658764926d62e"
+ integrity sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==
is-negative-zero@^2.0.2:
version "2.0.2"
@@ -10482,17 +10534,17 @@ is-regex@^1.0.4, is-regex@^1.1.4:
call-bind "^1.0.2"
has-tostringtag "^1.0.0"
-is-set@^2.0.1, is-set@^2.0.2:
- version "2.0.2"
- resolved "https://registry.yarnpkg.com/is-set/-/is-set-2.0.2.tgz#90755fa4c2562dc1c5d4024760d6119b94ca18ec"
- integrity sha512-+2cnTEZeY5z/iXGbLhPrOAaK/Mau5k5eXq9j14CpRTftq0pAJu2MwVRSZhyZWBzx3o6X795Lz6Bpb6R0GKf37g==
+is-set@^2.0.2, is-set@^2.0.3:
+ version "2.0.3"
+ resolved "https://registry.yarnpkg.com/is-set/-/is-set-2.0.3.tgz#8ab209ea424608141372ded6e0cb200ef1d9d01d"
+ integrity sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==
is-shared-array-buffer@^1.0.2:
- version "1.0.2"
- resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz#8f259c573b60b6a32d4058a1a07430c0a7344c79"
- integrity sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==
+ version "1.0.3"
+ resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz#1237f1cba059cdb62431d378dcc37d9680181688"
+ integrity sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==
dependencies:
- call-bind "^1.0.2"
+ call-bind "^1.0.7"
is-stream@^1.1.0:
version "1.1.0"
@@ -10530,7 +10582,21 @@ is-text-path@^1.0.1:
dependencies:
text-extensions "^1.0.0"
-is-typed-array@^1.1.10, is-typed-array@^1.1.9:
+is-typed-array@^1.1.10:
+ version "1.1.13"
+ resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.13.tgz#d6c5ca56df62334959322d7d7dd1cca50debe229"
+ integrity sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==
+ dependencies:
+ which-typed-array "^1.1.14"
+
+is-typed-array@^1.1.12:
+ version "1.1.12"
+ resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.12.tgz#d0bab5686ef4a76f7a73097b95470ab199c57d4a"
+ integrity sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==
+ dependencies:
+ which-typed-array "^1.1.11"
+
+is-typed-array@^1.1.9:
version "1.1.10"
resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.10.tgz#36a5b5cb4189b575d1a3e4b08536bfb485801e3f"
integrity sha512-PJqgEHiWZvMpaFZ3uTc8kHPM4+4ADTlDniuQL7cU/UDA0Ql7F70yGfHph3cLNe+c9toaigv+DFzTJKhc2CtO6A==
@@ -10541,13 +10607,6 @@ is-typed-array@^1.1.10, is-typed-array@^1.1.9:
gopd "^1.0.1"
has-tostringtag "^1.0.0"
-is-typed-array@^1.1.12:
- version "1.1.12"
- resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.12.tgz#d0bab5686ef4a76f7a73097b95470ab199c57d4a"
- integrity sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==
- dependencies:
- which-typed-array "^1.1.11"
-
is-typedarray@^1.0.0, is-typedarray@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
@@ -10558,10 +10617,10 @@ is-utf8@^0.2.0:
resolved "https://registry.yarnpkg.com/is-utf8/-/is-utf8-0.2.1.tgz#4b0da1442104d1b336340e80797e865cf39f7d72"
integrity sha512-rMYPYvCzsXywIsldgLaSoPlw5PfoB/ssr7hY4pLfcodrA5M/eArza1a9VmTiNIBNMjOGr1Ow9mTyU2o69U6U9Q==
-is-weakmap@^2.0.1:
- version "2.0.1"
- resolved "https://registry.yarnpkg.com/is-weakmap/-/is-weakmap-2.0.1.tgz#5008b59bdc43b698201d18f62b37b2ca243e8cf2"
- integrity sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==
+is-weakmap@^2.0.2:
+ version "2.0.2"
+ resolved "https://registry.yarnpkg.com/is-weakmap/-/is-weakmap-2.0.2.tgz#bf72615d649dfe5f699079c54b83e47d1ae19cfd"
+ integrity sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==
is-weakref@^1.0.2:
version "1.0.2"
@@ -10570,13 +10629,13 @@ is-weakref@^1.0.2:
dependencies:
call-bind "^1.0.2"
-is-weakset@^2.0.1:
- version "2.0.2"
- resolved "https://registry.yarnpkg.com/is-weakset/-/is-weakset-2.0.2.tgz#4569d67a747a1ce5a994dfd4ef6dcea76e7c0a1d"
- integrity sha512-t2yVvttHkQktwnNNmBQ98AhENLdPUTDTE21uPqAQ0ARwQfGeQKRVS0NNurH7bTf7RrvcVn1OOge45CnBeHCSmg==
+is-weakset@^2.0.3:
+ version "2.0.3"
+ resolved "https://registry.yarnpkg.com/is-weakset/-/is-weakset-2.0.3.tgz#e801519df8c0c43e12ff2834eead84ec9e624007"
+ integrity sha512-LvIm3/KWzS9oRFHugab7d+M/GcBXuXX5xZkzPmN+NxihdQlZUQ4dWuSV1xR/sq6upL1TJEDrfBgRepHFdBtSNQ==
dependencies:
- call-bind "^1.0.2"
- get-intrinsic "^1.1.1"
+ call-bind "^1.0.7"
+ get-intrinsic "^1.2.4"
is-whitespace-character@^1.0.0:
version "1.0.4"
@@ -11627,7 +11686,7 @@ loader-utils@^0.2.16:
json5 "^0.5.0"
object-assign "^4.0.1"
-loader-utils@^1.0.0, loader-utils@^1.0.2, loader-utils@^1.1.0, loader-utils@^1.2.1, loader-utils@^1.2.3, loader-utils@^1.4.0:
+loader-utils@^1.0.2, loader-utils@^1.1.0, loader-utils@^1.2.1, loader-utils@^1.2.3, loader-utils@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
integrity sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==
@@ -12017,6 +12076,11 @@ merge-options@1.0.1:
dependencies:
is-plain-obj "^1.1"
+merge-refs@^1.0.0:
+ version "1.2.2"
+ resolved "https://registry.yarnpkg.com/merge-refs/-/merge-refs-1.2.2.tgz#6142633398dd0d10a37626cae77ddeb1db26db0c"
+ integrity sha512-RwcT7GsQR3KbuLw1rRuodq4Nt547BKEBkliZ0qqsrpyNne9bGTFtsFIsIpx82huWhcl3kOlOlH4H0xkPk/DqVw==
+
merge-stream@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
@@ -12823,11 +12887,6 @@ nock@^12.0.3:
lodash "^4.17.13"
propagate "^2.0.0"
-node-ensure@^0.0.0:
- version "0.0.0"
- resolved "https://registry.yarnpkg.com/node-ensure/-/node-ensure-0.0.0.tgz#ecae764150de99861ec5c810fd5d096b183932a7"
- integrity sha512-DRI60hzo2oKN1ma0ckc6nQWlHU69RH6xN0sjQTjMpChPfTYvKZdcQFfdYK2RWbJcKyUizSIy/l8OTGxMAM1QDw==
-
node-fetch@2.6.7, node-fetch@^2.0.0, node-fetch@^2.6.0, node-fetch@^2.6.1:
version "2.6.7"
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.7.tgz#24de9fba827e3b4ae44dc8b20256a379160052ad"
@@ -13064,7 +13123,7 @@ object-hash@^3.0.0:
resolved "https://registry.yarnpkg.com/object-hash/-/object-hash-3.0.0.tgz#73f97f753e7baffc0e2cc9d6e079079744ac82e9"
integrity sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==
-object-inspect@^1.12.0, object-inspect@^1.9.0:
+object-inspect@^1.12.0:
version "1.12.2"
resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.2.tgz#c0641f26394532f28ab8d796ab954e43c009a8ea"
integrity sha512-z+cPxW0QGUp0mcqcsgQyLVRDoXFQbXOwBaqyF7VIgI4TWNQsDHrBpUQslRmIfAoYWdYzs6UlKJtB2XJpTaNSpQ==
@@ -13079,7 +13138,7 @@ object-inspect@^1.13.1:
resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.13.1.tgz#b96c6109324ccfef6b12216a956ca4dc2ff94bc2"
integrity sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==
-object-is@^1.0.1, object-is@^1.1.5:
+object-is@^1.0.1:
version "1.1.5"
resolved "https://registry.yarnpkg.com/object-is/-/object-is-1.1.5.tgz#b9deeaa5fc7f1846a0faecdceec138e5778f53ac"
integrity sha512-3cyDsyHgtmi7I7DfSSI2LDp6SK2lwvtbg0p0R1e0RvTqF5ceGx+K2dfSjm1bKDMVCFEDAQvy+o8c6a7VujOddw==
@@ -13087,6 +13146,14 @@ object-is@^1.0.1, object-is@^1.1.5:
call-bind "^1.0.2"
define-properties "^1.1.3"
+object-is@^1.1.5:
+ version "1.1.6"
+ resolved "https://registry.yarnpkg.com/object-is/-/object-is-1.1.6.tgz#1a6a53aed2dd8f7e6775ff870bea58545956ab07"
+ integrity sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==
+ dependencies:
+ call-bind "^1.0.7"
+ define-properties "^1.2.1"
+
object-keys@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e"
@@ -13110,12 +13177,12 @@ object.assign@^4.1.0, object.assign@^4.1.2:
object-keys "^1.1.1"
object.assign@^4.1.4:
- version "4.1.4"
- resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.4.tgz#9673c7c7c351ab8c4d0b516f4343ebf4dfb7799f"
- integrity sha512-1mxKf0e58bvyjSCtKYY4sRe9itRk3PJpquJOjeIkz885CczcI4IvJJDLPS72oowuSh+pBxUFROpX+TU++hxhZQ==
+ version "4.1.5"
+ resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.5.tgz#3a833f9ab7fdb80fc9e8d2300c803d216d8fdbb0"
+ integrity sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==
dependencies:
- call-bind "^1.0.2"
- define-properties "^1.1.4"
+ call-bind "^1.0.5"
+ define-properties "^1.2.1"
has-symbols "^1.0.3"
object-keys "^1.1.1"
@@ -13699,13 +13766,10 @@ pbkdf2@^3.0.3:
safe-buffer "^5.0.1"
sha.js "^2.4.8"
-pdfjs-dist@2.1.266:
- version "2.1.266"
- resolved "https://registry.yarnpkg.com/pdfjs-dist/-/pdfjs-dist-2.1.266.tgz#cded02268b389559e807f410d2a729db62160026"
- integrity sha512-Jy7o1wE3NezPxozexSbq4ltuLT0Z21ew/qrEiAEeUZzHxMHGk4DUV1D7RuCXg5vJDvHmjX1YssN+we9QfRRgXQ==
- dependencies:
- node-ensure "^0.0.0"
- worker-loader "^2.0.0"
+pdfjs-dist@2.12.313:
+ version "2.12.313"
+ resolved "https://registry.yarnpkg.com/pdfjs-dist/-/pdfjs-dist-2.12.313.tgz#62f2273737bb956267ae2e02cdfaddcb1099819c"
+ integrity sha512-1x6iXO4Qnv6Eb+YFdN5JdUzt4pAkxSp3aLAYPX93eQCyg/m7QFzXVWJHJVtoW48CI8HCXju4dSkhQZwoheL5mA==
peek-readable@^4.1.0:
version "4.1.0"
@@ -13832,6 +13896,11 @@ posix-character-classes@^0.1.0:
resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"
integrity sha512-xTgYBc3fuo7Yt7JbiuFxSYGToMoz8fLoE6TC9Wx1P/u+LfeThMOAqmuyECnlBaaJb+u1m9hHiXUEtwW4OzfUJg==
+possible-typed-array-names@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz#89bb63c6fada2c3e90adc4a647beeeb39cc7bf8f"
+ integrity sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==
+
post-me@0.4.5:
version "0.4.5"
resolved "https://registry.yarnpkg.com/post-me/-/post-me-0.4.5.tgz#6171b721c7b86230c51cfbe48ddea047ef8831ce"
@@ -14590,17 +14659,21 @@ react-markdown@^4.0.8, react-markdown@^4.2.2:
unist-util-visit "^1.3.0"
xtend "^4.0.1"
-react-pdf@^4.0.5:
- version "4.2.0"
- resolved "https://registry.yarnpkg.com/react-pdf/-/react-pdf-4.2.0.tgz#b83a01eb070912522075b7a51aee7d63b2c912ed"
- integrity sha512-Ao44mZszfPwtCUsrXHtXnhM+czTvPxfG5wqssbWgj2onL70TKSOKGzQfCH4csCnNDOKji/Pc/s0Og70/VOE+Rg==
+react-pdf@^5.7.2:
+ version "5.7.2"
+ resolved "https://registry.yarnpkg.com/react-pdf/-/react-pdf-5.7.2.tgz#c458dedf7983822668b40dcac1eae052c1f6e056"
+ integrity sha512-hdDwvf007V0i2rPCqQVS1fa70CXut17SN3laJYlRHzuqcu8sLLjEoeXihty6c0Ev5g1mw31b8OT8EwRw1s8C4g==
dependencies:
"@babel/runtime" "^7.0.0"
+ file-loader "^6.0.0"
make-cancellable-promise "^1.0.0"
make-event-props "^1.1.0"
merge-class-names "^1.1.1"
- pdfjs-dist "2.1.266"
+ merge-refs "^1.0.0"
+ pdfjs-dist "2.12.313"
prop-types "^15.6.2"
+ tiny-invariant "^1.0.0"
+ tiny-warning "^1.0.0"
react-popper@^2.2.3:
version "2.3.0"
@@ -15024,16 +15097,11 @@ regenerator-runtime@^0.12.0:
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz#fa1a71544764c036f8c49b13a08b2594c9f8a0de"
integrity sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg==
-regenerator-runtime@^0.13.11:
+regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.4:
version "0.13.11"
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"
integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
-regenerator-runtime@^0.13.4:
- version "0.13.9"
- resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz#8925742a98ffd90814988d7566ad30ca3b263b52"
- integrity sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==
-
regenerator-runtime@^0.14.0:
version "0.14.0"
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
@@ -15063,7 +15131,7 @@ regexp.prototype.flags@^1.2.0, regexp.prototype.flags@^1.4.1, regexp.prototype.f
define-properties "^1.1.3"
functions-have-names "^1.2.2"
-regexp.prototype.flags@^1.5.0, regexp.prototype.flags@^1.5.1:
+regexp.prototype.flags@^1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz#90ce989138db209f81492edd734183ce99f9677e"
integrity sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==
@@ -15508,14 +15576,6 @@ scheduler@^0.23.0:
dependencies:
loose-envify "^1.1.0"
-schema-utils@^0.4.0:
- version "0.4.7"
- resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.4.7.tgz#ba74f597d2be2ea880131746ee17d0a093c68187"
- integrity sha512-v/iwU6wvwGK8HbU9yi3/nhGzP0yGSuhQMzL6ySiec1FSrZZDkhm4noOSWzrNFo/jEc+SJY6jRTwuwbSXJPDUnQ==
- dependencies:
- ajv "^6.1.0"
- ajv-keywords "^3.1.0"
-
schema-utils@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-1.0.0.tgz#0b79a93204d7b600d4b2850d1f66c2a34951c770"
@@ -15692,7 +15752,29 @@ set-function-length@^1.1.1:
gopd "^1.0.1"
has-property-descriptors "^1.0.0"
-set-function-name@^2.0.0, set-function-name@^2.0.1:
+set-function-length@^1.2.1:
+ version "1.2.2"
+ resolved "https://registry.yarnpkg.com/set-function-length/-/set-function-length-1.2.2.tgz#aac72314198eaed975cf77b2c3b6b880695e5449"
+ integrity sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==
+ dependencies:
+ define-data-property "^1.1.4"
+ es-errors "^1.3.0"
+ function-bind "^1.1.2"
+ get-intrinsic "^1.2.4"
+ gopd "^1.0.1"
+ has-property-descriptors "^1.0.2"
+
+set-function-name@^2.0.0:
+ version "2.0.2"
+ resolved "https://registry.yarnpkg.com/set-function-name/-/set-function-name-2.0.2.tgz#16a705c5a0dc2f5e638ca96d8a8cd4e1c2b90985"
+ integrity sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==
+ dependencies:
+ define-data-property "^1.1.4"
+ es-errors "^1.3.0"
+ functions-have-names "^1.2.3"
+ has-property-descriptors "^1.0.2"
+
+set-function-name@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/set-function-name/-/set-function-name-2.0.1.tgz#12ce38b7954310b9f61faa12701620a0c882793a"
integrity sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==
@@ -15776,13 +15858,14 @@ shellwords@^0.1.1:
integrity sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==
side-channel@^1.0.4:
- version "1.0.4"
- resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"
- integrity sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==
+ version "1.0.6"
+ resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.6.tgz#abd25fb7cd24baf45466406b1096b7831c9215f2"
+ integrity sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==
dependencies:
- call-bind "^1.0.0"
- get-intrinsic "^1.0.2"
- object-inspect "^1.9.0"
+ call-bind "^1.0.7"
+ es-errors "^1.3.0"
+ get-intrinsic "^1.2.4"
+ object-inspect "^1.13.1"
sift@^6.0.0:
version "6.0.0"
@@ -16817,7 +16900,12 @@ timers-browserify@^2.0.4:
dependencies:
setimmediate "^1.0.4"
-tiny-warning@^1.0.2:
+tiny-invariant@^1.0.0:
+ version "1.3.3"
+ resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.3.3.tgz#46680b7a873a0d5d10005995eb90a70d74d60127"
+ integrity sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==
+
+tiny-warning@^1.0.0, tiny-warning@^1.0.2:
version "1.0.3"
resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754"
integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==
@@ -17908,14 +17996,14 @@ which-builtin-type@^1.1.3:
which-typed-array "^1.1.9"
which-collection@^1.0.1:
- version "1.0.1"
- resolved "https://registry.yarnpkg.com/which-collection/-/which-collection-1.0.1.tgz#70eab71ebbbd2aefaf32f917082fc62cdcb70906"
- integrity sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/which-collection/-/which-collection-1.0.2.tgz#627ef76243920a107e7ce8e96191debe4b16c2a0"
+ integrity sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==
dependencies:
- is-map "^2.0.1"
- is-set "^2.0.1"
- is-weakmap "^2.0.1"
- is-weakset "^2.0.1"
+ is-map "^2.0.3"
+ is-set "^2.0.3"
+ is-weakmap "^2.0.2"
+ is-weakset "^2.0.3"
which-module@^2.0.0:
version "2.0.0"
@@ -17933,17 +18021,16 @@ which-typed-array@^1.1.11, which-typed-array@^1.1.13:
gopd "^1.0.1"
has-tostringtag "^1.0.0"
-which-typed-array@^1.1.9:
- version "1.1.9"
- resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.9.tgz#307cf898025848cf995e795e8423c7f337efbde6"
- integrity sha512-w9c4xkx6mPidwp7180ckYWfMmvxpjlZuIudNtDf4N/tTAUB8VJbX25qZoAsrtGuYNnGw3pa0AXgbGKRB8/EceA==
+which-typed-array@^1.1.14, which-typed-array@^1.1.9:
+ version "1.1.15"
+ resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.15.tgz#264859e9b11a649b388bfaaf4f767df1f779b38d"
+ integrity sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==
dependencies:
- available-typed-arrays "^1.0.5"
- call-bind "^1.0.2"
+ available-typed-arrays "^1.0.7"
+ call-bind "^1.0.7"
for-each "^0.3.3"
gopd "^1.0.1"
- has-tostringtag "^1.0.0"
- is-typed-array "^1.1.10"
+ has-tostringtag "^1.0.2"
which@^1.2.9:
version "1.3.1"
@@ -18016,14 +18103,6 @@ worker-farm@^1.7.0:
dependencies:
errno "~0.1.7"
-worker-loader@^2.0.0:
- version "2.0.0"
- resolved "https://registry.yarnpkg.com/worker-loader/-/worker-loader-2.0.0.tgz#45fda3ef76aca815771a89107399ee4119b430ac"
- integrity sha512-tnvNp4K3KQOpfRnD20m8xltE3eWh89Ye+5oj7wXEEHKac1P4oZ6p9oTj8/8ExqoSBnk9nu5Pr4nKfQ1hn2APJw==
- dependencies:
- loader-utils "^1.0.0"
- schema-utils "^0.4.0"
-
wrap-ansi@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-2.1.0.tgz#d8fc3d284dd05794fe84973caecdd1cf824fdd85"