diff --git a/CHANGELOG.md b/CHANGELOG.md
index f66d72116f93c131a3b0ce962413cab1a28ede07..ea33dd9abed76b2310c473b904d2f5a52750dc0f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,68 @@
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.
+### [1.7.1](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/compare/v1.7.0...v1.7.1) (2022-01-26)
+
+
+### Features
+
+* **newsletter:** Added feedback image for newsletter ([7cded54](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/7cded54362ed5511602c60d7e26c1505a5bedbdb))
+
+
+### Bug Fixes
+
+* Change text in next button in profile type form in third step ([febb74a](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/febb74a1e6a2d5a954e074a911f430022373e407))
+* **conso:** Resolve issue data doesn't refresh between conso tabs ([74c76c4](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/74c76c4ae7d31443deb69a210763795c82c23e52))
+* **ecogesture:** optimise design, correct text, and fix focus on button ([11945e6](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/11945e614d05db25efb7fb64a08955cce64ef4ee))
+* **faq:** typo ([8e545fa](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/8e545fac7b637e28ee91314be6a35424dacd4974))
+* **waterAlert:** Fix issue unable to activate alert (we already double check in service) ([6b310f7](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/6b310f775a5c8df09420309506f66ee981b5138b))
+
+### [1.7.1](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/compare/v1.7.0...v1.7.1) (2022-01-26)
+
+
+### Features
+
+* **newsletter:** Added feedback image for newsletter ([7cded54](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/7cded54362ed5511602c60d7e26c1505a5bedbdb))
+
+
+### Bug Fixes
+
+* Change text in next button in profile type form in third step ([febb74a](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/febb74a1e6a2d5a954e074a911f430022373e407))
+* **conso:** Resolve issue data doesn't refresh between conso tabs ([74c76c4](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/74c76c4ae7d31443deb69a210763795c82c23e52))
+* **ecogesture:** optimise design, correct text, and fix focus on button ([11945e6](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/11945e614d05db25efb7fb64a08955cce64ef4ee))
+* **faq:** typo ([8e545fa](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/8e545fac7b637e28ee91314be6a35424dacd4974))
+* **waterAlert:** Fix issue unable to activate alert (we already double check in service) ([6b310f7](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/6b310f775a5c8df09420309506f66ee981b5138b))
+
+### [1.7.1](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/compare/v1.4.4...v1.7.1) (2022-01-26)
+
+### Bug Fixes
+
+- fix tagging issue
+
+## [1.7.0](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/compare/v1.5.0...v1.7.0) (2022-01-21)
+
+### Features
+
+- add migration to delete price on month and year ([b961103](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/b961103bff0a6840ae7f7f254e91b079f8b8850e))
+- **analysis:** Add info modal for special elec card ([931a7e7](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/931a7e7ab1ac0b9e42f453cd8c18298f8d2eb173))
+- **Analysis:** Inform user when analysis cannot be processed ([f001b4d](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/f001b4d28152c8529f0e811bb3c39c3b2197c594))
+- **ecogesture:** Add visualisation by ecogesture status + navigation ([f82835e](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/f82835ec0fea7c99544f4d9eb3d9f599353094b6))
+- **ecogestures:** Add ecogesture selection tunnel ([41d3716](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/41d371602e3926082d25d74ca2b6a218b5520345))
+- **ecogestures:** Create ecogesture form ([c062e48](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/c062e48a88f5445c872832255a47be0deb78c08d))
+- **Feedback:** user can more easily consult the FAQ before sending its feedback ([994651a](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/994651aaf80a7b17fabff3421da3f5566fa87540))
+- **fluidPrices:** Dynamic prices for EGL fluid ([f02c8a9](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/f02c8a968b74b5540d06a0b0766f1d7325e7bf34))
+
+### Bug Fixes
+
+- add space in FAQ content ([ddcb262](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/ddcb2620384dfc153694823d85f0cd640c90d8b8))
+- adjust height of content on desktop view ([684fbc1](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/684fbc175dc3af5cf1f19c643e8b091cd1642623))
+- **alpha:** Fix alpha issue with oauth konnectors ([c5ffee2](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/c5ffee2c1e554a4fc76d0906517314f1d7fa91ff))
+- change invisible char by space and add a translation ([49ce0b8](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/49ce0b847e8c07b1d1ec19b290d0b19d4bfaf4f1))
+- change the global content height ([d0678b0](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/d0678b0474c16e59b0ff1f7463078bbea9dd7317))
+- prevent duplicate konnector jobs ([21615d2](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/21615d241334faaa02f5b6b17e336a89e80cb070))
+- **profile:** display correctly the navigation in the profile type form for iphone 11 and above ([9d3d180](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/9d3d1809821b7c868be5bafa5ff5802b41b1bf7c))
+- update date processing for fluidPrice service ([0a7bbf1](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/commit/0a7bbf1d8348f40f0baa14a1157ae3d7e8a29cc6))
+
### [1.6.5](https://forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/compare/v1.5.0...v1.6.5) (2022-01-13)
### Bug Fixes
diff --git a/manifest.webapp b/manifest.webapp
index 352196fcdceb928a24f6fa82f1af85459a63caaf..ae6aa278d29a5e34035c34b174bbc778610524b4 100644
--- a/manifest.webapp
+++ b/manifest.webapp
@@ -3,7 +3,7 @@
"slug": "ecolyo",
"icon": "icon.svg",
"categories": ["energy"],
- "version": "1.6.5",
+ "version": "1.7.1",
"licence": "AGPL-3.0",
"editor": "Métropole de Lyon",
"default_locale": "fr",
diff --git a/package.json b/package.json
index b18b871a48370ed762ca3b537c6921a5b5a02fd3..2ec391a2fad51c3d387c3298a84a0d0dca10f06c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "ecolyo",
- "version": "1.6.5",
+ "version": "1.7.1",
"scripts": {
"tx": "tx pull --all || true",
"lint": "yarn lint:js && yarn lint:styles",
diff --git a/src/assets/icons/email/feedback.svg b/src/assets/icons/email/feedback.svg
new file mode 100644
index 0000000000000000000000000000000000000000..8da7af00dc35761c0d7594c0e10092f5131b3014
--- /dev/null
+++ b/src/assets/icons/email/feedback.svg
@@ -0,0 +1,13 @@
+<svg width="54" height="53" viewBox="0 0 54 53" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.53418" width="52.9315" height="52.9315" rx="5.29315" fill="#E3B82A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.4246 36.5928C18.6244 38.8906 16.9914 41.4597 13.9325 43.668C19.3905 43.668 23.6562 41.0197 26.5632 38.1261C26.9446 38.1448 27.3292 38.1542 27.7167 38.1542C37.6134 38.1542 45.6362 31.9828 45.6362 24.37C45.6362 16.7572 37.6134 10.5858 27.7167 10.5858C17.8201 10.5858 9.79723 16.7572 9.79722 24.37C9.79722 29.6814 13.7024 34.2911 19.4246 36.5928Z" fill="url(#paint0_radial_12097_71860)"/>
+<rect x="36.9365" y="23.1191" width="3.68026" height="3.68026" transform="rotate(90 36.9365 23.1191)" fill="#E3B82A"/>
+<rect x="29.5762" y="23.1191" width="3.68026" height="3.68026" transform="rotate(90 29.5762 23.1191)" fill="#E3B82A"/>
+<rect x="22.2153" y="23.1191" width="3.68026" height="3.68026" transform="rotate(90 22.2153 23.1191)" fill="#E3B82A"/>
+<defs>
+<radialGradient id="paint0_radial_12097_71860" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(27.7167 42.6341) rotate(-90) scale(10.1314 21.7354)">
+<stop stop-color="#2A2B30"/>
+<stop offset="1" stop-color="#1B1C22"/>
+</radialGradient>
+</defs>
+</svg>
diff --git a/src/assets/icons/ico/doing-disabled.svg b/src/assets/icons/ico/doing-disabled.svg
new file mode 100644
index 0000000000000000000000000000000000000000..77db903d23e7a3521412f0f02e3f30218344f742
--- /dev/null
+++ b/src/assets/icons/ico/doing-disabled.svg
@@ -0,0 +1,18 @@
+<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_11435_1783)">
+<g clip-path="url(#clip1_11435_1783)">
+<path d="M22.6828 5.17873C22.6213 5.17821 22.5599 5.17769 22.5049 5.17578L20.1355 5.06101L20.1208 5.34363C20.036 5.36172 19.9527 5.38632 19.86 5.39928L18.5192 32.5978C18.6058 32.6202 18.6887 32.6571 18.7687 32.6809L18.7554 32.97L21.1249 33.0848L21.1235 33.0783C21.185 33.0788 21.2413 33.0872 21.3041 33.0943C28.2765 33.4403 34.2422 27.4707 34.6219 19.7618C35.0082 12.0515 29.6617 5.5234 22.6828 5.17873Z" fill="#666666"/>
+<path d="M32.1416 19.6335C32.5219 11.9257 27.175 5.39835 20.1991 5.05418C13.2231 4.71002 7.25973 10.6794 6.87946 18.3871C6.49919 26.0949 11.8461 32.6223 18.822 32.9664C25.798 33.3106 31.7614 27.3412 32.1416 19.6335Z" fill="#989898"/>
+<path d="M29.5447 19.505C29.847 13.3785 25.5995 8.1904 20.0577 7.91699C14.5159 7.64358 9.77837 12.3884 9.47612 18.5149C9.17386 24.6414 13.4213 29.8296 18.9631 30.103C24.5049 30.3764 29.2424 25.6315 29.5447 19.505Z" fill="#E5E5E5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M25.3898 12.9541C26.0218 13.4046 26.1688 14.2822 25.7183 14.9142L18.6774 24.7898C18.4244 25.1447 18.0211 25.3621 17.5856 25.3784C17.1501 25.3946 16.7317 25.2079 16.4529 24.873L13.0806 20.8207C12.5842 20.2242 12.6653 19.3381 13.2619 18.8416C13.8585 18.3451 14.7445 18.4263 15.241 19.0228L17.4472 21.6738L23.4297 13.2825C23.8803 12.6506 24.7578 12.5035 25.3898 12.9541Z" fill="#C0C0C0"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_11435_1783">
+<rect width="40" height="40" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+<clipPath id="clip1_11435_1783">
+<rect width="40" height="40" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/ico/doing-enabled.svg b/src/assets/icons/ico/doing-enabled.svg
new file mode 100644
index 0000000000000000000000000000000000000000..87ca053f52ebf01622b7ce52f26f83b7f2ff1c05
--- /dev/null
+++ b/src/assets/icons/ico/doing-enabled.svg
@@ -0,0 +1,19 @@
+<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_11435_1751)">
+<g clip-path="url(#clip1_11435_1751)">
+<path d="M22.6828 5.17873C22.6213 5.17821 22.5599 5.17769 22.5049 5.17578L20.1355 5.06101L20.1208 5.34363C20.036 5.36172 19.9527 5.38632 19.86 5.39928L18.5192 32.5978C18.6058 32.6202 18.6887 32.6571 18.7687 32.6809L18.7554 32.97L21.1249 33.0848L21.1235 33.0783C21.185 33.0788 21.2413 33.0872 21.3041 33.0943C28.2765 33.4403 34.2422 27.4707 34.6219 19.7618C35.0082 12.0515 29.6617 5.5234 22.6828 5.17873Z" fill="#2B6F1F"/>
+<path d="M34.4793 16.7926L31.863 16.192L18.5297 32.3908L18.5192 32.5975C18.6058 32.6199 18.6887 32.6568 18.7687 32.6806L18.7554 32.9697L21.1249 33.0845L21.1235 33.078C21.185 33.0785 21.2413 33.0869 21.3041 33.094C28.2765 33.44 34.2422 27.4705 34.6219 19.7615C34.6768 18.7409 34.6223 17.7505 34.4793 16.7926Z" fill="#295721"/>
+<path d="M32.1416 19.6335C32.5219 11.9257 27.175 5.39835 20.1991 5.05418C13.2231 4.71002 7.25973 10.6794 6.87946 18.3871C6.49919 26.0949 11.8461 32.6223 18.822 32.9664C25.798 33.3106 31.7614 27.3412 32.1416 19.6335Z" fill="#1ABA00"/>
+<path d="M29.5447 19.505C29.847 13.3785 25.5995 8.1904 20.0577 7.91699C14.5159 7.64358 9.77837 12.3884 9.47612 18.5149C9.17386 24.6414 13.4213 29.8296 18.9631 30.103C24.5049 30.3764 29.2424 25.6315 29.5447 19.505Z" fill="white"/>
+<path d="M26.1254 15.2044C26.7363 14.3476 26.5369 13.1578 25.6801 12.5469C24.8233 11.9361 23.6335 12.1355 23.0226 12.9923L17.4166 20.8554L15.6253 18.703C14.9522 17.8942 13.7509 17.7842 12.942 18.4573C12.1332 19.1304 12.0232 20.3317 12.6963 21.1406L16.0686 25.1928C16.4466 25.647 17.0139 25.9001 17.6043 25.878C18.1947 25.8559 18.7415 25.5612 19.0846 25.0801L26.1254 15.2044Z" fill="#1ABA00" stroke="white" stroke-linejoin="round"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_11435_1751">
+<rect width="40" height="40" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+<clipPath id="clip1_11435_1751">
+<rect width="40" height="40" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/ico/objective-disabled.svg b/src/assets/icons/ico/objective-disabled.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b0304a2e21698302639bb0f63385ce1ab0838643
--- /dev/null
+++ b/src/assets/icons/ico/objective-disabled.svg
@@ -0,0 +1,15 @@
+<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_11435_2942)">
+<path d="M22.0284 4.8345C21.9671 4.83784 21.9057 4.84118 21.8507 4.84273L19.4788 4.87705L19.4819 5.16003C19.3984 5.1834 19.3168 5.2132 19.2251 5.23195L19.5957 32.461C19.6836 32.4779 19.7686 32.5095 19.85 32.5282L19.8549 32.8176L22.2268 32.7833L22.225 32.7769C22.2864 32.7735 22.3431 32.7784 22.4063 32.7815C29.3866 32.6888 34.9655 26.3562 34.8602 18.6387C34.7613 10.9193 29.0152 4.74003 22.0284 4.8345Z" fill="#666666"/>
+<path d="M32.3767 18.6669C32.272 10.9505 26.5256 4.77191 19.5418 4.8667C12.558 4.96148 6.98141 11.2937 7.08613 19.0101C7.19086 26.7265 12.9372 32.9051 19.921 32.8103C26.9048 32.7155 32.4814 26.3833 32.3767 18.6669Z" fill="#989898"/>
+<path d="M29.777 18.7024C29.6937 12.5691 25.1287 7.65802 19.5807 7.73332C14.0327 7.80862 9.60258 12.8417 9.68583 18.9751C9.76907 25.1085 14.3341 30.0195 19.8821 29.9442C25.4301 29.8689 29.8602 24.8358 29.777 18.7024Z" fill="#E5E5E5"/>
+<path d="M27.1838 18.7373C27.1221 14.187 23.7354 10.5435 19.6195 10.5994C15.5036 10.6552 12.217 14.3893 12.2788 18.9396C12.3406 23.4899 15.7272 27.1334 19.8431 27.0776C23.9591 27.0217 27.2456 23.2876 27.1838 18.7373Z" fill="#989898"/>
+<path d="M24.5908 18.7725C24.5506 15.8089 22.3423 13.436 19.6585 13.4724C16.9747 13.5088 14.8317 15.9408 14.8719 18.9044C14.9121 21.868 17.1204 24.241 19.8042 24.2046C22.488 24.1681 24.631 21.7361 24.5908 18.7725Z" fill="#E5E5E5"/>
+<path d="M21.9912 18.8076C21.9725 17.427 20.9455 16.3216 19.6975 16.3385C18.4495 16.3555 17.453 17.4884 17.4717 18.8689C17.4904 20.2495 18.5173 21.3549 19.7654 21.338C21.0134 21.321 22.0099 20.1881 21.9912 18.8076Z" fill="#989898"/>
+</g>
+<defs>
+<clipPath id="clip0_11435_2942">
+<rect width="40" height="40" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/ico/objective-enabled.svg b/src/assets/icons/ico/objective-enabled.svg
new file mode 100644
index 0000000000000000000000000000000000000000..eb15ce13b268c126676d99edd9fdfbe7c7b0e0c3
--- /dev/null
+++ b/src/assets/icons/ico/objective-enabled.svg
@@ -0,0 +1,29 @@
+<svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_11435_17184)">
+<path d="M22.0284 4.8345C21.9671 4.83784 21.9057 4.84118 21.8507 4.84273L19.4788 4.87705L19.4819 5.16003C19.3984 5.1834 19.3168 5.2132 19.2251 5.23195L19.5957 32.461C19.6836 32.4779 19.7686 32.5095 19.85 32.5282L19.8549 32.8176L22.2268 32.7833L22.225 32.7769C22.2864 32.7735 22.3431 32.7784 22.4063 32.7815C29.3866 32.6888 34.9655 26.3562 34.8602 18.6387C34.7613 10.9193 29.0152 4.74003 22.0284 4.8345Z" fill="#1B4D97"/>
+<path d="M34.5313 15.6846L31.8824 15.2496L19.5931 32.2541L19.5957 32.461C19.6835 32.478 19.7685 32.5096 19.8499 32.5283L19.8548 32.8177L22.2268 32.7834L22.225 32.777C22.2864 32.7736 22.3431 32.7785 22.4063 32.7816C29.3866 32.6889 34.9655 26.3563 34.8602 18.6387C34.8509 17.6167 34.7342 16.6317 34.5313 15.6846Z" fill="#0C2C5B"/>
+<path d="M32.3767 18.6669C32.272 10.9505 26.5256 4.77191 19.5418 4.8667C12.558 4.96148 6.98141 11.2937 7.08613 19.0101C7.19086 26.7265 12.9372 32.9051 19.921 32.8103C26.9048 32.7155 32.4814 26.3833 32.3767 18.6669Z" fill="#538DE3"/>
+<path d="M29.777 18.7024C29.6937 12.5691 25.1287 7.65802 19.5807 7.73332C14.0327 7.80862 9.60258 12.8417 9.68583 18.9751C9.76907 25.1085 14.3341 30.0195 19.8821 29.9442C25.4301 29.8689 29.8602 24.8358 29.777 18.7024Z" fill="white"/>
+<path d="M27.1838 18.7373C27.1221 14.187 23.7354 10.5435 19.6195 10.5994C15.5036 10.6552 12.217 14.3893 12.2788 18.9396C12.3406 23.4899 15.7272 27.1334 19.8431 27.0776C23.9591 27.0217 27.2456 23.2876 27.1838 18.7373Z" fill="#538DE3"/>
+<path d="M24.5908 18.7725C24.5506 15.8089 22.3423 13.436 19.6585 13.4724C16.9747 13.5088 14.8317 15.9408 14.8719 18.9044C14.9121 21.868 17.1204 24.241 19.8042 24.2046C22.488 24.1681 24.631 21.7361 24.5908 18.7725Z" fill="white"/>
+<path d="M21.9912 18.8076C21.9725 17.427 20.9455 16.3216 19.6975 16.3385C18.4495 16.3555 17.453 17.4884 17.4717 18.8689C17.4904 20.2495 18.5173 21.3549 19.7654 21.338C21.0134 21.321 22.0099 20.1881 21.9912 18.8076Z" fill="#538DE3"/>
+<path opacity="0.35" d="M9.97602 27.6783C10.3998 28.252 10.8677 28.7855 11.3733 29.2808L19.6986 19.7767L19.0851 19.2424L17.3469 19.2653L9.97602 27.6783Z" fill="#0C2C5B"/>
+<path d="M19.5667 17.9404C19.5534 17.9404 19.5401 17.9404 19.5334 17.9404L3.16672 13.5938V13.6004C3.42672 13.7271 3.54005 14.1738 3.41339 14.6604C3.28672 15.1404 2.96672 15.4738 2.68005 15.4604L19.0067 19.7938C19.0267 19.8071 19.0467 19.8138 19.0734 19.8204C19.3801 19.9004 19.7401 19.5471 19.8801 19.0271C20.0067 18.5071 19.8734 18.0204 19.5667 17.9404Z" fill="#BCB1C9"/>
+<path d="M19.9068 18.4404L19.1668 18.2471L19.0201 18.2071L3.44676 14.0737C3.46676 14.2204 3.46676 14.3871 3.42676 14.5671L18.7868 18.6471L19.0401 18.7137L19.8868 18.9404C19.9268 18.7537 19.9268 18.5871 19.9068 18.4404Z" fill="#EAEAEA"/>
+<path d="M19.18 19.2667L18.7067 19.14L3.25334 15.04C3.10001 15.3067 2.88001 15.4667 2.68001 15.4534L2.67334 15.4667L19.04 19.8134V19.8C19.0467 19.8067 19.06 19.8134 19.0667 19.8134C19.2867 19.8734 19.54 19.7 19.7133 19.4067L19.18 19.2667Z" fill="#8B8496"/>
+<path d="M3.44529 14.6675C3.58323 14.1479 3.44696 13.6609 3.14092 13.5796C2.83489 13.4984 2.47497 13.8537 2.33704 14.3732C2.1991 14.8928 2.33537 15.3798 2.64141 15.4611C2.94744 15.5423 3.30735 15.187 3.44529 14.6675Z" fill="#EAEAEA"/>
+<path d="M4.58001 13.9735L5.24001 14.1468L4.71334 11.5335L4.05334 11.3535L4.58001 13.9735Z" fill="#F3D4FE"/>
+<path d="M6.87996 14.5801L7.53996 14.7534L7.03329 12.0801L6.37329 11.9067L6.87996 14.5801Z" fill="#F3D4FE"/>
+<path d="M5.05338 14.1002L4.59338 11.4868C4.59338 11.4868 5.41338 11.7068 5.63338 11.7601C6.18672 11.9068 7.12672 13.6735 7.12672 13.6735L6.73338 12.0002C6.73338 12.0002 7.98005 12.3335 8.40005 12.4402C8.81338 12.5535 9.33338 15.2268 9.33338 15.2268L5.05338 14.1002Z" fill="#D96FFF"/>
+<path opacity="0.45" d="M8.33994 14.4204L7.41327 13.0337L7.70661 14.2537L4.43994 13.387L4.57994 13.9737L5.05994 14.1004L5.24661 14.147L9.34661 15.2337C9.34661 15.2337 9.29327 15.087 9.18661 14.6404L8.33994 14.4204Z" fill="#9F25CA"/>
+<path d="M4.08012 15.8472L4.74012 16.0205L2.98678 18.0338L2.32678 17.8538L4.08012 15.8472Z" fill="#B67DCA"/>
+<path d="M6.38019 16.4536L7.04019 16.6336L5.27353 18.7069L4.61353 18.5269L6.38019 16.4536Z" fill="#B67DCA"/>
+<path d="M4.56015 15.9736L2.86682 18.0136C2.86682 18.0136 3.68682 18.2336 3.90682 18.287C4.46015 18.4336 6.15349 17.367 6.15349 17.367L4.98015 18.627C4.98015 18.627 6.22682 18.9603 6.64682 19.067C7.06015 19.1803 8.84015 17.107 8.84015 17.107L4.56015 15.9736Z" fill="#8C18B6"/>
+<path opacity="0.45" d="M7.56674 17.3203L6.07341 18.0603L6.93341 17.147L3.70007 16.287L4.08007 15.8403L4.56007 15.967L4.74674 16.0137L8.84674 17.1003C8.84674 17.1003 8.75341 17.207 8.44674 17.547L7.56674 17.3203Z" fill="#590478"/>
+</g>
+<defs>
+<clipPath id="clip0_11435_17184">
+<rect width="40" height="40" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/ico/skip-enabled.svg b/src/assets/icons/ico/skip-enabled.svg
new file mode 100644
index 0000000000000000000000000000000000000000..791506267456762edfebe96bd22b15138f6cbd75
--- /dev/null
+++ b/src/assets/icons/ico/skip-enabled.svg
@@ -0,0 +1,14 @@
+<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_11109_67546)">
+<path d="M34.0241 7.0181C33.9319 7.01732 33.8397 7.01654 33.7573 7.01368L30.2032 6.84152L30.1811 7.26545C30.054 7.29258 29.9289 7.32948 29.7899 7.34892L27.7788 48.1467C27.9087 48.1803 28.0329 48.2356 28.153 48.2713L28.1331 48.705L31.6873 48.8772L31.6852 48.8674C31.7774 48.8682 31.8619 48.8808 31.9561 48.8914C42.4147 49.4105 51.3632 40.4561 51.9328 28.8927C52.5123 17.3272 44.4924 7.53509 34.0241 7.0181Z" fill="#8C2929"/>
+<path d="M51.7189 24.4391L47.7945 23.5382L27.7944 47.8364L27.7788 48.1465C27.9087 48.1801 28.0329 48.2354 28.153 48.2711L28.1331 48.7049L31.6873 48.877L31.6852 48.8672C31.7774 48.868 31.8619 48.8807 31.9561 48.8912C42.4147 49.4103 51.3632 40.4559 51.9328 28.8925C52.0152 27.3616 51.9334 25.876 51.7189 24.4391Z" fill="#681818"/>
+<path d="M48.2123 28.7005C48.7827 17.1388 40.7624 7.34778 30.2985 6.83153C19.8346 6.31528 10.8895 15.2693 10.3191 26.831C9.74866 38.3926 17.769 48.1836 28.2329 48.6999C38.6968 49.2161 47.6419 40.2621 48.2123 28.7005Z" fill="#E24444"/>
+<path d="M44.3172 28.5078C44.7706 19.3181 38.3994 11.5358 30.0867 11.1257C21.774 10.7156 14.6677 17.8329 14.2144 27.0226C13.761 36.2124 20.1322 43.9946 28.4449 44.4047C36.7575 44.8148 43.8638 37.6975 44.3172 28.5078Z" fill="white"/>
+<rect x="39.1628" y="12" width="6.17925" height="37" transform="rotate(45 39.1628 12)" fill="#E24444"/>
+</g>
+<defs>
+<clipPath id="clip0_11109_67546">
+<rect width="60" height="60" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/visu/equipments/AIR_CONDITIONING.svg b/src/assets/icons/visu/equipments/AIR_CONDITIONING.svg
new file mode 100644
index 0000000000000000000000000000000000000000..858c9490013d2d14ffcdd58ace24376c410c5659
--- /dev/null
+++ b/src/assets/icons/visu/equipments/AIR_CONDITIONING.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_12059_7514)">
+<path d="M10.7429 1.0755C14.5566 -1.87438 18.6962 1.72741 19.6252 7.3338C20.326 7.3338 21.0105 7.52937 21.6298 7.88792C22.4773 6.91006 23.2269 5.57365 22.9336 4.07427C22.2491 0.570272 26.1768 -2.26552 29.909 2.57488C32.8589 6.38853 29.2571 10.5281 23.6344 11.4571C23.6344 12.1579 23.4551 12.8587 23.0803 13.478C24.0581 14.3092 25.3945 15.0589 26.8939 14.7655C30.3653 14.081 33.2174 17.9925 28.377 21.7409C24.5634 24.6908 20.4238 21.089 19.4948 15.4826C18.794 15.4826 18.1095 15.2708 17.5065 14.9122C16.659 15.8901 15.893 17.2428 16.1864 18.7422C16.8709 22.2299 12.9431 25.0819 9.21097 20.2415C6.2448 16.4116 9.86287 12.272 15.4856 11.3593C15.4856 10.6585 15.6974 9.97402 16.056 9.35471C15.0781 8.52353 13.7417 7.75754 12.226 8.0509C8.75463 8.7354 5.90254 4.82396 10.7429 1.0755ZM8.15162 26.0761H11.4112C12.2756 26.0761 13.1047 26.4195 13.716 27.0308C14.3273 27.6421 14.6707 28.4711 14.6707 29.3356V39.1142H11.4112V35.8547H8.15162V39.1142H4.89209V29.3356C4.89209 28.4711 5.2355 27.6421 5.84678 27.0308C6.45806 26.4195 7.28714 26.0761 8.15162 26.0761ZM8.15162 29.3356V32.5952H11.4112V29.3356H8.15162ZM21.0757 26.0761H24.4493L19.6741 39.1142H16.3004L21.0757 26.0761ZM29.3386 26.0761H34.2279V29.3356H29.3386V35.8547H34.2279V39.1142H29.3386C28.4741 39.1142 27.645 38.7708 27.0337 38.1595C26.4225 37.5482 26.079 36.7192 26.079 35.8547V29.3356C26.079 28.4711 26.4225 27.6421 27.0337 27.0308C27.645 26.4195 28.4741 26.0761 29.3386 26.0761Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_12059_7514">
+<rect width="40" height="40" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/visu/equipments/BOILER.svg b/src/assets/icons/visu/equipments/BOILER.svg
new file mode 100644
index 0000000000000000000000000000000000000000..336811783d51a91db43116976c0b1f6bcd7ded61
--- /dev/null
+++ b/src/assets/icons/visu/equipments/BOILER.svg
@@ -0,0 +1,3 @@
+<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="M10 2C8.89543 2 8 2.89543 8 4V35C8 35.9835 8.7099 36.8012 9.64524 36.9686C9.65764 36.9349 9.67069 36.9012 9.68439 36.8676L12.13 30.8676C12.5904 29.7383 13.6886 29 14.9081 29L25.1646 29.0001C26.3025 29.0001 27.3425 29.6438 27.8498 30.6623L30.839 36.6622C30.8597 36.7039 30.8794 36.7456 30.898 36.7876C31.5516 36.4586 32 35.7816 32 35V4C32 2.89543 31.1046 2 30 2H10ZM30.4248 36.9548C30.4141 36.9315 30.403 36.9083 30.3914 36.8852L27.4023 30.8853C26.9795 30.0365 26.1129 29.5001 25.1646 29.5001L14.9081 29.5C13.8918 29.5 12.9767 30.1152 12.5931 31.0564L10.1704 37H30C30.1458 37 30.2879 36.9844 30.4248 36.9548ZM16.5 35C17.3284 35 18 34.3284 18 33.5C18 32.6716 17.3284 32 16.5 32C15.6716 32 15 32.6716 15 33.5C15 34.3284 15.6716 35 16.5 35ZM25 33.5C25 34.3284 24.3284 35 23.5 35C22.6716 35 22 34.3284 22 33.5C22 32.6716 22.6716 32 23.5 32C24.3284 32 25 32.6716 25 33.5ZM20.8549 8.48117L20 9L19.1451 8.48117L20 7.07258L20.8549 8.48117ZM20 23C17.5838 23 15.625 21.0412 15.625 18.625C15.625 16.7598 18.232 12.0388 19.4211 9.98246C19.7724 9.37494 20 9 20 9C20 9 20.2275 9.37494 20.5789 9.98246C21.768 12.0388 24.375 16.7598 24.375 18.625C24.375 21.0412 22.4162 23 20 23ZM20 23C18.5503 23 17.375 21.8982 17.375 20.5391C17.375 19.1799 20 15.125 20 15.125C20 15.125 22.625 19.1799 22.625 20.5391C22.625 21.8982 21.4497 23 20 23ZM20.855 8.48138C20.8549 8.48126 20.8549 8.48117 20 9C19.1451 8.48117 19.1451 8.48126 19.145 8.48138L19.1448 8.48175L19.144 8.48299L19.1413 8.48741L19.1313 8.50397L19.0934 8.56693C19.0605 8.6218 19.0126 8.702 18.9518 8.80459C18.8302 9.00974 18.657 9.30465 18.4494 9.66579C18.0347 10.3873 17.4805 11.3768 16.9252 12.4452C16.3715 13.5105 15.8084 14.6697 15.3814 15.7273C14.9725 16.7397 14.625 17.8061 14.625 18.625C14.625 21.5935 17.0315 24 20 24C22.9685 24 25.375 21.5935 25.375 18.625C25.375 17.8061 25.0275 16.7397 24.6186 15.7273C24.1916 14.6697 23.6285 13.5105 23.0748 12.4452C22.5195 11.3768 21.9653 10.3873 21.5506 9.66579C21.343 9.30465 21.1698 9.00974 21.0482 8.80459C20.9874 8.702 20.9395 8.6218 20.9066 8.56693L20.8687 8.50397L20.8587 8.48741L20.856 8.48299L20.8552 8.48175L20.855 8.48138Z" fill="#121212"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/COMPUTER.svg b/src/assets/icons/visu/equipments/COMPUTER.svg
new file mode 100644
index 0000000000000000000000000000000000000000..a4724683f54b886a14aa4a8228870a8954eca3f4
--- /dev/null
+++ b/src/assets/icons/visu/equipments/COMPUTER.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.25953 29.8167H34.5953V8.62977C34.5953 8.19752 34.4236 7.78299 34.118 7.47735C33.8123 7.17171 33.3978 7 32.9655 7H6.8893C6.45706 7 6.04252 7.17171 5.73688 7.47735C5.43124 7.78299 5.25953 8.19752 5.25953 8.62977V29.8167ZM3.62977 33.0762H36.2251C37.8548 33.0762 37.8548 31.4465 37.8548 31.4465H2C2 31.4465 2 33.0762 3.62977 33.0762Z" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/COOKING_PLATES.svg b/src/assets/icons/visu/equipments/COOKING_PLATES.svg
new file mode 100644
index 0000000000000000000000000000000000000000..8f2dd5d7ca4b87b5e4c39c89f5be420186878016
--- /dev/null
+++ b/src/assets/icons/visu/equipments/COOKING_PLATES.svg
@@ -0,0 +1,5 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 13C17 14.6569 15.6569 16 14 16C12.3431 16 11 14.6569 11 13C11 11.3431 12.3431 10 14 10C15.6569 10 17 11.3431 17 13Z" fill="black"/>
+<path d="M14 30C15.6569 30 17 28.6569 17 27C17 25.3431 15.6569 24 14 24C12.3431 24 11 25.3431 11 27C11 28.6569 12.3431 30 14 30Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4 32L4 8C4 6.93914 4.34768 5.92172 4.96655 5.17157C5.58542 4.42143 6.42479 4 7.3 4L33.7 4C34.5752 4 35.4146 4.42143 36.0334 5.17157C36.6523 5.92172 37 6.93913 37 8V32C37 33.0609 36.6523 34.0783 36.0334 34.8284C35.4146 35.5786 34.5752 36 33.7 36H7.3C6.42479 36 5.58542 35.5786 4.96655 34.8284C4.34768 34.0783 4 33.0609 4 32ZM32 13C32 14.1046 31.1046 15 30 15C28.8954 15 28 14.1046 28 13C28 11.8954 28.8954 11 30 11C31.1046 11 32 11.8954 32 13ZM20 13C20 16.3137 17.3137 19 14 19C10.6863 19 8 16.3137 8 13C8 9.68629 10.6863 7 14 7C17.3137 7 20 9.68629 20 13ZM14 33C17.3137 33 20 30.3137 20 27C20 23.6863 17.3137 21 14 21C10.6863 21 8 23.6863 8 27C8 30.3137 10.6863 33 14 33ZM30 29C31.1046 29 32 28.1046 32 27C32 25.8954 31.1046 25 30 25C28.8954 25 28 25.8954 28 27C28 28.1046 28.8954 29 30 29Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/CURTAIN.svg b/src/assets/icons/visu/equipments/CURTAIN.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5a08753799d8f35408fa00f99826f305fd8fcc4d
--- /dev/null
+++ b/src/assets/icons/visu/equipments/CURTAIN.svg
@@ -0,0 +1,7 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="8" width="34" height="1" rx="0.5" fill="#121212"/>
+<path d="M7 10V33H13C13 30 12 27.5 10 25.5C17.5 22 20 13.3333 20 10H7Z" fill="#121212"/>
+<path d="M33 10V33H26.5C26.5 30 28 27.5 30 25.5C22.5 22 20 13.3333 20 10H33Z" fill="#121212"/>
+<circle cx="4.5" cy="8.5" r="1.5" fill="#121212"/>
+<circle cx="35.5" cy="8.5" r="1.5" fill="#121212"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/DISHWASHER.svg b/src/assets/icons/visu/equipments/DISHWASHER.svg
new file mode 100644
index 0000000000000000000000000000000000000000..bd2f6bd6d6c0f0f048ab2559736900f2abe6a089
--- /dev/null
+++ b/src/assets/icons/visu/equipments/DISHWASHER.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M29.4529 3.25977H9.89576C9.03128 3.25977 8.20221 3.60318 7.59092 4.21446C6.97964 4.82574 6.63623 5.65481 6.63623 6.5193V32.5955C6.63623 33.46 6.97964 34.2891 7.59092 34.9004C8.20221 35.5117 9.03128 35.8551 9.89576 35.8551H29.4529C30.3174 35.8551 31.1465 35.5117 31.7578 34.9004C32.3691 34.2891 32.7125 33.46 32.7125 32.5955V6.5193C32.7125 5.65481 32.3691 4.82574 31.7578 4.21446C31.1465 3.60318 30.3174 3.25977 29.4529 3.25977ZM16.4148 6.5193C16.8471 6.5193 17.2616 6.691 17.5672 6.99664C17.8729 7.30228 18.0446 7.71682 18.0446 8.14906C18.0446 8.5813 17.8729 8.99584 17.5672 9.30148C17.2616 9.60712 16.8471 9.77883 16.4148 9.77883C15.9826 9.77883 15.568 9.60712 15.2624 9.30148C14.9568 8.99584 14.7851 8.5813 14.7851 8.14906C14.7851 7.71682 14.9568 7.30228 15.2624 6.99664C15.568 6.691 15.9826 6.5193 16.4148 6.5193ZM11.5255 6.5193C11.9578 6.5193 12.3723 6.691 12.6779 6.99664C12.9836 7.30228 13.1553 7.71682 13.1553 8.14906C13.1553 8.5813 12.9836 8.99584 12.6779 9.30148C12.3723 9.60712 11.9578 9.77883 11.5255 9.77883C11.0933 9.77883 10.6787 9.60712 10.3731 9.30148C10.0675 8.99584 9.89576 8.5813 9.89576 8.14906C9.89576 7.71682 10.0675 7.30228 10.3731 6.99664C10.6787 6.691 11.0933 6.5193 11.5255 6.5193ZM29.4529 32.5955H9.89576V13.0384H29.4529V32.5955ZM24.0258 24.9845C24.0584 26.1254 23.6021 27.2336 22.7872 28.0485C22.3785 28.4575 21.8933 28.782 21.3592 29.0033C20.825 29.2247 20.2525 29.3387 19.6744 29.3387C19.0962 29.3387 18.5237 29.2247 17.9895 29.0033C17.4554 28.782 16.9702 28.4575 16.5615 28.0485C15.7466 27.2336 15.2903 26.1254 15.3229 24.9845C15.437 23.8274 15.8118 22.7192 16.4148 21.725C17.0178 20.3723 17.7349 19.1174 18.5824 17.9277L19.6744 16.2979C22.5916 20.519 24.0258 23.4037 24.0258 24.9845Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/DRYER.svg b/src/assets/icons/visu/equipments/DRYER.svg
new file mode 100644
index 0000000000000000000000000000000000000000..bc38f186ac64e33a70070f3c867b80b354134e05
--- /dev/null
+++ b/src/assets/icons/visu/equipments/DRYER.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.2595 4H29.8167C30.6812 4 31.5103 4.34341 32.1215 4.95469C32.7328 5.56597 33.0762 6.39505 33.0762 7.25953V33.3358C33.0762 34.2003 32.7328 35.0293 32.1215 35.6406C31.5103 36.2519 30.6812 36.5953 29.8167 36.5953H10.2595C9.39505 36.5953 8.56597 36.2519 7.95469 35.6406C7.34341 35.0293 7 34.2003 7 33.3358V7.25953C7 6.39505 7.34341 5.56597 7.95469 4.95469C8.56597 4.34341 9.39505 4 10.2595 4ZM11.8893 7.25953C11.4571 7.25953 11.0425 7.43124 10.7369 7.73688C10.4312 8.04252 10.2595 8.45706 10.2595 8.8893C10.2595 9.32154 10.4312 9.73607 10.7369 10.0417C11.0425 10.3474 11.4571 10.5191 11.8893 10.5191C12.3215 10.5191 12.7361 10.3474 13.0417 10.0417C13.3474 9.73607 13.5191 9.32154 13.5191 8.8893C13.5191 8.45706 13.3474 8.04252 13.0417 7.73688C12.7361 7.43124 12.3215 7.25953 11.8893 7.25953ZM16.7786 7.25953C16.3464 7.25953 15.9318 7.43124 15.6262 7.73688C15.3205 8.04252 15.1488 8.45706 15.1488 8.8893C15.1488 9.32154 15.3205 9.73607 15.6262 10.0417C15.9318 10.3474 16.3464 10.5191 16.7786 10.5191C17.2108 10.5191 17.6254 10.3474 17.931 10.0417C18.2366 9.73607 18.4084 9.32154 18.4084 8.8893C18.4084 8.45706 18.2366 8.04252 17.931 7.73688C17.6254 7.43124 17.2108 7.25953 16.7786 7.25953ZM20.0381 13.7786C17.4447 13.7786 14.9575 14.8088 13.1236 16.6427C11.2898 18.4765 10.2595 20.9637 10.2595 23.5572C10.2595 26.1506 11.2898 28.6379 13.1236 30.4717C14.9575 32.3055 17.4447 33.3358 20.0381 33.3358C22.6316 33.3358 25.1188 32.3055 26.9526 30.4717C28.7865 28.6379 29.8167 26.1506 29.8167 23.5572C29.8167 20.9637 28.7865 18.4765 26.9526 16.6427C25.1188 14.8088 22.6316 13.7786 20.0381 13.7786ZM13.6063 18.7135C13.6394 18.2179 14.0668 17.853 14.5636 17.853H15.5897C16.2105 17.853 16.6723 18.4133 16.6389 19.0332C16.5557 20.5803 16.9578 21.5812 17.7239 22.4C19.337 23.9692 20.132 25.9079 19.9545 28.4061C19.9194 28.8995 19.4931 29.2614 18.9984 29.2614H17.9675C17.3467 29.2614 16.8849 28.7011 16.9183 28.0812C17.0015 26.534 16.5994 25.5332 15.8333 24.7143C14.2213 23.1462 13.4394 21.2092 13.6063 18.7135ZM20.1254 18.7135C20.1585 18.2179 20.5859 17.853 21.0826 17.853H22.1087C22.7295 17.853 23.1913 18.4133 23.158 19.0332C23.0747 20.5803 23.4769 21.5812 24.2429 22.4C25.8561 23.9692 26.6511 25.9079 26.4736 28.4061C26.4385 28.8995 26.0121 29.2614 25.5174 29.2614H24.4866C23.8658 29.2614 23.404 28.7011 23.4373 28.0812C23.5206 26.534 23.1184 25.5332 22.3524 24.7143C20.7403 23.1462 19.9585 21.2092 20.1254 18.7135Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/FAN.svg b/src/assets/icons/visu/equipments/FAN.svg
new file mode 100644
index 0000000000000000000000000000000000000000..e85f23d490bb41a40aac3fe1b55c50f98d0c4460
--- /dev/null
+++ b/src/assets/icons/visu/equipments/FAN.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20 3.00132C12.8224 3.00132 7 8.78631 7 15.9253C7 23.0604 12.8237 28.8481 20 28.8507C27.175 28.8481 33 23.0604 33 15.9253C33 8.78499 27.1723 3 20 3V3.00132ZM20 4.48313C26.351 4.48313 31.5096 9.6069 31.5096 15.9253C31.5096 22.2425 26.3536 27.3662 20 27.3689C16.9476 27.3689 14.0203 26.1633 11.8619 24.0173C9.70358 21.8714 8.49103 18.9608 8.49103 15.926C8.49103 12.8912 9.70358 9.98063 11.8619 7.83467C14.0203 5.68871 16.9476 4.48313 20 4.48313ZM16.7291 6.66436C15.1712 6.81583 13.6172 8.81134 14.5764 10.6159C15.4772 12.3071 17.3531 12.1438 17.9294 14.0734C18.4659 13.3411 19.5271 12.5139 21.3248 13.374C22.4879 9.09057 20.0331 6.35087 16.7291 6.66436ZM27.3684 13.9088C25.4475 13.8363 24.6168 15.5276 22.6495 15.0613C23.0165 15.8871 23.2218 17.2346 21.5725 18.3542C24.7215 21.4956 28.309 20.7383 29.6881 17.7365C30.3359 16.3205 29.4218 13.9825 27.3697 13.9088H27.3684ZM19.6688 14.2381C18.8872 14.3961 18.303 15.1008 18.303 15.9253C18.303 16.8684 19.0515 17.6126 20 17.6126C20.9485 17.6126 21.697 16.8684 21.697 15.9253C21.697 14.9823 20.9485 14.2381 20 14.2381C19.8808 14.2381 19.7801 14.2143 19.6688 14.2381ZM17.1014 16.0492C12.7906 17.1885 11.6566 20.6869 13.5828 23.3752C14.4916 24.641 17.0034 24.9822 18.095 23.2514C19.119 21.6339 18.0287 20.1034 19.4198 18.6413C18.5176 18.5452 17.2511 18.0275 17.1014 16.0492ZM17.3505 30.4142C17.3505 33.0498 12.0514 33.5016 12.0514 35.6828V37H27.9486V35.6828C27.9486 33.5016 22.6495 33.0498 22.6495 30.4142C22.6495 30.4142 22.1475 30.8264 20 30.8264C17.8525 30.8264 17.3505 30.4142 17.3505 30.4142Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/FREEZER.svg b/src/assets/icons/visu/equipments/FREEZER.svg
new file mode 100644
index 0000000000000000000000000000000000000000..deee933ff236c374f8fb4409bbbf25e96c92ef25
--- /dev/null
+++ b/src/assets/icons/visu/equipments/FREEZER.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 d="M5 35H9C9 35.5523 8.55228 36 8 36H6C5.44772 36 5 35.5523 5 35Z" fill="black"/>
+<path d="M31 35H35C35 35.5523 34.5523 36 34 36H32C31.4477 36 31 35.5523 31 35Z" fill="black"/>
+<path d="M3 9C3 8.44772 3.44772 8 4 8H36C36.5523 8 37 8.44772 37 9V12H3V9Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3 14H37V34C37 34.5523 36.5523 35 36 35H4C3.44772 35 3 34.5523 3 34V14ZM14.7926 18.2352C14.6644 18.0411 14.6858 17.7774 14.8566 17.6065C15.0519 17.4113 15.3685 17.4113 15.5637 17.6065L16.3071 18.3499L16.5277 17.5266C16.5634 17.3933 16.7005 17.3141 16.8338 17.3499C16.9672 17.3856 17.0464 17.5227 17.0106 17.656L16.7153 18.7581L18.5882 20.6309L18.8825 19.5326L18.4263 19.2693C18.3067 19.2002 18.2657 19.0473 18.3348 18.9277C18.4038 18.8082 18.5567 18.7672 18.6763 18.8362L19.0164 19.0326L19.0753 18.8129C19.111 18.6796 19.2481 18.6004 19.3815 18.6362C19.5149 18.6719 19.594 18.809 19.5583 18.9423L19.4647 19.2914L20.3063 19.7773V17.1287L19.3182 16.5582C19.1986 16.4892 19.1577 16.3363 19.2267 16.2167C19.2957 16.0972 19.4486 16.0562 19.5682 16.1252L20.3063 16.5514V15.5001C20.3063 15.4829 20.3072 15.4658 20.3089 15.449C20.3345 15.1969 20.5474 15.0001 20.8063 15.0001C21.0824 15.0001 21.3063 15.224 21.3063 15.5001V16.5514L22.0444 16.1252C22.1639 16.0562 22.3168 16.0972 22.3859 16.2167C22.4549 16.3363 22.4139 16.4892 22.2944 16.5582L21.3063 17.1287V19.7773L22.1479 19.2914L22.0543 18.9422C22.0186 18.8088 22.0977 18.6718 22.2311 18.636C22.3644 18.6003 22.5015 18.6794 22.5373 18.8128L22.5962 19.0326L22.9363 18.8362C23.0558 18.7672 23.2087 18.8082 23.2778 18.9277C23.3468 19.0473 23.3058 19.2002 23.1863 19.2693L22.7301 19.5326L23.0244 20.6308L24.8972 18.758L24.6019 17.6559C24.5662 17.5225 24.6454 17.3855 24.7787 17.3497C24.9121 17.314 25.0492 17.3931 25.0849 17.5265L25.3055 18.3497L26.0488 17.6064C26.2441 17.4111 26.5607 17.4111 26.7559 17.6064C26.9512 17.8017 26.9512 18.1182 26.7559 18.3135L26.7559 18.3135L26.0126 19.0568L26.8358 19.2774C26.9692 19.3132 27.0483 19.4502 27.0126 19.5836C26.9769 19.717 26.8398 19.7961 26.7064 19.7604L25.6044 19.4651L23.7315 21.3379L24.2998 21.4902L24.481 21.1763C24.5501 21.0567 24.7029 21.0158 24.8225 21.0848C24.9421 21.1538 24.9831 21.3067 24.914 21.4263L24.7998 21.6242L25.5495 21.8251C25.6829 21.8608 25.762 21.9979 25.7263 22.1313C25.6906 22.2646 25.5535 22.3438 25.4201 22.308L24.541 22.0725L23.973 23.0563L26.6216 23.0563L27.192 22.0682C27.2611 21.9486 27.414 21.9077 27.5335 21.9767C27.6531 22.0457 27.6941 22.1986 27.625 22.3182L27.1989 23.0563H28.2501C28.5263 23.0563 28.7501 23.2802 28.7501 23.5563C28.7501 23.8324 28.5263 24.0563 28.2501 24.0563H27.1989L27.625 24.7944C27.6941 24.914 27.6531 25.0668 27.5335 25.1359C27.414 25.2049 27.2611 25.164 27.192 25.0444L26.6216 24.0563H23.973L24.5409 25.0399L25.4202 24.8043C25.5536 24.7686 25.6907 24.8477 25.7264 24.9811C25.7622 25.1145 25.683 25.2515 25.5496 25.2873L24.7997 25.4882L24.914 25.6863C24.9831 25.8059 24.9421 25.9588 24.8225 26.0278C24.7029 26.0968 24.5501 26.0559 24.481 25.9363L24.2997 25.6222L23.7316 25.7744L25.6045 27.6473L26.7065 27.352C26.8399 27.3162 26.977 27.3954 27.0127 27.5287C27.0485 27.6621 26.9693 27.7992 26.8359 27.8349L26.0127 28.0555L26.756 28.7988C26.9513 28.9941 26.9513 29.3107 26.756 29.5059C26.5608 29.7012 26.2442 29.7012 26.0489 29.5059L25.3056 28.7626L25.085 29.5858C25.0493 29.7192 24.9122 29.7984 24.7788 29.7626C24.6455 29.7269 24.5663 29.5898 24.6021 29.4564L24.8974 28.3544L23.0245 26.4815L22.6402 27.9158L23.1863 28.231C23.3058 28.3001 23.3468 28.453 23.2778 28.5725C23.2087 28.6921 23.0558 28.7331 22.9363 28.664L22.482 28.4018C22.4212 28.4696 22.3252 28.5015 22.2312 28.4763C22.0978 28.4406 22.0187 28.3035 22.0544 28.1701L22.058 28.1569L21.3063 27.723V30.3716L22.2944 30.942C22.4139 31.0111 22.4549 31.164 22.3859 31.2835C22.3168 31.4031 22.1639 31.4441 22.0444 31.375L21.3063 30.9489V32.0001C21.3063 32.2763 21.0824 32.5001 20.8063 32.5001C20.5301 32.5001 20.3063 32.2763 20.3063 32.0001V30.9489L19.5682 31.375C19.4486 31.4441 19.2957 31.4031 19.2267 31.2835C19.1577 31.164 19.1986 31.0111 19.3182 30.942L20.3063 30.3716V27.723L19.5545 28.157L19.558 28.1701C19.5938 28.3035 19.5146 28.4406 19.3812 28.4763C19.2872 28.5015 19.1913 28.4696 19.1304 28.4018L18.6763 28.664C18.5567 28.7331 18.4038 28.6921 18.3348 28.5725C18.2657 28.453 18.3067 28.3001 18.4263 28.231L18.9722 27.9158L18.5879 26.4815L16.7151 28.3544L17.0104 29.4564C17.0461 29.5898 16.967 29.7269 16.8336 29.7626C16.7002 29.7984 16.5632 29.7192 16.5274 29.5858L16.3068 28.7626L15.5635 29.5059C15.3682 29.7012 15.0517 29.7012 14.8564 29.5059C14.6611 29.3107 14.6611 28.9941 14.8564 28.7988L15.5997 28.0555L14.7765 27.8349C14.6431 27.7992 14.564 27.6621 14.5997 27.5287C14.6355 27.3954 14.7725 27.3162 14.9059 27.352L16.008 27.6473L17.8808 25.7744L17.2156 25.5962L17.0192 25.9363C16.9502 26.0559 16.7973 26.0968 16.6777 26.0278C16.5582 25.9588 16.5172 25.8059 16.5862 25.6863L16.7156 25.4622L16.0628 25.2873C15.9294 25.2515 15.8503 25.1145 15.886 24.9811C15.9218 24.8477 16.0588 24.7686 16.1922 24.8043L16.9744 25.0139L17.5273 24.0563H14.8787L14.3082 25.0444C14.2392 25.164 14.0863 25.2049 13.9667 25.1359C13.8472 25.0668 13.8062 24.914 13.8752 24.7944L14.3014 24.0563H13.2501C12.974 24.0563 12.7501 23.8324 12.7501 23.5563C12.7501 23.2802 12.974 23.0563 13.2501 23.0563H14.3014L13.8752 22.3182C13.8062 22.1986 13.8472 22.0457 13.9667 21.9767C14.0863 21.9077 14.2392 21.9486 14.3082 22.0682L14.8787 23.0563H17.5273L16.9744 22.0986L16.1925 22.3082C16.0591 22.3439 15.922 22.2647 15.8863 22.1314C15.8505 21.998 15.9297 21.8609 16.063 21.8252L16.7156 21.6503L16.5862 21.4263C16.5172 21.3067 16.5582 21.1538 16.6777 21.0848C16.7973 21.0158 16.9502 21.0567 17.0192 21.1763L17.2156 21.5164L17.8811 21.3381L16.0082 19.4652L14.9062 19.7605C14.7728 19.7962 14.6357 19.7171 14.6 19.5837C14.5642 19.4504 14.6434 19.3133 14.7767 19.2775L15.6 19.057L14.8566 18.3136C14.8322 18.2892 14.8109 18.2629 14.7926 18.2352ZM21.3063 20.3547L22.2818 19.7914L22.6162 21.0391L21.3063 22.3489V20.3547ZM23.3233 21.7462L22.0131 23.0563H23.3956L24.041 21.9385L23.3233 21.7462ZM19.5989 24.0563L18.2891 25.3662L17.4744 25.1479L18.1047 24.0563L19.5989 24.0563ZM20.3063 24.7632L18.9962 26.0733L19.4205 27.657L20.3063 27.1456V24.7632ZM22.6163 26.0733L22.1919 27.6569L21.3063 27.1456V24.7633L22.6163 26.0733ZM20.3063 22.3491V20.3547L19.3308 19.7914L18.9964 21.0392L20.3063 22.3491ZM22.0135 24.0563L23.3234 25.3662L24.0409 25.1739L23.3956 24.0563H22.0135ZM19.5993 23.0563H18.1047L17.4744 21.9647L18.2893 21.7463L19.5993 23.0563Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/HYDRAULIC_HEATING.svg b/src/assets/icons/visu/equipments/HYDRAULIC_HEATING.svg
new file mode 100644
index 0000000000000000000000000000000000000000..feba2c594b8da778b9f3153ab40c2736020f98bf
--- /dev/null
+++ b/src/assets/icons/visu/equipments/HYDRAULIC_HEATING.svg
@@ -0,0 +1,7 @@
+<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="M10 16C10 15.4477 10.4477 15 11 15H14C14.5523 15 15 15.4477 15 16V18H16V16C16 15.4477 16.4477 15 17 15H20C20.5523 15 21 15.4477 21 16V18H22V16C22 15.4477 22.4477 15 23 15H26C26.5523 15 27 15.4477 27 16V18H28V16C28 15.4477 28.4477 15 29 15H32C32.5523 15 33 15.4477 33 16V18H34C34.5523 18 35 18.4477 35 19C35 19.5523 34.5523 20 34 20H33V27H34C34.5523 27 35 27.4477 35 28C35 28.5523 34.5523 29 34 29H33V31C33 31.5523 32.5523 32 32 32H29C28.4477 32 28 31.5523 28 31V29H27V31C27 31.5523 26.5523 32 26 32H23C22.4477 32 22 31.5523 22 31V29H21V31C21 31.5523 20.5523 32 20 32H17C16.4477 32 16 31.5523 16 31V29H15V31C15 31.3706 14.7984 31.6941 14.4989 31.8668C14.4996 31.8279 14.5 31.789 14.5 31.75C14.5 29.913 13.2795 28.5575 12.229 27.3906L12.1159 27.2649C11.3601 26.424 10.5995 25.5709 10 24.5358L10 20C9.44772 20 9 19.5523 9 19C9 18.4477 9.44772 18 10 18V16ZM10 26.3203C10.4497 26.9071 10.923 27.4337 11.3712 27.9323L11.372 27.9333C12.5182 29.209 13.5 30.3019 13.5 31.75C13.5 31.8336 13.498 31.9169 13.4941 32H11C10.4477 32 10 31.5523 10 31L10 29C9.44772 29 9 28.5523 9 28C9 27.4477 9.44772 27 10 27L10 26.3203ZM28 20V27H27V20H28ZM22 20V27H21V20H22ZM16 20V27H15V20H16Z" fill="#121212"/>
+<path d="M15.3106 4H14.9556C14.4583 4 14.0287 4.36553 14.0072 4.8623C13.9257 6.74296 14.5375 8.21449 15.7586 9.41286C16.3158 10.0138 16.6267 10.739 16.615 11.8197C16.6083 12.4399 17.0646 13 17.6848 13H18.0445C18.5397 13 18.9683 12.6375 18.9916 12.1428C19.0805 10.2597 18.4589 8.7866 17.2368 7.58714C16.6796 6.98619 16.3686 6.26103 16.3804 5.18027C16.3871 4.56012 15.9307 4 15.3106 4Z" fill="black"/>
+<path d="M20.3106 4H19.9556C19.4583 4 19.0287 4.36553 19.0072 4.8623C18.9257 6.74296 19.5375 8.21449 20.7586 9.41286C21.3158 10.0138 21.6267 10.739 21.615 11.8197C21.6083 12.4399 22.0646 13 22.6848 13H23.0445C23.5397 13 23.9683 12.6375 23.9916 12.1428C24.0805 10.2597 23.4589 8.7866 22.2368 7.58714C21.6796 6.98619 21.3686 6.26103 21.3804 5.18027C21.3871 4.56012 20.9307 4 20.3106 4Z" fill="black"/>
+<path d="M25.3106 4H24.9556C24.4583 4 24.0287 4.36553 24.0072 4.8623C23.9257 6.74296 24.5375 8.21449 25.7586 9.41286C26.3158 10.0138 26.6267 10.739 26.615 11.8197C26.6083 12.4399 27.0646 13 27.6848 13H28.0445C28.5397 13 28.9683 12.6375 28.9916 12.1428C29.0805 10.2597 28.4589 8.7866 27.2368 7.58714C26.6796 6.98619 26.3686 6.26103 26.3804 5.18027C26.3871 4.56012 25.9307 4 25.3106 4Z" fill="black"/>
+<path d="M8.25 37C9.64239 37 10.9777 36.4469 11.9623 35.4623C12.9469 34.4777 13.5 33.1424 13.5 31.75C13.5 30.3019 12.5182 29.209 11.372 27.9332C10.2222 26.654 8.90625 25.1901 8.25 23C8.25 23 3 27.9752 3 31.75C3 33.1424 3.55312 34.4777 4.53769 35.4623C5.52226 36.4469 6.85761 37 8.25 37ZM7.06525 27.0652L7.68475 27.6848C7.431 27.9385 6.69775 28.8319 6.01612 30.196L5.23388 29.804C5.95138 28.3681 6.73625 27.3951 7.06525 27.0652Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/INTERNET_BOX.svg b/src/assets/icons/visu/equipments/INTERNET_BOX.svg
new file mode 100644
index 0000000000000000000000000000000000000000..69e6bb43d59f1fdd47a51c9d687b701ddc38b076
--- /dev/null
+++ b/src/assets/icons/visu/equipments/INTERNET_BOX.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="6" y="24" width="2" height="2" rx="1" fill="#121212"/>
+<rect x="32" y="24" width="2" height="2" rx="1" fill="#121212"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3 19C3 17.8954 3.89543 17 5 17H35C36.1046 17 37 17.8954 37 19V24C37 24.5523 36.5523 25 36 25H4C3.44772 25 3 24.5523 3 24V19ZM6 19H16V23H6V19ZM26 21C25.4477 21 25 21.4477 25 22C25 22.5523 25.4477 23 26 23C26.5523 23 27 22.5523 27 22C27 21.4477 26.5523 21 26 21ZM29 22C29 21.4477 29.4477 21 30 21C30.5523 21 31 21.4477 31 22C31 22.5523 30.5523 23 30 23C29.4477 23 29 22.5523 29 22ZM34 21C33.4477 21 33 21.4477 33 22C33 22.5523 33.4477 23 34 23C34.5523 23 35 22.5523 35 22C35 21.4477 34.5523 21 34 21Z" fill="#121212"/>
+<rect x="7" y="20" width="1" height="2" fill="#121212"/>
+<rect x="11" y="20" width="1" height="2" fill="#121212"/>
+<rect x="14" y="20" width="1" height="2" fill="#121212"/>
+<rect x="10" y="20" width="1" height="1" fill="#121212"/>
+<rect x="8" y="21" width="1" height="1" fill="#121212"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/MICROWAVE.svg b/src/assets/icons/visu/equipments/MICROWAVE.svg
new file mode 100644
index 0000000000000000000000000000000000000000..2e86d4ba692a5319b2bc9eed3e354eb1d7b9d2e8
--- /dev/null
+++ b/src/assets/icons/visu/equipments/MICROWAVE.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.1661 16.5298C11.6463 16.8436 10.9296 16.91 10.4988 16.4822L9.65911 15.6484C9.28075 15.2727 9.25959 14.6597 9.66787 14.3168C10.4005 13.7013 11.5055 13.0381 12.8624 13.0381C14.1662 13.0381 15.1277 13.6737 15.8122 14.13C16.3175 14.4723 16.6434 14.6679 16.9368 14.6679C17.1637 14.6679 17.4045 14.5732 17.6296 14.4378C18.1511 14.1241 18.87 14.0587 19.3004 14.489L20.1285 15.3171C20.5045 15.6932 20.5245 16.3043 20.1177 16.6468C19.386 17.2628 18.2833 17.9274 16.9368 17.9274C15.6493 17.9274 14.704 17.3081 14.0195 16.8518C13.4817 16.4932 13.172 16.2976 12.8624 16.2976C12.6343 16.2976 12.3922 16.3932 12.1661 16.5298ZM12.8624 24.4465C13.172 24.4465 13.4817 24.642 14.0195 25.0006C14.704 25.4569 15.6493 26.0762 16.9368 26.0762C18.2941 26.0762 19.391 25.4125 20.1189 24.7969C20.525 24.4535 20.5045 23.842 20.1285 23.4659L19.3004 22.6378C18.87 22.2075 18.1481 22.2696 17.627 22.5839C17.4001 22.7208 17.1591 22.8167 16.9368 22.8167C16.6434 22.8167 16.3175 22.6211 15.8122 22.2789C15.1277 21.8225 14.1662 21.1869 12.8624 21.1869C11.504 21.1869 10.398 21.8517 9.66535 22.4677C9.25827 22.81 9.27831 23.4211 9.65439 23.7972L10.5078 24.6506C10.9292 25.072 11.6235 25.0166 12.129 24.7008C12.3663 24.5526 12.6221 24.4465 12.8624 24.4465ZM36.0865 9.77857V29.3358C36.0865 31.1285 34.6197 32.5953 32.827 32.5953H6.75074C4.958 32.5953 3.49121 31.1285 3.49121 29.3358V9.77857C3.49121 7.98583 4.958 6.51904 6.75074 6.51904H32.827C34.6197 6.51904 36.0865 7.98583 36.0865 9.77857ZM23.0484 9.77857H6.75074V29.3358H23.0484V9.77857ZM31.1972 26.0762C31.1972 25.1799 30.4638 24.4465 29.5675 24.4465C28.6711 24.4465 27.9377 25.1799 27.9377 26.0762C27.9377 26.9726 28.6711 27.706 29.5675 27.706C30.4638 27.706 31.1972 26.9726 31.1972 26.0762ZM31.1972 19.5572C31.1972 18.6608 30.4638 17.9274 29.5675 17.9274C28.6711 17.9274 27.9377 18.6608 27.9377 19.5572C27.9377 20.4535 28.6711 21.1869 29.5675 21.1869C30.4638 21.1869 31.1972 20.4535 31.1972 19.5572ZM31.1972 11.4083H27.9377V14.6679H31.1972V11.4083Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/REFREGIRATOR.svg b/src/assets/icons/visu/equipments/REFREGIRATOR.svg
new file mode 100644
index 0000000000000000000000000000000000000000..2d0dc947a590cf589b69b6412f1a4a9bee4c8965
--- /dev/null
+++ b/src/assets/icons/visu/equipments/REFREGIRATOR.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.2595 1H28.5572C29.4217 1 30.2507 1.34341 30.862 1.95469C31.4733 2.56597 31.8167 3.39505 31.8167 4.25953V12.4084H9V4.25953C9 3.39505 9.34341 2.56597 9.95469 1.95469C10.566 1.34341 11.395 1 12.2595 1ZM31.8167 34.1107C31.8167 34.9752 31.4733 35.8043 30.862 36.4155C30.2507 37.0268 29.4217 37.3702 28.5572 37.3702V39H25.2977V37.3702H15.5191V39H12.2595V37.3702C11.395 37.3702 10.566 37.0268 9.95469 36.4155C9.34341 35.8043 9 34.9752 9 34.1107V14.0381H31.8167V34.1107ZM13.8893 5.8893V9.14883H17.1488V5.8893H13.8893ZM13.8893 17.2977V22.1869H17.1488V17.2977H13.8893Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/VENTILATION.svg b/src/assets/icons/visu/equipments/VENTILATION.svg
new file mode 100644
index 0000000000000000000000000000000000000000..aacb7fb38b850e11b29a5b41d92db595e8b28556
--- /dev/null
+++ b/src/assets/icons/visu/equipments/VENTILATION.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.6437 30.9951C23.1757 32.4827 21.9554 33.703 20.4677 34.171C17.9437 34.9734 15.5534 33.7866 14.4669 31.7974C13.8818 30.7109 14.751 29.4071 15.988 29.4071H16.0047C16.573 29.4071 17.1413 29.6745 17.4088 30.176C17.693 30.7109 18.2446 31.0786 18.8965 31.0786C19.8158 31.0786 20.568 30.3264 20.568 29.4071C20.568 28.4877 19.8158 27.7355 18.8965 27.7355H4.67155C3.7522 27.7355 3 26.9833 3 26.064C3 25.1446 3.7522 24.3924 4.67155 24.3924H18.8798C22.156 24.3924 24.7302 27.5684 23.6437 30.9951ZM31.266 10.4684C31.0146 9.42181 30.4788 8.46511 29.7177 7.70402C28.9566 6.94294 27.9999 6.40712 26.9534 6.15577C24.0114 5.48715 21.3202 7.04169 20.2337 9.46545C19.7155 10.5854 20.5179 11.8558 21.7381 11.8558C22.39 11.8558 22.9918 11.488 23.2425 10.903C23.4317 10.4425 23.7537 10.0487 24.1675 9.77185C24.5813 9.495 25.0681 9.3476 25.566 9.34844C26.9534 9.34844 28.0733 10.4684 28.0733 11.8558C28.0733 13.2432 26.9534 14.3631 25.566 14.3631H4.67155C3.7522 14.3631 3 15.1153 3 16.0347C3 16.954 3.7522 17.7062 4.67155 17.7062H25.566C29.2434 17.7062 32.1352 14.2962 31.266 10.4684ZM30.4135 19.3778H4.67155C3.7522 19.3778 3 20.13 3 21.0493C3 21.9687 3.7522 22.7209 4.67155 22.7209H30.5806C31.968 22.7209 33.088 23.8408 33.088 25.2282C33.0888 25.7261 32.9414 26.2129 32.6646 26.6267C32.3877 27.0405 31.9939 27.3625 31.5334 27.5517C30.9317 27.8024 30.5806 28.4042 30.5806 29.0561C30.5806 30.2763 31.851 31.0786 32.971 30.5772C34.1951 30.0292 35.1946 29.0784 35.8029 27.8831C36.4112 26.6878 36.5916 25.3201 36.3141 24.008C35.7457 21.2666 33.205 19.3778 30.4135 19.3778Z" fill="black"/>
+</svg>
diff --git a/src/assets/icons/visu/equipments/WASHING_MACHINE.svg b/src/assets/icons/visu/equipments/WASHING_MACHINE.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4b956d4bfe0948bda92c62c68f597ab13e3a6f78
--- /dev/null
+++ b/src/assets/icons/visu/equipments/WASHING_MACHINE.svg
@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M24.6504 18.9449C25.8713 20.1694 26.5569 21.828 26.5569 23.5572C26.5569 25.2863 25.8713 26.945 24.6504 28.1694C23.4259 29.3904 21.7673 30.076 20.0381 30.076C18.309 30.076 16.6503 29.3904 15.4259 28.1694L24.6504 18.9449ZM10.2595 4H29.8167C30.6812 4 31.5103 4.34341 32.1215 4.95469C32.7328 5.56597 33.0762 6.39505 33.0762 7.25953V33.3358C33.0762 34.2003 32.7328 35.0293 32.1215 35.6406C31.5103 36.2519 30.6812 36.5953 29.8167 36.5953H10.2595C9.39505 36.5953 8.56597 36.2519 7.95469 35.6406C7.34341 35.0293 7 34.2003 7 33.3358V7.25953C7 6.39505 7.34341 5.56597 7.95469 4.95469C8.56597 4.34341 9.39505 4 10.2595 4ZM11.8893 7.25953C11.4571 7.25953 11.0425 7.43124 10.7369 7.73688C10.4312 8.04252 10.2595 8.45706 10.2595 8.8893C10.2595 9.32154 10.4312 9.73607 10.7369 10.0417C11.0425 10.3474 11.4571 10.5191 11.8893 10.5191C12.3215 10.5191 12.7361 10.3474 13.0417 10.0417C13.3474 9.73607 13.5191 9.32154 13.5191 8.8893C13.5191 8.45706 13.3474 8.04252 13.0417 7.73688C12.7361 7.43124 12.3215 7.25953 11.8893 7.25953ZM16.7786 7.25953C16.3464 7.25953 15.9318 7.43124 15.6262 7.73688C15.3205 8.04252 15.1488 8.45706 15.1488 8.8893C15.1488 9.32154 15.3205 9.73607 15.6262 10.0417C15.9318 10.3474 16.3464 10.5191 16.7786 10.5191C17.2108 10.5191 17.6254 10.3474 17.931 10.0417C18.2366 9.73607 18.4084 9.32154 18.4084 8.8893C18.4084 8.45706 18.2366 8.04252 17.931 7.73688C17.6254 7.43124 17.2108 7.25953 16.7786 7.25953ZM20.0381 13.7786C17.4447 13.7786 14.9575 14.8088 13.1236 16.6427C11.2898 18.4765 10.2595 20.9637 10.2595 23.5572C10.2595 26.1506 11.2898 28.6379 13.1236 30.4717C14.9575 32.3055 17.4447 33.3358 20.0381 33.3358C22.6316 33.3358 25.1188 32.3055 26.9526 30.4717C28.7865 28.6379 29.8167 26.1506 29.8167 23.5572C29.8167 20.9637 28.7865 18.4765 26.9526 16.6427C25.1188 14.8088 22.6316 13.7786 20.0381 13.7786Z" fill="black"/>
+</svg>
diff --git a/src/components/Analysis/AnalysisConsumption.tsx b/src/components/Analysis/AnalysisConsumption.tsx
index e7426b2cd0dd6155a9272a59164b2d9ab8545f44..d2b298c9a1cb5dc267ee958c153802279420392a 100644
--- a/src/components/Analysis/AnalysisConsumption.tsx
+++ b/src/components/Analysis/AnalysisConsumption.tsx
@@ -42,12 +42,21 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
const [toggleHome, setToggleHome] = useState<string>('average')
const [isLoading, setisLoading] = useState<boolean>(true)
+ // Disconnected + empty fluids to show in AnalysisConsumptionRow
const disconnectedFluidTypes: FluidType[] = [
FluidType.ELECTRICITY,
FluidType.WATER,
FluidType.GAS,
].filter(fluidType => !fluidTypes.includes(fluidType))
+ const emptyFluidTypes: FluidType[] = []
+
+ for (let i = 0; i < performanceIndicators.length; i++) {
+ if (performanceIndicators[i] && !performanceIndicators[i].value) {
+ emptyFluidTypes.push(fluidTypes[i])
+ }
+ }
+
const getTotalValueWithConnectedFluids = useCallback(
(monthlyForecast: MonthlyForecast) => {
if (fluidTypes.length === 3) {
@@ -55,7 +64,8 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
} else {
let totalPrice = 0
fluidTypes.forEach(fluid => {
- totalPrice += monthlyForecast.fluidForecast[fluid].value
+ if (monthlyForecast.fluidForecast[fluid].value)
+ totalPrice += monthlyForecast.fluidForecast[fluid].value
})
setHomePriceConsumption(totalPrice)
}
@@ -152,6 +162,7 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
forecast={forecast}
toggleHome={toggleHome}
connected={true}
+ noData={false}
/>
) : (
<AnalysisConsumptionRow
@@ -162,25 +173,45 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
forecast={forecast}
toggleHome={toggleHome}
connected={false}
+ noData={false}
/>
)}
</div>
{fluidTypes.map((fluid, index) => {
+ return (
+ performanceIndicators[fluid] &&
+ performanceIndicators[fluid].value && (
+ <AnalysisConsumptionRow
+ key={index}
+ fluid={fluid}
+ userPriceConsumption={userPriceConsumption}
+ homePriceConsumption={homePriceConsumption}
+ performanceValue={performanceIndicators[fluid].value}
+ forecast={forecast}
+ toggleHome={toggleHome}
+ connected={true}
+ noData={false}
+ />
+ )
+ )
+ })}
+ {fluidTypes.length < 3 && <hr className="consumption-sep" />}
+ {disconnectedFluidTypes.map((fluid, index) => {
return (
<AnalysisConsumptionRow
key={index}
fluid={fluid}
userPriceConsumption={userPriceConsumption}
homePriceConsumption={homePriceConsumption}
- performanceValue={performanceIndicators[fluid].value}
+ performanceValue={null}
forecast={forecast}
toggleHome={toggleHome}
- connected={true}
+ connected={false}
+ noData={false}
/>
)
})}
- {fluidTypes.length < 3 && <hr className="consumption-sep" />}
- {disconnectedFluidTypes.map((fluid, index) => {
+ {emptyFluidTypes.map((fluid, index) => {
return (
<AnalysisConsumptionRow
key={index}
@@ -191,9 +222,11 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
forecast={forecast}
toggleHome={toggleHome}
connected={false}
+ noData={true}
/>
)
})}
+
<StyledCard
onClick={toggleAverage}
className={`link-average ${toggleHome === 'average' &&
diff --git a/src/components/Analysis/AnalysisConsumptionRow.spec.tsx b/src/components/Analysis/AnalysisConsumptionRow.spec.tsx
index fa4497dc2dca725f0dfd5df5dfeca65309c02b87..1c78d3b58a8057f2ea1aa3f87de9f04ea6cddcd0 100644
--- a/src/components/Analysis/AnalysisConsumptionRow.spec.tsx
+++ b/src/components/Analysis/AnalysisConsumptionRow.spec.tsx
@@ -22,6 +22,7 @@ describe('AnalysisConsumptionRow component', () => {
const forecast: MonthlyForecast = mockMonthlyForecastJanuaryTestProfile1
const toggleHome = 'average'
const connected = true
+ const noData = false
it('should be rendered correctly for Multifluid and at least fluid connected', async () => {
const mockPerformanceValue: number | null = null
@@ -34,6 +35,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={forecast}
toggleHome={toggleHome}
connected={connected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-multifluid').exists()).toBeTruthy()
@@ -65,6 +67,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={forecast}
toggleHome={toggleHome}
connected={mockConnected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-multifluid').exists()).toBeTruthy()
@@ -94,6 +97,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={forecast}
toggleHome={toggleHome}
connected={connected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-electricity').exists()).toBeTruthy()
@@ -124,6 +128,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={forecast}
toggleHome={mockToggleHome}
connected={connected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-electricity').exists()).toBeTruthy()
@@ -154,6 +159,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={forecast}
toggleHome={toggleHome}
connected={mockConnected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-electricity').exists()).toBeTruthy()
@@ -184,6 +190,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={forecast}
toggleHome={toggleHome}
connected={connected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-electricity').exists()).toBeTruthy()
@@ -226,6 +233,7 @@ describe('AnalysisConsumptionRow component', () => {
forecast={mockforecast}
toggleHome={toggleHome}
connected={connected}
+ noData={noData}
/>
)
expect(wrapper.find('.consumption-electricity').exists()).toBeTruthy()
diff --git a/src/components/Analysis/AnalysisConsumptionRow.tsx b/src/components/Analysis/AnalysisConsumptionRow.tsx
index 64e667d5824689ad63ff765383ea7b1f5f505067..ed40c2fc916908f08729e0bbb4e69f665ee8a411 100644
--- a/src/components/Analysis/AnalysisConsumptionRow.tsx
+++ b/src/components/Analysis/AnalysisConsumptionRow.tsx
@@ -18,6 +18,7 @@ interface AnalysisConsumptionRowProps {
forecast: MonthlyForecast | null
toggleHome: string
connected: boolean
+ noData: boolean
}
const AnalysisConsumptionRow: React.FC<AnalysisConsumptionRowProps> = ({
@@ -28,6 +29,7 @@ const AnalysisConsumptionRow: React.FC<AnalysisConsumptionRowProps> = ({
forecast,
toggleHome,
connected,
+ noData,
}: AnalysisConsumptionRowProps) => {
const { t } = useI18n()
const converterService: ConverterService = new ConverterService()
@@ -104,15 +106,19 @@ const AnalysisConsumptionRow: React.FC<AnalysisConsumptionRowProps> = ({
}
}
return (
- <div className={`consumption-${FluidType[fluid].toLowerCase()}`}>
+ <div
+ className={`consumption-${FluidType[fluid].toLowerCase()} analysisRow`}
+ >
<div className="user-graph">
<div
className={classNames('price', 'text-15-bold', {
- ['not-connected']: !connected,
+ ['not-connected']: !connected || noData,
})}
>
{connected
? formatFluidConsumptionForConso(fluid)
+ : noData
+ ? t(`analysis.no_data_2`)
: t(`analysis.not_connected`)}
</div>
<div className="container-graph">
diff --git a/src/components/Analysis/AnalysisView.spec.tsx b/src/components/Analysis/AnalysisView.spec.tsx
index c8ce8316344b1c426af17fe4d81caf9540224dcd..286f6cf6b1da754e00ebf01abd88085f258e5790 100644
--- a/src/components/Analysis/AnalysisView.spec.tsx
+++ b/src/components/Analysis/AnalysisView.spec.tsx
@@ -6,7 +6,6 @@ import { Provider } from 'react-redux'
import AnalysisView from 'components/Analysis/AnalysisView'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
import { profileData } from '../../../tests/__mocks__/profile.mock'
-import Header from 'components/Header/Header'
import {
createMockStore,
mockInitialEcolyoState,
@@ -23,14 +22,11 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
-jest.mock('components/Header/CozyBar', () => () => <div id="cozybar"></div>)
-jest.mock('components/DateNavigator/DateNavigator', () => () => (
- <div id="dateNavigator"></div>
-))
-
-jest.mock('components/Analysis/MonthlyAnalysis', () => () => (
- <div id="monthlyanalysis"></div>
-))
+jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
+jest.mock('components/Header/Header', () => 'mock-header')
+jest.mock('components/Content/Content', () => 'mock-content')
+jest.mock('components/DateNavigator/DateNavigator', () => 'mock-datenavigator')
+jest.mock('components/Analysis/MonthlyAnalysis', () => 'mock-monthlyanalysis')
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
@@ -69,9 +65,10 @@ describe('AnalysisView component', () => {
<AnalysisView />
</Provider>
)
- expect(wrapper.find('#cozybar')).toBeTruthy()
- expect(wrapper.find(Header)).toBeTruthy()
- expect(wrapper.find('#monthlyanalysis')).toBeTruthy()
+ expect(wrapper.find('mock-cozybar').exists()).toBeTruthy()
+ expect(wrapper.find('mock-header').exists()).toBeTruthy()
+ expect(wrapper.find('mock-datenavigator').exists()).toBeTruthy()
+ expect(wrapper.find('mock-monthlyanalysis').exists()).toBeTruthy()
})
it('should update profile and toggle analysis notification to false if notification is true', () => {
@@ -91,14 +88,15 @@ describe('AnalysisView component', () => {
<AnalysisView />
</Provider>
)
- expect(wrapper.find('#cozybar')).toBeTruthy()
- expect(wrapper.find(Header)).toBeTruthy()
- expect(wrapper.find('#monthlyanalysis')).toBeTruthy()
- expect(updateProfileSpy).toBeCalledTimes(2)
+ expect(wrapper.find('mock-cozybar').exists()).toBeTruthy()
+ expect(wrapper.find('mock-header').exists()).toBeTruthy()
+ expect(wrapper.find('mock-datenavigator').exists()).toBeTruthy()
+ expect(wrapper.find('mock-monthlyanalysis').exists()).toBeTruthy()
+ expect(updateProfileSpy).toBeCalledTimes(1)
expect(updateProfileSpy).toHaveBeenCalledWith({
haveSeenLastAnalysis: true,
})
- expect(toggleAnalysisNotificationSpy).toBeCalledTimes(2)
+ expect(toggleAnalysisNotificationSpy).toBeCalledTimes(1)
expect(toggleAnalysisNotificationSpy).toHaveBeenCalledWith(false)
})
})
diff --git a/src/components/Analysis/MonthlyAnalysis.tsx b/src/components/Analysis/MonthlyAnalysis.tsx
index 6a8f1167395ca1e08d846c5b50b7d50f7520222d..d8725f87f92aa29506a9ffa0577e940378014150 100644
--- a/src/components/Analysis/MonthlyAnalysis.tsx
+++ b/src/components/Analysis/MonthlyAnalysis.tsx
@@ -46,6 +46,7 @@ const MonthlyAnalysis: React.FC<MonthlyAnalysisProps> = ({
const [performanceIndicators, setPerformanceIndicators] = useState<
PerformanceIndicator[]
>([])
+ const [loadAnalysis, setLoadAnalysis] = useState<boolean>(false)
const [
aggregatedPerformanceIndicators,
setAggregatedPerformanceIndicators,
@@ -89,6 +90,16 @@ const MonthlyAnalysis: React.FC<MonthlyAnalysisProps> = ({
if (subscribed) {
if (fetchedPerformanceIndicators) {
setPerformanceIndicators(fetchedPerformanceIndicators)
+ setLoadAnalysis(false)
+ for (let i = 0; i < fetchedPerformanceIndicators.length; i++) {
+ if (
+ fetchedPerformanceIndicators[i] &&
+ fetchedPerformanceIndicators[i].value
+ ) {
+ setLoadAnalysis(true)
+ }
+ }
+
setAggregatedPerformanceIndicators(
performanceIndicatorService.aggregatePerformanceIndicators(
fetchedPerformanceIndicators
@@ -137,58 +148,65 @@ const MonthlyAnalysis: React.FC<MonthlyAnalysisProps> = ({
})}
</div>
</div>
- <div className="analysis-content">
- <div className="card rich-card">
- <TotalAnalysisChart
- analysisDate={analysisDate}
- fluidTypes={fluidTypes}
- />
- </div>
- </div>
- <div className="analysis-content">
- <div className="card rich-card">
- <MaxConsumptionCard analysisDate={analysisDate} />
- </div>
- </div>
- <div className="analysis-content">
- <div className="card rich-card">
- <div className="status-header">
- <div>
- <StyledIcon icon={AnalysisIcon} size={44} />
- <p className="text-16-normal">
- {t('analysis.compare.title')}
- </p>
+
+ {loadAnalysis && (
+ <>
+ <div className="analysis-content">
+ <div className="card rich-card">
+ <TotalAnalysisChart
+ analysisDate={analysisDate}
+ fluidTypes={fluidTypes}
+ />
</div>
- {isProfileTypeCompleted && (
- <Button
- aria-label={t(
- 'analysis.accessibility.button_go_to_profil'
- )}
- onClick={goToForm}
- classes={{
- root: 'btn-secondary-negative',
- label: 'text-16-normal',
- }}
- >
- <StyledIcon icon={ProfileEditIcon} size={40} />
- </Button>
- )}
</div>
- <AnalysisConsumption
- aggregatedPerformanceIndicator={
- aggregatedPerformanceIndicators
- }
- performanceIndicators={performanceIndicators}
- analysisDate={analysisDate}
- />
- </div>
- </div>
- {fluidTypes.includes(FluidType.ELECTRICITY) && (
- <div className="analysis-content">
- <div className="card">
- <ElecHalfHourMonthlyAnalysis analysisDate={analysisDate} />
+ <div className="analysis-content">
+ <div className="card rich-card">
+ <MaxConsumptionCard analysisDate={analysisDate} />
+ </div>
</div>
- </div>
+ <div className="analysis-content">
+ <div className="card rich-card">
+ <div className="status-header">
+ <div>
+ <StyledIcon icon={AnalysisIcon} size={44} />
+ <p className="text-16-normal">
+ {t('analysis.compare.title')}
+ </p>
+ </div>
+ {isProfileTypeCompleted && (
+ <Button
+ aria-label={t(
+ 'analysis.accessibility.button_go_to_profil'
+ )}
+ onClick={goToForm}
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-16-normal',
+ }}
+ >
+ <StyledIcon icon={ProfileEditIcon} size={40} />
+ </Button>
+ )}
+ </div>
+ <AnalysisConsumption
+ aggregatedPerformanceIndicator={
+ aggregatedPerformanceIndicators
+ }
+ performanceIndicators={performanceIndicators}
+ analysisDate={analysisDate}
+ />
+ </div>
+ </div>
+ {fluidTypes.includes(FluidType.ELECTRICITY) && (
+ <div className="analysis-content">
+ <div className="card">
+ <ElecHalfHourMonthlyAnalysis
+ analysisDate={analysisDate}
+ />
+ </div>
+ </div>
+ )}
+ </>
)}
</>
) : (
diff --git a/src/components/Analysis/analysisConsumptionRow.scss b/src/components/Analysis/analysisConsumptionRow.scss
index 460c2c58fa955f442f0e35791607781fc3b74556..2079dd10bcb6a4e410822290a0603ced17ab7d36 100644
--- a/src/components/Analysis/analysisConsumptionRow.scss
+++ b/src/components/Analysis/analysisConsumptionRow.scss
@@ -90,15 +90,18 @@
}
}
}
-.icon-container {
- flex-basis: 10%;
- display: flex;
- justify-content: center;
- svg {
- align-self: center;
- width: 40px;
+.analysisRow {
+ .icon-container {
+ flex-basis: 10%;
+ display: flex;
+ justify-content: center;
+ svg {
+ align-self: center;
+ width: 40px;
+ }
}
}
+
.container-graph {
flex-basis: 50%;
display: flex;
diff --git a/src/components/App.tsx b/src/components/App.tsx
index 171fcd7bc33765fcef906fc11f97b50bc95e8524..86d54f5d42de5d53ecbbe39e9a760de279aea935 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -16,7 +16,9 @@ import WelcomeModal from 'components/Onboarding/WelcomeModal'
export const history = createBrowserHistory()
export const App = () => {
- const { onboarding } = useSelector((state: AppStore) => state.ecolyo.profile)
+ const { onboarding, isProfileEcogestureCompleted } = useSelector(
+ (state: AppStore) => state.ecolyo.profile
+ )
const { termsStatus } = useSelector((state: AppStore) => state.ecolyo.global)
return (
@@ -34,7 +36,10 @@ export const App = () => {
)}
<Main>
<Content className="app-content">
- <Routes termsStatus={termsStatus} />
+ <Routes
+ termsStatus={termsStatus}
+ isProfileEcogestureCompleted={isProfileEcogestureCompleted}
+ />
</Content>
</Main>
</SplashRoot>
diff --git a/src/components/Challenge/ChallengeCard.tsx b/src/components/Challenge/ChallengeCard.tsx
index 74ea68a883a16e8599079977c37407c290aa09fd..852f3395f068d089e0d07c9335d1a028ff9001ae 100644
--- a/src/components/Challenge/ChallengeCard.tsx
+++ b/src/components/Challenge/ChallengeCard.tsx
@@ -43,7 +43,7 @@ const ChallengeCard: React.FC<ChallengeCardProps> = ({
return (
<div
onClick={() => moveToSlide(index)}
- className={indexSlider === index ? 'slide active' : 'slide'}
+ className={indexSlider === index ? 'slide active' : 'slide inactive'}
style={{
minWidth: `${cardWidth}px`,
maxWidth: `${cardWidth}px`,
diff --git a/src/components/Challenge/ChallengeView.tsx b/src/components/Challenge/ChallengeView.tsx
index 973567aa27d99829bc479d0f5c96f65b25f95db9..17fd422778224cb6702939696b60e44158fb8bff 100644
--- a/src/components/Challenge/ChallengeView.tsx
+++ b/src/components/Challenge/ChallengeView.tsx
@@ -153,7 +153,7 @@ const ChallengeView: React.FC = () => {
<div className="content">{t('challenge.banner.content')}</div>
</div>
<div
- className="container"
+ className="challenge-container"
style={{
transform: `translateX(${containerTranslation}px)`,
}}
diff --git a/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap b/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap
index bcc90ac093e8f250c8c5cd6dc483834e8ad85012..5f7dfa0f965a157f1e7727250d4b17fe4761cbbf 100644
--- a/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap
+++ b/src/components/Challenge/__snapshots__/ChallengeView.spec.tsx.snap
@@ -39,7 +39,7 @@ exports[`ChallengeView component should be rendered correctly 1`] = `
</div>
</div>
<div
- className="container"
+ className="challenge-container"
style={
Object {
"transform": "translateX(16px)",
diff --git a/src/components/Challenge/challengeCard.scss b/src/components/Challenge/challengeCard.scss
index 9cac755c11a77f978a6ff1e683272b0a84e5b8f5..467bf027d6cb61a93c8df01b7b56a48e6a6addd2 100644
--- a/src/components/Challenge/challengeCard.scss
+++ b/src/components/Challenge/challengeCard.scss
@@ -1,16 +1,16 @@
.slide {
- margin: auto;
- // height: 465px;
+ margin: 1rem 1rem 1rem 0;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px;
- margin-right: 1rem;
transition: all 300ms ease;
color: white;
display: flex;
flex-direction: column;
- transform: scale(0.9);
&.active {
- transform: scale(1.08);
+ transform: scale(1);
+ }
+ &.inactive {
+ transform: scale(0.9);
}
.cardContent {
background: linear-gradient(180deg, #323339 0%, #25262b 100%);
diff --git a/src/components/Challenge/challengeView.scss b/src/components/Challenge/challengeView.scss
index 55fb3f25e166b550df3fde5585c9b1f80ed28635..31e0d2537f02d08fc6b4b2bbd9ae70f61815e4ba 100644
--- a/src/components/Challenge/challengeView.scss
+++ b/src/components/Challenge/challengeView.scss
@@ -4,22 +4,15 @@
@import '../../styles/base/z-index';
.challengeSlider {
- min-height: inherit;
- margin-top: 0;
- overflow-x: hidden;
- padding: 1rem 2rem;
position: relative;
- max-width: 850px;
+ min-height: inherit;
user-select: none;
- @media all and (min-width: $width-tablet) {
- margin: auto;
- // margin-top: 3rem; //TODO: uncomment when wip is removed from challenges
- padding: 5rem 2rem 2rem 2rem;
- min-height: 0;
- }
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding: 0 2rem;
}
.building-banner {
- position: absolute;
display: flex;
flex-direction: column;
align-items: center;
@@ -40,20 +33,19 @@
padding: 0.5rem 1rem;
text-align: center;
height: 75px;
- margin: 0 1rem;
+ margin: 1rem -1rem 0;
z-index: calc(#{$z-header} - 1);
border-radius: 6px;
- top: 14px;
- left: 0;
.title {
font-weight: 700;
margin-bottom: 0.1rem;
}
}
-.container {
- min-height: inherit;
+.challenge-container {
+ position: relative;
width: 100%;
display: flex;
+ flex: 1;
transition: all 300ms ease;
}
.cardContent {
diff --git a/src/components/CommonKit/ErrorPage/ErrorPage.spec.tsx b/src/components/CommonKit/ErrorPage/ErrorPage.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..fdc9f8093f7249ebba4cca314b06af13e510ecd4
--- /dev/null
+++ b/src/components/CommonKit/ErrorPage/ErrorPage.spec.tsx
@@ -0,0 +1,65 @@
+/* eslint-disable react/display-name */
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import configureStore from 'redux-mock-store'
+import { globalStateData } from '../../../../tests/__mocks__/globalStateData.mock'
+import { Provider } from 'react-redux'
+import ErrorPage from './ErrorPage'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+
+jest.mock('components/Header/Header', () => () => <div id="Header"></div>)
+jest.mock('components/Header/CozyBar', () => () => <div id="CozyBar"></div>)
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+jest.mock('components/Content/Content', () => (props: any) => (
+ <div id="content">{props.children}</div>
+))
+const mockStore = configureStore([])
+
+describe('ErrorPage component', () => {
+ it('should be rendered correctly', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <ErrorPage text={'test'} returnPage={'ecogestures'} />
+ </Provider>
+ )
+
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should click on button and be redirected', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <ErrorPage text={'test'} returnPage={'ecogestures'} />
+ </Provider>
+ )
+ wrapper.find(Button).simulate('click')
+ expect(mockHistoryPush).toHaveBeenCalledWith('/ecogestures')
+ })
+})
diff --git a/src/components/CommonKit/ErrorPage/ErrorPage.tsx b/src/components/CommonKit/ErrorPage/ErrorPage.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..1a673d0111f983735179c7d291bbbd767b4ae189
--- /dev/null
+++ b/src/components/CommonKit/ErrorPage/ErrorPage.tsx
@@ -0,0 +1,61 @@
+import React, { useCallback, useState } from 'react'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import Content from 'components/Content/Content'
+import CozyBar from 'components/Header/CozyBar'
+import Header from 'components/Header/Header'
+import BearIcon from 'assets/icons/visu/duelResult/CHALLENGE0001-0.svg'
+import { Button } from '@material-ui/core'
+import { useHistory } from 'react-router-dom'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import './errorPage.scss'
+
+interface ErrorPageProps {
+ text: string
+ returnPage: string
+}
+
+const ErrorPage: React.FC<ErrorPageProps> = ({
+ text,
+ returnPage,
+}: ErrorPageProps) => {
+ const history = useHistory()
+ const { t } = useI18n()
+
+ const [headerHeight, setHeaderHeight] = useState<number>(0)
+ const defineHeaderHeight = (height: number) => {
+ setHeaderHeight(height)
+ }
+ const handleClick = useCallback(() => {
+ history.push(`/${returnPage}`)
+ }, [history, returnPage])
+ return (
+ <>
+ <CozyBar titleKey={'error_page.main'} />
+ <Header
+ setHeaderHeight={defineHeaderHeight}
+ desktopTitleKey={'error_page.main'}
+ ></Header>
+ <Content height={headerHeight}>
+ <div className="error-container">
+ <StyledIcon className="profile-icon" icon={BearIcon} size={250} />
+
+ <div className="text-18-bold head">{text}</div>
+ <Button
+ aria-label={t('error_page.back')}
+ onClick={handleClick}
+ variant={'contained'}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-18-bold',
+ }}
+ type="submit"
+ >
+ {t('error_page.back')}
+ </Button>
+ </div>
+ </Content>
+ </>
+ )
+}
+
+export default ErrorPage
diff --git a/src/components/CommonKit/ErrorPage/__snapshots__/ErrorPage.spec.tsx.snap b/src/components/CommonKit/ErrorPage/__snapshots__/ErrorPage.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..bf887521e977eb7e5d8226e3ad4713e0388ba034
--- /dev/null
+++ b/src/components/CommonKit/ErrorPage/__snapshots__/ErrorPage.spec.tsx.snap
@@ -0,0 +1,224 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ErrorPage component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <ErrorPage
+ returnPage="ecogestures"
+ text="test"
+ >
+ <Component
+ titleKey="error_page.main"
+ >
+ <div
+ id="CozyBar"
+ />
+ </Component>
+ <Component
+ desktopTitleKey="error_page.main"
+ setHeaderHeight={[Function]}
+ >
+ <div
+ id="Header"
+ />
+ </Component>
+ <Component
+ height={0}
+ >
+ <div
+ id="content"
+ >
+ <div
+ className="error-container"
+ >
+ <StyledIcon
+ className="profile-icon"
+ icon="test-file-stub"
+ size={250}
+ >
+ <Icon
+ aria-hidden={true}
+ className="profile-icon"
+ icon="test-file-stub"
+ size={250}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="profile-icon styles__icon___23x3R"
+ height={250}
+ style={Object {}}
+ width={250}
+ >
+ <svg
+ aria-hidden={true}
+ className="profile-icon styles__icon___23x3R"
+ height={250}
+ style={Object {}}
+ width={250}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-18-bold head"
+ >
+ test
+ </div>
+ <WithStyles(ForwardRef(Button))
+ aria-label="error_page.back"
+ classes={
+ Object {
+ "label": "text-18-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[Function]}
+ type="submit"
+ variant="contained"
+ >
+ <ForwardRef(Button)
+ aria-label="error_page.back"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-18-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ type="submit"
+ variant="contained"
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="error_page.back"
+ className="MuiButton-root btn-highlight MuiButton-contained"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="submit"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="error_page.back"
+ className="MuiButton-root btn-highlight MuiButton-contained"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="submit"
+ >
+ <button
+ aria-label="error_page.back"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-contained"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="submit"
+ >
+ <span
+ className="MuiButton-label text-18-bold"
+ >
+ error_page.back
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </Component>
+ </ErrorPage>
+</Provider>
+`;
diff --git a/src/components/CommonKit/ErrorPage/errorPage.scss b/src/components/CommonKit/ErrorPage/errorPage.scss
new file mode 100644
index 0000000000000000000000000000000000000000..3724f53ad83c13f77cf694c5c5e83a154b2effd8
--- /dev/null
+++ b/src/components/CommonKit/ErrorPage/errorPage.scss
@@ -0,0 +1,15 @@
+@import 'src/styles/base/color';
+
+.error-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ max-width: 450px;
+ margin: auto;
+ padding: 2rem;
+ text-align: center;
+ .head {
+ color: $gold-shadow;
+ }
+}
diff --git a/src/components/ConsumptionVisualizer/NoDataModal.tsx b/src/components/ConsumptionVisualizer/NoDataModal.tsx
index f6c64f7a1ce587b23504a0aa0036cb25b87f5f40..b61a39f2560b65b25bc4416b78d92da8b0b77e41 100644
--- a/src/components/ConsumptionVisualizer/NoDataModal.tsx
+++ b/src/components/ConsumptionVisualizer/NoDataModal.tsx
@@ -49,12 +49,18 @@ const NoDataModal: React.FC<NoDataModalProps> = ({
<div className="text-16-normal">
{t('consumption_visualizer.dataModal.list_title')}
</div>
- <div className="text-16-normal">
+ <div className="text-16-normal justified-text">
+ <span>• </span>
{t('consumption_visualizer.dataModal.item1')}
</div>
- <div className="text-16-normal">
+ <div className="text-16-normal justified-text">
+ <span>• </span>
{t('consumption_visualizer.dataModal.item2')}
</div>
+ <div className="text-16-normal justified-text">
+ <span>• </span>
+ {t('consumption_visualizer.dataModal.item3')}
+ </div>
<Button
aria-label={t('ecogesture_info_modal.button_close')}
onClick={handleCloseClick}
diff --git a/src/components/ConsumptionVisualizer/noDataModal.scss b/src/components/ConsumptionVisualizer/noDataModal.scss
index f2e825050705a7808030a5dee1bac7232012e18f..bbb047c844054b312f2c0e4da61d0eabc997792d 100644
--- a/src/components/ConsumptionVisualizer/noDataModal.scss
+++ b/src/components/ConsumptionVisualizer/noDataModal.scss
@@ -16,4 +16,8 @@
text-align: center;
margin: 1rem 0;
}
+ .justified-text {
+ display: flex;
+ justify-content: start;
+ }
}
diff --git a/src/components/Content/Content.tsx b/src/components/Content/Content.tsx
index 1722a0bd6f7c919a3d11c0b2a39cc848460f9de3..6e141e27364bfbdc739d623e8d636136fe291fef 100644
--- a/src/components/Content/Content.tsx
+++ b/src/components/Content/Content.tsx
@@ -82,7 +82,7 @@ const Content: React.FC<ContentProps> = ({
paddingBottom: 0,
minHeight:
screenType !== ScreenType.DESKTOP
- ? `calc(100vh - ${height}px - ${cozyBarHeight}px - ${cozyNavHeight}px)`
+ ? `calc(100vh - ${height}px - ${cozyBarHeight}px - ${cozyNavHeight}px - env(safe-area-inset-top) - env(safe-area-inset-bottom) - env(safe-area-inset-bottom))`
: `unset`,
background: background,
}}
diff --git a/src/components/Ecogesture/EcogestureCard.spec.tsx b/src/components/Ecogesture/EcogestureCard.spec.tsx
index 923e9edfb873722b9c85d17bcabfa24009ba434d..3146ddbdb375ff02e25230b93ed77e1859ba5775 100644
--- a/src/components/Ecogesture/EcogestureCard.spec.tsx
+++ b/src/components/Ecogesture/EcogestureCard.spec.tsx
@@ -1,7 +1,14 @@
+/* eslint-disable react/display-name */
import React from 'react'
-import { shallow } from 'enzyme'
+import { mount } from 'enzyme'
import EcogestureCard from 'components/Ecogesture/EcogestureCard'
import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import toJson from 'enzyme-to-json'
+import configureStore from 'redux-mock-store'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { Provider } from 'react-redux'
+import { BrowserRouter } from 'react-router-dom'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -12,6 +19,9 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
+jest.mock('components/CommonKit/Icon/StyledIcon', () => () => (
+ <div id="StyledIcon"></div>
+))
const mockImportIconbyId = jest.fn()
jest.mock('utils/utils', () => {
return {
@@ -21,11 +31,43 @@ jest.mock('utils/utils', () => {
}
})
+const mockStore = configureStore([])
+
describe('EcogestureCard component', () => {
- it('should be rendered correctly', () => {
- const component = shallow(
- <EcogestureCard ecogesture={ecogesturesData[0]} />
- ).getElement
- expect(component).toMatchSnapshot()
+ it('should be rendered correctly', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ },
+ })
+ mockImportIconbyId.mockReturnValueOnce('')
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <EcogestureCard ecogesture={ecogesturesData[0]} />
+ </BrowserRouter>
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should be with default icon', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ },
+ })
+ mockImportIconbyId.mockReturnValue(undefined)
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <EcogestureCard ecogesture={ecogesturesData[0]} />
+ </BrowserRouter>
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find('.Icon').exists()).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/EcogestureCard.tsx b/src/components/Ecogesture/EcogestureCard.tsx
index 8ea970b48f7e482441dcaaab9d74997103597ab8..5e9311124a90512a769afd1cdf4dd0caf24326c9 100644
--- a/src/components/Ecogesture/EcogestureCard.tsx
+++ b/src/components/Ecogesture/EcogestureCard.tsx
@@ -6,22 +6,17 @@ import { importIconbyId } from 'utils/utils'
import './ecogestureCard.scss'
import EfficientyRating from './EfficientyRating'
import defaultIcon from 'assets/icons/visu/ecogesture/default.svg'
+import { Link as RouterLink } from 'react-router-dom'
+import { Link } from '@material-ui/core/'
interface EcogestureCardProps {
ecogesture: Ecogesture
- handleClick?: (ecogesture: Ecogesture) => void
- challengeEcogesture?: number
}
const EcogestureCard: React.FC<EcogestureCardProps> = ({
ecogesture,
- handleClick,
}: EcogestureCardProps) => {
- const handleCardclick = () => {
- handleClick && ecogesture && handleClick(ecogesture)
- }
const [ecogestureIcon, setEcogestureIcon] = useState<string>('')
-
useEffect(() => {
async function handleEcogestureIcon() {
const icon = await importIconbyId(ecogesture.id, 'ecogesture')
@@ -37,8 +32,12 @@ const EcogestureCard: React.FC<EcogestureCardProps> = ({
}, [ecogesture])
return (
- <>
- <StyledEcogestureCard onClick={handleCardclick}>
+ <Link
+ to={`/ecogesture/${ecogesture.id}`}
+ component={RouterLink}
+ className="ecogesture-list-item"
+ >
+ <StyledEcogestureCard>
<div className="ec">
<div className={`ec-content `}>
<div className="ec-content-icon">
@@ -53,7 +52,7 @@ const EcogestureCard: React.FC<EcogestureCardProps> = ({
</div>
</div>
</StyledEcogestureCard>
- </>
+ </Link>
)
}
diff --git a/src/components/Ecogesture/EcogestureEmptyList.spec.tsx b/src/components/Ecogesture/EcogestureEmptyList.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..1093a09a8df46b210f413ec0e7e223b13c53ada5
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureEmptyList.spec.tsx
@@ -0,0 +1,140 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import configureStore from 'redux-mock-store'
+import { profileData } from '../../../tests/__mocks__/profile.mock'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { Provider } from 'react-redux'
+import Button from '@material-ui/core/Button'
+import EcogestureEmptyList from './EcogestureEmptyList'
+import toJson from 'enzyme-to-json'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+const mockStore = configureStore([])
+const mockChangeTab = jest.fn()
+describe('EcogestureEmptyList component', () => {
+ it('should be rendered correctly', () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureEmptyList
+ setTab={mockChangeTab}
+ isObjective={true}
+ isSelectionDone={false}
+ />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should return to all ecogestures', () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureEmptyList
+ setTab={mockChangeTab}
+ isObjective={false}
+ isSelectionDone={true}
+ />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(mockChangeTab).toHaveBeenCalledTimes(1)
+ })
+ it('should launch ecogesture form', () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureEmptyList
+ setTab={mockChangeTab}
+ isObjective={false}
+ isSelectionDone={false}
+ />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ expect(mockHistoryPush).toHaveBeenCalledWith('/ecogesture-form')
+ })
+ it('should render doing text with empty list on completed selection', () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureEmptyList
+ setTab={mockChangeTab}
+ isObjective={false}
+ isSelectionDone={true}
+ />
+ </Provider>
+ )
+
+ expect(
+ wrapper
+ .find('.text')
+ .first()
+ .text()
+ ).toBe('ecogesture.emptyList.doing1_done')
+ })
+ it('should render objective text with empty list on completed selection', () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureEmptyList
+ setTab={mockChangeTab}
+ isObjective={true}
+ isSelectionDone={true}
+ />
+ </Provider>
+ )
+
+ expect(
+ wrapper
+ .find('.text')
+ .first()
+ .text()
+ ).toBe('ecogesture.emptyList.obj1_done')
+ })
+})
diff --git a/src/components/Ecogesture/EcogestureEmptyList.tsx b/src/components/Ecogesture/EcogestureEmptyList.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..d83cdec613cb77fdfb8df8a14d6fa632760a977a
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureEmptyList.tsx
@@ -0,0 +1,80 @@
+import React from 'react'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import Button from '@material-ui/core/Button'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import doingIcon from 'assets/icons/ico/doing-enabled.svg'
+import objectiveIcon from 'assets/icons/ico/objective-enabled.svg'
+
+import './ecogestureEmptyList.scss'
+import { useHistory } from 'react-router-dom'
+
+interface EcogestureEmptyListProps {
+ setTab: React.Dispatch<React.SetStateAction<number>>
+ isObjective: boolean
+ isSelectionDone: boolean
+}
+const EcogestureEmptyList: React.FC<EcogestureEmptyListProps> = ({
+ setTab,
+ isObjective,
+ isSelectionDone,
+}: EcogestureEmptyListProps) => {
+ const { t } = useI18n()
+ const history = useHistory()
+ return (
+ <div className="ec-empty-container">
+ <div className="ec-empty-content">
+ <StyledIcon
+ className="icon-big"
+ icon={isObjective ? objectiveIcon : doingIcon}
+ size={150}
+ />
+ <div className="text-16-normal text">
+ {isObjective
+ ? isSelectionDone
+ ? t('ecogesture.emptyList.obj1_done')
+ : t('ecogesture.emptyList.obj1')
+ : isSelectionDone
+ ? t('ecogesture.emptyList.doing1_done')
+ : t('ecogesture.emptyList.doing1')}
+ </div>
+ <div className="text-16-normal text">
+ {isObjective
+ ? isSelectionDone
+ ? t('ecogesture.emptyList.obj2_done')
+ : t('ecogesture.emptyList.obj2')
+ : isSelectionDone
+ ? t('ecogesture.emptyList.doing2_done')
+ : t('ecogesture.emptyList.doing2')}
+ </div>
+ <div className="btn-container">
+ <Button
+ aria-label={t('ecogesture.emptyList.btn1')}
+ onClick={() => setTab(2)}
+ classes={{
+ root: 'btn-secondary-negative btn1',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.emptyList.btn1')}
+ </Button>
+ {!isSelectionDone && (
+ <Button
+ aria-label={t('ecogesture.emptyList.btn2')}
+ onClick={() => {
+ history.push('/ecogesture-form')
+ }}
+ classes={{
+ root: 'btn-highlight btn2',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.emptyList.btn2')}
+ </Button>
+ )}
+ </div>
+ </div>
+ </div>
+ )
+}
+
+export default EcogestureEmptyList
diff --git a/src/components/Ecogesture/EcogestureError.spec.tsx b/src/components/Ecogesture/EcogestureError.spec.tsx
deleted file mode 100644
index 810c48e44d2a1d9730401002edb515f2a455fa86..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureError.spec.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import React from 'react'
-import { mount } from 'enzyme'
-import configureStore from 'redux-mock-store'
-import { profileData } from '../../../tests/__mocks__/profile.mock'
-import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
-import { Provider } from 'react-redux'
-import Button from '@material-ui/core/Button'
-import EcogestureError from './EcogestureError'
-
-jest.mock('cozy-ui/transpiled/react/I18n', () => {
- return {
- useI18n: jest.fn(() => {
- return {
- t: (str: string) => str,
- }
- }),
- }
-})
-const mockHistoryPush = jest.fn()
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- useHistory: () => ({
- push: mockHistoryPush,
- }),
-}))
-const mockStore = configureStore([])
-
-describe('EcogestureError component', () => {
- it('should be rendered correctly', () => {
- const store = mockStore({
- ecolyo: {
- profile: profileData,
- global: globalStateData,
- },
- })
- const wrapper = mount(
- <Provider store={store}>
- <EcogestureError />
- </Provider>
- )
- expect(wrapper.find(Button).exists()).toBeTruthy()
- })
- it('should redirect to profile type form', () => {
- const store = mockStore({
- ecolyo: {
- profile: profileData,
- global: globalStateData,
- },
- })
- const wrapper = mount(
- <Provider store={store}>
- <EcogestureError />
- </Provider>
- )
- wrapper
- .find('.btn-highlight')
- .first()
- .simulate('click')
- })
-})
diff --git a/src/components/Ecogesture/EcogestureError.tsx b/src/components/Ecogesture/EcogestureError.tsx
deleted file mode 100644
index 8dc6110cc007442dbe4f91e3884d29f70487fcc1..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureError.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { useHistory } from 'react-router-dom'
-import Button from '@material-ui/core/Button'
-import './ecogestureError.scss'
-
-const EcogestureError: React.FC = () => {
- const { t } = useI18n()
- const history = useHistory()
- const goToForm = () => {
- history.push('/profileType')
- }
- return (
- <div className="ec-error-container">
- <div className="ec-error-content">
- <div className="ec-error-title text-16-normal">
- {t('ecogesture.adjust_profil.description')}
- </div>
- <Button
- aria-label={t('ecogesture.accessibility.button_go_to_profil')}
- onClick={goToForm}
- classes={{
- root: 'btn-highlight',
- label: 'text-16-bold',
- }}
- >
- {t('ecogesture.adjust_profil.button_go_to_profil')}
- </Button>
- </div>
- </div>
- )
-}
-
-export default EcogestureError
diff --git a/src/components/Ecogesture/EcogestureInfoModal.spec.tsx b/src/components/Ecogesture/EcogestureInfoModal.spec.tsx
deleted file mode 100644
index e6f7bc0acb97f3be4bebe5ac1704e3017a6b202e..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureInfoModal.spec.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import React from 'react'
-import { mount } from 'enzyme'
-import EcogestureInfoModal from './EcogestureInfoModal'
-import Button from '@material-ui/core/Button'
-
-jest.mock('cozy-ui/transpiled/react/I18n', () => {
- return {
- useI18n: jest.fn(() => {
- return {
- t: (str: string) => str,
- }
- }),
- }
-})
-
-const mockHandleCloseClick = jest.fn()
-
-describe('EcogestureInfoModal component', () => {
- it('should be rendered correctly', () => {
- const wrapper = mount(
- <EcogestureInfoModal
- open={true}
- handleCloseClick={mockHandleCloseClick}
- />
- )
- expect(wrapper.find('.info-header').exists()).toBeTruthy()
- expect(wrapper.find('.info-title').exists()).toBeTruthy()
- expect(wrapper.find('.info-detail').exists()).toBeTruthy()
- expect(wrapper.find(Button).exists()).toBeTruthy()
- })
-
- it('should be call handleCloseClick when click on button', () => {
- const wrapper = mount(
- <EcogestureInfoModal
- open={true}
- handleCloseClick={mockHandleCloseClick}
- />
- )
- wrapper
- .find(Button)
- .first()
- .simulate('click')
- expect(mockHandleCloseClick).toHaveBeenCalled()
- })
-})
diff --git a/src/components/Ecogesture/EcogestureInfoModal.tsx b/src/components/Ecogesture/EcogestureInfoModal.tsx
deleted file mode 100644
index f346c70f6fe42f6f72181a7effa826f9b233e771..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureInfoModal.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React from 'react'
-import './ecogestureInfoModal.scss'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import Button from '@material-ui/core/Button'
-import Dialog from '@material-ui/core/Dialog'
-import HeaderQuestion from 'assets/icons/ico/header-question.svg'
-
-interface EcogestureInfoModalProps {
- open: boolean
- handleCloseClick: () => void
-}
-
-const EcogestureInfoModal: React.FC<EcogestureInfoModalProps> = ({
- open,
- handleCloseClick,
-}: EcogestureInfoModalProps) => {
- const { t } = useI18n()
- return (
- <Dialog
- open={open}
- onClose={handleCloseClick}
- aria-labelledby={'accessibility-title'}
- classes={{
- root: 'modal-root',
- paper: 'modal-paper',
- }}
- >
- <div id={'accessibility-title'}>
- {t('ecogesture_info_modal.accessibility.window_title')}
- </div>
- <div className="info-header">
- <Icon icon={HeaderQuestion} size={80} />
- </div>
- <div className="info-content">
- <div className="info-title text-20-bold">
- {t('ecogesture_info_modal.header')}
- </div>
- <div className="info-detail text-16-normal">
- {t('ecogesture_info_modal.text')}
- </div>
- <Button
- aria-label={t('ecogesture_info_modal.accessibility.button_close')}
- onClick={handleCloseClick}
- classes={{
- root: 'btn-secondary-negative',
- label: 'text-14-normal',
- }}
- >
- {t('ecogesture_info_modal.button_close')}
- </Button>
- </div>
- </Dialog>
- )
-}
-
-export default EcogestureInfoModal
diff --git a/src/components/Ecogesture/EcogestureInitModal.spec.tsx b/src/components/Ecogesture/EcogestureInitModal.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..298dd9d9330ba76d3dc56029d2361bd98ff31a7b
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureInitModal.spec.tsx
@@ -0,0 +1,109 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import configureStore from 'redux-mock-store'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
+import { Provider } from 'react-redux'
+import EcogestureInitModal from './EcogestureInitModal'
+import { Button } from '@material-ui/core'
+import { mockInitialProfileState } from '../../../tests/__mocks__/store'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockImportIconbyId = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ importIconbyId: jest.fn(() => {
+ return mockImportIconbyId
+ }),
+ }
+})
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+
+const mockStore = configureStore([])
+const mockHandleClose = jest.fn()
+const mockHandleLaunchForm = jest.fn()
+describe('EcogestureInitModal component', () => {
+ it('should be rendered correctly', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ profile: mockInitialProfileState,
+ challenge: challengeStateData,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureInitModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ handleLaunchForm={mockHandleLaunchForm}
+ />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should close modal ', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ profile: mockInitialProfileState,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureInitModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ handleLaunchForm={mockHandleLaunchForm}
+ />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(mockHandleClose).toHaveBeenCalledTimes(1)
+ })
+ it('should close modal and maunch form', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ profile: mockInitialProfileState,
+ challenge: challengeStateData,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureInitModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ handleLaunchForm={mockHandleLaunchForm}
+ />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ expect(mockHandleLaunchForm).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/src/components/Ecogesture/EcogestureInitModal.tsx b/src/components/Ecogesture/EcogestureInitModal.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..3993af59ede7ee0f1331df44dd66af18e193434b
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureInitModal.tsx
@@ -0,0 +1,77 @@
+import React from 'react'
+import Dialog from '@material-ui/core/Dialog'
+import { Button, IconButton } from '@material-ui/core'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import CloseIcon from 'assets/icons/ico/close.svg'
+import './ecogestureInitModal.scss'
+interface EcogestureInitModalProps {
+ open: boolean
+ handleCloseClick: () => void
+ handleLaunchForm: () => void
+}
+const EcogestureInitModal: React.FC<EcogestureInitModalProps> = ({
+ open,
+ handleCloseClick,
+ handleLaunchForm,
+}: EcogestureInitModalProps) => {
+ const { t } = useI18n()
+ return (
+ <Dialog
+ open={open}
+ onClose={handleCloseClick}
+ aria-labelledby={'accessibility-title'}
+ classes={{
+ root: 'modal-root',
+ paper: 'modal-paper',
+ }}
+ >
+ <div id={'accessibility-title'}>
+ {t('feedback.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="eg-init-modal">
+ <div className="title text-20-bold">
+ {t('ecogesture.initModal.title')}
+ </div>
+ <div className="text-16-normal text">
+ {t('ecogesture.initModal.text1')}
+ </div>
+ <div className="text-16-normal text">
+ {t('ecogesture.initModal.text2')}
+ </div>
+ <div className="buttons-container">
+ <Button
+ aria-label={t('ecogesture.initModal.btn1')}
+ onClick={handleCloseClick}
+ className="btn1"
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.initModal.btn1')}
+ </Button>
+ <Button
+ aria-label={t('ecogesture.initModal.btn2')}
+ onClick={handleLaunchForm}
+ classes={{
+ root: 'btn-profile-next rounded',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.initModal.btn2')}
+ </Button>
+ </div>
+ </div>
+ </Dialog>
+ )
+}
+
+export default EcogestureInitModal
diff --git a/src/components/Ecogesture/EcogestureList.spec.tsx b/src/components/Ecogesture/EcogestureList.spec.tsx
index 23a5010f45db065ead90777b479dbf2de68d2aa2..f56bd2f2352d1207de14f95851f41a095c44d8b7 100644
--- a/src/components/Ecogesture/EcogestureList.spec.tsx
+++ b/src/components/Ecogesture/EcogestureList.spec.tsx
@@ -1,6 +1,15 @@
import React from 'react'
-import { shallow } from 'enzyme'
+import { mount } from 'enzyme'
import EcogestureList from 'components/Ecogesture/EcogestureList'
+import toJson from 'enzyme-to-json'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
+import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import { BrowserRouter } from 'react-router-dom'
+import { Button, MenuItem } from '@material-ui/core'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -11,11 +20,87 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
+jest.mock('components/Ecogesture/EcogestureCard', () => 'mock-ecogesturecard')
+
+const mockStore = configureStore([])
describe('EcogesturesList component', () => {
- it('should be rendered correctly', () => {
- const component = shallow(<EcogestureList filteredByProfile={false} />)
- .getElement
- expect(component).toMatchSnapshot()
+ it('should be rendered correctly', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <EcogestureList
+ list={ecogesturesData}
+ displaySelection={false}
+ selectionTotal={0}
+ selectionViewed={0}
+ />
+ </BrowserRouter>
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+
+ it('should open the filter menu and select all ecogesture', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <EcogestureList
+ list={ecogesturesData}
+ displaySelection={false}
+ selectionTotal={0}
+ selectionViewed={0}
+ />
+ </BrowserRouter>
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper.find('.filter-button').simulate('click')
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(wrapper.find('.filter-menu').exists()).toBeTruthy()
+ wrapper
+ .find(MenuItem)
+ .at(1)
+ .simulate('click')
+ expect(wrapper.find('.ecogestures').text()).toBe('ecogesture.HEATING')
+ })
+
+ it('should display the selection section', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <EcogestureList
+ list={ecogesturesData}
+ displaySelection={true}
+ selectionTotal={50}
+ selectionViewed={10}
+ />
+ </BrowserRouter>
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(wrapper.find('.selection').exists()).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/EcogestureList.tsx b/src/components/Ecogesture/EcogestureList.tsx
index d2d54b6ad47be6ca19b83328759dac1c0f0c7551..029e36748d843c2b69784bb22bf0fb7a1ebe798a 100644
--- a/src/components/Ecogesture/EcogestureList.tsx
+++ b/src/components/Ecogesture/EcogestureList.tsx
@@ -1,62 +1,37 @@
-import React, { useState, useEffect, useCallback } from 'react'
+import React, { useState } from 'react'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { useClient } from 'cozy-client'
-
+import { useHistory } from 'react-router-dom'
import { Ecogesture } from 'models'
-import EcogestureService from 'services/ecogesture.service'
+
import { Menu, MenuItem, ListItemIcon } from '@material-ui/core/'
import SortIcon from 'assets/icons/ico/sort.svg'
import CheckIcon from 'assets/icons/ico/check.svg'
-import QuestionIcon from 'assets/icons/ico/efficiency-question.svg'
-import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
import EcogestureCard from 'components/Ecogesture/EcogestureCard'
-import EcogestureModal from 'components/Ecogesture/EcogestureModal'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import Button from '@material-ui/core/Button'
import './ecogestureList.scss'
-import { ProfileType } from 'models/profileType.model'
import { Usage } from 'enum/ecogesture.enum'
-import EcogestureInfoModal from './EcogestureInfoModal'
-import { getSeason } from 'utils/utils'
interface EcogestureListProps {
- filteredByProfile: boolean
- profileType?: ProfileType
+ list: Ecogesture[]
+ displaySelection: boolean
+ selectionTotal: number
+ selectionViewed: number
}
const EcogestureList: React.FC<EcogestureListProps> = ({
- filteredByProfile,
- profileType,
+ list,
+ displaySelection,
+ selectionTotal,
+ selectionViewed,
}: EcogestureListProps) => {
const { t } = useI18n()
- const client = useClient()
-
- const [
- selectedEcogesture,
- setSelectedEcogesture,
- ] = useState<Ecogesture | null>(null)
- const [ecogestures, setEcogestures] = useState<Ecogesture[] | null>(null)
- const [isLoaded, setisLoaded] = useState(false)
- const [openEcogestureModal, setOpenEcogestureModal] = useState(false)
+ const history = useHistory()
const [activeFilter, setactiveFilter] = useState<string>(Usage[Usage.ALL])
const [openDropDown, setopenDropDown] = useState<boolean>(false)
- const [openInfoModal, setOpenInfoModal] = useState<boolean>(false)
-
- const handleClick = (ecogesture: Ecogesture) => {
- setSelectedEcogesture(ecogesture)
- setOpenEcogestureModal(true)
- }
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)
- const handleCloseClick = useCallback(() => {
- setOpenEcogestureModal(false)
- }, [])
-
- const toggleInfoModal = () => {
- setOpenInfoModal(prev => !prev)
- }
-
const toggleDropDown = () => {
setopenDropDown(prev => !prev)
}
@@ -69,12 +44,13 @@ const EcogestureList: React.FC<EcogestureListProps> = ({
usage && setactiveFilter(usage)
setAnchorEl(null)
}
+
const filterEcogesture = (_ecogestures: Ecogesture[]) => {
const filtered = _ecogestures
.filter(ecogesture => Usage[ecogesture.usage] === activeFilter)
.map((ecogesture, index) => (
<div key={index} className="ecogesture-list-item">
- <EcogestureCard ecogesture={ecogesture} handleClick={handleClick} />
+ <EcogestureCard ecogesture={ecogesture} />
</div>
))
if (filtered.length > 0) {
@@ -82,7 +58,7 @@ const EcogestureList: React.FC<EcogestureListProps> = ({
} else {
return (
<div className="ec-filter-error">
- <div className="text-16-normal">
+ <div className="text-20-normal">
{t('ecogesture.no_ecogesture_filter.text1')}
</div>
<div className="text-16-italic">
@@ -93,33 +69,29 @@ const EcogestureList: React.FC<EcogestureListProps> = ({
}
}
- useEffect(() => {
- let subscribed = true
- async function loadEcogestures() {
- const ecogestureService = new EcogestureService(client)
- const dataAll = await ecogestureService.getAllEcogestures(getSeason())
- if (subscribed && dataAll) {
- setEcogestures(dataAll)
- if (filteredByProfile && profileType) {
- setEcogestures(
- EcogestureService.getEcogestureListByProfile(dataAll, profileType)
- )
- } else {
- setEcogestures(dataAll)
- }
- }
- setisLoaded(true)
- }
- loadEcogestures()
- return () => {
- subscribed = false
- }
- }, [client, filteredByProfile, profileType])
-
return (
<div className="ecogesture-root">
- <>
- <div className="efficiency-button-content">
+ <div className="efficiency-button-content">
+ {displaySelection ? (
+ <div className="selection text-16-normal">
+ <span>{t('ecogesture.selection')}</span>
+ <span>
+ {`(${selectionViewed} ${t(
+ 'ecogesture.selection_2'
+ )} ${selectionTotal})`}
+ </span>
+ <Button
+ aria-label={t('ecogesture.accessibility.button_selection')}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-16-bold',
+ }}
+ onClick={() => history.push('/ecogesture-selection')}
+ >
+ {t('ecogesture.button_selection')}
+ </Button>
+ </div>
+ ) : (
<div className="filters text-16-normal">
<div
className="filter-button"
@@ -188,59 +160,28 @@ const EcogestureList: React.FC<EcogestureListProps> = ({
</Menu>
</div>
</div>
- {filteredByProfile && (
- <Button
- classes={{
- root: 'btn-secondary-negative btn-info',
- label: 'text-14-normal',
- }}
- aria-controls="ecogesture-info"
- aria-haspopup="true"
- onClick={toggleInfoModal}
- variant="contained"
- >
- <StyledIcon icon={QuestionIcon} size={40} />
- </Button>
- )}
- </div>
- <div className="ecogesture-content">
- {!ecogestures || !isLoaded ? (
- <div className="ecogesture-content-loading">
- <StyledSpinner size="5em" />
+ )}
+ </div>
+ <div className="ecogesture-content">
+ {list.length > 0 && activeFilter === Usage[Usage.ALL] ? (
+ list.map((ecogesture, index) => (
+ <EcogestureCard ecogesture={ecogesture} key={index} />
+ ))
+ ) : list.length > 0 && activeFilter !== Usage[Usage.ALL] ? (
+ filterEcogesture(list)
+ ) : !displaySelection ? (
+ <div className="ec-filter-error">
+ <div className="text-20-normal">
+ {t('ecogesture.no_ecogesture_filter.text1')}
</div>
- ) : ecogestures && activeFilter === Usage[Usage.ALL] ? (
- ecogestures.map((ecogesture, index) => (
- <div key={index} className="ecogesture-list-item">
- <EcogestureCard
- ecogesture={ecogesture}
- handleClick={handleClick}
- />
- </div>
- ))
- ) : ecogestures && activeFilter !== Usage[Usage.ALL] ? (
- filterEcogesture(ecogestures)
- ) : (
- <div className="ec-filter-error">
- <div className="text-16-normal">
- {t('ecogesture.no_ecogesture')}
- </div>
+ <div className="text-16-italic">
+ {t('ecogesture.no_ecogesture_filter.text2')}
</div>
- )}
- </div>
- </>
-
- {selectedEcogesture && (
- <EcogestureModal
- open={openEcogestureModal}
- ecogesture={selectedEcogesture}
- isAction={false}
- handleCloseClick={handleCloseClick}
- />
- )}
- <EcogestureInfoModal
- open={openInfoModal}
- handleCloseClick={toggleInfoModal}
- />
+ </div>
+ ) : (
+ ''
+ )}
+ </div>
</div>
)
}
diff --git a/src/components/Ecogesture/EcogestureModal.spec.tsx b/src/components/Ecogesture/EcogestureModal.spec.tsx
index 727fd4ca90e6d46cd0ce88d48a6bcf8ce18b881c..561d8020c68246c657b1b072d0b8edf1e6adb371 100644
--- a/src/components/Ecogesture/EcogestureModal.spec.tsx
+++ b/src/components/Ecogesture/EcogestureModal.spec.tsx
@@ -6,6 +6,7 @@ import configureStore from 'redux-mock-store'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
import { Provider } from 'react-redux'
+import { act } from 'react-dom/test-utils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -28,7 +29,7 @@ jest.mock('utils/utils', () => {
const mockStore = configureStore([])
describe('EcogestureModal component', () => {
- it('should be rendered correctly', () => {
+ it('should be rendered correctly', async () => {
const store = mockStore({
ecolyo: {
global: globalStateData,
@@ -46,6 +47,10 @@ describe('EcogestureModal component', () => {
/>
</Provider>
)
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
expect(wrapper.find('.em-title').text()).toEqual(
ecogesturesData[0].shortName
)
diff --git a/src/components/Ecogesture/EcogestureView.spec.tsx b/src/components/Ecogesture/EcogestureView.spec.tsx
index baba729c0016026591b381f015cc15346ead7e1f..0c7ab368b83f4f492036b88c08246bc8fe91195f 100644
--- a/src/components/Ecogesture/EcogestureView.spec.tsx
+++ b/src/components/Ecogesture/EcogestureView.spec.tsx
@@ -8,7 +8,14 @@ import {
mockInitialEcolyoState,
} from '../../../tests/__mocks__/store'
import EcogestureView from 'components/Ecogesture/EcogestureView'
-import { Tab } from '@material-ui/core'
+import { IconButton, Tab } from '@material-ui/core'
+import toJson from 'enzyme-to-json'
+import EcogestureInitModal from './EcogestureInitModal'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import { Season } from 'enum/ecogesture.enum'
+import EcogestureEmptyList from './EcogestureEmptyList'
+import * as profileActions from 'store/profile/profile.actions'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -19,52 +26,155 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
+const mockgetAllEcogestures = jest.fn()
+const mockGetEcogestureListByProfile = jest.fn()
+jest.mock('services/ecogesture.service', () => {
+ return jest.fn(() => {
+ return {
+ getAllEcogestures: mockgetAllEcogestures,
+ getEcogestureListByProfile: mockGetEcogestureListByProfile,
+ }
+ })
+})
+const mockgetProfile = jest.fn()
+const mockUpdateProfile = jest.fn()
+jest.mock('services/profile.service', () => {
+ return jest.fn(() => {
+ return {
+ getProfile: mockgetProfile,
+ updateProfile: mockUpdateProfile,
+ }
+ })
+})
-jest.mock('components/Header/CozyBar', () => () => <div id="cozybar"></div>)
-jest.mock('components/Ecogesture/EcogestureList', () => () => (
- <div id="ecogesturelist"></div>
-))
-jest.mock('components/Ecogesture/EcogestureError', () => () => (
- <div id="ecogestureerror"></div>
-))
-
+jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
+jest.mock('components/Header/Header', () => 'mock-header')
+jest.mock('components/Ecogesture/EcogestureList', () => 'mock-ecogesturelist')
+jest.mock('components/Content/Content', () => 'mock-content')
+const mockgetSeason = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ getSeason: jest.fn(() => {
+ return mockgetSeason
+ }),
+ }
+})
const useSelectorSpy = jest.spyOn(reactRedux, 'useSelector')
+const mockHistoryGoBack = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useLocation: () => {
+ return {
+ search: '',
+ }
+ },
+ useHistory: () => ({
+ push: mockHistoryGoBack,
+ }),
+}))
+
describe('EcogestureView component', () => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let store: any
beforeEach(() => {
store = createMockStore(mockInitialEcolyoState)
+ mockgetSeason.mockClear()
+ mockgetAllEcogestures.mockClear()
+ mockGetEcogestureListByProfile.mockClear()
+ })
+
+ it('should be rendered correctly', async () => {
+ useSelectorSpy.mockReturnValue({
+ ...mockInitialEcolyoState.profile,
+ isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: true,
+ })
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce(ecogesturesData)
+ mockGetEcogestureListByProfile.mockResolvedValue([])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(Tab).length).toBe(3)
+ expect(toJson(wrapper)).toMatchSnapshot()
})
+ it('should render ecogesture init modal', async () => {
+ const updateProfileSpy = jest.spyOn(profileActions, 'updateProfile')
- it('should be rendered correctly', () => {
useSelectorSpy.mockReturnValue({
...mockInitialEcolyoState.profile,
isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: false,
})
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce(ecogesturesData)
+ mockGetEcogestureListByProfile.mockResolvedValueOnce([])
const wrapper = mount(
<Provider store={store}>
<EcogestureView />
</Provider>
)
- expect(wrapper.find('#cozybar')).toBeTruthy()
- expect(wrapper.find(Tab).length).toBe(2)
- expect(wrapper.find('#ecogesturelist').length).toBe(2)
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(EcogestureInitModal).exists()).toBeTruthy()
+ wrapper
+ .find(IconButton)
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+
+ expect(updateProfileSpy).toHaveBeenCalledWith({
+ haveSeenEcogestureModal: true,
+ })
})
- it('should be rendered with EcogestureError', () => {
+ it('should render empty list', async () => {
+ useSelectorSpy.mockReturnValue({
+ ...mockInitialEcolyoState.profile,
+ isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: false,
+ })
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce([])
+ mockGetEcogestureListByProfile.mockResolvedValueOnce([])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(EcogestureEmptyList).exists()).toBeTruthy()
+ })
+ it('should change tab', async () => {
useSelectorSpy.mockReturnValue({
...mockInitialEcolyoState.profile,
- isProfileTypeCompleted: false,
+ isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: true,
})
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce(ecogesturesData)
+ mockGetEcogestureListByProfile.mockResolvedValueOnce([])
const wrapper = mount(
<Provider store={store}>
<EcogestureView />
</Provider>
)
- expect(wrapper.find('#cozybar')).toBeTruthy()
- expect(wrapper.find(Tab).length).toBe(2)
- expect(wrapper.find('#ecogesturelist').length).toBe(1)
- expect(wrapper.find('#ecogestureerror').length).toBe(1)
+ await waitForComponentToPaint(wrapper)
+
+ wrapper
+ .find(Tab)
+ .first()
+ .simulate('click')
+ mockgetAllEcogestures.mockResolvedValueOnce([])
+
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(EcogestureEmptyList).exists()).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/EcogestureView.tsx b/src/components/Ecogesture/EcogestureView.tsx
index e40a59ccf6bf2c40bf61019aba43377bc41bfee1..3a4110cca29bb1bcf55966cfeb2968e9cf2150df 100644
--- a/src/components/Ecogesture/EcogestureView.tsx
+++ b/src/components/Ecogesture/EcogestureView.tsx
@@ -1,4 +1,5 @@
-import React, { useState } from 'react'
+import React, { useCallback, useEffect, useState } from 'react'
+import { useClient } from 'cozy-client'
import EcogestureList from 'components/Ecogesture/EcogestureList'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
@@ -7,9 +8,19 @@ import { Tabs, Tab } from '@material-ui/core'
import './ecogestureView.scss'
import classNames from 'classnames'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import EcogestureError from './EcogestureError'
-import { useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
import { AppStore } from 'store'
+import { Ecogesture } from 'models'
+import EcogestureService from 'services/ecogesture.service'
+import { getSeason } from 'utils/utils'
+import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
+import { FluidType } from 'enum/fluid.enum'
+import EcogestureEmptyList from './EcogestureEmptyList'
+import { EcogestureStatus } from 'enum/ecogesture.enum'
+import EcogestureInitModal from './EcogestureInitModal'
+import { updateProfile } from 'store/profile/profile.actions'
+import { useHistory, useLocation } from 'react-router-dom'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
interface TabPanelProps {
children?: React.ReactNode
@@ -39,67 +50,234 @@ const EcogestureView: React.FC = () => {
setHeaderHeight(height)
}
const { t } = useI18n()
- const profile = useSelector((state: AppStore) => state.ecolyo.profile)
- const profileType = useSelector((state: Appstore) => state.ecolyo.profileType)
- const [value, setValue] = useState<number>(0)
+ const client = useClient()
+ const dispatch = useDispatch()
+ const tab = new URLSearchParams(useLocation().search).get('tab')
- const handleChange = () => {
- value === 0 ? setValue(1) : setValue(0)
- }
+ const profileType = useSelector((state: AppStore) => state.ecolyo.profileType)
+ const profileEcogesture: ProfileEcogesture = useSelector(
+ (state: AppStore) => state.ecolyo.profileEcogesture
+ )
- const tabProps = (index: number) => {
+ const { haveSeenEcogestureModal, isProfileEcogestureCompleted } = useSelector(
+ (state: AppStore) => state.ecolyo.profile
+ )
+ const [tabValue, setTabValue] = useState<EcogestureStatus>(
+ tab ? parseInt(tab) : EcogestureStatus.ALL
+ )
+ const history = useHistory()
+ const [isLoaded, setIsLoaded] = useState<boolean>(false)
+ const [allEcogestureList, setAllEcogestureList] = useState<Ecogesture[]>([])
+ const [doingEcogestureList, setDoingEcogestureList] = useState<Ecogesture[]>(
+ []
+ )
+ const [objectiveEcogestureList, setObjectiveEcogestureList] = useState<
+ Ecogesture[]
+ >([])
+ const [totalViewed, setTotalViewed] = useState<number>(0)
+ const [totalAvailable, setTotalAvailable] = useState<number>(0)
+ const [openEcogestureInitModal, setOpenEcogestureInitModal] = useState<
+ boolean
+ >(!haveSeenEcogestureModal)
+
+ const handleLaunchForm = useCallback(async () => {
+ dispatch(updateProfile({ haveSeenEcogestureModal: true }))
+ setOpenEcogestureInitModal(false)
+ history.push('/ecogesture-form?modal=false')
+ }, [dispatch, history])
+
+ const handleCloseEcogestureInitModal = useCallback(async () => {
+ dispatch(updateProfile({ haveSeenEcogestureModal: true }))
+ setOpenEcogestureInitModal(false)
+ }, [dispatch])
+
+ const handleChange = useCallback(
+ (event: React.ChangeEvent<{}>, newValue: any) => {
+ event.preventDefault()
+ const params = new URLSearchParams()
+ params.append('tab', newValue.toString())
+ history.push({ search: params.toString() })
+ setTabValue(newValue)
+ },
+ [history]
+ )
+
+ const tabProps = useCallback((index: number) => {
return {
id: `simple-tab-${index}`,
'aria-controls': `simple-tabpanel-${index}`,
}
- }
+ }, [])
+
+ const getLabel = useCallback(
+ (_tab: number) => {
+ return (
+ <>
+ {t(`ecogesture.title_tab_${_tab}`)}
+ <br></br>
+ {_tab === EcogestureStatus.OBJECTIVE &&
+ `(${objectiveEcogestureList.length})`}
+ {_tab === EcogestureStatus.DOING && `(${doingEcogestureList.length})`}
+ {_tab === EcogestureStatus.ALL && `(${allEcogestureList.length})`}
+ </>
+ )
+ },
+ [
+ allEcogestureList.length,
+ doingEcogestureList.length,
+ objectiveEcogestureList.length,
+ t,
+ ]
+ )
+
+ useEffect(() => {
+ let subscribed = true
+ async function loadEcogestures() {
+ const ecogestureService = new EcogestureService(client)
+ const dataAll = await ecogestureService.getAllEcogestures(getSeason())
+ const availableList: Ecogesture[] = await ecogestureService.getEcogestureListByProfile(
+ profileEcogesture
+ )
+ const filteredList: Ecogesture[] = availableList.filter(
+ (ecogesture: Ecogesture) => ecogesture.viewedInSelection === false
+ )
+ if (subscribed && dataAll) {
+ const doing = dataAll.filter(ecogesture => ecogesture.doing === true)
+ const objective = dataAll.filter(
+ ecogesture => ecogesture.objective === true
+ )
+ setAllEcogestureList(dataAll)
+ setObjectiveEcogestureList(objective)
+ setDoingEcogestureList(doing)
+ setTotalAvailable(availableList.length)
+ setTotalViewed(availableList.length - filteredList.length)
+ }
+ setIsLoaded(true)
+ }
+ loadEcogestures()
+ return () => {
+ subscribed = false
+ }
+ }, [client, profileEcogesture, profileType])
return (
<>
<CozyBar titleKey={'common.title_ecogestures'} />
- <Header
- setHeaderHeight={defineHeaderHeight}
- desktopTitleKey={'common.title_ecogestures'}
- >
- <Tabs
- value={value}
- className="ecogestures-tabs"
- aria-label="ecogestures-tabs"
- onChange={handleChange}
- TabIndicatorProps={{ className: 'indicator-tab' }}
- centered={true}
- >
- <Tab
- label={t('ecogesture.title_tab_1')}
- className={classNames('single-tab', {
- ['active']: value === 0,
- })}
- {...tabProps(0)}
- ></Tab>
- <Tab
- label={t('ecogesture.title_tab_2')}
- className={classNames('single-tab', {
- ['active']: value === 1,
- })}
- {...tabProps(1)}
- ></Tab>
- </Tabs>
- </Header>
- <Content height={headerHeight}>
- <TabPanel value={value} index={0}>
- <EcogestureList filteredByProfile={false} />
- </TabPanel>
- <TabPanel value={value} index={1}>
- {profile.isProfileTypeCompleted ? (
- <EcogestureList
- filteredByProfile={true}
- profileType={profileType}
- />
- ) : (
- <EcogestureError />
- )}
- </TabPanel>
- </Content>
+ {!isLoaded ? (
+ <Content height={headerHeight}>
+ <div className="ecogesture-spinner" aria-busy="true">
+ <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ </Content>
+ ) : (
+ <>
+ <Header
+ setHeaderHeight={defineHeaderHeight}
+ desktopTitleKey={'common.title_ecogestures'}
+ >
+ <Tabs
+ value={tabValue}
+ className="ecogestures-tabs"
+ aria-label="ecogestures-tabs"
+ onChange={handleChange}
+ TabIndicatorProps={{ className: 'indicator-tab' }}
+ centered={true}
+ >
+ <Tab
+ label={getLabel(EcogestureStatus.OBJECTIVE)}
+ className={classNames('single-tab', {
+ ['active']: tabValue === EcogestureStatus.OBJECTIVE,
+ })}
+ {...tabProps(EcogestureStatus.OBJECTIVE)}
+ ></Tab>
+ <Tab
+ label={getLabel(EcogestureStatus.DOING)}
+ className={classNames('single-tab', {
+ ['active']: tabValue === EcogestureStatus.DOING,
+ })}
+ {...tabProps(EcogestureStatus.DOING)}
+ ></Tab>
+ <Tab
+ label={getLabel(EcogestureStatus.ALL)}
+ className={classNames('single-tab', {
+ ['active']: tabValue === EcogestureStatus.ALL,
+ })}
+ {...tabProps(EcogestureStatus.ALL)}
+ ></Tab>
+ </Tabs>
+ </Header>
+ <Content height={headerHeight}>
+ <TabPanel value={tabValue} index={EcogestureStatus.OBJECTIVE}>
+ {isProfileEcogestureCompleted === true ? (
+ totalAvailable === totalViewed &&
+ objectiveEcogestureList.length === 0 ? (
+ <EcogestureEmptyList
+ setTab={setTabValue}
+ isObjective={true}
+ isSelectionDone={true}
+ />
+ ) : (
+ <EcogestureList
+ list={objectiveEcogestureList}
+ displaySelection={totalAvailable !== totalViewed}
+ selectionTotal={totalAvailable}
+ selectionViewed={totalViewed}
+ />
+ )
+ ) : (
+ <EcogestureEmptyList
+ setTab={setTabValue}
+ isObjective={true}
+ isSelectionDone={false}
+ />
+ )}
+ </TabPanel>
+
+ <TabPanel value={tabValue} index={EcogestureStatus.DOING}>
+ {isProfileEcogestureCompleted === true ? (
+ totalAvailable === totalViewed &&
+ doingEcogestureList.length === 0 ? (
+ <EcogestureEmptyList
+ setTab={setTabValue}
+ isObjective={false}
+ isSelectionDone={true}
+ />
+ ) : (
+ <EcogestureList
+ list={doingEcogestureList}
+ displaySelection={totalAvailable !== totalViewed}
+ selectionTotal={totalAvailable}
+ selectionViewed={totalViewed}
+ />
+ )
+ ) : (
+ <EcogestureEmptyList
+ setTab={setTabValue}
+ isObjective={false}
+ isSelectionDone={false}
+ />
+ )}
+ </TabPanel>
+ <TabPanel value={tabValue} index={EcogestureStatus.ALL}>
+ {allEcogestureList.length && (
+ <EcogestureList
+ list={allEcogestureList}
+ displaySelection={false}
+ selectionTotal={totalAvailable}
+ selectionViewed={totalViewed}
+ />
+ )}
+ </TabPanel>
+ </Content>
+ </>
+ )}
+ {openEcogestureInitModal && (
+ <EcogestureInitModal
+ open={openEcogestureInitModal}
+ handleCloseClick={handleCloseEcogestureInitModal}
+ handleLaunchForm={handleLaunchForm}
+ />
+ )}
</>
)
}
diff --git a/src/components/Ecogesture/EfficientyRating.spec.tsx b/src/components/Ecogesture/EfficientyRating.spec.tsx
index e167effc6d036e47862ad27703d9492928490aee..6b28de3796cfd74894268ca53e83d975ae5531fa 100644
--- a/src/components/Ecogesture/EfficientyRating.spec.tsx
+++ b/src/components/Ecogesture/EfficientyRating.spec.tsx
@@ -1,6 +1,11 @@
import React from 'react'
-import { shallow } from 'enzyme'
+import { mount } from 'enzyme'
import EfficientyRating from 'components/Ecogesture/EfficientyRating'
+import toJson from 'enzyme-to-json'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
+import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -12,9 +17,21 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}
})
+const mockStore = configureStore([])
+
describe('EfficientyRating component', () => {
it('should be rendered correctly', () => {
- const component = shallow(<EfficientyRating result={3} />).getElement
- expect(component).toMatchSnapshot()
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EfficientyRating result={3} />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
})
})
diff --git a/src/components/Ecogesture/SingleEcogesture.spec.tsx b/src/components/Ecogesture/SingleEcogesture.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8f45017fcaf5eb431b6a1d88e135d84c4bdc2df0
--- /dev/null
+++ b/src/components/Ecogesture/SingleEcogesture.spec.tsx
@@ -0,0 +1,175 @@
+/* eslint-disable react/display-name */
+import React from 'react'
+import { mount } from 'enzyme'
+import { Provider } from 'react-redux'
+import SingleEcogesture from 'components/Ecogesture/SingleEcogesture'
+import toJson from 'enzyme-to-json'
+import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import configureStore from 'redux-mock-store'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockImportIconbyId = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ importIconbyId: () => mockImportIconbyId,
+ }
+})
+
+jest.mock('components/Ecogesture/EfficientyRating', () => () => (
+ <div id="EfficientyRating"></div>
+))
+jest.mock('components/Header/Header', () => () => <div id="Header"></div>)
+jest.mock('components/Header/CozyBar', () => () => <div id="CozyBar"></div>)
+jest.mock('components/CommonKit/Spinner/StyledSpinner', () => () => (
+ <div id="spinner"></div>
+))
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+jest.mock('components/Content/Content', () => (props: any) => (
+ <div id="content">{props.children}</div>
+))
+
+const mockgetEcogesturesByIds = jest.fn()
+const mockupdateEcogesture = jest.fn()
+jest.mock('services/ecogesture.service', () => {
+ return jest.fn(() => {
+ return {
+ getEcogesturesByIds: mockgetEcogesturesByIds,
+ updateEcogesture: mockupdateEcogesture,
+ }
+ })
+})
+
+const mockStore = configureStore([])
+
+describe('SingleEcogesture component', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+ it('should be rendered correctly', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+
+ mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should change doing status', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+
+ mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
+ mockImportIconbyId.mockReturnValue('')
+ const updatedEcogesture = { ...ecogesturesData[0], doing: true }
+ mockupdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
+ const wrapper = mount(
+ <Provider store={store}>
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ wrapper
+ .find('.doing-btn')
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+
+ expect(mockupdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
+ })
+ it('should change objective status', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+
+ mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
+ mockImportIconbyId.mockReturnValue('icontest')
+ const updatedEcogesture = { ...ecogesturesData[0], objective: true }
+ mockupdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ wrapper
+ .find('.objective-btn')
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+ expect(mockupdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
+ })
+ it('should toggle more details', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+
+ mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
+ mockImportIconbyId.mockReturnValue(undefined)
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ wrapper
+ .find('.toggle-text')
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find('.toggle-text').text()).toBe(
+ 'ecogesture_modal.show_less'
+ )
+ })
+})
diff --git a/src/components/Ecogesture/SingleEcogesture.tsx b/src/components/Ecogesture/SingleEcogesture.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..96154c6c9c667603003ebb574e2bd079f663b76e
--- /dev/null
+++ b/src/components/Ecogesture/SingleEcogesture.tsx
@@ -0,0 +1,231 @@
+import React, { useState, useEffect, useCallback, useMemo } from 'react'
+import './singleEcogesture.scss'
+import classNames from 'classnames'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { AppStore } from 'store'
+import { useSelector } from 'react-redux'
+import useExploration from 'components/Hooks/useExploration'
+import { importIconbyId } from 'utils/utils'
+import EcogestureService from 'services/ecogesture.service'
+import IconButton from '@material-ui/core/IconButton'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import { Ecogesture } from 'models'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import EfficientyRating from './EfficientyRating'
+import defaultIcon from 'assets/icons/visu/ecogesture/default.svg'
+import doingEnabledIcon from 'assets/icons/ico/doing-enabled.svg'
+import doingDisabledIcon from 'assets/icons/ico/doing-disabled.svg'
+import objectiveEnabledIcon from 'assets/icons/ico/objective-enabled.svg'
+import objectiveDisabledIcon from 'assets/icons/ico/objective-disabled.svg'
+import Content from 'components/Content/Content'
+import CozyBar from 'components/Header/CozyBar'
+import Header from 'components/Header/Header'
+import { useClient } from 'cozy-client'
+import ErrorPage from 'components/CommonKit/ErrorPage/ErrorPage'
+import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
+import { FluidType } from 'enum/fluid.enum'
+
+interface SingleEcogestureProps {
+ match: { params: { id: string } }
+}
+
+const SingleEcogesture: React.FC<SingleEcogestureProps> = ({
+ match,
+}: SingleEcogestureProps) => {
+ const { t } = useI18n()
+ const client = useClient()
+ const [ecogesture, setEcogesture] = useState<Ecogesture>()
+ const [ecogestureIcon, setEcogestureIcon] = useState<string>('')
+ const [isMoreDetail, setIsMoreDetail] = useState<boolean>(false)
+ const [isDoing, setIsDoing] = useState<boolean>(false)
+ const [isObjective, setIsObjective] = useState<boolean>(false)
+ const [isLoading, setIsLoading] = useState<boolean>(true)
+ const ecogestureID: string = match.params.id
+
+ const ecogestureService = useMemo(() => new EcogestureService(client), [
+ client,
+ ])
+ const { currentChallenge } = useSelector(
+ (state: AppStore) => state.ecolyo.challenge
+ )
+ const [headerHeight, setHeaderHeight] = useState<number>(0)
+ const defineHeaderHeight = (height: number) => {
+ setHeaderHeight(height)
+ }
+ const [, setValidExploration] = useExploration()
+ const toggleMoreDetail = () => {
+ setIsMoreDetail(prev => !prev)
+ }
+ const toggleObjective = useCallback(async () => {
+ if (ecogesture) {
+ const toUpdate: Ecogesture = { ...ecogesture, objective: !isObjective }
+ const updatedEcogesture = await ecogestureService.updateEcogesture(
+ toUpdate
+ )
+ if (updatedEcogesture) {
+ setIsObjective(prev => !prev)
+ setEcogesture(updatedEcogesture)
+ }
+ }
+ }, [ecogesture, ecogestureService, isObjective])
+
+ const toggleDoing = useCallback(async () => {
+ if (ecogesture) {
+ const toUpdate: Ecogesture = { ...ecogesture, doing: !isDoing }
+ const updatedEcogesture = await ecogestureService.updateEcogesture(
+ toUpdate
+ )
+ if (updatedEcogesture) {
+ setIsDoing(prev => !prev)
+ setEcogesture(updatedEcogesture)
+ }
+ }
+ }, [ecogesture, ecogestureService, isDoing])
+
+ useEffect(() => {
+ let subscribed = true
+ async function getSingleEcogesture() {
+ const data = await ecogestureService.getEcogesturesByIds([ecogestureID])
+ if (subscribed) {
+ if (data && data[0]) {
+ setEcogesture(data[0])
+ //Prevent case this key doesn't exist in doctype
+ setIsObjective(data[0].objective ? true : false)
+ setIsDoing(data[0].doing ? true : false)
+ const icon = await importIconbyId(data[0].id, 'ecogesture')
+ if (subscribed) {
+ if (icon) {
+ setEcogestureIcon(icon)
+ } else {
+ setEcogestureIcon(defaultIcon)
+ }
+ if (
+ currentChallenge &&
+ currentChallenge.exploration.ecogesture_id === data[0]._id
+ ) {
+ setValidExploration(currentChallenge.exploration.id)
+ }
+ }
+ }
+ setIsLoading(false)
+ }
+ }
+ getSingleEcogesture()
+
+ return () => {
+ subscribed = false
+ }
+ }, [
+ client,
+ currentChallenge,
+ ecogestureID,
+ ecogestureService,
+ setValidExploration,
+ ])
+
+ if (isLoading) {
+ return (
+ <Content height={headerHeight}>
+ <div className="se-loader-container">
+ <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ </Content>
+ )
+ }
+ return ecogesture ? (
+ <>
+ <CozyBar
+ titleKey={ecogesture && ecogesture.shortName}
+ isNotKey={true}
+ displayBackArrow={true}
+ />
+ <Header
+ setHeaderHeight={defineHeaderHeight}
+ desktopTitleKey={ecogesture && ecogesture.shortName}
+ displayBackArrow={true}
+ isNotKey={true}
+ ></Header>
+ <Content height={headerHeight}>
+ <div className="single-ecogesture">
+ <div className="icon-container">
+ {ecogestureIcon && (
+ <StyledIcon
+ className="icon-big"
+ icon={ecogestureIcon}
+ size={220}
+ />
+ )}
+ </div>
+ <div className="details">
+ <div className="efficiency">
+ <span className="text text-14-normal">
+ {t('ecogesture_modal.efficiency')}
+ </span>
+ <EfficientyRating result={Math.round(ecogesture.efficiency)} />
+ </div>
+ </div>
+ <div className="styled-container">
+ <div className="long-name">{ecogesture.longName}</div>
+ <div
+ className={classNames('description text-16-normal-150', {
+ ['block']: isMoreDetail === true,
+ })}
+ >
+ {ecogesture.longDescription}
+ </div>
+ <div
+ className="toggle-text text-15-normal"
+ onClick={toggleMoreDetail}
+ >
+ {isMoreDetail
+ ? t('ecogesture_modal.show_less')
+ : t('ecogesture_modal.show_more')}
+ </div>
+ </div>
+ <div className="buttons-selection">
+ <IconButton
+ aria-label={t('ecogesture.objective')}
+ onClick={toggleObjective}
+ classes={{
+ root: `btn-secondary-negative objective-btn ${isObjective &&
+ 'active'}`,
+ label: 'text-15-normal',
+ }}
+ >
+ <Icon
+ className="status-icon"
+ icon={
+ isObjective ? objectiveEnabledIcon : objectiveDisabledIcon
+ }
+ size={40}
+ />
+ <span>{t('ecogesture.objective')}</span>
+ </IconButton>
+ <IconButton
+ aria-label={t('ecogesture.doing')}
+ onClick={toggleDoing}
+ classes={{
+ root: `btn-secondary-negative doing-btn ${isDoing && 'active'}`,
+ label: 'text-15-normal',
+ }}
+ >
+ <Icon
+ className="status-icon"
+ icon={isDoing ? doingEnabledIcon : doingDisabledIcon}
+ size={40}
+ />
+ <span>{t('ecogesture.doing')}</span>
+ </IconButton>
+ </div>
+ </div>
+ </Content>
+ </>
+ ) : (
+ <ErrorPage
+ text={t('error_page.no_ecogesture')}
+ returnPage={'ecogestures'}
+ />
+ )
+}
+
+export default SingleEcogesture
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap
index f8e50719fc6b0aae73189e91184e0b20f98f1a2a..f919091582e7d742b443f548059551526e767bcb 100644
--- a/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap
@@ -1,3 +1,429 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`EcogestureCard component should be rendered correctly 1`] = `[Function]`;
+exports[`EcogestureCard component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <BrowserRouter>
+ <Router
+ history={
+ Object {
+ "action": "POP",
+ "block": [Function],
+ "createHref": [Function],
+ "go": [Function],
+ "goBack": [Function],
+ "goForward": [Function],
+ "length": 1,
+ "listen": [Function],
+ "location": Object {
+ "hash": "",
+ "pathname": "/",
+ "search": "",
+ "state": undefined,
+ },
+ "push": [Function],
+ "replace": [Function],
+ }
+ }
+ >
+ <EcogestureCard
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ "viewedInSelection": false,
+ }
+ }
+ >
+ <WithStyles(ForwardRef(Link))
+ className="ecogesture-list-item"
+ component={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "displayName": "Link",
+ "propTypes": Object {
+ "innerRef": [Function],
+ "onClick": [Function],
+ "replace": [Function],
+ "target": [Function],
+ "to": [Function],
+ },
+ "render": [Function],
+ }
+ }
+ to="/ecogesture/ECOGESTURE001"
+ >
+ <ForwardRef(Link)
+ className="ecogesture-list-item"
+ classes={
+ Object {
+ "button": "MuiLink-button",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiLink-root",
+ "underlineAlways": "MuiLink-underlineAlways",
+ "underlineHover": "MuiLink-underlineHover",
+ "underlineNone": "MuiLink-underlineNone",
+ }
+ }
+ component={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "displayName": "Link",
+ "propTypes": Object {
+ "innerRef": [Function],
+ "onClick": [Function],
+ "replace": [Function],
+ "target": [Function],
+ "to": [Function],
+ },
+ "render": [Function],
+ }
+ }
+ to="/ecogesture/ECOGESTURE001"
+ >
+ <WithStyles(ForwardRef(Typography))
+ className="MuiLink-root MuiLink-underlineHover ecogesture-list-item"
+ color="primary"
+ component={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "displayName": "Link",
+ "propTypes": Object {
+ "innerRef": [Function],
+ "onClick": [Function],
+ "replace": [Function],
+ "target": [Function],
+ "to": [Function],
+ },
+ "render": [Function],
+ }
+ }
+ onBlur={[Function]}
+ onFocus={[Function]}
+ to="/ecogesture/ECOGESTURE001"
+ variant="inherit"
+ >
+ <ForwardRef(Typography)
+ className="MuiLink-root MuiLink-underlineHover ecogesture-list-item"
+ classes={
+ Object {
+ "alignCenter": "MuiTypography-alignCenter",
+ "alignJustify": "MuiTypography-alignJustify",
+ "alignLeft": "MuiTypography-alignLeft",
+ "alignRight": "MuiTypography-alignRight",
+ "body1": "MuiTypography-body1",
+ "body2": "MuiTypography-body2",
+ "button": "MuiTypography-button",
+ "caption": "MuiTypography-caption",
+ "colorError": "MuiTypography-colorError",
+ "colorInherit": "MuiTypography-colorInherit",
+ "colorPrimary": "MuiTypography-colorPrimary",
+ "colorSecondary": "MuiTypography-colorSecondary",
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
+ "displayBlock": "MuiTypography-displayBlock",
+ "displayInline": "MuiTypography-displayInline",
+ "gutterBottom": "MuiTypography-gutterBottom",
+ "h1": "MuiTypography-h1",
+ "h2": "MuiTypography-h2",
+ "h3": "MuiTypography-h3",
+ "h4": "MuiTypography-h4",
+ "h5": "MuiTypography-h5",
+ "h6": "MuiTypography-h6",
+ "noWrap": "MuiTypography-noWrap",
+ "overline": "MuiTypography-overline",
+ "paragraph": "MuiTypography-paragraph",
+ "root": "MuiTypography-root",
+ "srOnly": "MuiTypography-srOnly",
+ "subtitle1": "MuiTypography-subtitle1",
+ "subtitle2": "MuiTypography-subtitle2",
+ }
+ }
+ color="primary"
+ component={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "displayName": "Link",
+ "propTypes": Object {
+ "innerRef": [Function],
+ "onClick": [Function],
+ "replace": [Function],
+ "target": [Function],
+ "to": [Function],
+ },
+ "render": [Function],
+ }
+ }
+ onBlur={[Function]}
+ onFocus={[Function]}
+ to="/ecogesture/ECOGESTURE001"
+ variant="inherit"
+ >
+ <Link
+ className="MuiTypography-root MuiLink-root MuiLink-underlineHover ecogesture-list-item MuiTypography-colorPrimary"
+ onBlur={[Function]}
+ onFocus={[Function]}
+ to="/ecogesture/ECOGESTURE001"
+ >
+ <LinkAnchor
+ className="MuiTypography-root MuiLink-root MuiLink-underlineHover ecogesture-list-item MuiTypography-colorPrimary"
+ href="/ecogesture/ECOGESTURE001"
+ navigate={[Function]}
+ onBlur={[Function]}
+ onFocus={[Function]}
+ >
+ <a
+ className="MuiTypography-root MuiLink-root MuiLink-underlineHover ecogesture-list-item MuiTypography-colorPrimary"
+ href="/ecogesture/ECOGESTURE001"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onFocus={[Function]}
+ >
+ <StyledEcogestureCard>
+ <WithStyles(WithStyles(ForwardRef(CardActionArea)))>
+ <WithStyles(ForwardRef(CardActionArea))
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(CardActionArea))-root-1",
+ }
+ }
+ >
+ <ForwardRef(CardActionArea)
+ classes={
+ Object {
+ "focusHighlight": "MuiCardActionArea-focusHighlight",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1",
+ }
+ }
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1"
+ focusVisibleClassName="Mui-focusVisible"
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ focusVisibleClassName="Mui-focusVisible"
+ >
+ <button
+ className="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1"
+ disabled={false}
+ onBlur={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <WithStyles(WithStyles(ForwardRef(CardContent)))>
+ <WithStyles(ForwardRef(CardContent))
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(CardContent))-root-2",
+ }
+ }
+ >
+ <ForwardRef(CardContent)
+ classes={
+ Object {
+ "root": "MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2",
+ }
+ }
+ >
+ <div
+ className="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
+ >
+ <div
+ className="ec"
+ >
+ <div
+ className="ec-content "
+ >
+ <div
+ className="ec-content-icon"
+ >
+ <Component
+ className="Icon"
+ icon=""
+ size={50}
+ >
+ <div
+ id="StyledIcon"
+ />
+ </Component>
+ </div>
+ <div
+ className="ec-content-short-name text-15-bold"
+ >
+ Bonhomme de neige
+ </div>
+ <div
+ className="ec-content-efficiency"
+ >
+ <EfficientyRating
+ result={4}
+ >
+ <div
+ className="thunder"
+ >
+ <Component
+ className="star"
+ icon="test-file-stub"
+ key="0"
+ size={15}
+ >
+ <div
+ id="StyledIcon"
+ />
+ </Component>
+ <Component
+ className="star"
+ icon="test-file-stub"
+ key="1"
+ size={15}
+ >
+ <div
+ id="StyledIcon"
+ />
+ </Component>
+ <Component
+ className="star"
+ icon="test-file-stub"
+ key="2"
+ size={15}
+ >
+ <div
+ id="StyledIcon"
+ />
+ </Component>
+ <Component
+ className="star"
+ icon="test-file-stub"
+ key="3"
+ size={15}
+ >
+ <div
+ id="StyledIcon"
+ />
+ </Component>
+ <Component
+ className="star"
+ icon="test-file-stub"
+ key="4"
+ size={15}
+ >
+ <div
+ id="StyledIcon"
+ />
+ </Component>
+ </div>
+ </EfficientyRating>
+ </div>
+ </div>
+ </div>
+ </div>
+ </ForwardRef(CardContent)>
+ </WithStyles(ForwardRef(CardContent))>
+ </WithStyles(WithStyles(ForwardRef(CardContent)))>
+ <span
+ className="MuiCardActionArea-focusHighlight"
+ />
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(CardActionArea)>
+ </WithStyles(ForwardRef(CardActionArea))>
+ </WithStyles(WithStyles(ForwardRef(CardActionArea)))>
+ </StyledEcogestureCard>
+ </a>
+ </LinkAnchor>
+ </Link>
+ </ForwardRef(Typography)>
+ </WithStyles(ForwardRef(Typography))>
+ </ForwardRef(Link)>
+ </WithStyles(ForwardRef(Link))>
+ </EcogestureCard>
+ </Router>
+ </BrowserRouter>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureEmptyList.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureEmptyList.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..db551a11f78ecb9ab71eb9e9a261063f0a689022
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/EcogestureEmptyList.spec.tsx.snap
@@ -0,0 +1,344 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureEmptyList component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureEmptyList
+ isObjective={true}
+ isSelectionDone={false}
+ setTab={[MockFunction]}
+ >
+ <div
+ className="ec-empty-container"
+ >
+ <div
+ className="ec-empty-content"
+ >
+ <StyledIcon
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj2
+ </div>
+ <div
+ className="btn-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative btn1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative btn1",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight btn2",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight btn2",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight btn2 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight btn2 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-highlight btn2 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </EcogestureEmptyList>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureInitModal.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureInitModal.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..84d7f084314a1ebadc63c942ff82061649576dea
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/EcogestureInitModal.spec.tsx.snap
@@ -0,0 +1,1145 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureInitModal component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureInitModal
+ handleCloseClick={[MockFunction]}
+ handleLaunchForm={[MockFunction]}
+ open={true}
+ >
+ <WithStyles(ForwardRef(Dialog))
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "paper": "modal-paper",
+ "root": "modal-root",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Dialog)
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "container": "MuiDialog-container",
+ "paper": "MuiDialog-paper modal-paper",
+ "paperFullScreen": "MuiDialog-paperFullScreen",
+ "paperFullWidth": "MuiDialog-paperFullWidth",
+ "paperScrollBody": "MuiDialog-paperScrollBody",
+ "paperScrollPaper": "MuiDialog-paperScrollPaper",
+ "paperWidthFalse": "MuiDialog-paperWidthFalse",
+ "paperWidthLg": "MuiDialog-paperWidthLg",
+ "paperWidthMd": "MuiDialog-paperWidthMd",
+ "paperWidthSm": "MuiDialog-paperWidthSm",
+ "paperWidthXl": "MuiDialog-paperWidthXl",
+ "paperWidthXs": "MuiDialog-paperWidthXs",
+ "root": "MuiDialog-root modal-root",
+ "scrollBody": "MuiDialog-scrollBody",
+ "scrollPaper": "MuiDialog-scrollPaper",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Modal)
+ BackdropComponent={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "Naked": Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "propTypes": Object {
+ "children": [Function],
+ "className": [Function],
+ "classes": [Function],
+ "invisible": [Function],
+ "open": [Function],
+ "transitionDuration": [Function],
+ },
+ "render": [Function],
+ },
+ "displayName": "WithStyles(ForwardRef(Backdrop))",
+ "options": Object {
+ "defaultTheme": Object {
+ "breakpoints": Object {
+ "between": [Function],
+ "down": [Function],
+ "keys": Array [
+ "xs",
+ "sm",
+ "md",
+ "lg",
+ "xl",
+ ],
+ "only": [Function],
+ "up": [Function],
+ "values": Object {
+ "lg": 1280,
+ "md": 960,
+ "sm": 600,
+ "xl": 1920,
+ "xs": 0,
+ },
+ "width": [Function],
+ },
+ "direction": "ltr",
+ "mixins": Object {
+ "gutters": [Function],
+ "toolbar": Object {
+ "@media (min-width:0px) and (orientation: landscape)": Object {
+ "minHeight": 48,
+ },
+ "@media (min-width:600px)": Object {
+ "minHeight": 64,
+ },
+ "minHeight": 56,
+ },
+ },
+ "overrides": Object {},
+ "palette": Object {
+ "action": Object {
+ "active": "rgba(0, 0, 0, 0.54)",
+ "disabled": "rgba(0, 0, 0, 0.26)",
+ "disabledBackground": "rgba(0, 0, 0, 0.12)",
+ "hover": "rgba(0, 0, 0, 0.08)",
+ "hoverOpacity": 0.08,
+ "selected": "rgba(0, 0, 0, 0.14)",
+ },
+ "augmentColor": [Function],
+ "background": Object {
+ "default": "#fafafa",
+ "paper": "#fff",
+ },
+ "common": Object {
+ "black": "#000",
+ "white": "#fff",
+ },
+ "contrastThreshold": 3,
+ "divider": "rgba(0, 0, 0, 0.12)",
+ "error": Object {
+ "contrastText": "#fff",
+ "dark": "#d32f2f",
+ "light": "#e57373",
+ "main": "#f44336",
+ },
+ "getContrastText": [Function],
+ "grey": Object {
+ "100": "#f5f5f5",
+ "200": "#eeeeee",
+ "300": "#e0e0e0",
+ "400": "#bdbdbd",
+ "50": "#fafafa",
+ "500": "#9e9e9e",
+ "600": "#757575",
+ "700": "#616161",
+ "800": "#424242",
+ "900": "#212121",
+ "A100": "#d5d5d5",
+ "A200": "#aaaaaa",
+ "A400": "#303030",
+ "A700": "#616161",
+ },
+ "info": Object {
+ "contrastText": "#fff",
+ "dark": "#1976d2",
+ "light": "#64b5f6",
+ "main": "#2196f3",
+ },
+ "primary": Object {
+ "contrastText": "#fff",
+ "dark": "#303f9f",
+ "light": "#7986cb",
+ "main": "#3f51b5",
+ },
+ "secondary": Object {
+ "contrastText": "#fff",
+ "dark": "#c51162",
+ "light": "#ff4081",
+ "main": "#f50057",
+ },
+ "success": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#388e3c",
+ "light": "#81c784",
+ "main": "#4caf50",
+ },
+ "text": Object {
+ "disabled": "rgba(0, 0, 0, 0.38)",
+ "hint": "rgba(0, 0, 0, 0.38)",
+ "primary": "rgba(0, 0, 0, 0.87)",
+ "secondary": "rgba(0, 0, 0, 0.54)",
+ },
+ "tonalOffset": 0.2,
+ "type": "light",
+ "warning": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#f57c00",
+ "light": "#ffb74d",
+ "main": "#ff9800",
+ },
+ },
+ "props": Object {},
+ "shadows": Array [
+ "none",
+ "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
+ "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
+ "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
+ "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+ "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+ "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+ "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+ "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+ "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+ "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+ "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+ "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+ "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+ "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+ "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+ "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+ "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+ "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+ ],
+ "shape": Object {
+ "borderRadius": 4,
+ },
+ "spacing": [Function],
+ "transitions": Object {
+ "create": [Function],
+ "duration": Object {
+ "complex": 375,
+ "enteringScreen": 225,
+ "leavingScreen": 195,
+ "short": 250,
+ "shorter": 200,
+ "shortest": 150,
+ "standard": 300,
+ },
+ "easing": Object {
+ "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+ "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+ "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+ "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+ },
+ "getAutoHeightDuration": [Function],
+ },
+ "typography": Object {
+ "body1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.5,
+ },
+ "body2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.01071em",
+ "lineHeight": 1.43,
+ },
+ "button": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.02857em",
+ "lineHeight": 1.75,
+ "textTransform": "uppercase",
+ },
+ "caption": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.03333em",
+ "lineHeight": 1.66,
+ },
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": 14,
+ "fontWeightBold": 700,
+ "fontWeightLight": 300,
+ "fontWeightMedium": 500,
+ "fontWeightRegular": 400,
+ "h1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "6rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.01562em",
+ "lineHeight": 1.167,
+ },
+ "h2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3.75rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.00833em",
+ "lineHeight": 1.2,
+ },
+ "h3": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.167,
+ },
+ "h4": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "2.125rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00735em",
+ "lineHeight": 1.235,
+ },
+ "h5": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.5rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.334,
+ },
+ "h6": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.25rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.0075em",
+ "lineHeight": 1.6,
+ },
+ "htmlFontSize": 16,
+ "overline": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.08333em",
+ "lineHeight": 2.66,
+ "textTransform": "uppercase",
+ },
+ "pxToRem": [Function],
+ "round": [Function],
+ "subtitle1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.75,
+ },
+ "subtitle2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.00714em",
+ "lineHeight": 1.57,
+ },
+ },
+ "zIndex": Object {
+ "appBar": 1100,
+ "drawer": 1200,
+ "mobileStepper": 1000,
+ "modal": 1300,
+ "snackbar": 1400,
+ "speedDial": 1050,
+ "tooltip": 1500,
+ },
+ },
+ "name": "MuiBackdrop",
+ },
+ "propTypes": Object {
+ "classes": [Function],
+ "innerRef": [Function],
+ },
+ "render": [Function],
+ "useStyles": [Function],
+ }
+ }
+ BackdropProps={
+ Object {
+ "transitionDuration": Object {
+ "enter": 225,
+ "exit": 195,
+ },
+ }
+ }
+ className="MuiDialog-root modal-root"
+ closeAfterTransition={true}
+ disableBackdropClick={false}
+ disableEscapeKeyDown={false}
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Portal)
+ disablePortal={false}
+ >
+ <Portal
+ containerInfo={
+ <body
+ style="padding-right: 0px; overflow: hidden;"
+ >
+ <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"
+ >
+ feedback.accessibility.window_title
+ </div>
+ <button
+ aria-label="feedback.accessibility.button_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="eg-init-modal"
+ >
+ <div
+ class="title text-20-bold"
+ >
+ ecogesture.initModal.title
+ </div>
+ <div
+ class="text-16-normal text"
+ >
+ ecogesture.initModal.text1
+ </div>
+ <div
+ class="text-16-normal text"
+ >
+ ecogesture.initModal.text2
+ </div>
+ <div
+ class="buttons-container"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn1"
+ class="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn1
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <button
+ aria-label="ecogesture.initModal.btn2"
+ class="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn2
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+ </body>
+ }
+ >
+ <div
+ className="MuiDialog-root modal-root"
+ onKeyDown={[Function]}
+ role="presentation"
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "fixed",
+ "right": 0,
+ "top": 0,
+ "zIndex": 1300,
+ }
+ }
+ >
+ <WithStyles(ForwardRef(Backdrop))
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Backdrop)
+ classes={
+ Object {
+ "invisible": "MuiBackdrop-invisible",
+ "root": "MuiBackdrop-root",
+ }
+ }
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Fade)
+ in={true}
+ onClick={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onClick={[Function]}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ aria-hidden={true}
+ className="MuiBackdrop-root"
+ onClick={[Function]}
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ />
+ </Transition>
+ </ForwardRef(Fade)>
+ </ForwardRef(Backdrop)>
+ </WithStyles(ForwardRef(Backdrop))>
+ <TrapFocus
+ disableAutoFocus={false}
+ disableEnforceFocus={false}
+ disableRestoreFocus={false}
+ getDoc={[Function]}
+ isEnabled={[Function]}
+ open={true}
+ >
+ <div
+ data-test="sentinelStart"
+ tabIndex={0}
+ />
+ <ForwardRef(Fade)
+ appear={true}
+ in={true}
+ onEnter={[Function]}
+ onExited={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ className="MuiDialog-container MuiDialog-scrollPaper"
+ onClick={[Function]}
+ onMouseDown={[Function]}
+ role="none presentation"
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ tabIndex="-1"
+ >
+ <WithStyles(ForwardRef(Paper))
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ elevation={24}
+ role="dialog"
+ >
+ <ForwardRef(Paper)
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ classes={
+ Object {
+ "elevation0": "MuiPaper-elevation0",
+ "elevation1": "MuiPaper-elevation1",
+ "elevation10": "MuiPaper-elevation10",
+ "elevation11": "MuiPaper-elevation11",
+ "elevation12": "MuiPaper-elevation12",
+ "elevation13": "MuiPaper-elevation13",
+ "elevation14": "MuiPaper-elevation14",
+ "elevation15": "MuiPaper-elevation15",
+ "elevation16": "MuiPaper-elevation16",
+ "elevation17": "MuiPaper-elevation17",
+ "elevation18": "MuiPaper-elevation18",
+ "elevation19": "MuiPaper-elevation19",
+ "elevation2": "MuiPaper-elevation2",
+ "elevation20": "MuiPaper-elevation20",
+ "elevation21": "MuiPaper-elevation21",
+ "elevation22": "MuiPaper-elevation22",
+ "elevation23": "MuiPaper-elevation23",
+ "elevation24": "MuiPaper-elevation24",
+ "elevation3": "MuiPaper-elevation3",
+ "elevation4": "MuiPaper-elevation4",
+ "elevation5": "MuiPaper-elevation5",
+ "elevation6": "MuiPaper-elevation6",
+ "elevation7": "MuiPaper-elevation7",
+ "elevation8": "MuiPaper-elevation8",
+ "elevation9": "MuiPaper-elevation9",
+ "outlined": "MuiPaper-outlined",
+ "root": "MuiPaper-root",
+ "rounded": "MuiPaper-rounded",
+ }
+ }
+ elevation={24}
+ role="dialog"
+ >
+ <div
+ aria-labelledby="accessibility-title"
+ className="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
+ role="dialog"
+ >
+ <div
+ id="accessibility-title"
+ >
+ feedback.accessibility.window_title
+ </div>
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="feedback.accessibility.button_close"
+ className="modal-paper-close-button"
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="feedback.accessibility.button_close"
+ className="modal-paper-close-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="feedback.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="feedback.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <button
+ aria-label="feedback.accessibility.button_close"
+ className="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <Icon
+ icon="test-file-stub"
+ size={16}
+ spin={false}
+ >
+ <Component
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <svg
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ <div
+ className="eg-init-modal"
+ >
+ <div
+ className="title text-20-bold"
+ >
+ ecogesture.initModal.title
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.initModal.text1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.initModal.text2
+ </div>
+ <div
+ className="buttons-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.initModal.btn1"
+ className="btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.initModal.btn1"
+ className="btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.initModal.btn1"
+ className="MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.initModal.btn1"
+ className="MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.initModal.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-profile-next rounded",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.initModal.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next rounded",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </ForwardRef(Paper)>
+ </WithStyles(ForwardRef(Paper))>
+ </div>
+ </Transition>
+ </ForwardRef(Fade)>
+ <div
+ data-test="sentinelEnd"
+ tabIndex={0}
+ />
+ </TrapFocus>
+ </div>
+ </Portal>
+ </ForwardRef(Portal)>
+ </ForwardRef(Modal)>
+ </ForwardRef(Dialog)>
+ </WithStyles(ForwardRef(Dialog))>
+ </EcogestureInitModal>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap
index 4c3198174675b06385c194ab5626a78dab91b7ca..5ecf8327ab3872c13aa3cbb97aa041c35957cb8b 100644
--- a/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap
@@ -1,3 +1,1958 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`EcogesturesList component should be rendered correctly 1`] = `[Function]`;
+exports[`EcogesturesList component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <BrowserRouter>
+ <Router
+ history={
+ Object {
+ "action": "POP",
+ "block": [Function],
+ "createHref": [Function],
+ "go": [Function],
+ "goBack": [Function],
+ "goForward": [Function],
+ "length": 1,
+ "listen": [Function],
+ "location": Object {
+ "hash": "",
+ "pathname": "/",
+ "search": "",
+ "state": undefined,
+ },
+ "push": [Function],
+ "replace": [Function],
+ }
+ }
+ >
+ <EcogestureList
+ displaySelection={false}
+ list={
+ Array [
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ "viewedInSelection": false,
+ },
+ Object {
+ "_id": "ECOGESTURE002",
+ "_rev": "1-ef7ddd778254e3b7d331a88fd17f606d",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": true,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ "AIR_CONDITIONING",
+ ],
+ "fluidTypes": Array [
+ 0,
+ ],
+ "id": "ECOGESTURE002",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "Cela permet de garder la fraicheur à 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",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Eté",
+ "shortName": "Coup de vent",
+ "usage": 2,
+ "viewedInSelection": false,
+ },
+ Object {
+ "_id": "ECOGESTURE0013",
+ "_rev": "1-0b2761dd4aef79556c7aef144060fde6",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": true,
+ "actionDuration": 3,
+ "actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 1,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ "WASHING_MACHINE",
+ "DISHWASHER",
+ ],
+ "fluidTypes": Array [
+ 1,
+ ],
+ "id": "ECOGESTURE0013",
+ "impactLevel": 2,
+ "investment": null,
+ "longDescription": "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.",
+ "objective": false,
+ "room": Array [
+ 1,
+ 3,
+ 2,
+ ],
+ "season": "Sans saison",
+ "shortName": "Accelerateur de particules",
+ "usage": 5,
+ "viewedInSelection": false,
+ },
+ ]
+ }
+ selectionTotal={0}
+ selectionViewed={0}
+ >
+ <div
+ className="ecogesture-root"
+ >
+ <div
+ className="efficiency-button-content"
+ >
+ <div
+ className="filters text-16-normal"
+ >
+ <div
+ className="filter-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ tabIndex={0}
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ classes={
+ Object {
+ "label": "text-14-normal",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[Function]}
+ variant="contained"
+ >
+ <ForwardRef(Button)
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-14-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ variant="contained"
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ className="MuiButton-root btn-secondary-negative MuiButton-contained"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ className="MuiButton-root btn-secondary-negative MuiButton-contained"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-contained"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-14-normal"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={20}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={20}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={20}
+ style={Object {}}
+ width={20}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={20}
+ style={Object {}}
+ width={20}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <span
+ className="ecogestures"
+ >
+ ecogesture.MENU_TITLE
+ </span>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Menu))
+ MenuListProps={
+ Object {
+ "className": "filter-menu-list",
+ }
+ }
+ PopoverClasses={
+ Object {
+ "paper": "filter-menu",
+ }
+ }
+ anchorEl={null}
+ keepMounted={true}
+ onClose={[Function]}
+ open={false}
+ variant="menu"
+ >
+ <ForwardRef(Menu)
+ MenuListProps={
+ Object {
+ "className": "filter-menu-list",
+ }
+ }
+ PopoverClasses={
+ Object {
+ "paper": "filter-menu",
+ }
+ }
+ anchorEl={null}
+ classes={
+ Object {
+ "list": "MuiMenu-list",
+ "paper": "MuiMenu-paper",
+ }
+ }
+ keepMounted={true}
+ onClose={[Function]}
+ open={false}
+ variant="menu"
+ >
+ <WithStyles(ForwardRef(Popover))
+ PaperProps={
+ Object {
+ "classes": Object {
+ "root": "MuiMenu-paper",
+ },
+ }
+ }
+ anchorEl={null}
+ anchorOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ classes={
+ Object {
+ "paper": "filter-menu",
+ }
+ }
+ getContentAnchorEl={[Function]}
+ keepMounted={true}
+ onClose={[Function]}
+ onEntering={[Function]}
+ open={false}
+ transformOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ transitionDuration="auto"
+ >
+ <ForwardRef(Popover)
+ PaperProps={
+ Object {
+ "classes": Object {
+ "root": "MuiMenu-paper",
+ },
+ }
+ }
+ anchorEl={null}
+ anchorOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ classes={
+ Object {
+ "paper": "MuiPopover-paper filter-menu",
+ "root": "MuiPopover-root",
+ }
+ }
+ getContentAnchorEl={[Function]}
+ keepMounted={true}
+ onClose={[Function]}
+ onEntering={[Function]}
+ open={false}
+ transformOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ transitionDuration="auto"
+ >
+ <ForwardRef(Modal)
+ BackdropProps={
+ Object {
+ "invisible": true,
+ }
+ }
+ className="MuiPopover-root"
+ keepMounted={true}
+ onClose={[Function]}
+ open={false}
+ >
+ <ForwardRef(Portal)
+ disablePortal={false}
+ >
+ <Portal
+ containerInfo={
+ <body>
+ <div
+ aria-hidden="true"
+ class="MuiPopover-root"
+ role="presentation"
+ style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px; visibility: hidden;"
+ >
+ <div
+ data-test="sentinelStart"
+ tabindex="0"
+ />
+ <div
+ class="MuiPaper-root MuiMenu-paper MuiPopover-paper filter-menu MuiPaper-elevation8 MuiPaper-rounded"
+ style="opacity: 0; transform: scale(0.75, 0.5625); visibility: hidden;"
+ tabindex="-1"
+ >
+ <ul
+ class="MuiList-root MuiMenu-list filter-menu-list MuiList-padding"
+ role="menu"
+ tabindex="-1"
+ >
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.ALL
+ <div
+ class="MuiListItemIcon-root filter-menu-icon"
+ >
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="13"
+ width="13"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ </div>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.HEATING
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.AIR_CONDITIONING
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.ECS
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.COLD_WATER
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.ELECTRICITY_SPECIFIC
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.COOKING
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ </ul>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+ </body>
+ }
+ >
+ <div
+ className="MuiPopover-root"
+ onKeyDown={[Function]}
+ role="presentation"
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "fixed",
+ "right": 0,
+ "top": 0,
+ "visibility": "hidden",
+ "zIndex": 1300,
+ }
+ }
+ >
+ <ForwardRef(SimpleBackdrop)
+ invisible={true}
+ onClick={[Function]}
+ open={false}
+ />
+ <TrapFocus
+ disableAutoFocus={false}
+ disableEnforceFocus={false}
+ disableRestoreFocus={false}
+ getDoc={[Function]}
+ isEnabled={[Function]}
+ open={false}
+ >
+ <div
+ data-test="sentinelStart"
+ tabIndex={0}
+ />
+ <ForwardRef(Grow)
+ appear={true}
+ in={false}
+ onEnter={[Function]}
+ onEntering={[Function]}
+ onExited={[Function]}
+ tabIndex="-1"
+ timeout="auto"
+ >
+ <Transition
+ addEndListener={[Function]}
+ appear={true}
+ enter={true}
+ exit={true}
+ in={false}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ tabIndex="-1"
+ timeout={null}
+ unmountOnExit={false}
+ >
+ <WithStyles(ForwardRef(Paper))
+ className="MuiPopover-paper filter-menu"
+ classes={
+ Object {
+ "root": "MuiMenu-paper",
+ }
+ }
+ elevation={8}
+ style={
+ Object {
+ "opacity": 0,
+ "transform": "scale(0.75, 0.5625)",
+ "visibility": "hidden",
+ }
+ }
+ tabIndex="-1"
+ >
+ <ForwardRef(Paper)
+ className="MuiPopover-paper filter-menu"
+ classes={
+ Object {
+ "elevation0": "MuiPaper-elevation0",
+ "elevation1": "MuiPaper-elevation1",
+ "elevation10": "MuiPaper-elevation10",
+ "elevation11": "MuiPaper-elevation11",
+ "elevation12": "MuiPaper-elevation12",
+ "elevation13": "MuiPaper-elevation13",
+ "elevation14": "MuiPaper-elevation14",
+ "elevation15": "MuiPaper-elevation15",
+ "elevation16": "MuiPaper-elevation16",
+ "elevation17": "MuiPaper-elevation17",
+ "elevation18": "MuiPaper-elevation18",
+ "elevation19": "MuiPaper-elevation19",
+ "elevation2": "MuiPaper-elevation2",
+ "elevation20": "MuiPaper-elevation20",
+ "elevation21": "MuiPaper-elevation21",
+ "elevation22": "MuiPaper-elevation22",
+ "elevation23": "MuiPaper-elevation23",
+ "elevation24": "MuiPaper-elevation24",
+ "elevation3": "MuiPaper-elevation3",
+ "elevation4": "MuiPaper-elevation4",
+ "elevation5": "MuiPaper-elevation5",
+ "elevation6": "MuiPaper-elevation6",
+ "elevation7": "MuiPaper-elevation7",
+ "elevation8": "MuiPaper-elevation8",
+ "elevation9": "MuiPaper-elevation9",
+ "outlined": "MuiPaper-outlined",
+ "root": "MuiPaper-root MuiMenu-paper",
+ "rounded": "MuiPaper-rounded",
+ }
+ }
+ elevation={8}
+ style={
+ Object {
+ "opacity": 0,
+ "transform": "scale(0.75, 0.5625)",
+ "visibility": "hidden",
+ }
+ }
+ tabIndex="-1"
+ >
+ <div
+ className="MuiPaper-root MuiMenu-paper MuiPopover-paper filter-menu MuiPaper-elevation8 MuiPaper-rounded"
+ style={
+ Object {
+ "opacity": 0,
+ "transform": "scale(0.75, 0.5625)",
+ "visibility": "hidden",
+ }
+ }
+ tabIndex="-1"
+ >
+ <ForwardRef(MenuList)
+ actions={
+ Object {
+ "current": Object {
+ "adjustStyleForScrollbar": [Function],
+ },
+ }
+ }
+ autoFocus={false}
+ autoFocusItem={false}
+ className="MuiMenu-list filter-menu-list"
+ onKeyDown={[Function]}
+ variant="menu"
+ >
+ <WithStyles(ForwardRef(List))
+ className="MuiMenu-list filter-menu-list"
+ onKeyDown={[Function]}
+ role="menu"
+ tabIndex={-1}
+ >
+ <ForwardRef(List)
+ className="MuiMenu-list filter-menu-list"
+ classes={
+ Object {
+ "dense": "MuiList-dense",
+ "padding": "MuiList-padding",
+ "root": "MuiList-root",
+ "subheader": "MuiList-subheader",
+ }
+ }
+ onKeyDown={[Function]}
+ role="menu"
+ tabIndex={-1}
+ >
+ <ul
+ className="MuiList-root MuiMenu-list filter-menu-list MuiList-padding"
+ onKeyDown={[Function]}
+ role="menu"
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "item-active",
+ }
+ }
+ key=".$.$0"
+ onClick={[Function]}
+ selected={true}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root item-active",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={true}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={true}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={true}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.ALL
+ <WithStyles(ForwardRef(ListItemIcon))
+ classes={
+ Object {
+ "root": "filter-menu-icon",
+ }
+ }
+ key=".1"
+ >
+ <ForwardRef(ListItemIcon)
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
+ "root": "MuiListItemIcon-root filter-menu-icon",
+ }
+ }
+ >
+ <div
+ className="MuiListItemIcon-root filter-menu-icon"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={13}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={13}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={13}
+ style={Object {}}
+ width={13}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={13}
+ style={Object {}}
+ width={13}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </div>
+ </ForwardRef(ListItemIcon)>
+ </WithStyles(ForwardRef(ListItemIcon))>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "",
+ }
+ }
+ key=".$.$1"
+ onClick={[Function]}
+ selected={false}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={false}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.HEATING
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "",
+ }
+ }
+ key=".$.$2"
+ onClick={[Function]}
+ selected={false}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={false}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.AIR_CONDITIONING
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "",
+ }
+ }
+ key=".$.$3"
+ onClick={[Function]}
+ selected={false}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={false}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.ECS
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "",
+ }
+ }
+ key=".$.$4"
+ onClick={[Function]}
+ selected={false}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={false}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.COLD_WATER
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "",
+ }
+ }
+ key=".$.$5"
+ onClick={[Function]}
+ selected={false}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={false}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.ELECTRICITY_SPECIFIC
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
+ classes={
+ Object {
+ "root": "",
+ }
+ }
+ key=".$.$6"
+ onClick={[Function]}
+ selected={false}
+ >
+ <ForwardRef(MenuItem)
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
+ "selected": "Mui-selected",
+ }
+ }
+ onClick={[Function]}
+ selected={false}
+ >
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
+ "disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
+ "focusVisible": "Mui-focusVisible",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
+ }
+ }
+ component="li"
+ disableGutters={false}
+ onClick={[Function]}
+ role="menuitem"
+ selected={false}
+ tabIndex={-1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ ecogesture.COOKING
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ </ul>
+ </ForwardRef(List)>
+ </WithStyles(ForwardRef(List))>
+ </ForwardRef(MenuList)>
+ </div>
+ </ForwardRef(Paper)>
+ </WithStyles(ForwardRef(Paper))>
+ </Transition>
+ </ForwardRef(Grow)>
+ <div
+ data-test="sentinelEnd"
+ tabIndex={0}
+ />
+ </TrapFocus>
+ </div>
+ </Portal>
+ </ForwardRef(Portal)>
+ </ForwardRef(Modal)>
+ </ForwardRef(Popover)>
+ </WithStyles(ForwardRef(Popover))>
+ </ForwardRef(Menu)>
+ </WithStyles(ForwardRef(Menu))>
+ </div>
+ </div>
+ </div>
+ <div
+ className="ecogesture-content"
+ >
+ <mock-ecogesturecard
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ "viewedInSelection": false,
+ }
+ }
+ key="0"
+ />
+ <mock-ecogesturecard
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE002",
+ "_rev": "1-ef7ddd778254e3b7d331a88fd17f606d",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": true,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ "AIR_CONDITIONING",
+ ],
+ "fluidTypes": Array [
+ 0,
+ ],
+ "id": "ECOGESTURE002",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "Cela permet de garder la fraicheur à 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",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Eté",
+ "shortName": "Coup de vent",
+ "usage": 2,
+ "viewedInSelection": false,
+ }
+ }
+ key="1"
+ />
+ <mock-ecogesturecard
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE0013",
+ "_rev": "1-0b2761dd4aef79556c7aef144060fde6",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": true,
+ "actionDuration": 3,
+ "actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 1,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ "WASHING_MACHINE",
+ "DISHWASHER",
+ ],
+ "fluidTypes": Array [
+ 1,
+ ],
+ "id": "ECOGESTURE0013",
+ "impactLevel": 2,
+ "investment": null,
+ "longDescription": "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.",
+ "objective": false,
+ "room": Array [
+ 1,
+ 3,
+ 2,
+ ],
+ "season": "Sans saison",
+ "shortName": "Accelerateur de particules",
+ "usage": 5,
+ "viewedInSelection": false,
+ }
+ }
+ key="2"
+ />
+ </div>
+ </div>
+ </EcogestureList>
+ </Router>
+ </BrowserRouter>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureView.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureView.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..a438baf66a1755b3470bab2b62e3fb1b59f1502a
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/EcogestureView.spec.tsx.snap
@@ -0,0 +1,1357 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureView component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureView>
+ <mock-cozybar
+ titleKey="common.title_ecogestures"
+ />
+ <mock-header
+ desktopTitleKey="common.title_ecogestures"
+ setHeaderHeight={[Function]}
+ >
+ <WithStyles(ForwardRef(Tabs))
+ TabIndicatorProps={
+ Object {
+ "className": "indicator-tab",
+ }
+ }
+ aria-label="ecogestures-tabs"
+ centered={true}
+ className="ecogestures-tabs"
+ onChange={[Function]}
+ value={2}
+ >
+ <ForwardRef(Tabs)
+ TabIndicatorProps={
+ Object {
+ "className": "indicator-tab",
+ }
+ }
+ aria-label="ecogestures-tabs"
+ centered={true}
+ className="ecogestures-tabs"
+ classes={
+ Object {
+ "centered": "MuiTabs-centered",
+ "fixed": "MuiTabs-fixed",
+ "flexContainer": "MuiTabs-flexContainer",
+ "flexContainerVertical": "MuiTabs-flexContainerVertical",
+ "indicator": "MuiTabs-indicator",
+ "root": "MuiTabs-root",
+ "scrollButtons": "MuiTabs-scrollButtons",
+ "scrollButtonsDesktop": "MuiTabs-scrollButtonsDesktop",
+ "scrollable": "MuiTabs-scrollable",
+ "scroller": "MuiTabs-scroller",
+ "vertical": "MuiTabs-vertical",
+ }
+ }
+ onChange={[Function]}
+ value={2}
+ >
+ <div
+ aria-label="ecogestures-tabs"
+ className="MuiTabs-root ecogestures-tabs"
+ >
+ <div
+ className="MuiTabs-scroller MuiTabs-fixed"
+ onScroll={[Function]}
+ style={
+ Object {
+ "marginBottom": null,
+ "overflow": "hidden",
+ }
+ }
+ >
+ <div
+ className="MuiTabs-flexContainer MuiTabs-centered"
+ role="tablist"
+ >
+ <WithStyles(ForwardRef(Tab))
+ aria-controls="simple-tabpanel-0"
+ className="single-tab"
+ fullWidth={false}
+ id="simple-tab-0"
+ indicator={false}
+ key=".0"
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={0}
+ >
+ <ForwardRef(Tab)
+ aria-controls="simple-tabpanel-0"
+ className="single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "fullWidth": "MuiTab-fullWidth",
+ "labelIcon": "MuiTab-labelIcon",
+ "root": "MuiTab-root",
+ "selected": "Mui-selected",
+ "textColorInherit": "MuiTab-textColorInherit",
+ "textColorPrimary": "MuiTab-textColorPrimary",
+ "textColorSecondary": "MuiTab-textColorSecondary",
+ "wrapped": "MuiTab-wrapped",
+ "wrapper": "MuiTab-wrapper",
+ }
+ }
+ fullWidth={false}
+ id="simple-tab-0"
+ indicator={false}
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={0}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-tabpanel-0"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-0"
+ onClick={[Function]}
+ role="tab"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-tabpanel-0"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-0"
+ onClick={[Function]}
+ role="tab"
+ >
+ <button
+ aria-controls="simple-tabpanel-0"
+ aria-selected={false}
+ className="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ id="simple-tab-0"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="tab"
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Tab)>
+ </WithStyles(ForwardRef(Tab))>
+ <WithStyles(ForwardRef(Tab))
+ aria-controls="simple-tabpanel-1"
+ className="single-tab"
+ fullWidth={false}
+ id="simple-tab-1"
+ indicator={false}
+ key=".1"
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_1
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={1}
+ >
+ <ForwardRef(Tab)
+ aria-controls="simple-tabpanel-1"
+ className="single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "fullWidth": "MuiTab-fullWidth",
+ "labelIcon": "MuiTab-labelIcon",
+ "root": "MuiTab-root",
+ "selected": "Mui-selected",
+ "textColorInherit": "MuiTab-textColorInherit",
+ "textColorPrimary": "MuiTab-textColorPrimary",
+ "textColorSecondary": "MuiTab-textColorSecondary",
+ "wrapped": "MuiTab-wrapped",
+ "wrapper": "MuiTab-wrapper",
+ }
+ }
+ fullWidth={false}
+ id="simple-tab-1"
+ indicator={false}
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_1
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-tabpanel-1"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-1"
+ onClick={[Function]}
+ role="tab"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-tabpanel-1"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-1"
+ onClick={[Function]}
+ role="tab"
+ >
+ <button
+ aria-controls="simple-tabpanel-1"
+ aria-selected={false}
+ className="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ id="simple-tab-1"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="tab"
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_1
+ <br />
+ (0)
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Tab)>
+ </WithStyles(ForwardRef(Tab))>
+ <WithStyles(ForwardRef(Tab))
+ aria-controls="simple-tabpanel-2"
+ className="single-tab active"
+ fullWidth={false}
+ id="simple-tab-2"
+ indicator={false}
+ key=".2"
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={true}
+ textColor="inherit"
+ value={2}
+ >
+ <ForwardRef(Tab)
+ aria-controls="simple-tabpanel-2"
+ className="single-tab active"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "fullWidth": "MuiTab-fullWidth",
+ "labelIcon": "MuiTab-labelIcon",
+ "root": "MuiTab-root",
+ "selected": "Mui-selected",
+ "textColorInherit": "MuiTab-textColorInherit",
+ "textColorPrimary": "MuiTab-textColorPrimary",
+ "textColorSecondary": "MuiTab-textColorSecondary",
+ "wrapped": "MuiTab-wrapped",
+ "wrapper": "MuiTab-wrapper",
+ }
+ }
+ fullWidth={false}
+ id="simple-tab-2"
+ indicator={false}
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={true}
+ textColor="inherit"
+ value={2}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-tabpanel-2"
+ aria-selected={true}
+ className="MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-2"
+ onClick={[Function]}
+ role="tab"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-tabpanel-2"
+ aria-selected={true}
+ className="MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-2"
+ onClick={[Function]}
+ role="tab"
+ >
+ <button
+ aria-controls="simple-tabpanel-2"
+ aria-selected={true}
+ className="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ disabled={false}
+ id="simple-tab-2"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="tab"
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Tab)>
+ </WithStyles(ForwardRef(Tab))>
+ </div>
+ <WithStyles(ForwardRef(TabIndicator))
+ className="indicator-tab"
+ color="secondary"
+ orientation="horizontal"
+ style={
+ Object {
+ "left": 0,
+ "width": 0,
+ }
+ }
+ >
+ <ForwardRef(TabIndicator)
+ className="indicator-tab"
+ classes={
+ Object {
+ "colorPrimary": "PrivateTabIndicator-colorPrimary-3",
+ "colorSecondary": "PrivateTabIndicator-colorSecondary-4",
+ "root": "PrivateTabIndicator-root-2",
+ "vertical": "PrivateTabIndicator-vertical-5",
+ }
+ }
+ color="secondary"
+ orientation="horizontal"
+ style={
+ Object {
+ "left": 0,
+ "width": 0,
+ }
+ }
+ >
+ <span
+ className="PrivateTabIndicator-root-2 PrivateTabIndicator-colorSecondary-4 indicator-tab"
+ style={
+ Object {
+ "left": 0,
+ "width": 0,
+ }
+ }
+ />
+ </ForwardRef(TabIndicator)>
+ </WithStyles(ForwardRef(TabIndicator))>
+ </div>
+ </div>
+ </ForwardRef(Tabs)>
+ </WithStyles(ForwardRef(Tabs))>
+ </mock-header>
+ <mock-content
+ height={0}
+ >
+ <TabPanel
+ index={0}
+ value={2}
+ >
+ <div
+ aria-labelledby="simple-tab-0"
+ hidden={true}
+ id="simple-tabpanel-0"
+ role="tabpanel"
+ >
+ <EcogestureEmptyList
+ isObjective={true}
+ isSelectionDone={false}
+ setTab={[Function]}
+ >
+ <div
+ className="ec-empty-container"
+ >
+ <div
+ className="ec-empty-content"
+ >
+ <StyledIcon
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj2
+ </div>
+ <div
+ className="btn-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative btn1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative btn1",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight btn2",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight btn2",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight btn2 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight btn2 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-highlight btn2 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </EcogestureEmptyList>
+ </div>
+ </TabPanel>
+ <TabPanel
+ index={1}
+ value={2}
+ >
+ <div
+ aria-labelledby="simple-tab-1"
+ hidden={true}
+ id="simple-tabpanel-1"
+ role="tabpanel"
+ >
+ <EcogestureEmptyList
+ isObjective={false}
+ isSelectionDone={false}
+ setTab={[Function]}
+ >
+ <div
+ className="ec-empty-container"
+ >
+ <div
+ className="ec-empty-content"
+ >
+ <StyledIcon
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.doing1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.doing2
+ </div>
+ <div
+ className="btn-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative btn1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative btn1",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight btn2",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight btn2",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight btn2 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight btn2 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-highlight btn2 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </EcogestureEmptyList>
+ </div>
+ </TabPanel>
+ <TabPanel
+ index={2}
+ value={2}
+ >
+ <div
+ aria-labelledby="simple-tab-2"
+ hidden={false}
+ id="simple-tabpanel-2"
+ role="tabpanel"
+ >
+ <mock-ecogesturelist
+ displaySelection={false}
+ list={
+ Array [
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ "viewedInSelection": false,
+ },
+ Object {
+ "_id": "ECOGESTURE002",
+ "_rev": "1-ef7ddd778254e3b7d331a88fd17f606d",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": true,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ "AIR_CONDITIONING",
+ ],
+ "fluidTypes": Array [
+ 0,
+ ],
+ "id": "ECOGESTURE002",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "Cela permet de garder la fraicheur à 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",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Eté",
+ "shortName": "Coup de vent",
+ "usage": 2,
+ "viewedInSelection": false,
+ },
+ Object {
+ "_id": "ECOGESTURE0013",
+ "_rev": "1-0b2761dd4aef79556c7aef144060fde6",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": true,
+ "actionDuration": 3,
+ "actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 1,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ "WASHING_MACHINE",
+ "DISHWASHER",
+ ],
+ "fluidTypes": Array [
+ 1,
+ ],
+ "id": "ECOGESTURE0013",
+ "impactLevel": 2,
+ "investment": null,
+ "longDescription": "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.",
+ "objective": false,
+ "room": Array [
+ 1,
+ 3,
+ 2,
+ ],
+ "season": "Sans saison",
+ "shortName": "Accelerateur de particules",
+ "usage": 5,
+ "viewedInSelection": false,
+ },
+ ]
+ }
+ selectionTotal={0}
+ selectionViewed={0}
+ />
+ </div>
+ </TabPanel>
+ </mock-content>
+ </EcogestureView>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EfficientyRating.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EfficientyRating.spec.tsx.snap
index 514760e51c31ec3de4e71e066683136b173bdb5d..596e41d6d8ac9ea60413be73af4a3418efe19208 100644
--- a/src/components/Ecogesture/__snapshots__/EfficientyRating.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EfficientyRating.spec.tsx.snap
@@ -1,3 +1,195 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`EfficientyRating component should be rendered correctly 1`] = `[Function]`;
+exports[`EfficientyRating component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EfficientyRating
+ result={3}
+ >
+ <div
+ className="thunder"
+ >
+ <StyledIcon
+ className="star"
+ icon="test-file-stub"
+ key="0"
+ size={15}
+ >
+ <Icon
+ aria-hidden={true}
+ className="star"
+ icon="test-file-stub"
+ size={15}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <svg
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <StyledIcon
+ className="star"
+ icon="test-file-stub"
+ key="1"
+ size={15}
+ >
+ <Icon
+ aria-hidden={true}
+ className="star"
+ icon="test-file-stub"
+ size={15}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <svg
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <StyledIcon
+ className="star"
+ icon="test-file-stub"
+ key="2"
+ size={15}
+ >
+ <Icon
+ aria-hidden={true}
+ className="star"
+ icon="test-file-stub"
+ size={15}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <svg
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <StyledIcon
+ className="star"
+ icon="test-file-stub"
+ key="3"
+ size={15}
+ >
+ <Icon
+ aria-hidden={true}
+ className="star"
+ icon="test-file-stub"
+ size={15}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <svg
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <StyledIcon
+ className="star"
+ icon="test-file-stub"
+ key="4"
+ size={15}
+ >
+ <Icon
+ aria-hidden={true}
+ className="star"
+ icon="test-file-stub"
+ size={15}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <svg
+ aria-hidden={true}
+ className="star styles__icon___23x3R"
+ height={15}
+ style={Object {}}
+ width={15}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </div>
+ </EfficientyRating>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/SingleEcogesture.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/SingleEcogesture.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..52ff638316feb318e17e07f0229cb3a3c06cb696
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/SingleEcogesture.spec.tsx.snap
@@ -0,0 +1,375 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SingleEcogesture component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <SingleEcogesture
+ match={
+ Object {
+ "params": Object {
+ "id": "ECOGESTURE0001",
+ },
+ }
+ }
+ >
+ <Component
+ displayBackArrow={true}
+ isNotKey={true}
+ titleKey="Bonhomme de neige"
+ >
+ <div
+ id="CozyBar"
+ />
+ </Component>
+ <Component
+ desktopTitleKey="Bonhomme de neige"
+ displayBackArrow={true}
+ isNotKey={true}
+ setHeaderHeight={[Function]}
+ >
+ <div
+ id="Header"
+ />
+ </Component>
+ <Component
+ height={0}
+ >
+ <div
+ id="content"
+ >
+ <div
+ className="single-ecogesture"
+ >
+ <div
+ className="icon-container"
+ />
+ <div
+ className="details"
+ >
+ <div
+ className="efficiency"
+ >
+ <span
+ className="text text-14-normal"
+ >
+ ecogesture_modal.efficiency
+ </span>
+ <Component
+ result={4}
+ >
+ <div
+ id="EfficientyRating"
+ />
+ </Component>
+ </div>
+ </div>
+ <div
+ className="styled-container"
+ >
+ <div
+ className="long-name"
+ >
+ Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.
+ </div>
+ <div
+ className="description text-16-normal-150"
+ >
+ On se demande parfois si cela vaut le coup de "couper le chauffage" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…
+ </div>
+ <div
+ className="toggle-text text-15-normal"
+ onClick={[Function]}
+ >
+ ecogesture_modal.show_more
+ </div>
+ </div>
+ <div
+ className="buttons-selection"
+ >
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="ecogesture.objective"
+ classes={
+ Object {
+ "label": "text-15-normal",
+ "root": "btn-secondary-negative objective-btn false",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="ecogesture.objective"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label text-15-normal",
+ "root": "MuiIconButton-root btn-secondary-negative objective-btn false",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.objective"
+ centerRipple={true}
+ className="MuiIconButton-root btn-secondary-negative objective-btn false"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.objective"
+ centerRipple={true}
+ className="MuiIconButton-root btn-secondary-negative objective-btn false"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="ecogesture.objective"
+ className="MuiButtonBase-root MuiIconButton-root btn-secondary-negative objective-btn false"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label text-15-normal"
+ >
+ <Icon
+ className="status-icon"
+ icon="test-file-stub"
+ size={40}
+ spin={false}
+ >
+ <Component
+ className="status-icon styles__icon___23x3R"
+ height={40}
+ style={Object {}}
+ width={40}
+ >
+ <svg
+ className="status-icon styles__icon___23x3R"
+ height={40}
+ style={Object {}}
+ width={40}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ <span>
+ ecogesture.objective
+ </span>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="ecogesture.doing"
+ classes={
+ Object {
+ "label": "text-15-normal",
+ "root": "btn-secondary-negative doing-btn false",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="ecogesture.doing"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label text-15-normal",
+ "root": "MuiIconButton-root btn-secondary-negative doing-btn false",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.doing"
+ centerRipple={true}
+ className="MuiIconButton-root btn-secondary-negative doing-btn false"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.doing"
+ centerRipple={true}
+ className="MuiIconButton-root btn-secondary-negative doing-btn false"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="ecogesture.doing"
+ className="MuiButtonBase-root MuiIconButton-root btn-secondary-negative doing-btn false"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label text-15-normal"
+ >
+ <Icon
+ className="status-icon"
+ icon="test-file-stub"
+ size={40}
+ spin={false}
+ >
+ <Component
+ className="status-icon styles__icon___23x3R"
+ height={40}
+ style={Object {}}
+ width={40}
+ >
+ <svg
+ className="status-icon styles__icon___23x3R"
+ height={40}
+ style={Object {}}
+ width={40}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ <span>
+ ecogesture.doing
+ </span>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ </div>
+ </div>
+ </div>
+ </Component>
+ </SingleEcogesture>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/ecogestureError.scss b/src/components/Ecogesture/ecogestureEmptyList.scss
similarity index 65%
rename from src/components/Ecogesture/ecogestureError.scss
rename to src/components/Ecogesture/ecogestureEmptyList.scss
index c89ffaf796a6b7d8602260cea1c5e0f76be76487..56ec9b82958fa9e5272625c59018612b5393ac4d 100644
--- a/src/components/Ecogesture/ecogestureError.scss
+++ b/src/components/Ecogesture/ecogestureEmptyList.scss
@@ -1,12 +1,10 @@
@import '../../styles/base/color';
@import '../../styles/base/breakpoint';
-.ec-error-container {
+.ec-empty-container {
margin-top: 6rem;
- @media (min-width: $width-phone) {
- margin-top: 2rem;
- }
- .ec-error-content {
+
+ .ec-empty-content {
color: $grey-bright;
text-align: center;
padding: 0 0.5rem;
@@ -18,8 +16,14 @@
@media (min-width: $width-desktop) {
max-width: 35%;
}
- }
- .ec-error-title {
- padding: 0 1.5rem;
+ .text {
+ margin: 1rem 0;
+ }
+ .btn-container {
+ display: flex;
+ button.btn2 {
+ margin-left: 1rem;
+ }
+ }
}
}
diff --git a/src/components/Ecogesture/ecogestureInfoModal.scss b/src/components/Ecogesture/ecogestureInfoModal.scss
deleted file mode 100644
index dd1033c0e872746bf451d18993b06493b6fd9f13..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/ecogestureInfoModal.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-@import 'src/styles/base/breakpoint';
-@import 'src/styles/base/color';
-
-.info-header {
- margin: 1rem;
-}
-
-.info-content {
- margin: 0 1.25rem 2.125rem;
- text-align: center;
- .info-title {
- color: $white;
- text-indent: -10px;
- }
- .info-detail {
- margin: 1rem 0;
- color: $grey-bright;
- }
-}
-
-#accessibility-title {
- display: none;
-}
diff --git a/src/components/Ecogesture/ecogestureInitModal.scss b/src/components/Ecogesture/ecogestureInitModal.scss
new file mode 100644
index 0000000000000000000000000000000000000000..3088fd8fd08b7122aed896d9cdf995fa8697b16e
--- /dev/null
+++ b/src/components/Ecogesture/ecogestureInitModal.scss
@@ -0,0 +1,23 @@
+@import '../../styles/base/color';
+
+.eg-init-modal {
+ color: $grey-bright;
+ margin: 1rem 0;
+ .title {
+ text-align: center;
+ color: $gold-shadow;
+ }
+ .text {
+ margin: 1rem 0;
+ }
+ .buttons-container {
+ display: flex;
+ button {
+ min-height: 45px;
+ cursor: pointer;
+ }
+ button.btn1 {
+ margin-right: 1rem;
+ }
+ }
+}
diff --git a/src/components/Ecogesture/ecogestureList.scss b/src/components/Ecogesture/ecogestureList.scss
index 3d857bdcb5f9aecde4d6b0acc4f97264bcdd7980..07b207a0f9df5e8d05bf12e8f7f662c968718ec2 100644
--- a/src/components/Ecogesture/ecogestureList.scss
+++ b/src/components/Ecogesture/ecogestureList.scss
@@ -22,7 +22,20 @@
@media #{$large-phone} {
width: 97%;
}
-
+ .selection {
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ color: white;
+ text-align: center;
+ margin: 1rem auto;
+ @media #{$large-phone} {
+ margin: 1rem 0;
+ }
+ button.btn-highlight {
+ padding: 0.625rem;
+ }
+ }
.filters {
display: flex;
align-items: center;
diff --git a/src/components/Ecogesture/ecogestureView.scss b/src/components/Ecogesture/ecogestureView.scss
index 4752507bd50e2272c66694025864d32b80368ade..9206f18f6160faf74105a212b5c2c27fab9dd00d 100644
--- a/src/components/Ecogesture/ecogestureView.scss
+++ b/src/components/Ecogesture/ecogestureView.scss
@@ -1,5 +1,16 @@
@import 'src/styles/base/color';
+@import 'src/styles/base/breakpoint';
+.ecogesture-spinner {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ min-height: inherit;
+ @media all and(min-width: $width-tablet) {
+ min-height: 80vh;
+ }
+}
.ecogestures-tabs {
background: transparent;
color: $soft-grey;
@@ -8,7 +19,7 @@
margin: 0 1rem;
box-sizing: border-box;
.single-tab {
- width: 50%;
+ width: 32%;
text-transform: initial;
font-size: 1rem;
font-weight: 400;
diff --git a/src/components/Ecogesture/singleEcogesture.scss b/src/components/Ecogesture/singleEcogesture.scss
new file mode 100644
index 0000000000000000000000000000000000000000..0ae3efe906985832775fb92aaeab34ff66b97a0d
--- /dev/null
+++ b/src/components/Ecogesture/singleEcogesture.scss
@@ -0,0 +1,122 @@
+@import 'src/styles/base/color';
+@import 'src/styles/base/breakpoint';
+
+.se-loader-container {
+ min-height: inherit;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ @media all and(min-width: $width-tablet) {
+ min-height: 80vh;
+ }
+}
+.single-ecogesture {
+ color: $grey-bright;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem 1.2rem;
+ .icon-container {
+ margin: auto;
+ max-width: 250px;
+ height: 250px;
+ width: 100%;
+ display: flex;
+ .icon-big {
+ margin: auto;
+ }
+ }
+ .details {
+ .efficiency {
+ display: flex;
+ text-align: center;
+ margin: auto;
+ .text {
+ margin-right: 0.7rem;
+ }
+ }
+ }
+ .styled-container {
+ line-height: 150%;
+ background: radial-gradient(
+ 60.65% 30.62% at 50% 3.13%,
+ #2a2b30 0%,
+ #1b1c22 100%
+ );
+ border: 3px solid $blue-40;
+ padding: 1.5rem 0.6rem;
+ border-radius: 50px 1px 50px 1px;
+ margin: 1.5rem 0 1rem;
+ max-width: 500px;
+ .long-name {
+ text-align: center;
+ font-weight: bold;
+ color: white;
+ }
+ .description {
+ display: none;
+ margin: 0.5rem;
+ text-align: left;
+ }
+ .block {
+ display: block !important;
+ }
+ .toggle-text {
+ text-align: center;
+ text-decoration: underline;
+ margin-top: 1rem;
+ cursor: pointer;
+ }
+ }
+ .buttons-selection {
+ display: flex;
+ width: 100%;
+ justify-content: center;
+ button.btn-secondary-negative {
+ height: 45px;
+ max-width: 160px;
+ width: 100%;
+ border-radius: 4px;
+ }
+ .objective-btn {
+ margin-right: 0.5rem;
+ span {
+ color: $grey-bright;
+ }
+ &.active {
+ background: radial-gradient(
+ 105.25% 64.58% at 49.68% 70.83%,
+ rgba(12, 44, 91, 0.5) 0%,
+ rgba(255, 255, 255, 0) 100%
+ ),
+ #4470b3;
+ border-color: transparent;
+ span {
+ color: white;
+ }
+ }
+ }
+ .doing-btn {
+ span {
+ color: $grey-bright;
+ }
+ &.active {
+ background: radial-gradient(
+ 105.25% 64.58% at 49.68% 70.83%,
+ rgba(41, 87, 33, 0.5) 0%,
+ rgba(255, 255, 255, 0) 100%
+ ),
+ #21a90b;
+ border-color: transparent;
+ span {
+ color: white;
+ }
+ }
+ }
+ .MuiIconButton-label {
+ justify-content: flex-start;
+ color: white;
+ }
+ }
+}
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment.spec.tsx b/src/components/EcogestureForm/EcogestureFormEquipment.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..b03d7b959c22cd28e74a599f9bde95b6dc2b29a9
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureFormEquipment.spec.tsx
@@ -0,0 +1,145 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import * as reactRedux from 'react-redux'
+import toJson from 'enzyme-to-json'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
+import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+import EcogestureFormEquipment from './EcogestureFormEquipment'
+import { mockProfileEcogesture } from '../../../tests/__mocks__/profileEcogesture.mock'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockStore = configureStore([])
+const mockSetPreviousStep = jest.fn()
+
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+jest.mock('./EquipmentIcon', () => 'mock-equipment-icon')
+const mockUseDispatch = jest.spyOn(reactRedux, 'useDispatch')
+
+describe('EcogestureFormEquipment component', () => {
+ it('should be rendered correctly', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormEquipment
+ profileEcogesture={mockProfileEcogesture}
+ setPreviousStep={mockSetPreviousStep}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should finish the form', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ mockUseDispatch.mockReturnValue(jest.fn())
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormEquipment
+ profileEcogesture={mockProfileEcogesture}
+ setPreviousStep={mockSetPreviousStep}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ expect(mockUseDispatch).toHaveBeenCalledTimes(2)
+ })
+ it('should select equipment and unselect it', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormEquipment
+ profileEcogesture={mockProfileEcogesture}
+ setPreviousStep={mockSetPreviousStep}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find('.item-eq')
+ .first()
+ .simulate('change')
+ await waitForComponentToPaint(wrapper)
+
+ expect(
+ wrapper
+ .find('.item-eq')
+ .first()
+ .hasClass('checked')
+ ).toBeTruthy
+ wrapper
+ .find('.checked')
+ .first()
+ .simulate('change')
+ await waitForComponentToPaint(wrapper)
+ expect(
+ wrapper
+ .find('.item-eq')
+ .first()
+ .hasClass('checked')
+ ).toBeFalsy()
+ })
+
+ it('should click on disabled back button', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormEquipment
+ profileEcogesture={mockProfileEcogesture}
+ setPreviousStep={mockSetPreviousStep}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find('.icons-container').exists()).toBeTruthy()
+ })
+})
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment.tsx b/src/components/EcogestureForm/EcogestureFormEquipment.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..6d5d656fc0f5e4de2b6910ca6b56eeed74952767
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureFormEquipment.tsx
@@ -0,0 +1,116 @@
+import React, { useCallback, useState } from 'react'
+import 'components/ProfileType/profileTypeForm.scss'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import FormNavigation from 'components/ProfileType/FormNavigation'
+import { EcogestureStepForm } from 'enum/ecogestureForm.enum'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import { EquipmentType } from 'enum/ecogesture.enum'
+import EquipmentIcon from './EquipmentIcon'
+import './ecogestureFormEquipment.scss'
+import { newProfileEcogestureEntry } from 'store/profileEcogesture/profileEcogesture.actions'
+import { useDispatch } from 'react-redux'
+import { updateProfile } from 'store/profile/profile.actions'
+import { useHistory } from 'react-router-dom'
+
+interface EcogestureFormEquipmentProps {
+ profileEcogesture: ProfileEcogesture
+ setPreviousStep: Function
+}
+
+const EcogestureFormEquipment: React.FC<EcogestureFormEquipmentProps> = ({
+ profileEcogesture,
+ setPreviousStep,
+}: EcogestureFormEquipmentProps) => {
+ const { t } = useI18n()
+ const dispatch = useDispatch()
+ const history = useHistory()
+ const [answer, setAnswer] = useState<string[]>([])
+
+ const handlePrevious = useCallback(() => {
+ setPreviousStep(profileEcogesture)
+ }, [profileEcogesture, setPreviousStep])
+
+ const handleFinish = useCallback(() => {
+ profileEcogesture.equipments = answer as EquipmentType[]
+ dispatch(newProfileEcogestureEntry(profileEcogesture))
+ dispatch(updateProfile({ isProfileEcogestureCompleted: true }))
+ history.push('/ecogesture-selection')
+ }, [profileEcogesture, answer, dispatch, history])
+
+ const isChecked = useCallback(
+ (value: string): boolean => {
+ if (answer.includes(value)) {
+ return true
+ } else {
+ return false
+ }
+ },
+ [answer]
+ )
+
+ const handleChange = useCallback(
+ (value: string) => {
+ const tempAnswer: string[] = [...answer]
+ if (tempAnswer.includes(value)) {
+ const index = tempAnswer.indexOf(value)
+ if (index > -1) tempAnswer.splice(index, 1)
+ } else {
+ tempAnswer.push(value)
+ }
+ setAnswer(tempAnswer)
+ },
+ [answer]
+ )
+
+ return (
+ <div className="ecogesture-profile-container">
+ <div className={'equipment-form-container'}>
+ <div className={'equipment-label text-22-normal'}>
+ {t(
+ `ecogesture_profile.${EcogestureStepForm[
+ EcogestureStepForm.EQUIPMENTS
+ ].toLowerCase()}.question`
+ )}
+ </div>
+ <div className={'equipment-hint text-16-normal'}>
+ {t(
+ `ecogesture_profile.${EcogestureStepForm[
+ EcogestureStepForm.EQUIPMENTS
+ ].toLowerCase()}.hint`
+ )}
+ </div>
+ <div className="icons-container">
+ {Object.values(EquipmentType).map((equipment, index) => {
+ return (
+ <label key={index} className={'checkbox-equipment'}>
+ <input
+ type={'checkbox'}
+ value={equipment}
+ name={equipment.toString()}
+ onChange={() => handleChange(equipment)}
+ checked={isChecked(equipment)}
+ className={
+ isChecked(equipment) ? 'item-eq checked' : 'item-eq'
+ }
+ />
+ <EquipmentIcon
+ equipment={equipment}
+ isChecked={answer.includes(equipment)}
+ />
+ </label>
+ )
+ })}
+ </div>
+ </div>
+ <FormNavigation
+ step={EcogestureStepForm.EQUIPMENTS}
+ handlePrevious={handlePrevious}
+ handleNext={handleFinish}
+ disableNextButton={answer === []}
+ isEcogesture={true}
+ />
+ </div>
+ )
+}
+
+export default EcogestureFormEquipment
diff --git a/src/components/EcogestureForm/EcogestureFormSingleChoice.spec.tsx b/src/components/EcogestureForm/EcogestureFormSingleChoice.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..09853bbc8a422791d0904b682afb394fb5d7b993
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureFormSingleChoice.spec.tsx
@@ -0,0 +1,147 @@
+/* eslint-disable react/display-name */
+import React from 'react'
+import { mount } from 'enzyme'
+import { Provider } from 'react-redux'
+import {
+ createMockStore,
+ mockInitialEcolyoState,
+} from '../../../tests/__mocks__/store'
+import toJson from 'enzyme-to-json'
+
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+import EcogestureFormSingleChoice from './EcogestureFormSingleChoice'
+import {
+ mockEcogestureAnswer,
+ mockProfileEcogesture,
+} from '../../../tests/__mocks__/profileEcogesture.mock'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+
+jest.mock(
+ 'components/EcogestureForm/EcogestureLaunchFormModal',
+ () => 'mock-ecogesturelaunchmodal'
+)
+
+const mockHandleNextStep = jest.fn()
+const mockHandlePreviousStep = jest.fn()
+describe('EcogestureFormSingleChoice component', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ let store: any
+ beforeEach(() => {
+ store = createMockStore(mockInitialEcolyoState)
+ })
+
+ it('should be rendered correctly', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormSingleChoice
+ step={0}
+ viewedStep={-1}
+ setNextStep={mockHandleNextStep}
+ setPrevioustStep={mockHandlePreviousStep}
+ profileEcogesture={mockProfileEcogesture}
+ answerType={mockEcogestureAnswer}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should click on disabled button', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormSingleChoice
+ step={0}
+ viewedStep={-1}
+ setNextStep={mockHandleNextStep}
+ setPrevioustStep={mockHandlePreviousStep}
+ profileEcogesture={mockProfileEcogesture}
+ answerType={mockEcogestureAnswer}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(mockHandlePreviousStep).toHaveBeenCalledTimes(0)
+ })
+
+ it('should pick a choice and go next', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormSingleChoice
+ step={0}
+ viewedStep={-1}
+ setNextStep={mockHandleNextStep}
+ setPrevioustStep={mockHandlePreviousStep}
+ profileEcogesture={mockProfileEcogesture}
+ answerType={mockEcogestureAnswer}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find('input')
+ .first()
+ .simulate('change')
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+
+ expect(mockHandleNextStep).toHaveBeenCalledTimes(1)
+ })
+ it('should go back', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormSingleChoice
+ step={1}
+ viewedStep={0}
+ setNextStep={mockHandleNextStep}
+ setPrevioustStep={mockHandlePreviousStep}
+ profileEcogesture={mockProfileEcogesture}
+ answerType={mockEcogestureAnswer}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(mockHandlePreviousStep).toHaveBeenCalledTimes(1)
+ })
+ it('should keep previous answer', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormSingleChoice
+ step={0}
+ viewedStep={1}
+ setNextStep={mockHandleNextStep}
+ setPrevioustStep={mockHandlePreviousStep}
+ profileEcogesture={mockProfileEcogesture}
+ answerType={mockEcogestureAnswer}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(
+ wrapper
+ .find('input')
+ .first()
+ .hasClass('checked-input')
+ ).toBe(true)
+ })
+})
diff --git a/src/components/EcogestureForm/EcogestureFormSingleChoice.tsx b/src/components/EcogestureForm/EcogestureFormSingleChoice.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..790e0b4dbe99bd6bf5c6d7aa41d6d8ef96225bb1
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureFormSingleChoice.tsx
@@ -0,0 +1,100 @@
+import React, { useCallback, useEffect, useState } from 'react'
+import 'components/ProfileType/profileTypeForm.scss'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import classNames from 'classnames'
+import FormNavigation from 'components/ProfileType/FormNavigation'
+import { EcogestureStepForm } from 'enum/ecogestureForm.enum'
+import {
+ ProfileEcogesture,
+ ProfileEcogestureAnswer,
+ ProfileEcogestureAnswerChoices,
+} from 'models/profileEcogesture.model'
+import './ecogestureFormSingleChoice.scss'
+interface EcogestureFormSingleChoiceProps {
+ step: EcogestureStepForm
+ viewedStep: EcogestureStepForm
+ profileEcogesture: ProfileEcogesture
+ answerType: ProfileEcogestureAnswer
+ setNextStep: Function
+ setPrevioustStep: Function
+}
+
+const EcogestureFormSingleChoice: React.FC<EcogestureFormSingleChoiceProps> = ({
+ step,
+ viewedStep,
+ profileEcogesture,
+ answerType,
+ setNextStep,
+ setPrevioustStep,
+}: EcogestureFormSingleChoiceProps) => {
+ const { t } = useI18n()
+ const [answer, setAnswer] = useState<ProfileEcogestureAnswerChoices>('')
+
+ const handlePrevious = useCallback(() => {
+ setPrevioustStep(profileEcogesture)
+ }, [profileEcogesture, setPrevioustStep])
+
+ const handleAnswer = useCallback((value: ProfileEcogestureAnswerChoices) => {
+ setAnswer(value)
+ }, [])
+
+ const handleNext = useCallback(() => {
+ profileEcogesture[answerType.attribute] = answer
+ setNextStep(profileEcogesture)
+ }, [profileEcogesture, setNextStep, answer, answerType.attribute])
+
+ useEffect(() => {
+ if (step < viewedStep) {
+ setAnswer(profileEcogesture[answerType.attribute])
+ }
+ }, [step, viewedStep, profileEcogesture, answerType])
+
+ return (
+ <div className="ecogesture-profile-container">
+ <div className={'profile-form-container ecogesture-form-single'}>
+ <div className={'profile-question-label'}>
+ {t(
+ `ecogesture_form.${EcogestureStepForm[step].toLowerCase()}.question`
+ )}
+ </div>
+ {answerType.choices.map(
+ (value: ProfileEcogestureAnswerChoices, index: number) => {
+ return value || value === 0 ? (
+ <label
+ key={index}
+ className={classNames({
+ ['radio_short']: answerType.choices.length < 5,
+ ['radio_long']: answerType.choices.length > 4,
+ ['answer-checked']: answer === value,
+ })}
+ >
+ <input
+ type={'radio'}
+ value={value}
+ name={value.toString()}
+ onChange={() => handleAnswer(value)}
+ checked={answer === value ? true : false}
+ className={answer === value ? 'checked-input' : ''}
+ />
+ {t(
+ `ecogesture_form.${EcogestureStepForm[
+ step
+ ].toLowerCase()}.${value}`
+ )}
+ </label>
+ ) : null
+ }
+ )}
+ </div>
+ <FormNavigation
+ step={step}
+ handlePrevious={handlePrevious}
+ handleNext={handleNext}
+ disableNextButton={answer === ''}
+ isEcogesture={true}
+ />
+ </div>
+ )
+}
+
+export default EcogestureFormSingleChoice
diff --git a/src/components/EcogestureForm/EcogestureFormView.spec.tsx b/src/components/EcogestureForm/EcogestureFormView.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8d6c77f09e895fc6da10344b15b3ef2d571e81c7
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureFormView.spec.tsx
@@ -0,0 +1,136 @@
+/* eslint-disable react/display-name */
+import React from 'react'
+import { mount } from 'enzyme'
+import { Provider } from 'react-redux'
+import {
+ createMockStore,
+ mockInitialEcolyoState,
+} from '../../../tests/__mocks__/store'
+import toJson from 'enzyme-to-json'
+
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+import EcogestureFormView from './EcogestureFormView'
+import { Profile } from 'models'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+
+jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
+jest.mock('components/Header/Header', () => 'mock-header')
+jest.mock(
+ 'components/EcogestureForm/EcogestureLaunchFormModal',
+ () => 'mock-ecogesturelaunchmodal'
+)
+jest.mock(
+ 'components/EcogestureForm/EcogestureFormEquipment',
+ () => 'mock-ecogestureformequipment'
+)
+jest.mock('components/Content/Content', () => 'mock-content')
+
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useLocation: () => {
+ return {
+ search: '',
+ }
+ },
+}))
+describe('EcogestureFormView component', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ let store: any
+ beforeEach(() => {
+ store = createMockStore(mockInitialEcolyoState)
+ })
+
+ it('should be rendered correctly', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should render singlechoice', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(wrapper.find('.ecogesture-form-single').exists()).toBeTruthy()
+ })
+ it('should render equipment step because profiletype is completed', async () => {
+ const updatedProfile: Profile = {
+ ...mockInitialEcolyoState.profile,
+ isProfileTypeCompleted: true,
+ }
+ const updatedStore = { ...mockInitialEcolyoState, profile: updatedProfile }
+ const wrapper = mount(
+ <Provider store={createMockStore(updatedStore)}>
+ <EcogestureFormView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(
+ wrapper
+ .find('mock-ecogestureformequipment')
+ .first()
+ .exists()
+ ).toBeTruthy()
+ })
+ it('should go to next step', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find('input')
+ .first()
+ .simulate('change')
+ await waitForComponentToPaint(wrapper)
+ console.log(wrapper.debug())
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+ expect(wrapper.find('.ecogesture-form-single').exists()).toBeTruthy()
+ })
+ it('should go to previous step', async () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureFormView />
+ </Provider>
+ )
+ //go first to next step
+ await waitForComponentToPaint(wrapper)
+ wrapper
+ .find('input')
+ .first()
+ .simulate('change')
+ await waitForComponentToPaint(wrapper)
+ console.log(wrapper.debug())
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+ //then go back
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(wrapper.find('.ecogesture-form-single').exists()).toBeTruthy()
+ })
+})
diff --git a/src/components/EcogestureForm/EcogestureFormView.tsx b/src/components/EcogestureForm/EcogestureFormView.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..5f5e80505c237c999e1c997f552b553369a1d520
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureFormView.tsx
@@ -0,0 +1,154 @@
+import React, { useCallback, useEffect, useState } from 'react'
+import CozyBar from 'components/Header/CozyBar'
+import Header from 'components/Header/Header'
+import Content from 'components/Content/Content'
+import { useSelector } from 'react-redux'
+import { AppStore } from 'store'
+import {
+ ProfileEcogestureAnswerType,
+ EcogestureStepForm,
+} from 'enum/ecogestureForm.enum'
+import EcogestureFormSingleChoice from 'components/EcogestureForm/EcogestureFormSingleChoice'
+import EcogestureLaunchFormModal from 'components/EcogestureForm/EcogestureLaunchFormModal'
+import EcogestureFormEquipment from 'components/EcogestureForm/EcogestureFormEquipment'
+import {
+ ProfileEcogesture,
+ ProfileEcogestureAnswer,
+} from 'models/profileEcogesture.model'
+import { Profile, ProfileType } from 'models'
+import ProfileEcogestureFormService from 'services/profileEcogestureForm.service'
+import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
+import { FluidType } from 'enum/fluid.enum'
+import './ecogestureFormView.scss'
+import { useLocation } from 'react-router-dom'
+
+const EcogestureFormView: React.FC = () => {
+ const [headerHeight, setHeaderHeight] = useState<number>(0)
+ const defineHeaderHeight = (height: number) => {
+ setHeaderHeight(height)
+ }
+ const { isProfileTypeCompleted }: Profile = useSelector(
+ (state: AppStore) => state.ecolyo.profile
+ )
+ const curProfileEcogesture: ProfileEcogesture = useSelector(
+ (state: AppStore) => state.ecolyo.profileEcogesture
+ )
+ const profileType: ProfileType = useSelector(
+ (state: AppStore) => state.ecolyo.profileType
+ )
+ const shouldOpenModal = new URLSearchParams(useLocation().search).get('modal')
+ const [step, setStep] = useState<EcogestureStepForm>(
+ EcogestureStepForm.HEATING_TYPE
+ )
+ const [answerType, setAnswerType] = useState<ProfileEcogestureAnswer>({
+ type: ProfileEcogestureAnswerType.SINGLE_CHOICE,
+ attribute: '',
+ choices: [],
+ })
+
+ const [isLoading, setIsLoading] = useState<boolean>(true)
+ const [openLaunchModal, setOpenLaunchModal] = useState<boolean>(
+ shouldOpenModal !== 'false' ? true : false
+ )
+ const [viewedStep, setViewedStep] = useState<number>(-1)
+ const [profileEcogesture, setProfileEcogesture] = useState<ProfileEcogesture>(
+ curProfileEcogesture
+ )
+ const setNextStep = useCallback(
+ (_profileEcogesture: ProfileEcogesture) => {
+ setProfileEcogesture(_profileEcogesture)
+ const pefs = new ProfileEcogestureFormService(_profileEcogesture)
+ const nextStep: EcogestureStepForm = pefs.getNextFormStep(step)
+ setIsLoading(true)
+ if (nextStep > viewedStep) {
+ setViewedStep(nextStep)
+ }
+ const _answerType: ProfileEcogestureAnswer = ProfileEcogestureFormService.getAnswerForStep(
+ isProfileTypeCompleted ? EcogestureStepForm.EQUIPMENTS : nextStep
+ )
+ setAnswerType(_answerType)
+ setStep(nextStep)
+ },
+ [isProfileTypeCompleted, step, viewedStep]
+ )
+ const setPreviousStep = useCallback(
+ (_profileEcogesture: ProfileEcogesture) => {
+ setProfileEcogesture(_profileEcogesture)
+ const pefs = new ProfileEcogestureFormService(_profileEcogesture)
+ const previousStep: EcogestureStepForm = pefs.getPreviousFormStep(step)
+ setIsLoading(true)
+ const _answerType: ProfileEcogestureAnswer = ProfileEcogestureFormService.getAnswerForStep(
+ previousStep
+ )
+ setAnswerType(_answerType)
+ setStep(previousStep)
+ },
+ [step]
+ )
+
+ useEffect(() => {
+ let subscribed = true
+ if (isProfileTypeCompleted) {
+ if (subscribed) {
+ curProfileEcogesture.heating = profileType.heating
+ curProfileEcogesture.hotWater = profileType.hotWater
+ curProfileEcogesture.warmingFluid = profileType.warmingFluid
+ setStep(EcogestureStepForm.EQUIPMENTS)
+ }
+ }
+ const _answerType: ProfileEcogestureAnswer = ProfileEcogestureFormService.getAnswerForStep(
+ isProfileTypeCompleted ? EcogestureStepForm.EQUIPMENTS : step
+ )
+ setAnswerType(_answerType)
+ if (subscribed) {
+ setAnswerType(_answerType)
+ setIsLoading(false)
+ }
+ return () => {
+ subscribed = false
+ }
+ }, [step, curProfileEcogesture, isProfileTypeCompleted, profileType])
+
+ if (isLoading) {
+ return (
+ <Content height={headerHeight}>
+ <div className="se-loader-container">
+ <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ </Content>
+ )
+ }
+ return (
+ <>
+ <CozyBar titleKey={'common.title_ecogestures'} />
+ <Header
+ setHeaderHeight={defineHeaderHeight}
+ desktopTitleKey={'common.title_ecogestures'}
+ ></Header>
+ <Content height={headerHeight}>
+ {step === EcogestureStepForm.EQUIPMENTS && (
+ <EcogestureFormEquipment
+ profileEcogesture={profileEcogesture}
+ setPreviousStep={setPreviousStep}
+ />
+ )}
+ {step !== EcogestureStepForm.EQUIPMENTS && (
+ <EcogestureFormSingleChoice
+ step={step}
+ viewedStep={viewedStep}
+ profileEcogesture={profileEcogesture}
+ answerType={answerType}
+ setNextStep={setNextStep}
+ setPrevioustStep={setPreviousStep}
+ />
+ )}
+ </Content>
+ <EcogestureLaunchFormModal
+ open={openLaunchModal}
+ handleCloseClick={() => setOpenLaunchModal(false)}
+ />
+ </>
+ )
+}
+
+export default EcogestureFormView
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal.spec.tsx b/src/components/EcogestureForm/EcogestureLaunchFormModal.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..33e0bbaa3353ddc921f2c51f812acf57a768c02b
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal.spec.tsx
@@ -0,0 +1,41 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import EcogestureLaunchFormModal from './EcogestureLaunchFormModal'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+
+const mockHandleClose = jest.fn()
+describe('EcogestureLaunchFormModal component', () => {
+ it('should be rendered correctly', () => {
+ const wrapper = mount(
+ <EcogestureLaunchFormModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ />
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should close modal', async () => {
+ const wrapper = mount(
+ <EcogestureLaunchFormModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ />
+ )
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(mockHandleClose).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/src/components/EcogestureForm/EcogestureLaunchFormModal.tsx b/src/components/EcogestureForm/EcogestureLaunchFormModal.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..1a0ff36d5b6a42d5ed8ddc2b36007f5635b5c563
--- /dev/null
+++ b/src/components/EcogestureForm/EcogestureLaunchFormModal.tsx
@@ -0,0 +1,60 @@
+import React from 'react'
+import Dialog from '@material-ui/core/Dialog'
+import { Button, IconButton } from '@material-ui/core'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import CloseIcon from 'assets/icons/ico/close.svg'
+import './ecogestureLaunchFormModal.scss'
+
+interface EcogestureLaunchFormModalProps {
+ open: boolean
+ handleCloseClick: () => void
+}
+const EcogestureLaunchFormModal: React.FC<EcogestureLaunchFormModalProps> = ({
+ open,
+ handleCloseClick,
+}: EcogestureLaunchFormModalProps) => {
+ const { t } = useI18n()
+ return (
+ <Dialog
+ open={open}
+ onClose={handleCloseClick}
+ aria-labelledby={'accessibility-title'}
+ classes={{
+ root: 'modal-root',
+ paper: 'modal-paper',
+ }}
+ >
+ <div id={'accessibility-title'}>
+ {t('feedback.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="eg-init-modal">
+ <div className="title text-20-bold">
+ {t('ecogesture.initModal.title')}
+ </div>
+ <div className="text-16-normal text">
+ {t('ecogesture.initModal.text3')}
+ </div>
+ <Button
+ aria-label={t('ecogesture.initModal.btn2')}
+ onClick={handleCloseClick}
+ classes={{
+ root: 'btn-profile-next rounded',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.initModal.btn2')}
+ </Button>
+ </div>
+ </Dialog>
+ )
+}
+
+export default EcogestureLaunchFormModal
diff --git a/src/components/EcogestureForm/EquipmentIcon.spec.tsx b/src/components/EcogestureForm/EquipmentIcon.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8e341372ed4226b931de772f7b08f05bcbb777bc
--- /dev/null
+++ b/src/components/EcogestureForm/EquipmentIcon.spec.tsx
@@ -0,0 +1,48 @@
+/* eslint-disable react/display-name */
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+import EquipmentIcon from './EquipmentIcon'
+import { EquipmentType } from 'enum/ecogesture.enum'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockImportIconbyId = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ importIconbyId: jest.fn(() => {
+ return mockImportIconbyId
+ }),
+ }
+})
+describe('EcogestureFormSingleChoice component', () => {
+ it('should be rendered correctly', async () => {
+ mockImportIconbyId.mockReturnValue('')
+ const wrapper = mount(
+ <EquipmentIcon equipment={EquipmentType.BOILER} isChecked={false} />
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should render checked icon', async () => {
+ mockImportIconbyId.mockReturnValue('')
+ const wrapper = mount(
+ <EquipmentIcon equipment={EquipmentType.BOILER} isChecked={true} />
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(
+ wrapper
+ .find('.checked')
+ .first()
+ .exists()
+ ).toBeTruthy()
+ })
+})
diff --git a/src/components/EcogestureForm/EquipmentIcon.tsx b/src/components/EcogestureForm/EquipmentIcon.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..6792b4cc9e9d3f1fe184312d460b20301647f568
--- /dev/null
+++ b/src/components/EcogestureForm/EquipmentIcon.tsx
@@ -0,0 +1,49 @@
+import React, { useEffect, useState } from 'react'
+import 'components/ProfileType/profileTypeForm.scss'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { importIconbyId } from 'utils/utils'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+
+interface EquipmentIconProps {
+ equipment: string
+ isChecked: boolean
+}
+
+const EquipmentIcon: React.FC<EquipmentIconProps> = ({
+ equipment,
+ isChecked,
+}: EquipmentIconProps) => {
+ const { t } = useI18n()
+ const [icon, setIcon] = useState<string>('')
+ useEffect(() => {
+ let subscribed = true
+ async function getIcon() {
+ const svg = await importIconbyId(equipment, 'equipments')
+ if (subscribed && svg) {
+ setIcon(svg)
+ }
+ }
+ getIcon()
+ return () => {
+ subscribed = false
+ }
+ }, [equipment])
+ return (
+ <>
+ <div
+ className={
+ isChecked
+ ? 'equipment-icon-container checked'
+ : ' equipment-icon-container'
+ }
+ >
+ <Icon icon={icon} size={40} className={'equipmentIcon '} />
+ </div>
+ <div className="text text-14-normal">
+ {t(`ecogesture_profile.equipments.${equipment.toLocaleLowerCase()}`)}
+ </div>
+ </>
+ )
+}
+
+export default EquipmentIcon
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..26e73e2ed207751330783f75d9d96753f0bf4c5c
--- /dev/null
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
@@ -0,0 +1,592 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureFormEquipment
+ profileEcogesture={
+ Object {
+ "equipments": Array [],
+ "heating": "individual",
+ "hotWater": "individual",
+ "warmingFluid": 0,
+ }
+ }
+ setPreviousStep={[MockFunction]}
+ >
+ <div
+ className="ecogesture-profile-container"
+ >
+ <div
+ className="equipment-form-container"
+ >
+ <div
+ className="equipment-label text-22-normal"
+ >
+ ecogesture_profile.equipments.question
+ </div>
+ <div
+ className="equipment-hint text-16-normal"
+ >
+ ecogesture_profile.equipments.hint
+ </div>
+ <div
+ className="icons-container"
+ >
+ <label
+ className="checkbox-equipment"
+ key="0"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="AIR_CONDITIONING"
+ onChange={[Function]}
+ type="checkbox"
+ value="AIR_CONDITIONING"
+ />
+ <mock-equipment-icon
+ equipment="AIR_CONDITIONING"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="1"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="COMPUTER"
+ onChange={[Function]}
+ type="checkbox"
+ value="COMPUTER"
+ />
+ <mock-equipment-icon
+ equipment="COMPUTER"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="2"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="MICROWAVE"
+ onChange={[Function]}
+ type="checkbox"
+ value="MICROWAVE"
+ />
+ <mock-equipment-icon
+ equipment="MICROWAVE"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="3"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="WASHING_MACHINE"
+ onChange={[Function]}
+ type="checkbox"
+ value="WASHING_MACHINE"
+ />
+ <mock-equipment-icon
+ equipment="WASHING_MACHINE"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="4"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="DISHWASHER"
+ onChange={[Function]}
+ type="checkbox"
+ value="DISHWASHER"
+ />
+ <mock-equipment-icon
+ equipment="DISHWASHER"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="5"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="COOKING_PLATES"
+ onChange={[Function]}
+ type="checkbox"
+ value="COOKING_PLATES"
+ />
+ <mock-equipment-icon
+ equipment="COOKING_PLATES"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="6"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="DRYER"
+ onChange={[Function]}
+ type="checkbox"
+ value="DRYER"
+ />
+ <mock-equipment-icon
+ equipment="DRYER"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="7"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="REFREGIRATOR"
+ onChange={[Function]}
+ type="checkbox"
+ value="REFREGIRATOR"
+ />
+ <mock-equipment-icon
+ equipment="REFREGIRATOR"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="8"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="FAN"
+ onChange={[Function]}
+ type="checkbox"
+ value="FAN"
+ />
+ <mock-equipment-icon
+ equipment="FAN"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="9"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="CURTAIN"
+ onChange={[Function]}
+ type="checkbox"
+ value="CURTAIN"
+ />
+ <mock-equipment-icon
+ equipment="CURTAIN"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="10"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="INTERNET_BOX"
+ onChange={[Function]}
+ type="checkbox"
+ value="INTERNET_BOX"
+ />
+ <mock-equipment-icon
+ equipment="INTERNET_BOX"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="11"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="VENTILATION"
+ onChange={[Function]}
+ type="checkbox"
+ value="VENTILATION"
+ />
+ <mock-equipment-icon
+ equipment="VENTILATION"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="12"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="FREEZER"
+ onChange={[Function]}
+ type="checkbox"
+ value="FREEZER"
+ />
+ <mock-equipment-icon
+ equipment="FREEZER"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="13"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="BOILER"
+ onChange={[Function]}
+ type="checkbox"
+ value="BOILER"
+ />
+ <mock-equipment-icon
+ equipment="BOILER"
+ isChecked={false}
+ />
+ </label>
+ <label
+ className="checkbox-equipment"
+ key="14"
+ >
+ <input
+ checked={false}
+ className="item-eq"
+ name="HYDRAULIC_HEATING"
+ onChange={[Function]}
+ type="checkbox"
+ value="HYDRAULIC_HEATING"
+ />
+ <mock-equipment-icon
+ equipment="HYDRAULIC_HEATING"
+ isChecked={false}
+ />
+ </label>
+ </div>
+ </div>
+ <FormNavigation
+ disableNextButton={false}
+ handleNext={[Function]}
+ handlePrevious={[Function]}
+ isEcogesture={true}
+ step={3}
+ >
+ <div
+ className="profile-navigation"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-profile-back",
+ }
+ }
+ disabled={false}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-back",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ disabled={false}
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButtonBase-root MuiButton-root btn-profile-back MuiButton-text profile-navigation-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ < profile_type.form.button_previous
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_end"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-profile-next rounded",
+ }
+ }
+ disabled={false}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="profile_type.accessibility.button_end"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next rounded",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ disabled={false}
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="profile_type.accessibility.button_end"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="profile_type.accessibility.button_end"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="profile_type.accessibility.button_end"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ profile_type.form.button_end
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </FormNavigation>
+ </div>
+ </EcogestureFormEquipment>
+</Provider>
+`;
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureFormSingleChoice.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureFormSingleChoice.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..e68886b80ccfeafb97303f9ec5c9d7c37560d210
--- /dev/null
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureFormSingleChoice.spec.tsx.snap
@@ -0,0 +1,309 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureFormSingleChoice component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureFormSingleChoice
+ answerType={
+ Object {
+ "attribute": "heating",
+ "choices": Array [
+ "individual",
+ "collective",
+ ],
+ "type": 0,
+ }
+ }
+ profileEcogesture={
+ Object {
+ "equipments": Array [],
+ "heating": "individual",
+ "hotWater": "individual",
+ "warmingFluid": 0,
+ }
+ }
+ setNextStep={[MockFunction]}
+ setPrevioustStep={[MockFunction]}
+ step={0}
+ viewedStep={-1}
+ >
+ <div
+ className="ecogesture-profile-container"
+ >
+ <div
+ className="profile-form-container ecogesture-form-single"
+ >
+ <div
+ className="profile-question-label"
+ >
+ ecogesture_form.heating_type.question
+ </div>
+ <label
+ className="radio_short"
+ key="0"
+ >
+ <input
+ checked={false}
+ className=""
+ name="individual"
+ onChange={[Function]}
+ type="radio"
+ value="individual"
+ />
+ ecogesture_form.heating_type.individual
+ </label>
+ <label
+ className="radio_short"
+ key="1"
+ >
+ <input
+ checked={false}
+ className=""
+ name="collective"
+ onChange={[Function]}
+ type="radio"
+ value="collective"
+ />
+ ecogesture_form.heating_type.collective
+ </label>
+ </div>
+ <FormNavigation
+ disableNextButton={true}
+ handleNext={[Function]}
+ handlePrevious={[Function]}
+ isEcogesture={true}
+ step={0}
+ >
+ <div
+ className="profile-navigation"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-profile-back",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-back",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButtonBase-root MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled Mui-disabled"
+ disabled={true}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={-1}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ < profile_type.form.button_previous
+ </span>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_next"
+ className="profile-navigation-button disabled"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-profile-next rounded",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="profile_type.accessibility.button_next"
+ className="profile-navigation-button disabled"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next rounded",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="profile_type.accessibility.button_next"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button disabled Mui-disabled"
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="profile_type.accessibility.button_next"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button disabled Mui-disabled"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="profile_type.accessibility.button_next"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button disabled Mui-disabled Mui-disabled"
+ disabled={true}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={-1}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ profile_type.form.button_next >
+ </span>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </FormNavigation>
+ </div>
+ </EcogestureFormSingleChoice>
+</Provider>
+`;
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..3caf0d88608e85810999a00c625118971598c111
--- /dev/null
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureFormView.spec.tsx.snap
@@ -0,0 +1,326 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureFormView component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureFormView>
+ <mock-cozybar
+ titleKey="common.title_ecogestures"
+ />
+ <mock-header
+ desktopTitleKey="common.title_ecogestures"
+ setHeaderHeight={[Function]}
+ />
+ <mock-content
+ height={0}
+ >
+ <EcogestureFormSingleChoice
+ answerType={
+ Object {
+ "attribute": "heating",
+ "choices": Array [
+ "individual",
+ "collective",
+ ],
+ "type": 0,
+ }
+ }
+ profileEcogesture={
+ Object {
+ "equipments": Array [],
+ "heating": "individual",
+ "hotWater": "individual",
+ "warmingFluid": 0,
+ }
+ }
+ setNextStep={[Function]}
+ setPrevioustStep={[Function]}
+ step={0}
+ viewedStep={-1}
+ >
+ <div
+ className="ecogesture-profile-container"
+ >
+ <div
+ className="profile-form-container ecogesture-form-single"
+ >
+ <div
+ className="profile-question-label"
+ >
+ ecogesture_form.heating_type.question
+ </div>
+ <label
+ className="radio_short"
+ key="0"
+ >
+ <input
+ checked={false}
+ className=""
+ name="individual"
+ onChange={[Function]}
+ type="radio"
+ value="individual"
+ />
+ ecogesture_form.heating_type.individual
+ </label>
+ <label
+ className="radio_short"
+ key="1"
+ >
+ <input
+ checked={false}
+ className=""
+ name="collective"
+ onChange={[Function]}
+ type="radio"
+ value="collective"
+ />
+ ecogesture_form.heating_type.collective
+ </label>
+ </div>
+ <FormNavigation
+ disableNextButton={true}
+ handleNext={[Function]}
+ handlePrevious={[Function]}
+ isEcogesture={true}
+ step={0}
+ >
+ <div
+ className="profile-navigation"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-profile-back",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="profile_type.accessibility.button_previous"
+ className="profile-navigation-button"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-back",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="profile_type.accessibility.button_previous"
+ className="MuiButtonBase-root MuiButton-root btn-profile-back MuiButton-text profile-navigation-button Mui-disabled Mui-disabled"
+ disabled={true}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={-1}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ < profile_type.form.button_previous
+ </span>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="profile_type.accessibility.button_next"
+ className="profile-navigation-button disabled"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-profile-next rounded",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="profile_type.accessibility.button_next"
+ className="profile-navigation-button disabled"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next rounded",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ disabled={true}
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="profile_type.accessibility.button_next"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button disabled Mui-disabled"
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="profile_type.accessibility.button_next"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button disabled Mui-disabled"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={true}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="profile_type.accessibility.button_next"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button disabled Mui-disabled Mui-disabled"
+ disabled={true}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={-1}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ profile_type.form.button_next >
+ </span>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </FormNavigation>
+ </div>
+ </EcogestureFormSingleChoice>
+ </mock-content>
+ <mock-ecogesturelaunchmodal
+ handleCloseClick={[Function]}
+ open={true}
+ />
+ </EcogestureFormView>
+</Provider>
+`;
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..df73463356a5f652304dfc46ed47b4b8a4108040
--- /dev/null
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureLaunchFormModal.spec.tsx.snap
@@ -0,0 +1,963 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureLaunchFormModal component should be rendered correctly 1`] = `
+<EcogestureLaunchFormModal
+ handleCloseClick={[MockFunction]}
+ open={true}
+>
+ <WithStyles(ForwardRef(Dialog))
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "paper": "modal-paper",
+ "root": "modal-root",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Dialog)
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "container": "MuiDialog-container",
+ "paper": "MuiDialog-paper modal-paper",
+ "paperFullScreen": "MuiDialog-paperFullScreen",
+ "paperFullWidth": "MuiDialog-paperFullWidth",
+ "paperScrollBody": "MuiDialog-paperScrollBody",
+ "paperScrollPaper": "MuiDialog-paperScrollPaper",
+ "paperWidthFalse": "MuiDialog-paperWidthFalse",
+ "paperWidthLg": "MuiDialog-paperWidthLg",
+ "paperWidthMd": "MuiDialog-paperWidthMd",
+ "paperWidthSm": "MuiDialog-paperWidthSm",
+ "paperWidthXl": "MuiDialog-paperWidthXl",
+ "paperWidthXs": "MuiDialog-paperWidthXs",
+ "root": "MuiDialog-root modal-root",
+ "scrollBody": "MuiDialog-scrollBody",
+ "scrollPaper": "MuiDialog-scrollPaper",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Modal)
+ BackdropComponent={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "Naked": Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "propTypes": Object {
+ "children": [Function],
+ "className": [Function],
+ "classes": [Function],
+ "invisible": [Function],
+ "open": [Function],
+ "transitionDuration": [Function],
+ },
+ "render": [Function],
+ },
+ "displayName": "WithStyles(ForwardRef(Backdrop))",
+ "options": Object {
+ "defaultTheme": Object {
+ "breakpoints": Object {
+ "between": [Function],
+ "down": [Function],
+ "keys": Array [
+ "xs",
+ "sm",
+ "md",
+ "lg",
+ "xl",
+ ],
+ "only": [Function],
+ "up": [Function],
+ "values": Object {
+ "lg": 1280,
+ "md": 960,
+ "sm": 600,
+ "xl": 1920,
+ "xs": 0,
+ },
+ "width": [Function],
+ },
+ "direction": "ltr",
+ "mixins": Object {
+ "gutters": [Function],
+ "toolbar": Object {
+ "@media (min-width:0px) and (orientation: landscape)": Object {
+ "minHeight": 48,
+ },
+ "@media (min-width:600px)": Object {
+ "minHeight": 64,
+ },
+ "minHeight": 56,
+ },
+ },
+ "overrides": Object {},
+ "palette": Object {
+ "action": Object {
+ "active": "rgba(0, 0, 0, 0.54)",
+ "disabled": "rgba(0, 0, 0, 0.26)",
+ "disabledBackground": "rgba(0, 0, 0, 0.12)",
+ "hover": "rgba(0, 0, 0, 0.08)",
+ "hoverOpacity": 0.08,
+ "selected": "rgba(0, 0, 0, 0.14)",
+ },
+ "augmentColor": [Function],
+ "background": Object {
+ "default": "#fafafa",
+ "paper": "#fff",
+ },
+ "common": Object {
+ "black": "#000",
+ "white": "#fff",
+ },
+ "contrastThreshold": 3,
+ "divider": "rgba(0, 0, 0, 0.12)",
+ "error": Object {
+ "contrastText": "#fff",
+ "dark": "#d32f2f",
+ "light": "#e57373",
+ "main": "#f44336",
+ },
+ "getContrastText": [Function],
+ "grey": Object {
+ "100": "#f5f5f5",
+ "200": "#eeeeee",
+ "300": "#e0e0e0",
+ "400": "#bdbdbd",
+ "50": "#fafafa",
+ "500": "#9e9e9e",
+ "600": "#757575",
+ "700": "#616161",
+ "800": "#424242",
+ "900": "#212121",
+ "A100": "#d5d5d5",
+ "A200": "#aaaaaa",
+ "A400": "#303030",
+ "A700": "#616161",
+ },
+ "info": Object {
+ "contrastText": "#fff",
+ "dark": "#1976d2",
+ "light": "#64b5f6",
+ "main": "#2196f3",
+ },
+ "primary": Object {
+ "contrastText": "#fff",
+ "dark": "#303f9f",
+ "light": "#7986cb",
+ "main": "#3f51b5",
+ },
+ "secondary": Object {
+ "contrastText": "#fff",
+ "dark": "#c51162",
+ "light": "#ff4081",
+ "main": "#f50057",
+ },
+ "success": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#388e3c",
+ "light": "#81c784",
+ "main": "#4caf50",
+ },
+ "text": Object {
+ "disabled": "rgba(0, 0, 0, 0.38)",
+ "hint": "rgba(0, 0, 0, 0.38)",
+ "primary": "rgba(0, 0, 0, 0.87)",
+ "secondary": "rgba(0, 0, 0, 0.54)",
+ },
+ "tonalOffset": 0.2,
+ "type": "light",
+ "warning": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#f57c00",
+ "light": "#ffb74d",
+ "main": "#ff9800",
+ },
+ },
+ "props": Object {},
+ "shadows": Array [
+ "none",
+ "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
+ "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
+ "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
+ "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+ "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+ "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+ "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+ "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+ "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+ "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+ "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+ "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+ "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+ "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+ "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+ "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+ "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+ "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+ ],
+ "shape": Object {
+ "borderRadius": 4,
+ },
+ "spacing": [Function],
+ "transitions": Object {
+ "create": [Function],
+ "duration": Object {
+ "complex": 375,
+ "enteringScreen": 225,
+ "leavingScreen": 195,
+ "short": 250,
+ "shorter": 200,
+ "shortest": 150,
+ "standard": 300,
+ },
+ "easing": Object {
+ "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+ "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+ "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+ "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+ },
+ "getAutoHeightDuration": [Function],
+ },
+ "typography": Object {
+ "body1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.5,
+ },
+ "body2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.01071em",
+ "lineHeight": 1.43,
+ },
+ "button": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.02857em",
+ "lineHeight": 1.75,
+ "textTransform": "uppercase",
+ },
+ "caption": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.03333em",
+ "lineHeight": 1.66,
+ },
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": 14,
+ "fontWeightBold": 700,
+ "fontWeightLight": 300,
+ "fontWeightMedium": 500,
+ "fontWeightRegular": 400,
+ "h1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "6rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.01562em",
+ "lineHeight": 1.167,
+ },
+ "h2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3.75rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.00833em",
+ "lineHeight": 1.2,
+ },
+ "h3": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.167,
+ },
+ "h4": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "2.125rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00735em",
+ "lineHeight": 1.235,
+ },
+ "h5": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.5rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.334,
+ },
+ "h6": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.25rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.0075em",
+ "lineHeight": 1.6,
+ },
+ "htmlFontSize": 16,
+ "overline": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.08333em",
+ "lineHeight": 2.66,
+ "textTransform": "uppercase",
+ },
+ "pxToRem": [Function],
+ "round": [Function],
+ "subtitle1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.75,
+ },
+ "subtitle2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.00714em",
+ "lineHeight": 1.57,
+ },
+ },
+ "zIndex": Object {
+ "appBar": 1100,
+ "drawer": 1200,
+ "mobileStepper": 1000,
+ "modal": 1300,
+ "snackbar": 1400,
+ "speedDial": 1050,
+ "tooltip": 1500,
+ },
+ },
+ "name": "MuiBackdrop",
+ },
+ "propTypes": Object {
+ "classes": [Function],
+ "innerRef": [Function],
+ },
+ "render": [Function],
+ "useStyles": [Function],
+ }
+ }
+ BackdropProps={
+ Object {
+ "transitionDuration": Object {
+ "enter": 225,
+ "exit": 195,
+ },
+ }
+ }
+ className="MuiDialog-root modal-root"
+ closeAfterTransition={true}
+ disableBackdropClick={false}
+ disableEscapeKeyDown={false}
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Portal)
+ disablePortal={false}
+ >
+ <Portal
+ containerInfo={
+ <body
+ style="padding-right: 0px; overflow: hidden;"
+ >
+ <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"
+ >
+ feedback.accessibility.window_title
+ </div>
+ <button
+ aria-label="feedback.accessibility.button_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="eg-init-modal"
+ >
+ <div
+ class="title text-20-bold"
+ >
+ ecogesture.initModal.title
+ </div>
+ <div
+ class="text-16-normal text"
+ >
+ ecogesture.initModal.text3
+ </div>
+ <button
+ aria-label="ecogesture.initModal.btn2"
+ class="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn2
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ </div>
+ </div>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+ </body>
+ }
+ >
+ <div
+ className="MuiDialog-root modal-root"
+ onKeyDown={[Function]}
+ role="presentation"
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "fixed",
+ "right": 0,
+ "top": 0,
+ "zIndex": 1300,
+ }
+ }
+ >
+ <WithStyles(ForwardRef(Backdrop))
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Backdrop)
+ classes={
+ Object {
+ "invisible": "MuiBackdrop-invisible",
+ "root": "MuiBackdrop-root",
+ }
+ }
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Fade)
+ in={true}
+ onClick={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onClick={[Function]}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ aria-hidden={true}
+ className="MuiBackdrop-root"
+ onClick={[Function]}
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ />
+ </Transition>
+ </ForwardRef(Fade)>
+ </ForwardRef(Backdrop)>
+ </WithStyles(ForwardRef(Backdrop))>
+ <TrapFocus
+ disableAutoFocus={false}
+ disableEnforceFocus={false}
+ disableRestoreFocus={false}
+ getDoc={[Function]}
+ isEnabled={[Function]}
+ open={true}
+ >
+ <div
+ data-test="sentinelStart"
+ tabIndex={0}
+ />
+ <ForwardRef(Fade)
+ appear={true}
+ in={true}
+ onEnter={[Function]}
+ onExited={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ className="MuiDialog-container MuiDialog-scrollPaper"
+ onClick={[Function]}
+ onMouseDown={[Function]}
+ role="none presentation"
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ tabIndex="-1"
+ >
+ <WithStyles(ForwardRef(Paper))
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ elevation={24}
+ role="dialog"
+ >
+ <ForwardRef(Paper)
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ classes={
+ Object {
+ "elevation0": "MuiPaper-elevation0",
+ "elevation1": "MuiPaper-elevation1",
+ "elevation10": "MuiPaper-elevation10",
+ "elevation11": "MuiPaper-elevation11",
+ "elevation12": "MuiPaper-elevation12",
+ "elevation13": "MuiPaper-elevation13",
+ "elevation14": "MuiPaper-elevation14",
+ "elevation15": "MuiPaper-elevation15",
+ "elevation16": "MuiPaper-elevation16",
+ "elevation17": "MuiPaper-elevation17",
+ "elevation18": "MuiPaper-elevation18",
+ "elevation19": "MuiPaper-elevation19",
+ "elevation2": "MuiPaper-elevation2",
+ "elevation20": "MuiPaper-elevation20",
+ "elevation21": "MuiPaper-elevation21",
+ "elevation22": "MuiPaper-elevation22",
+ "elevation23": "MuiPaper-elevation23",
+ "elevation24": "MuiPaper-elevation24",
+ "elevation3": "MuiPaper-elevation3",
+ "elevation4": "MuiPaper-elevation4",
+ "elevation5": "MuiPaper-elevation5",
+ "elevation6": "MuiPaper-elevation6",
+ "elevation7": "MuiPaper-elevation7",
+ "elevation8": "MuiPaper-elevation8",
+ "elevation9": "MuiPaper-elevation9",
+ "outlined": "MuiPaper-outlined",
+ "root": "MuiPaper-root",
+ "rounded": "MuiPaper-rounded",
+ }
+ }
+ elevation={24}
+ role="dialog"
+ >
+ <div
+ aria-labelledby="accessibility-title"
+ className="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
+ role="dialog"
+ >
+ <div
+ id="accessibility-title"
+ >
+ feedback.accessibility.window_title
+ </div>
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="feedback.accessibility.button_close"
+ className="modal-paper-close-button"
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="feedback.accessibility.button_close"
+ className="modal-paper-close-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="feedback.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="feedback.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <button
+ aria-label="feedback.accessibility.button_close"
+ className="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <Icon
+ icon="test-file-stub"
+ size={16}
+ spin={false}
+ >
+ <Component
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <svg
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ <div
+ className="eg-init-modal"
+ >
+ <div
+ className="title text-20-bold"
+ >
+ ecogesture.initModal.title
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.initModal.text3
+ </div>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.initModal.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-profile-next rounded",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.initModal.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next rounded",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </ForwardRef(Paper)>
+ </WithStyles(ForwardRef(Paper))>
+ </div>
+ </Transition>
+ </ForwardRef(Fade)>
+ <div
+ data-test="sentinelEnd"
+ tabIndex={0}
+ />
+ </TrapFocus>
+ </div>
+ </Portal>
+ </ForwardRef(Portal)>
+ </ForwardRef(Modal)>
+ </ForwardRef(Dialog)>
+ </WithStyles(ForwardRef(Dialog))>
+</EcogestureLaunchFormModal>
+`;
diff --git a/src/components/EcogestureForm/__snapshots__/EquipmentIcon.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EquipmentIcon.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..bded38e56adb198ea87f56117e6db48cec16285f
--- /dev/null
+++ b/src/components/EcogestureForm/__snapshots__/EquipmentIcon.spec.tsx.snap
@@ -0,0 +1,42 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureFormSingleChoice component should be rendered correctly 1`] = `
+<EquipmentIcon
+ equipment="BOILER"
+ isChecked={false}
+>
+ <div
+ className=" equipment-icon-container"
+ >
+ <Icon
+ className="equipmentIcon "
+ icon=""
+ size={40}
+ spin={false}
+ >
+ <Component
+ className="equipmentIcon styles__icon___23x3R"
+ height={40}
+ style={Object {}}
+ width={40}
+ >
+ <svg
+ className="equipmentIcon styles__icon___23x3R"
+ height={40}
+ style={Object {}}
+ width={40}
+ >
+ <use
+ xlinkHref="#"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </div>
+ <div
+ className="text text-14-normal"
+ >
+ ecogesture_profile.equipments.boiler
+ </div>
+</EquipmentIcon>
+`;
diff --git a/src/components/EcogestureForm/ecogestureFormEquipment.scss b/src/components/EcogestureForm/ecogestureFormEquipment.scss
new file mode 100644
index 0000000000000000000000000000000000000000..43fb2428905e3fbb448b1a4ff157159086d16fdb
--- /dev/null
+++ b/src/components/EcogestureForm/ecogestureFormEquipment.scss
@@ -0,0 +1,56 @@
+@import 'src/styles/base/color';
+@import '../../styles/base/breakpoint';
+
+.equipment-form-container {
+ padding: 1.5rem;
+ color: $grey-bright;
+ .equipment-label {
+ @media (min-width: $width-large-phone) {
+ text-align: center;
+ }
+ }
+ .equipment-hint {
+ margin: 1rem 0;
+ @media (min-width: $width-large-phone) {
+ text-align: center;
+ }
+ }
+ .icons-container {
+ display: grid;
+ grid-template-columns: repeat(3, 1fr);
+ grid-template-rows: repeat(5, 1fr);
+ grid-column-gap: 32px;
+ grid-row-gap: 32px;
+ max-width: 400px;
+ margin: 1.5rem auto 3rem auto;
+ .checkbox-equipment {
+ cursor: pointer;
+ max-width: 80px;
+ text-align: center;
+ margin: 0 auto;
+ .text {
+ margin-top: 0.5rem;
+ text-align: center;
+ }
+ }
+ input.item-eq {
+ display: none;
+ }
+ .equipment-icon-container {
+ display: flex;
+ transition: all 200ms ease;
+ box-sizing: border-box;
+ flex-direction: column;
+ width: 80px;
+ height: 80px;
+ border-radius: 5px;
+ background-color: $grey-bright;
+ &.checked {
+ background-color: $gold-shadow;
+ }
+ .equipmentIcon {
+ margin: auto;
+ }
+ }
+ }
+}
diff --git a/src/components/EcogestureForm/ecogestureFormSingleChoice.scss b/src/components/EcogestureForm/ecogestureFormSingleChoice.scss
new file mode 100644
index 0000000000000000000000000000000000000000..7f02b12bb22de03604d9dc6415ffbf6fd43a7174
--- /dev/null
+++ b/src/components/EcogestureForm/ecogestureFormSingleChoice.scss
@@ -0,0 +1,24 @@
+@import '../../styles/base/color';
+@import '../../styles/base/breakpoint';
+
+.ecogesture-profile-container {
+ position: relative;
+ height: 100%;
+ min-height: inherit;
+ display: flex;
+ justify-content: center;
+ .ecogesture-form-single {
+ width: 100%;
+ max-width: 53rem;
+ color: #ffffff;
+ margin: 1rem 1rem 3.5rem;
+ color: $white;
+ margin: 1rem 1rem 3.5rem;
+ @media (min-width: $width-tablet) {
+ margin: 1rem 1rem 0;
+ }
+ label {
+ cursor: pointer;
+ }
+ }
+}
diff --git a/src/components/EcogestureForm/ecogestureFormView.scss b/src/components/EcogestureForm/ecogestureFormView.scss
new file mode 100644
index 0000000000000000000000000000000000000000..c63af75bea5ec2eba6291b8325a931889d3ebdad
--- /dev/null
+++ b/src/components/EcogestureForm/ecogestureFormView.scss
@@ -0,0 +1,12 @@
+@import 'src/styles/base/color';
+@import 'src/styles/base/breakpoint';
+
+.se-loader-container {
+ min-height: inherit;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ @media all and(min-width: $width-tablet) {
+ min-height: 80vh;
+ }
+}
diff --git a/src/components/EcogestureForm/ecogestureLaunchFormModal.scss b/src/components/EcogestureForm/ecogestureLaunchFormModal.scss
new file mode 100644
index 0000000000000000000000000000000000000000..c3e52eacfedfa0f7bf5c243b2e164dfaaadb8c9e
--- /dev/null
+++ b/src/components/EcogestureForm/ecogestureLaunchFormModal.scss
@@ -0,0 +1,16 @@
+@import '../../styles/base/color';
+
+.eg-init-modal {
+ color: $grey-bright;
+ margin: 1rem 0;
+ .title {
+ text-align: center;
+ color: $gold-shadow;
+ }
+ .text {
+ margin: 1rem 0;
+ }
+ button {
+ min-height: 45px;
+ }
+}
diff --git a/src/components/EcogestureSelection/EcogestureSelection.spec.tsx b/src/components/EcogestureSelection/EcogestureSelection.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..b35f91684674ab60d459358760efc27a96c4365c
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelection.spec.tsx
@@ -0,0 +1,120 @@
+/* eslint-disable react/display-name */
+import React from 'react'
+import { mount } from 'enzyme'
+import { Provider } from 'react-redux'
+import {
+ createMockStore,
+ mockInitialEcolyoState,
+} from '../../../tests/__mocks__/store'
+import EcogestureSelection from './EcogestureSelection'
+import toJson from 'enzyme-to-json'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+import mockClient from '../../../tests/__mocks__/client'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+jest.mock('cozy-client', () => {
+ return {
+ useClient: jest.fn(() => {
+ return mockClient
+ }),
+ }
+})
+const mockHistoryGoBack = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useLocation: () => {
+ return {
+ search: '',
+ }
+ },
+ useHistory: () => ({
+ push: mockHistoryGoBack,
+ }),
+}))
+const mockGetEcogestureListByProfile = jest.fn()
+jest.mock('services/ecogesture.service', () => {
+ return jest.fn(() => {
+ return {
+ getEcogestureListByProfile: mockGetEcogestureListByProfile,
+ }
+ })
+})
+
+jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
+jest.mock('components/Header/Header', () => 'mock-header')
+jest.mock('components/Content/Content', () => 'mock-content')
+jest.mock(
+ 'components/EcogestureSelection/EcogestureSelectionModal',
+ () => 'mock-ecogestureselectionmodal'
+)
+jest.mock(
+ 'components/EcogestureSelection/EcogestureSelectionDetail',
+ () => 'mock-ecogestureselectiondetail'
+)
+jest.mock(
+ 'components/EcogestureSelection/EcogestureSelectionRestart',
+ () => 'mock-ecogestureselectionrestart'
+)
+jest.mock(
+ 'components/EcogestureSelection/EcogestureSelectionEnd',
+ () => 'mock-ecogestureselectionend'
+)
+
+describe('EcogestureSelection component', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ let store: any
+ beforeEach(() => {
+ store = createMockStore(mockInitialEcolyoState)
+ mockGetEcogestureListByProfile.mockClear()
+ })
+
+ it('should be rendered correctly', async () => {
+ mockGetEcogestureListByProfile.mockResolvedValue([ecogesturesData[0]])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureSelection />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should render with the EcogestureSelectionModal', async () => {
+ mockGetEcogestureListByProfile.mockResolvedValue([ecogesturesData[0]])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureSelection />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(wrapper.find('mock-ecogestureselectionmodal').exists()).toBeTruthy()
+ })
+ it('should render with the EcogestureSelectionDetail', async () => {
+ mockGetEcogestureListByProfile.mockResolvedValue([ecogesturesData[0]])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureSelection />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(wrapper.find('mock-ecogestureselectiondetail').exists()).toBeTruthy()
+ })
+ it('should render with the EcogestureSelectionEnd', async () => {
+ mockGetEcogestureListByProfile.mockResolvedValue([])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureSelection />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(wrapper.find('mock-ecogestureselectionend').exists()).toBeTruthy()
+ })
+})
diff --git a/src/components/EcogestureSelection/EcogestureSelection.tsx b/src/components/EcogestureSelection/EcogestureSelection.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..41e0db5e6610a7101a6e46bc17eb02f8426cf2c2
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelection.tsx
@@ -0,0 +1,175 @@
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
+import './ecogestureSelection.scss'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import { useSelector } from 'react-redux'
+import { AppStore } from 'store'
+import { useClient } from 'cozy-client'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { Ecogesture } from 'models'
+import CozyBar from 'components/Header/CozyBar'
+import Header from 'components/Header/Header'
+import Content from 'components/Content/Content'
+import EcogestureService from 'services/ecogesture.service'
+import EcogestureSelectionModal from 'components/EcogestureSelection/EcogestureSelectionModal'
+import EcogestureSelectionDetail from 'components/EcogestureSelection/EcogestureSelectionDetail'
+import EcogestureSelectionRestart from 'components/EcogestureSelection/EcogestureSelectionRestart'
+import EcogestureSelectionEnd from 'components/EcogestureSelection/EcogestureSelectionEnd'
+import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
+import { FluidType } from 'enum/fluid.enum'
+
+const EcogestureSelection: React.FC = () => {
+ const { t } = useI18n()
+ const client = useClient()
+ 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 defineHeaderHeight = useCallback((height: number) => {
+ setHeaderHeight(height)
+ }, [])
+
+ const ecogestureService = useMemo(() => new EcogestureService(client), [
+ client,
+ ])
+ const profileEcogesture: ProfileEcogesture = useSelector(
+ (state: AppStore) => state.ecolyo.profileEcogesture
+ )
+
+ const getTitle = useCallback((): string => {
+ if (
+ indexEcogesture <= ecogestureList.length - 1 &&
+ ecogestureList[indexEcogesture]
+ ) {
+ return ecogestureList[indexEcogesture].shortName
+ }
+ return t('ecogesture_selection.header')
+ }, [ecogestureList, indexEcogesture, t])
+
+ 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)
+ setIndexEcogesture(prev => prev + 1)
+ },
+ [ecogestureList, ecogestureService, indexEcogesture]
+ )
+
+ const restartSelection = useCallback(async () => {
+ setIsLoading(true)
+ const availableList: Ecogesture[] = await ecogestureService.getEcogestureListByProfile(
+ profileEcogesture
+ )
+ const filteredList: Ecogesture[] = availableList.filter(
+ (ecogesture: Ecogesture) => ecogesture.viewedInSelection === false
+ )
+ const slicedFilteredList = filteredList.slice(0, 10)
+ setTotalViewed(availableList.length - filteredList.length)
+ setEcogestureList(slicedFilteredList)
+ setIndexEcogesture(0)
+ setIsLoading(false)
+ }, [ecogestureService, profileEcogesture])
+
+ 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 slicedFilteredList = filteredList.slice(0, 10)
+ if (subscribed) {
+ if (
+ availableList.length === filteredList.length &&
+ slicedFilteredList.length > 0
+ ) {
+ setOpenEcogestureSelectionModal(true)
+ }
+ setTotalAvailable(availableList.length)
+ setTotalViewed(availableList.length - filteredList.length)
+ setEcogestureList(slicedFilteredList)
+ setIndexEcogesture(0)
+ setIsLoading(false)
+ }
+ }
+ getFilteredList()
+ return () => {
+ subscribed = false
+ }
+ }, [ecogestureService, profileEcogesture])
+
+ if (isLoading) {
+ return (
+ <Content height={headerHeight}>
+ <div className="eg-selection-loader">
+ <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ </Content>
+ )
+ }
+
+ return (
+ <>
+ <CozyBar
+ titleKey={getTitle()}
+ isNotKey={true}
+ displayBackArrow={indexEcogesture === 0 ? false : true}
+ backFunction={() => setIndexEcogesture(prev => prev - 1)}
+ />
+ <Header
+ setHeaderHeight={defineHeaderHeight}
+ desktopTitleKey={getTitle()}
+ displayBackArrow={indexEcogesture === 0 ? false : true}
+ isNotKey={true}
+ backFunction={() => setIndexEcogesture(prev => prev - 1)}
+ >
+ <div className="eg-selection-header">
+ {indexEcogesture <= ecogestureList.length - 1
+ ? `${totalViewed + indexEcogesture + 1}/${totalViewed +
+ ecogestureList.length}`
+ : ''}
+ </div>
+ </Header>
+ <Content height={headerHeight}>
+ {indexEcogesture <= ecogestureList.length - 1 ? (
+ <EcogestureSelectionDetail
+ ecogesture={ecogestureList[indexEcogesture]}
+ validate={validateChoice}
+ />
+ ) : totalAvailable > totalViewed + ecogestureList.length ? (
+ <EcogestureSelectionRestart
+ listLength={ecogestureList.length}
+ restart={restartSelection}
+ />
+ ) : (
+ <EcogestureSelectionEnd />
+ )}
+ </Content>
+ {openEcogestureSelectionModal && (
+ <EcogestureSelectionModal
+ open={openEcogestureSelectionModal}
+ handleCloseClick={() => setOpenEcogestureSelectionModal(false)}
+ />
+ )}
+ </>
+ )
+}
+
+export default EcogestureSelection
diff --git a/src/components/EcogestureSelection/EcogestureSelectionDetail.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionDetail.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..73075d03ba3a7864e6656e41eb7440d061da4124
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionDetail.spec.tsx
@@ -0,0 +1,93 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import { Button } from '@material-ui/core'
+import EcogestureSelectionDetail from './EcogestureSelectionDetail'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockImportIconbyId = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ importIconbyId: jest.fn(() => {
+ return mockImportIconbyId
+ }),
+ }
+})
+const mockValidate = jest.fn()
+
+describe('EcogestureSelectionDetail component', () => {
+ beforeEach(() => {
+ mockImportIconbyId.mockClear()
+ mockValidate.mockClear()
+ })
+
+ it('should be rendered correctly', async () => {
+ mockImportIconbyId.mockReturnValueOnce('testIcon')
+ const wrapper = mount(
+ <EcogestureSelectionDetail
+ ecogesture={ecogesturesData[0]}
+ validate={mockValidate}
+ />
+ )
+ await waitForComponentToPaint(wrapper)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+
+ it('should call validate with objective to true', async () => {
+ mockImportIconbyId.mockReturnValueOnce('testIcon')
+ const wrapper = mount(
+ <EcogestureSelectionDetail
+ ecogesture={ecogesturesData[0]}
+ validate={mockValidate}
+ />
+ )
+ wrapper
+ .find(Button)
+ .at(0)
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+ expect(mockValidate).toHaveBeenCalledWith(true, false)
+ })
+
+ it('should call validate with doing to true', async () => {
+ mockImportIconbyId.mockReturnValueOnce('testIcon')
+ const wrapper = mount(
+ <EcogestureSelectionDetail
+ ecogesture={ecogesturesData[0]}
+ validate={mockValidate}
+ />
+ )
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+ expect(mockValidate).toHaveBeenCalledWith(false, true)
+ })
+
+ it('should call validate with objective and doing to false', async () => {
+ mockImportIconbyId.mockReturnValueOnce('testIcon')
+ const wrapper = mount(
+ <EcogestureSelectionDetail
+ ecogesture={ecogesturesData[0]}
+ validate={mockValidate}
+ />
+ )
+ wrapper
+ .find(Button)
+ .at(2)
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+ expect(mockValidate).toHaveBeenCalledWith(false, false)
+ })
+})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionDetail.tsx b/src/components/EcogestureSelection/EcogestureSelectionDetail.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..055a3402acc7a20affe9c2c2ec7d0ceebc8716c9
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionDetail.tsx
@@ -0,0 +1,88 @@
+import React, { useEffect, useState } from 'react'
+import './ecogestureSelectionDetail.scss'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import { Button } from '@material-ui/core'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { Ecogesture } from 'models'
+import objectiveIcon from 'assets/icons/ico/objective-enabled.svg'
+import doingIcon from 'assets/icons/ico/doing-enabled.svg'
+import skipIcon from 'assets/icons/ico/skip-enabled.svg'
+import defaultIcon from 'assets/icons/visu/ecogesture/default.svg'
+import { importIconbyId } from 'utils/utils'
+
+interface EcogestureSelectionDetailProps {
+ ecogesture: Ecogesture
+ validate: (objective: boolean, doing: boolean) => void
+}
+
+const EcogestureSelectionDetail: React.FC<EcogestureSelectionDetailProps> = ({
+ ecogesture,
+ validate,
+}: EcogestureSelectionDetailProps) => {
+ const { t } = useI18n()
+ const [ecogestureIcon, setEcogestureIcon] = useState<string>('')
+
+ useEffect(() => {
+ let subscribed = true
+ async function getIcon() {
+ const _icon = await importIconbyId(ecogesture.id, 'ecogesture')
+ if (subscribed) {
+ if (_icon) {
+ setEcogestureIcon(_icon)
+ } else {
+ setEcogestureIcon(defaultIcon)
+ }
+ }
+ }
+ getIcon()
+ return () => {
+ subscribed = false
+ }
+ }, [ecogesture.id])
+
+ return (
+ <div className="eg-selection-detail-container">
+ <div className="content">
+ <StyledIcon className="icon" icon={ecogestureIcon} size={240} />
+ <div className="text text-16-normal">{ecogesture.longName}</div>
+ </div>
+ <div className="buttons">
+ <Button
+ aria-label={t('ecogesture_selection.button_objective')}
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-14-bold',
+ }}
+ onClick={() => validate(true, false)}
+ >
+ <StyledIcon icon={objectiveIcon} size={60} />
+ {t('ecogesture_selection.button_objective')}
+ </Button>
+ <Button
+ aria-label={t('ecogesture_selection.button_doing')}
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-14-bold',
+ }}
+ onClick={() => validate(false, true)}
+ >
+ <StyledIcon icon={doingIcon} size={60} />
+ {t('ecogesture_selection.button_doing')}
+ </Button>
+ <Button
+ aria-label={t('ecogesture_selection.button_skip')}
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-14-bold',
+ }}
+ onClick={() => validate(false, false)}
+ >
+ <StyledIcon icon={skipIcon} size={60} />
+ {t('ecogesture_selection.button_skip')}
+ </Button>
+ </div>
+ </div>
+ )
+}
+
+export default EcogestureSelectionDetail
diff --git a/src/components/EcogestureSelection/EcogestureSelectionEnd.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionEnd.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..75cd2b7b020a6a578e5ca544c567e6601a57340f
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionEnd.spec.tsx
@@ -0,0 +1,39 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import EcogestureSelectionEnd from './EcogestureSelectionEnd'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+
+describe('EcogestureSelectionEnd component', () => {
+ beforeEach(() => {
+ mockHistoryPush.mockClear()
+ })
+
+ it('should be rendered correctly', () => {
+ const wrapper = mount(<EcogestureSelectionEnd />)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+
+ it('should close modal and update profile', () => {
+ const wrapper = mount(<EcogestureSelectionEnd />)
+ wrapper.find(Button).simulate('click')
+ expect(mockHistoryPush).toHaveBeenCalledWith('/ecogestures?tab=0')
+ })
+})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionEnd.tsx b/src/components/EcogestureSelection/EcogestureSelectionEnd.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..13a515bc70c3dda147ad62af835f1f2c7bc3418e
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionEnd.tsx
@@ -0,0 +1,46 @@
+import React, { useCallback } from 'react'
+import './ecogestureSelectionEnd.scss'
+import { useHistory } from 'react-router-dom'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import icon from 'assets/icons/visu/profileType/finish.svg'
+import { Button } from '@material-ui/core'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+
+const EcogestureSelectionEnd: React.FC = () => {
+ const { t } = useI18n()
+ const history = useHistory()
+
+ const goToObjectives = useCallback(() => {
+ history.push('/ecogestures?tab=0')
+ }, [history])
+ return (
+ <div className="eg-selection-end-container">
+ <div className="content">
+ <div className="title text-21-bold">
+ {t('ecogesture_selection.title_final')}
+ </div>
+ <StyledIcon icon={icon} size={120} />
+ <div className="text text-16-normal">
+ {t('ecogesture_selection.text_final_1')}
+ </div>
+ <div className="text text-16-normal">
+ {t('ecogesture_selection.text_final_2')}
+ </div>
+ </div>
+ <div className="buttons">
+ <Button
+ aria-label={t('ecogesture_selection.accessibility.button_ok')}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-16-bold',
+ }}
+ onClick={goToObjectives}
+ >
+ {t('ecogesture_selection.button_ok')}
+ </Button>
+ </div>
+ </div>
+ )
+}
+
+export default EcogestureSelectionEnd
diff --git a/src/components/EcogestureSelection/EcogestureSelectionModal.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionModal.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..27b1073dd4d645fca3bc29754fe5eaefdb03fda9
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionModal.spec.tsx
@@ -0,0 +1,39 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import EcogestureSelectionModal from './EcogestureSelectionModal'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+
+const mockHandleClose = jest.fn()
+describe('EcogestureInitModal component', () => {
+ it('should be rendered correctly', () => {
+ const wrapper = mount(
+ <EcogestureSelectionModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ />
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+
+ it('should close modal and update profile', async () => {
+ const wrapper = mount(
+ <EcogestureSelectionModal
+ open={true}
+ handleCloseClick={mockHandleClose}
+ />
+ )
+ wrapper.find(Button).simulate('click')
+ expect(mockHandleClose).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionModal.tsx b/src/components/EcogestureSelection/EcogestureSelectionModal.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..81990d9a416ef9422c4988835147792688ae8829
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionModal.tsx
@@ -0,0 +1,62 @@
+import React from 'react'
+import Dialog from '@material-ui/core/Dialog'
+import { Button, IconButton } from '@material-ui/core'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import CloseIcon from 'assets/icons/ico/close.svg'
+import './ecogestureSelectionModal.scss'
+
+interface EcogestureSelectionModalProps {
+ open: boolean
+ handleCloseClick: () => void
+}
+
+const EcogestureSelectionModal: React.FC<EcogestureSelectionModalProps> = ({
+ open,
+ handleCloseClick,
+}: EcogestureSelectionModalProps) => {
+ const { t } = useI18n()
+
+ return (
+ <Dialog
+ open={open}
+ onClose={handleCloseClick}
+ aria-labelledby={'accessibility-title'}
+ classes={{
+ root: 'modal-root',
+ paper: 'modal-paper',
+ }}
+ >
+ <div id={'accessibility-title'}>
+ {t('ecogesture_selection.accessibility.window_title')}
+ </div>
+ <IconButton
+ aria-label={t('ecogesture_selection.accessibility.button_close')}
+ className="modal-paper-close-button"
+ onClick={handleCloseClick}
+ >
+ <Icon icon={CloseIcon} size={16} />
+ </IconButton>
+ <div className="eg-selection-modal">
+ <div className="title text-20-bold">
+ {t('ecogesture_selection.selectionModal.title')}
+ </div>
+ <div className="text text-16-normal">
+ {t('ecogesture_selection.selectionModal.text')}
+ </div>
+ <Button
+ aria-label={t('ecogesture_selection.selectionModal.button_close')}
+ onClick={handleCloseClick}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture_selection.selectionModal.button_close')}
+ </Button>
+ </div>
+ </Dialog>
+ )
+}
+
+export default EcogestureSelectionModal
diff --git a/src/components/EcogestureSelection/EcogestureSelectionRestart.spec.tsx b/src/components/EcogestureSelection/EcogestureSelectionRestart.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..58b4685381bb323a08acf5c0f7511f03049e464d
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionRestart.spec.tsx
@@ -0,0 +1,59 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import EcogestureSelectionRestart from './EcogestureSelectionRestart'
+import { Button } from '@material-ui/core'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+const mockRestart = jest.fn()
+
+describe('EcogestureSelectionRestart component', () => {
+ beforeEach(() => {
+ mockHistoryPush.mockClear()
+ mockRestart.mockClear()
+ })
+
+ it('should be rendered correctly', () => {
+ const wrapper = mount(
+ <EcogestureSelectionRestart listLength={10} restart={mockRestart} />
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+
+ it('should call go to the ecogesture view when user click on the button', () => {
+ const wrapper = mount(
+ <EcogestureSelectionRestart listLength={10} restart={mockRestart} />
+ )
+ wrapper
+ .find(Button)
+ .at(0)
+ .simulate('click')
+ expect(mockHistoryPush).toHaveBeenCalledWith('/ecogestures?tab=0')
+ })
+
+ it('should call the restart when user click on the button', () => {
+ const wrapper = mount(
+ <EcogestureSelectionRestart listLength={10} restart={mockRestart} />
+ )
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ expect(mockRestart).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/src/components/EcogestureSelection/EcogestureSelectionRestart.tsx b/src/components/EcogestureSelection/EcogestureSelectionRestart.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..e8058004449d08f5219e4fe420a27bb70afaf2ef
--- /dev/null
+++ b/src/components/EcogestureSelection/EcogestureSelectionRestart.tsx
@@ -0,0 +1,67 @@
+import React, { useCallback } from 'react'
+import './ecogestureSelectionRestart.scss'
+import { useHistory } from 'react-router-dom'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import icon from 'assets/icons/visu/ecogesture/ECOGESTURE0001.svg'
+import { Button } from '@material-ui/core'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+
+interface EcogestureSelectionRestartProps {
+ listLength: number
+ restart: () => void
+}
+
+const EcogestureSelectionRestart: React.FC<EcogestureSelectionRestartProps> = ({
+ listLength,
+ restart,
+}: EcogestureSelectionRestartProps) => {
+ const { t } = useI18n()
+ const history = useHistory()
+
+ const goToObjectives = useCallback(() => {
+ history.push('/ecogestures?tab=0')
+ }, [history])
+
+ return (
+ <div className="eg-selection-restart-container">
+ <div className="content">
+ <div className="title text-21-bold">
+ {t('ecogesture_selection.title', {
+ // eslint-disable-next-line @typescript-eslint/camelcase
+ smart_count: listLength,
+ })}
+ </div>
+ <StyledIcon icon={icon} size={120} />
+ <div className="text text-16-normal">
+ {t('ecogesture_selection.text')}
+ </div>
+ </div>
+ <div className="buttons">
+ <Button
+ aria-label={t(
+ 'ecogesture_selection.accessibility.button_go_to_ecogesture'
+ )}
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-16-normal',
+ }}
+ onClick={goToObjectives}
+ >
+ {t('ecogesture_selection.button_go_to_ecogesture')}
+ </Button>
+ <Button
+ aria-label={t('ecogesture_selection.accessibility.button_continue')}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-16-bold',
+ }}
+ onClick={restart}
+ >
+ {t('ecogesture_selection.button_continue')}
+ </Button>
+ </div>
+ </div>
+ )
+}
+
+export default EcogestureSelectionRestart
diff --git a/src/components/EcogestureSelection/__snapshots__/EcogestureSelection.spec.tsx.snap b/src/components/EcogestureSelection/__snapshots__/EcogestureSelection.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..ff696014729bcae1956c5c2c931737879190cad4
--- /dev/null
+++ b/src/components/EcogestureSelection/__snapshots__/EcogestureSelection.spec.tsx.snap
@@ -0,0 +1,82 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureSelection component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureSelection>
+ <mock-cozybar
+ backFunction={[Function]}
+ displayBackArrow={false}
+ isNotKey={true}
+ titleKey="Bonhomme de neige"
+ />
+ <mock-header
+ backFunction={[Function]}
+ desktopTitleKey="Bonhomme de neige"
+ displayBackArrow={false}
+ isNotKey={true}
+ setHeaderHeight={[Function]}
+ >
+ <div
+ className="eg-selection-header"
+ >
+ 1/1
+ </div>
+ </mock-header>
+ <mock-content
+ height={0}
+ >
+ <mock-ecogestureselectiondetail
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ "viewedInSelection": false,
+ }
+ }
+ validate={[Function]}
+ />
+ </mock-content>
+ <mock-ecogestureselectionmodal
+ handleCloseClick={[Function]}
+ open={true}
+ />
+ </EcogestureSelection>
+</Provider>
+`;
diff --git a/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..04807f72f8a09f0e5297a783496455859fa7612a
--- /dev/null
+++ b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap
@@ -0,0 +1,583 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = `
+<EcogestureSelectionDetail
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ "viewedInSelection": false,
+ }
+ }
+ validate={[MockFunction]}
+>
+ <div
+ className="eg-selection-detail-container"
+ >
+ <div
+ className="content"
+ >
+ <StyledIcon
+ className="icon"
+ icon="testIcon"
+ size={240}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon"
+ icon="testIcon"
+ size={240}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon styles__icon___23x3R"
+ height={240}
+ style={Object {}}
+ width={240}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon styles__icon___23x3R"
+ height={240}
+ style={Object {}}
+ width={240}
+ >
+ <use
+ xlinkHref="#testIcon"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text text-16-normal"
+ >
+ Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.
+ </div>
+ </div>
+ <div
+ className="buttons"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.button_objective"
+ classes={
+ Object {
+ "label": "text-14-bold",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.button_objective"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-14-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.button_objective"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.button_objective"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.button_objective"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-14-bold"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={60}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={60}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={60}
+ style={Object {}}
+ width={60}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={60}
+ style={Object {}}
+ width={60}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ ecogesture_selection.button_objective
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.button_doing"
+ classes={
+ Object {
+ "label": "text-14-bold",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.button_doing"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-14-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.button_doing"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.button_doing"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.button_doing"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-14-bold"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={60}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={60}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={60}
+ style={Object {}}
+ width={60}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={60}
+ style={Object {}}
+ width={60}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ ecogesture_selection.button_doing
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.button_skip"
+ classes={
+ Object {
+ "label": "text-14-bold",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.button_skip"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-14-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.button_skip"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.button_skip"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.button_skip"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-14-bold"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={60}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={60}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={60}
+ style={Object {}}
+ width={60}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={60}
+ style={Object {}}
+ width={60}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ ecogesture_selection.button_skip
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+</EcogestureSelectionDetail>
+`;
diff --git a/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionEnd.spec.tsx.snap b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionEnd.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..1b1ea7fd1956ac4587e955680a8176b9071a0480
--- /dev/null
+++ b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionEnd.spec.tsx.snap
@@ -0,0 +1,197 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureSelectionEnd component should be rendered correctly 1`] = `
+<EcogestureSelectionEnd>
+ <div
+ className="eg-selection-end-container"
+ >
+ <div
+ className="content"
+ >
+ <div
+ className="title text-21-bold"
+ >
+ ecogesture_selection.title_final
+ </div>
+ <StyledIcon
+ icon="test-file-stub"
+ size={120}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={120}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={120}
+ style={Object {}}
+ width={120}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={120}
+ style={Object {}}
+ width={120}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text text-16-normal"
+ >
+ ecogesture_selection.text_final_1
+ </div>
+ <div
+ className="text text-16-normal"
+ >
+ ecogesture_selection.text_final_2
+ </div>
+ </div>
+ <div
+ className="buttons"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.accessibility.button_ok"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.accessibility.button_ok"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.accessibility.button_ok"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.accessibility.button_ok"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.accessibility.button_ok"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture_selection.button_ok
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+</EcogestureSelectionEnd>
+`;
diff --git a/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionModal.spec.tsx.snap b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionModal.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..233978637306bec8261505551c00c96c4fb22916
--- /dev/null
+++ b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionModal.spec.tsx.snap
@@ -0,0 +1,963 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureInitModal component should be rendered correctly 1`] = `
+<EcogestureSelectionModal
+ handleCloseClick={[MockFunction]}
+ open={true}
+>
+ <WithStyles(ForwardRef(Dialog))
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "paper": "modal-paper",
+ "root": "modal-root",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Dialog)
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "container": "MuiDialog-container",
+ "paper": "MuiDialog-paper modal-paper",
+ "paperFullScreen": "MuiDialog-paperFullScreen",
+ "paperFullWidth": "MuiDialog-paperFullWidth",
+ "paperScrollBody": "MuiDialog-paperScrollBody",
+ "paperScrollPaper": "MuiDialog-paperScrollPaper",
+ "paperWidthFalse": "MuiDialog-paperWidthFalse",
+ "paperWidthLg": "MuiDialog-paperWidthLg",
+ "paperWidthMd": "MuiDialog-paperWidthMd",
+ "paperWidthSm": "MuiDialog-paperWidthSm",
+ "paperWidthXl": "MuiDialog-paperWidthXl",
+ "paperWidthXs": "MuiDialog-paperWidthXs",
+ "root": "MuiDialog-root modal-root",
+ "scrollBody": "MuiDialog-scrollBody",
+ "scrollPaper": "MuiDialog-scrollPaper",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Modal)
+ BackdropComponent={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "Naked": Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "propTypes": Object {
+ "children": [Function],
+ "className": [Function],
+ "classes": [Function],
+ "invisible": [Function],
+ "open": [Function],
+ "transitionDuration": [Function],
+ },
+ "render": [Function],
+ },
+ "displayName": "WithStyles(ForwardRef(Backdrop))",
+ "options": Object {
+ "defaultTheme": Object {
+ "breakpoints": Object {
+ "between": [Function],
+ "down": [Function],
+ "keys": Array [
+ "xs",
+ "sm",
+ "md",
+ "lg",
+ "xl",
+ ],
+ "only": [Function],
+ "up": [Function],
+ "values": Object {
+ "lg": 1280,
+ "md": 960,
+ "sm": 600,
+ "xl": 1920,
+ "xs": 0,
+ },
+ "width": [Function],
+ },
+ "direction": "ltr",
+ "mixins": Object {
+ "gutters": [Function],
+ "toolbar": Object {
+ "@media (min-width:0px) and (orientation: landscape)": Object {
+ "minHeight": 48,
+ },
+ "@media (min-width:600px)": Object {
+ "minHeight": 64,
+ },
+ "minHeight": 56,
+ },
+ },
+ "overrides": Object {},
+ "palette": Object {
+ "action": Object {
+ "active": "rgba(0, 0, 0, 0.54)",
+ "disabled": "rgba(0, 0, 0, 0.26)",
+ "disabledBackground": "rgba(0, 0, 0, 0.12)",
+ "hover": "rgba(0, 0, 0, 0.08)",
+ "hoverOpacity": 0.08,
+ "selected": "rgba(0, 0, 0, 0.14)",
+ },
+ "augmentColor": [Function],
+ "background": Object {
+ "default": "#fafafa",
+ "paper": "#fff",
+ },
+ "common": Object {
+ "black": "#000",
+ "white": "#fff",
+ },
+ "contrastThreshold": 3,
+ "divider": "rgba(0, 0, 0, 0.12)",
+ "error": Object {
+ "contrastText": "#fff",
+ "dark": "#d32f2f",
+ "light": "#e57373",
+ "main": "#f44336",
+ },
+ "getContrastText": [Function],
+ "grey": Object {
+ "100": "#f5f5f5",
+ "200": "#eeeeee",
+ "300": "#e0e0e0",
+ "400": "#bdbdbd",
+ "50": "#fafafa",
+ "500": "#9e9e9e",
+ "600": "#757575",
+ "700": "#616161",
+ "800": "#424242",
+ "900": "#212121",
+ "A100": "#d5d5d5",
+ "A200": "#aaaaaa",
+ "A400": "#303030",
+ "A700": "#616161",
+ },
+ "info": Object {
+ "contrastText": "#fff",
+ "dark": "#1976d2",
+ "light": "#64b5f6",
+ "main": "#2196f3",
+ },
+ "primary": Object {
+ "contrastText": "#fff",
+ "dark": "#303f9f",
+ "light": "#7986cb",
+ "main": "#3f51b5",
+ },
+ "secondary": Object {
+ "contrastText": "#fff",
+ "dark": "#c51162",
+ "light": "#ff4081",
+ "main": "#f50057",
+ },
+ "success": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#388e3c",
+ "light": "#81c784",
+ "main": "#4caf50",
+ },
+ "text": Object {
+ "disabled": "rgba(0, 0, 0, 0.38)",
+ "hint": "rgba(0, 0, 0, 0.38)",
+ "primary": "rgba(0, 0, 0, 0.87)",
+ "secondary": "rgba(0, 0, 0, 0.54)",
+ },
+ "tonalOffset": 0.2,
+ "type": "light",
+ "warning": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#f57c00",
+ "light": "#ffb74d",
+ "main": "#ff9800",
+ },
+ },
+ "props": Object {},
+ "shadows": Array [
+ "none",
+ "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
+ "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
+ "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
+ "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+ "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+ "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+ "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+ "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+ "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+ "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+ "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+ "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+ "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+ "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+ "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+ "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+ "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+ "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+ ],
+ "shape": Object {
+ "borderRadius": 4,
+ },
+ "spacing": [Function],
+ "transitions": Object {
+ "create": [Function],
+ "duration": Object {
+ "complex": 375,
+ "enteringScreen": 225,
+ "leavingScreen": 195,
+ "short": 250,
+ "shorter": 200,
+ "shortest": 150,
+ "standard": 300,
+ },
+ "easing": Object {
+ "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+ "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+ "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+ "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+ },
+ "getAutoHeightDuration": [Function],
+ },
+ "typography": Object {
+ "body1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.5,
+ },
+ "body2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.01071em",
+ "lineHeight": 1.43,
+ },
+ "button": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.02857em",
+ "lineHeight": 1.75,
+ "textTransform": "uppercase",
+ },
+ "caption": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.03333em",
+ "lineHeight": 1.66,
+ },
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": 14,
+ "fontWeightBold": 700,
+ "fontWeightLight": 300,
+ "fontWeightMedium": 500,
+ "fontWeightRegular": 400,
+ "h1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "6rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.01562em",
+ "lineHeight": 1.167,
+ },
+ "h2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3.75rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.00833em",
+ "lineHeight": 1.2,
+ },
+ "h3": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.167,
+ },
+ "h4": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "2.125rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00735em",
+ "lineHeight": 1.235,
+ },
+ "h5": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.5rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.334,
+ },
+ "h6": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.25rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.0075em",
+ "lineHeight": 1.6,
+ },
+ "htmlFontSize": 16,
+ "overline": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.08333em",
+ "lineHeight": 2.66,
+ "textTransform": "uppercase",
+ },
+ "pxToRem": [Function],
+ "round": [Function],
+ "subtitle1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.75,
+ },
+ "subtitle2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.00714em",
+ "lineHeight": 1.57,
+ },
+ },
+ "zIndex": Object {
+ "appBar": 1100,
+ "drawer": 1200,
+ "mobileStepper": 1000,
+ "modal": 1300,
+ "snackbar": 1400,
+ "speedDial": 1050,
+ "tooltip": 1500,
+ },
+ },
+ "name": "MuiBackdrop",
+ },
+ "propTypes": Object {
+ "classes": [Function],
+ "innerRef": [Function],
+ },
+ "render": [Function],
+ "useStyles": [Function],
+ }
+ }
+ BackdropProps={
+ Object {
+ "transitionDuration": Object {
+ "enter": 225,
+ "exit": 195,
+ },
+ }
+ }
+ className="MuiDialog-root modal-root"
+ closeAfterTransition={true}
+ disableBackdropClick={false}
+ disableEscapeKeyDown={false}
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Portal)
+ disablePortal={false}
+ >
+ <Portal
+ containerInfo={
+ <body
+ style="padding-right: 0px; overflow: hidden;"
+ >
+ <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"
+ >
+ ecogesture_selection.accessibility.window_title
+ </div>
+ <button
+ aria-label="ecogesture_selection.accessibility.button_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="eg-selection-modal"
+ >
+ <div
+ class="title text-20-bold"
+ >
+ ecogesture_selection.selectionModal.title
+ </div>
+ <div
+ class="text text-16-normal"
+ >
+ ecogesture_selection.selectionModal.text
+ </div>
+ <button
+ aria-label="ecogesture_selection.selectionModal.button_close"
+ class="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label text-16-bold"
+ >
+ ecogesture_selection.selectionModal.button_close
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ </div>
+ </div>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+ </body>
+ }
+ >
+ <div
+ className="MuiDialog-root modal-root"
+ onKeyDown={[Function]}
+ role="presentation"
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "fixed",
+ "right": 0,
+ "top": 0,
+ "zIndex": 1300,
+ }
+ }
+ >
+ <WithStyles(ForwardRef(Backdrop))
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Backdrop)
+ classes={
+ Object {
+ "invisible": "MuiBackdrop-invisible",
+ "root": "MuiBackdrop-root",
+ }
+ }
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Fade)
+ in={true}
+ onClick={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onClick={[Function]}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ aria-hidden={true}
+ className="MuiBackdrop-root"
+ onClick={[Function]}
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ />
+ </Transition>
+ </ForwardRef(Fade)>
+ </ForwardRef(Backdrop)>
+ </WithStyles(ForwardRef(Backdrop))>
+ <TrapFocus
+ disableAutoFocus={false}
+ disableEnforceFocus={false}
+ disableRestoreFocus={false}
+ getDoc={[Function]}
+ isEnabled={[Function]}
+ open={true}
+ >
+ <div
+ data-test="sentinelStart"
+ tabIndex={0}
+ />
+ <ForwardRef(Fade)
+ appear={true}
+ in={true}
+ onEnter={[Function]}
+ onExited={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ className="MuiDialog-container MuiDialog-scrollPaper"
+ onClick={[Function]}
+ onMouseDown={[Function]}
+ role="none presentation"
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ tabIndex="-1"
+ >
+ <WithStyles(ForwardRef(Paper))
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ elevation={24}
+ role="dialog"
+ >
+ <ForwardRef(Paper)
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ classes={
+ Object {
+ "elevation0": "MuiPaper-elevation0",
+ "elevation1": "MuiPaper-elevation1",
+ "elevation10": "MuiPaper-elevation10",
+ "elevation11": "MuiPaper-elevation11",
+ "elevation12": "MuiPaper-elevation12",
+ "elevation13": "MuiPaper-elevation13",
+ "elevation14": "MuiPaper-elevation14",
+ "elevation15": "MuiPaper-elevation15",
+ "elevation16": "MuiPaper-elevation16",
+ "elevation17": "MuiPaper-elevation17",
+ "elevation18": "MuiPaper-elevation18",
+ "elevation19": "MuiPaper-elevation19",
+ "elevation2": "MuiPaper-elevation2",
+ "elevation20": "MuiPaper-elevation20",
+ "elevation21": "MuiPaper-elevation21",
+ "elevation22": "MuiPaper-elevation22",
+ "elevation23": "MuiPaper-elevation23",
+ "elevation24": "MuiPaper-elevation24",
+ "elevation3": "MuiPaper-elevation3",
+ "elevation4": "MuiPaper-elevation4",
+ "elevation5": "MuiPaper-elevation5",
+ "elevation6": "MuiPaper-elevation6",
+ "elevation7": "MuiPaper-elevation7",
+ "elevation8": "MuiPaper-elevation8",
+ "elevation9": "MuiPaper-elevation9",
+ "outlined": "MuiPaper-outlined",
+ "root": "MuiPaper-root",
+ "rounded": "MuiPaper-rounded",
+ }
+ }
+ elevation={24}
+ role="dialog"
+ >
+ <div
+ aria-labelledby="accessibility-title"
+ className="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
+ role="dialog"
+ >
+ <div
+ id="accessibility-title"
+ >
+ ecogesture_selection.accessibility.window_title
+ </div>
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="ecogesture_selection.accessibility.button_close"
+ className="modal-paper-close-button"
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="ecogesture_selection.accessibility.button_close"
+ className="modal-paper-close-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <button
+ aria-label="ecogesture_selection.accessibility.button_close"
+ className="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <Icon
+ icon="test-file-stub"
+ size={16}
+ spin={false}
+ >
+ <Component
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <svg
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ <div
+ className="eg-selection-modal"
+ >
+ <div
+ className="title text-20-bold"
+ >
+ ecogesture_selection.selectionModal.title
+ </div>
+ <div
+ className="text text-16-normal"
+ >
+ ecogesture_selection.selectionModal.text
+ </div>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.selectionModal.button_close"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.selectionModal.button_close"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.selectionModal.button_close"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.selectionModal.button_close"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.selectionModal.button_close"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture_selection.selectionModal.button_close
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </ForwardRef(Paper)>
+ </WithStyles(ForwardRef(Paper))>
+ </div>
+ </Transition>
+ </ForwardRef(Fade)>
+ <div
+ data-test="sentinelEnd"
+ tabIndex={0}
+ />
+ </TrapFocus>
+ </div>
+ </Portal>
+ </ForwardRef(Portal)>
+ </ForwardRef(Modal)>
+ </ForwardRef(Dialog)>
+ </WithStyles(ForwardRef(Dialog))>
+</EcogestureSelectionModal>
+`;
diff --git a/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionRestart.spec.tsx.snap b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionRestart.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..0dc2cff5a3fb8d1819f7d58b0d4b6f43d61a4d92
--- /dev/null
+++ b/src/components/EcogestureSelection/__snapshots__/EcogestureSelectionRestart.spec.tsx.snap
@@ -0,0 +1,328 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureSelectionRestart component should be rendered correctly 1`] = `
+<EcogestureSelectionRestart
+ listLength={10}
+ restart={[MockFunction]}
+>
+ <div
+ className="eg-selection-restart-container"
+ >
+ <div
+ className="content"
+ >
+ <div
+ className="title text-21-bold"
+ >
+ ecogesture_selection.title
+ </div>
+ <StyledIcon
+ icon="test-file-stub"
+ size={120}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={120}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={120}
+ style={Object {}}
+ width={120}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={120}
+ style={Object {}}
+ width={120}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text text-16-normal"
+ >
+ ecogesture_selection.text
+ </div>
+ </div>
+ <div
+ className="buttons"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.accessibility.button_go_to_ecogesture"
+ classes={
+ Object {
+ "label": "text-16-normal",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.accessibility.button_go_to_ecogesture"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.accessibility.button_go_to_ecogesture"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.accessibility.button_go_to_ecogesture"
+ className="MuiButton-root btn-secondary-negative MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.accessibility.button_go_to_ecogesture"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-normal"
+ >
+ ecogesture_selection.button_go_to_ecogesture
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture_selection.accessibility.button_continue"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture_selection.accessibility.button_continue"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture_selection.accessibility.button_continue"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture_selection.accessibility.button_continue"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture_selection.accessibility.button_continue"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture_selection.button_continue
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+</EcogestureSelectionRestart>
+`;
diff --git a/src/components/EcogestureSelection/ecogestureSelection.scss b/src/components/EcogestureSelection/ecogestureSelection.scss
new file mode 100644
index 0000000000000000000000000000000000000000..128410d01da72b40f7d06c50bffbcf9e58ee2dde
--- /dev/null
+++ b/src/components/EcogestureSelection/ecogestureSelection.scss
@@ -0,0 +1,19 @@
+@import '../../styles/base/color';
+@import '../../styles/base/breakpoint';
+
+.eg-selection-loader {
+ min-height: inherit;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ @media all and(min-width: $width-tablet) {
+ min-height: 80vh;
+ }
+}
+
+.eg-selection-header {
+ color: $grey-bright;
+ text-align: center;
+ margin-top: -1rem;
+ margin-bottom: 1rem;
+}
diff --git a/src/components/EcogestureSelection/ecogestureSelectionDetail.scss b/src/components/EcogestureSelection/ecogestureSelectionDetail.scss
new file mode 100644
index 0000000000000000000000000000000000000000..db61bfa253cdd25701e539fd2863ae849e296265
--- /dev/null
+++ b/src/components/EcogestureSelection/ecogestureSelectionDetail.scss
@@ -0,0 +1,59 @@
+@import '../../styles/base/color';
+@import '../../styles/base/breakpoint';
+
+.eg-selection-detail-container {
+ position: relative;
+ min-height: inherit;
+ margin: auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ color: $grey-bright;
+ max-width: 45.75rem;
+ @media #{$large-phone} {
+ margin: 0 1rem;
+ max-width: unset;
+ }
+ .content {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+ justify-content: center;
+ align-items: center;
+ .icon {
+ margin: 5rem 0 0;
+ @media #{$large-phone} {
+ margin: 1rem 0 0;
+ }
+ }
+ .text {
+ min-height: 4.875rem;
+ display: flex;
+ align-items: center;
+ margin: 0 1rem;
+ }
+ }
+ .buttons {
+ margin: 1rem 0;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ width: 100%;
+ button.btn-secondary-negative {
+ padding: 0.75rem 0.25rem;
+ margin: 0 0.25rem;
+ height: 7.375rem;
+ width: 6.5rem;
+ border-radius: 0.25rem;
+ &:focus {
+ background: transparent;
+ }
+ span {
+ flex-direction: column;
+ color: $grey-bright;
+ }
+ }
+ }
+}
diff --git a/src/components/EcogestureSelection/ecogestureSelectionEnd.scss b/src/components/EcogestureSelection/ecogestureSelectionEnd.scss
new file mode 100644
index 0000000000000000000000000000000000000000..1d9d3315659a459553e3761f34ac572c1d4f64b4
--- /dev/null
+++ b/src/components/EcogestureSelection/ecogestureSelectionEnd.scss
@@ -0,0 +1,48 @@
+@import '../../styles/base/color';
+@import '../../styles/base/breakpoint';
+
+.eg-selection-end-container {
+ position: relative;
+ min-height: inherit;
+ margin: auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ color: $grey-bright;
+ max-width: 45.75rem;
+ @media #{$large-phone} {
+ margin: 0 1rem;
+ max-width: unset;
+ }
+ .content {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+ justify-content: center;
+ align-items: center;
+ .title {
+ color: $gold-shadow;
+ margin: 1rem;
+ @media all and(min-width: $width-tablet) {
+ margin: 5rem;
+ }
+ }
+ .text {
+ margin-top: 1rem;
+ }
+ }
+ .buttons {
+ margin: 1rem 0;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ width: 100%;
+ button.btn-highlight {
+ padding: 0.75rem 0.5rem;
+ margin: 0 0.5rem;
+ max-width: 25rem;
+ }
+ }
+}
diff --git a/src/components/EcogestureSelection/ecogestureSelectionModal.scss b/src/components/EcogestureSelection/ecogestureSelectionModal.scss
new file mode 100644
index 0000000000000000000000000000000000000000..99a08d67a118b774f5573f524763b6b34c06f7a2
--- /dev/null
+++ b/src/components/EcogestureSelection/ecogestureSelectionModal.scss
@@ -0,0 +1,19 @@
+@import '../../styles/base/color';
+
+.eg-selection-modal {
+ color: $grey-bright;
+ margin: 1rem 0;
+ text-align: center;
+ display: flex;
+ flex-direction: column;
+ .title {
+ margin: 1rem 0;
+ color: $gold-shadow;
+ }
+ .text {
+ margin: 1rem 0;
+ }
+ button.btn-highlight {
+ padding: 0.75rem 0.5rem;
+ }
+}
diff --git a/src/components/EcogestureSelection/ecogestureSelectionRestart.scss b/src/components/EcogestureSelection/ecogestureSelectionRestart.scss
new file mode 100644
index 0000000000000000000000000000000000000000..08c2885b01e7b35bcdb1d02bd7da499631e44a65
--- /dev/null
+++ b/src/components/EcogestureSelection/ecogestureSelectionRestart.scss
@@ -0,0 +1,51 @@
+@import '../../styles/base/color';
+@import '../../styles/base/breakpoint';
+
+.eg-selection-restart-container {
+ position: relative;
+ min-height: inherit;
+ margin: auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ color: $grey-bright;
+ max-width: 45.75rem;
+ @media #{$large-phone} {
+ margin: 0 1rem;
+ max-width: unset;
+ }
+ .content {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+ justify-content: center;
+ align-items: center;
+ .title {
+ color: $gold-shadow;
+ margin: 1rem;
+ @media all and(min-width: $width-tablet) {
+ margin: 5rem;
+ }
+ }
+ .text {
+ margin-top: 3.25rem;
+ }
+ }
+ .buttons {
+ margin: 1rem 0;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ width: 100%;
+ button.btn-secondary-negative {
+ padding: 0.75rem 0.5rem;
+ margin: 0 0.25rem;
+ }
+ button.btn-highlight {
+ padding: 0.75rem 0.5rem;
+ margin: 0 0.5rem;
+ }
+ }
+}
diff --git a/src/components/FAQ/FAQData.spec.tsx b/src/components/FAQ/FAQData.spec.tsx
index ce8cdd348db6715c4c49c5a975763265178cdcf1..dcdd2188d461c5570effe7b0b9da677608b74cc0 100644
--- a/src/components/FAQ/FAQData.spec.tsx
+++ b/src/components/FAQ/FAQData.spec.tsx
@@ -1,6 +1,6 @@
import mockClient from '../../../tests/__mocks__/client'
import FaqData from 'components/FAQ/FAQData'
-import { allFluidPrices } from '../../../tests/__mocks__/fluidPrice.mock'
+import { allLastFluidPrices } from '../../../tests/__mocks__/fluidPrice.mock'
import { FAQSection } from 'models'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
@@ -28,7 +28,7 @@ describe('FAQData', () => {
})
it('should return', async () => {
- mockGetAllLastPrices.mockResolvedValue(allFluidPrices)
+ mockGetAllLastPrices.mockResolvedValue(allLastFluidPrices)
const result: FAQSection[] = await FaqData(mockClient)
expect(result.length).toBe(3)
})
diff --git a/src/components/FAQ/FAQData.tsx b/src/components/FAQ/FAQData.tsx
index fb1851863819349f3adf64d355cc5d018d0bc352..ff4fa0c0e4c9ab07009af233bc598ea10cbba256 100644
--- a/src/components/FAQ/FAQData.tsx
+++ b/src/components/FAQ/FAQData.tsx
@@ -277,7 +277,7 @@ const FaqData = async (client: Client): Promise<FAQSection[]> => {
},
{
summary:
- 'Pourquoi dois-je renseigner mon profil dans la service ? Comment le modifier ? ',
+ 'Pourquoi dois-je renseigner mon profil dans le service ? Comment le modifier ? ',
details: (
<div>
Renseigner votre profil c'est profiter à la fois d'une comparaison
diff --git a/src/components/Header/CozyBar.tsx b/src/components/Header/CozyBar.tsx
index cfa24d38dca8edf58d4d6d04a9af1f00c398ef28..7f56b78d90ef4459a20e12eafad6d49dcddaccb1 100644
--- a/src/components/Header/CozyBar.tsx
+++ b/src/components/Header/CozyBar.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useCallback } from 'react'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import { useSelector, useDispatch } from 'react-redux'
import { AppStore } from 'store'
@@ -17,12 +17,16 @@ interface CozyBarProps {
titleKey?: string
displayBackArrow?: boolean
isBuilding?: boolean
+ isNotKey?: boolean
+ backFunction?: () => void
}
const CozyBar = ({
titleKey = 'common.title_app',
displayBackArrow = false,
isBuilding,
+ isNotKey,
+ backFunction,
}: CozyBarProps) => {
const { t } = useI18n()
const history = useHistory()
@@ -30,9 +34,13 @@ const CozyBar = ({
const { BarLeft, BarCenter, BarRight } = cozy.bar
const { screenType } = useSelector((state: AppStore) => state.ecolyo.global)
- const handleClickBack = () => {
- history.goBack()
- }
+ const handleClickBack = useCallback(() => {
+ if (backFunction) {
+ backFunction()
+ } else {
+ history.goBack()
+ }
+ }, [backFunction, history])
const handleClickFeedbacks = () => {
dispatch(updateModalIsFeedbacksOpen(true))
@@ -57,11 +65,15 @@ const CozyBar = ({
{isBuilding ? (
<>
<Icon icon={HammerLeft} size={17} />
- <span className="app-title isBuilding">{t(titleKey)}</span>
+ <span className="app-title isBuilding">
+ {isNotKey ? titleKey : t(titleKey)}
+ </span>
<Icon icon={HammerRight} size={17} />
</>
) : (
- <span className="app-title">{t(titleKey)}</span>
+ <span className="app-title">
+ {isNotKey ? titleKey : t(titleKey)}
+ </span>
)}
</div>
</BarCenter>
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index b8ea60d70de0d180bd59ed48e142b0eab31967d2..d3045cc0f2c6ed573e0c156b368eaf7d2f7c23a7 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -14,6 +14,7 @@ import BackArrowIcon from 'assets/icons/ico/back-arrow.svg'
import FeedbacksIcon from 'assets/icons/ico/feedbacks.svg'
import HammerLeft from 'assets/icons/ico/hammer-left.svg'
import HammerRight from 'assets/icons/ico/hammer-right.svg'
+import { EcogestureStatus } from 'enum/ecogesture.enum'
interface HeaderProps {
textKey?: string
@@ -22,6 +23,8 @@ interface HeaderProps {
children?: React.ReactNode
setHeaderHeight(height: number): void
isBuilding?: boolean
+ isNotKey?: boolean
+ backFunction?: () => void
}
const Header: React.FC<HeaderProps> = ({
@@ -31,6 +34,8 @@ const Header: React.FC<HeaderProps> = ({
children,
setHeaderHeight,
isBuilding,
+ isNotKey,
+ backFunction,
}: HeaderProps) => {
const { t } = useI18n()
const history = useHistory()
@@ -39,11 +44,14 @@ const Header: React.FC<HeaderProps> = ({
const { screenType } = useSelector((state: AppStore) => state.ecolyo.global)
const cozyBarHeight = 48
- const headerBottomHeight = 8
const handleClickBack = useCallback(() => {
- history.goBack()
- }, [history])
+ if (backFunction) {
+ backFunction()
+ } else {
+ history.goBack()
+ }
+ }, [backFunction, history])
const handleClickFeedbacks = () => {
dispatch(updateModalIsFeedbacksOpen(true))
@@ -52,14 +60,10 @@ const Header: React.FC<HeaderProps> = ({
useEffect(() => {
if (screenType === ScreenType.MOBILE) {
setHeaderHeight(
- header.current
- ? header.current.clientHeight - cozyBarHeight - headerBottomHeight
- : 0
+ header.current ? header.current.clientHeight - cozyBarHeight : 0
)
} else {
- setHeaderHeight(
- header.current ? header.current.clientHeight - headerBottomHeight : 0
- )
+ setHeaderHeight(header.current ? header.current.clientHeight : 0)
}
}, [screenType, children, setHeaderHeight])
@@ -82,7 +86,7 @@ const Header: React.FC<HeaderProps> = ({
: 'text-22-bold'
}`}
>
- {t(textKey)}
+ {isNotKey ? textKey : t(textKey)}
</div>
)}
{desktopTitleKey && (
@@ -112,7 +116,7 @@ const Header: React.FC<HeaderProps> = ({
</div>
</>
) : (
- <span>{t(desktopTitleKey)}</span>
+ <span>{isNotKey ? desktopTitleKey : t(desktopTitleKey)}</span>
)}
</div>
)}
diff --git a/src/components/Home/ConsumptionView.tsx b/src/components/Home/ConsumptionView.tsx
index d6eeda1ce63c5eb362dbc372df81036b3d4e779d..165429fad00f3124df713a9b68923c91f4f8083e 100644
--- a/src/components/Home/ConsumptionView.tsx
+++ b/src/components/Home/ConsumptionView.tsx
@@ -53,13 +53,14 @@ const ConsumptionView: React.FC<ConsumptionViewProps> = ({
const updatekey =
fluidType !== FluidType.MULTIFLUID && fluidStatus[fluidType].lastDataDate
- ? `${fluidStatus[fluidType].lastDataDate!.toLocaleString()} + ${
- fluidStatus[fluidType].status
- }`
+ ? `${fluidStatus[
+ fluidType
+ ].lastDataDate!.toLocaleString()} + ${fluidStatus[fluidType].status +
+ fluidType}`
: ''
const lastDataDateKey =
fluidType !== FluidType.MULTIFLUID && fluidStatus[fluidType].lastDataDate
- ? fluidStatus[fluidType].lastDataDate!.toLocaleString()
+ ? `${fluidStatus[fluidType].lastDataDate!.toLocaleString() + fluidType}`
: ''
const defineHeaderHeight = useCallback((height: number) => {
diff --git a/src/components/Options/ReportOptions.tsx b/src/components/Options/ReportOptions.tsx
index 8edbc8c243fcda808d79a5b95c90a4cb753f85d8..2fa99ed47c733088ed18f59fd51a57ccd14b6322 100644
--- a/src/components/Options/ReportOptions.tsx
+++ b/src/components/Options/ReportOptions.tsx
@@ -54,12 +54,6 @@ const ReportOptions: React.FC = () => {
useEffect(() => {
let subscribed = true
- if (
- profile.sendConsumptionAlert &&
- profile.waterDailyConsumptionLimit === 0
- ) {
- updateProfileAlert(false)
- }
async function getMaxLoadData() {
const timePeriod: TimePeriod = {
startDate: DateTime.now()
diff --git a/src/components/PerformanceIndicator/FluidPerformanceIndicator.tsx b/src/components/PerformanceIndicator/FluidPerformanceIndicator.tsx
index 151d62d292723609c1ee1843963ea6a4cdb3b4c4..a331d9ddb2998c86e383a66746d4e493ec27d8d2 100644
--- a/src/components/PerformanceIndicator/FluidPerformanceIndicator.tsx
+++ b/src/components/PerformanceIndicator/FluidPerformanceIndicator.tsx
@@ -22,11 +22,10 @@ const FluidPerformanceIndicator: React.FC<FluidPerformanceIndicatorProps> = ({
}: FluidPerformanceIndicatorProps) => {
const { t } = useI18n()
const iconType = getPicto(fluidType)
- let displayedValue: string
- if (performanceIndicator && performanceIndicator.value)
+ let displayedValue = '----'
+ if (performanceIndicator && performanceIndicator.value) {
displayedValue = formatNumberValues(performanceIndicator.value).toString()
- else displayedValue = '-----'
-
+ }
return (
<div className="card">
<div className="fpi">
@@ -38,40 +37,52 @@ const FluidPerformanceIndicator: React.FC<FluidPerformanceIndicatorProps> = ({
size={50}
/>
<div className="fpi-content-perf">
- <div className="fpi-content-perf-result card-result">
- <span>{displayedValue}</span>
- <span className="card-indicator">
- {t('FLUID.' + FluidType[fluidType] + '.UNIT')}
- </span>
- <span className={`euro-value month`}>
- <span
- className={`${
- performanceIndicator &&
- performanceIndicator.percentageVariation &&
- performanceIndicator.percentageVariation > 0
- ? 'negative'
- : 'positive'
- }`}
- >
- {performanceIndicator &&
- performanceIndicator.percentageVariation ? (
- performanceIndicator.percentageVariation > 0 ? (
- `-${formatNumberValues(
- performanceIndicator.percentageVariation * 100
- )} %`
+ {!performanceIndicator.value ? (
+ <div className="fpi-content-perf-no-data card-result">
+ <span>{t('performance_indicator.fpi.no_data')}</span>
+ </div>
+ ) : (
+ <div className="fpi-content-perf-result card-result">
+ <span>{displayedValue}</span>
+ <span className="card-indicator">
+ {t('FLUID.' + FluidType[fluidType] + '.UNIT')}
+ </span>
+ <span className={`euro-value month`}>
+ {/* condition pas de comparaison possible */}
+ <span
+ className={`${
+ performanceIndicator &&
+ performanceIndicator.percentageVariation &&
+ performanceIndicator.percentageVariation > 0
+ ? 'negative'
+ : 'positive'
+ }`}
+ >
+ {performanceIndicator &&
+ performanceIndicator.percentageVariation ? (
+ performanceIndicator.percentageVariation > 0 ? (
+ `-${formatNumberValues(
+ performanceIndicator.percentageVariation * 100
+ )} %`
+ ) : (
+ `+${formatNumberValues(
+ Math.abs(performanceIndicator.percentageVariation) *
+ 100
+ )} %`
+ )
) : (
- `+${formatNumberValues(
- Math.abs(performanceIndicator.percentageVariation) *
- 100
- )} %`
- )
- ) : (
- <></>
- )}
+ <>
+ <span className="no-comparison">
+ {t('performance_indicator.fpi.no_comparison')}
+ </span>
+ </>
+ )}
+ </span>
+ {performanceIndicator.percentageVariation &&
+ `/ ${getPreviousMonthName(date.minus({ month: 1 }))}`}
</span>
- {`/ ${getPreviousMonthName(date.minus({ month: 1 }))}`}
- </span>
- </div>
+ </div>
+ )}
</div>
</div>
</div>
diff --git a/src/components/PerformanceIndicator/fluidPerformanceIndicator.scss b/src/components/PerformanceIndicator/fluidPerformanceIndicator.scss
index 69f2f9029a9b9ddce005a15f86ba4c97d475d7a8..78ab7d1948014491e71b66d9e1f8ef3c1552e58e 100644
--- a/src/components/PerformanceIndicator/fluidPerformanceIndicator.scss
+++ b/src/components/PerformanceIndicator/fluidPerformanceIndicator.scss
@@ -136,6 +136,19 @@
.WATER-color {
color: $water-color;
}
+ .no-comparison {
+ color: $soft-grey;
+ }
+ }
+ .fpi-content-perf-no-data {
+ color: $grey-bright;
+ & span {
+ display: inline-block;
+ padding-right: 0.25rem;
+ font-size: 1.1rem;
+ display: block;
+ font-weight: 400;
+ }
}
}
}
diff --git a/src/components/ProfileType/ProfileTypeNavigation.spec.tsx b/src/components/ProfileType/FormNavigation.spec.tsx
similarity index 90%
rename from src/components/ProfileType/ProfileTypeNavigation.spec.tsx
rename to src/components/ProfileType/FormNavigation.spec.tsx
index 601d53936fda544d0382e5bb10a2a8a3e96c1bdf..01d0dc8bb12c8685352e454582c43be99528148f 100644
--- a/src/components/ProfileType/ProfileTypeNavigation.spec.tsx
+++ b/src/components/ProfileType/FormNavigation.spec.tsx
@@ -6,7 +6,7 @@ import {
createMockStore,
mockInitialEcolyoState,
} from '../../../tests/__mocks__/store'
-import ProfileTypeNavigation from './ProfileTypeNavigation'
+import FormNavigation from './FormNavigation'
import { ProfileTypeStepForm } from 'enum/profileType.enum'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
@@ -19,7 +19,7 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}
})
-describe('ProfileTypeNavigation component', () => {
+describe('FormNavigation component', () => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let store: any
beforeEach(() => {
@@ -31,7 +31,7 @@ describe('ProfileTypeNavigation component', () => {
const mockhandleNext = jest.fn()
const wrapper = mount(
<Provider store={store}>
- <ProfileTypeNavigation
+ <FormNavigation
step={ProfileTypeStepForm.COOKING_FLUID}
handlePrevious={mockhandlePrevious}
handleNext={mockhandleNext}
diff --git a/src/components/ProfileType/ProfileTypeNavigation.tsx b/src/components/ProfileType/FormNavigation.tsx
similarity index 70%
rename from src/components/ProfileType/ProfileTypeNavigation.tsx
rename to src/components/ProfileType/FormNavigation.tsx
index d7011eedebcacdb47ffe2520a40583ed25766c7d..07e9097a1c8adbb85c42d8ea0b8d9c3a2afc4b02 100644
--- a/src/components/ProfileType/ProfileTypeNavigation.tsx
+++ b/src/components/ProfileType/FormNavigation.tsx
@@ -1,23 +1,26 @@
import React from 'react'
-import 'components/ProfileType/profileTypeNavigation.scss'
+import 'components/ProfileType/formNavigation.scss'
import classNames from 'classnames'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Button from '@material-ui/core/Button'
import { ProfileTypeStepForm } from 'enum/profileType.enum'
+import { EcogestureStepForm } from 'enum/ecogestureForm.enum'
-interface ProfileTypeNavigationProps {
- step: ProfileTypeStepForm
+interface FormNavigationProps {
+ step: ProfileTypeStepForm | EcogestureStepForm
handlePrevious: Function
handleNext: Function
disableNextButton: boolean
+ isEcogesture?: boolean
}
-const ProfileTypeNavigation: React.FC<ProfileTypeNavigationProps> = ({
+const FormNavigation: React.FC<FormNavigationProps> = ({
step,
handlePrevious,
handleNext,
disableNextButton,
-}: ProfileTypeNavigationProps) => {
+ isEcogesture,
+}: FormNavigationProps) => {
const { t } = useI18n()
const handlePreviousClick = () => {
@@ -43,7 +46,8 @@ const ProfileTypeNavigation: React.FC<ProfileTypeNavigationProps> = ({
</Button>
<Button
aria-label={
- step === ProfileTypeStepForm.UPDATE_DATE
+ step === ProfileTypeStepForm.UPDATE_DATE ||
+ (step === EcogestureStepForm.EQUIPMENTS && isEcogesture)
? t('profile_type.accessibility.button_end')
: t('profile_type.accessibility.button_next')
}
@@ -57,7 +61,8 @@ const ProfileTypeNavigation: React.FC<ProfileTypeNavigationProps> = ({
label: 'text-16-normal',
}}
>
- {step === ProfileTypeStepForm.UPDATE_DATE
+ {step === ProfileTypeStepForm.UPDATE_DATE ||
+ (step === EcogestureStepForm.EQUIPMENTS && isEcogesture)
? t('profile_type.form.button_end')
: `${t('profile_type.form.button_next')} >`}
</Button>
@@ -65,4 +70,4 @@ const ProfileTypeNavigation: React.FC<ProfileTypeNavigationProps> = ({
)
}
-export default ProfileTypeNavigation
+export default FormNavigation
diff --git a/src/components/ProfileType/ProfileTypeFormDateSelection.tsx b/src/components/ProfileType/ProfileTypeFormDateSelection.tsx
index 268a7f36327b748a7383c29c47f20054725bbbe2..693413cf5e7d27b8f4d328acca88770c720910b0 100644
--- a/src/components/ProfileType/ProfileTypeFormDateSelection.tsx
+++ b/src/components/ProfileType/ProfileTypeFormDateSelection.tsx
@@ -4,7 +4,7 @@ import React, { useCallback, useEffect, useState } from 'react'
import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import ProfileTypeProgress from 'components/ProfileType/ProfileTypeProgress'
-import ProfileTypeNavigation from 'components/ProfileType/ProfileTypeNavigation'
+import FormNavigation from 'components/ProfileType/FormNavigation'
import { ProfileTypeStepForm } from 'enum/profileType.enum'
import {
ProfileType,
@@ -238,7 +238,7 @@ const ProfileTypeFormDateSelection: React.FC<ProfileTypeFormDateSelectionProps>
</div>
) : null}
</div>
- <ProfileTypeNavigation
+ <FormNavigation
step={step}
handlePrevious={handlePrevious}
handleNext={handleNext}
diff --git a/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx b/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx
index 1924a877d52b7955f3af21d9ddbda75375c98668..93b0da660df1546a047e68b22061e1d4f9df0a44 100644
--- a/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx
+++ b/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx
@@ -3,7 +3,7 @@ import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import classNames from 'classnames'
import ProfileTypeProgress from 'components/ProfileType/ProfileTypeProgress'
-import ProfileTypeNavigation from 'components/ProfileType/ProfileTypeNavigation'
+import FormNavigation from 'components/ProfileType/FormNavigation'
import { remove } from 'lodash'
import {
IndividualInsulationWork,
@@ -118,7 +118,7 @@ const ProfileTypeFormMultiChoice: React.FC<ProfileTypeFormMultiChoiceProps> = ({
}
)}
</div>
- <ProfileTypeNavigation
+ <FormNavigation
step={step}
handlePrevious={handlePrevious}
handleNext={handleNext}
diff --git a/src/components/ProfileType/ProfileTypeFormNumber.tsx b/src/components/ProfileType/ProfileTypeFormNumber.tsx
index c5acc3d348d1701663974450f0de7210ec5baddb..18f54f4c4a9e24e30a7fa945aa506625cbd3d685 100644
--- a/src/components/ProfileType/ProfileTypeFormNumber.tsx
+++ b/src/components/ProfileType/ProfileTypeFormNumber.tsx
@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react'
import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import ProfileTypeProgress from 'components/ProfileType/ProfileTypeProgress'
-import ProfileTypeNavigation from 'components/ProfileType/ProfileTypeNavigation'
+import FormNavigation from 'components/ProfileType/FormNavigation'
import { ProfileTypeStepForm } from 'enum/profileType.enum'
import {
ProfileType,
@@ -69,7 +69,7 @@ const ProfileTypeFormNumber: React.FC<ProfileTypeFormNumberProps> = ({
</label>
) : null}
</div>
- <ProfileTypeNavigation
+ <FormNavigation
step={step}
handlePrevious={handlePrevious}
handleNext={handleNext}
diff --git a/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx b/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx
index a11ea926e6bfc3b8cd23ca295f4e441ced2a8a07..9f8ffeabe2960d4611e7ff8c40fe9b706ef49301 100644
--- a/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx
+++ b/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx
@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react'
import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import ProfileTypeProgress from 'components/ProfileType/ProfileTypeProgress'
-import ProfileTypeNavigation from 'components/ProfileType/ProfileTypeNavigation'
+import FormNavigation from 'components/ProfileType/FormNavigation'
import { ProfileTypeStepForm } from 'enum/profileType.enum'
import {
ProfileType,
@@ -100,7 +100,7 @@ const ProfileTypeFormNumberSelection: React.FC<ProfileTypeFormNumberSelectionPro
</div>
) : null}
</div>
- <ProfileTypeNavigation
+ <FormNavigation
step={step}
handlePrevious={handlePrevious}
handleNext={handleNext}
diff --git a/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx b/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx
index 2f31a2dd14653a3026881c589f16387ff78d0836..0c6265ad526d1a59fb073307c6e6c64c5a21c5ae 100644
--- a/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx
+++ b/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx
@@ -3,7 +3,7 @@ import 'components/ProfileType/profileTypeForm.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import classNames from 'classnames'
import ProfileTypeProgress from 'components/ProfileType/ProfileTypeProgress'
-import ProfileTypeNavigation from 'components/ProfileType/ProfileTypeNavigation'
+import FormNavigation from 'components/ProfileType/FormNavigation'
import { ProfileTypeStepForm } from 'enum/profileType.enum'
import {
ProfileType,
@@ -85,7 +85,7 @@ const ProfileTypeFormSingleChoice: React.FC<ProfileTypeFormSingleChoiceProps> =
}
)}
</div>
- <ProfileTypeNavigation
+ <FormNavigation
step={step}
handlePrevious={handlePrevious}
handleNext={handleNext}
diff --git a/src/components/ProfileType/ProfileTypeView.tsx b/src/components/ProfileType/ProfileTypeView.tsx
index 4b6d4c614fadea77f2c5e5feff0c40639061bfd6..76689e60a37ecfb21e5de45454055a70e90c093c 100644
--- a/src/components/ProfileType/ProfileTypeView.tsx
+++ b/src/components/ProfileType/ProfileTypeView.tsx
@@ -89,7 +89,7 @@ const ProfileTypeView = () => {
}
setStep(nextStep)
},
- [step, viewedStep]
+ [profile.isProfileTypeCompleted, step, viewedStep]
)
const setPrevioustStep = useCallback(
diff --git a/src/components/ProfileType/profileTypeNavigation.scss b/src/components/ProfileType/formNavigation.scss
similarity index 95%
rename from src/components/ProfileType/profileTypeNavigation.scss
rename to src/components/ProfileType/formNavigation.scss
index a3903835e5ca70d0be548327342453a9cee22d5e..b3baeff5f57b2701a689aa1601dd4db2089a1a32 100644
--- a/src/components/ProfileType/profileTypeNavigation.scss
+++ b/src/components/ProfileType/formNavigation.scss
@@ -13,7 +13,7 @@
align-items: flex-start;
padding: 0 0 env(safe-area-inset-bottom) 0;
@media (min-width: $width-tablet) {
- background: none;
+ background: $dark-light-2;
height: 3rem;
}
.rounded {
diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx
index 223eeaaa71a8b89dd406dfca26af6043aff8183c..5267763350f7d8d119a7449b05a224c363b4c20d 100644
--- a/src/components/Routes/Routes.tsx
+++ b/src/components/Routes/Routes.tsx
@@ -9,12 +9,17 @@ import ActionView from 'components/Action/ActionView'
import UnSubscribe from 'components/Options/UnSubscribe'
import TermsView from 'components/Terms/TermsView'
import { TermsStatus } from 'models'
+import EcogestureFormView from 'components/EcogestureForm/EcogestureFormView'
+import EcogestureSelection from 'components/EcogestureSelection/EcogestureSelection'
const ConsumptionView = lazy(() => import('components/Home/ConsumptionView'))
const EcogestureView = lazy(() =>
import('components/Ecogesture/EcogestureView')
)
+const SingleEcogesture = lazy(() =>
+ import('components/Ecogesture/SingleEcogesture')
+)
const OptionsView = lazy(() => import('components/Options/OptionsView'))
const FAQView = lazy(() => import('components/FAQ/FAQView'))
const LegalNoticeView = lazy(() =>
@@ -28,8 +33,12 @@ const ProfileTypeView = lazy(() =>
interface RouteProps {
termsStatus: TermsStatus
+ isProfileEcogestureCompleted: boolean
}
-const Routes: React.FC<RouteProps> = ({ termsStatus }: RouteProps) => {
+const Routes: React.FC<RouteProps> = ({
+ termsStatus,
+ isProfileEcogestureCompleted,
+}: RouteProps) => {
return (
<Suspense fallback={<div></div>}>
<Switch>
@@ -59,8 +68,14 @@ const Routes: React.FC<RouteProps> = ({ termsStatus }: RouteProps) => {
<Route path={`/challenges/exploration`} component={ExplorationView} />
<Route path={`/challenges/action`} exact component={ActionView} />
<Route path={`/challenges/`} component={ChallengeView} exact />
-
- <Route path="/ecogestures" component={EcogestureView} />
+ {!isProfileEcogestureCompleted && (
+ <Route path="/ecogesture-form" component={EcogestureFormView} />
+ )}
+ <Route path="/ecogesture-selection" component={EcogestureSelection} />
+ <Route path="/ecogesture/:id/:tab" component={SingleEcogesture} />
+ <Route path="/ecogesture/:id" component={SingleEcogesture} />
+ <Route path={`/ecogestures`} component={EcogestureView} />
+ <Route path={`/ecogestures`} component={EcogestureView} />
<Route path={'/options/FAQ'} component={FAQView} />
<Route path={`/options/legalnotice`} component={LegalNoticeView} />
<Route path={`/options/gcu`} component={GCUView} />
diff --git a/src/components/Splash/SplashRoot.tsx b/src/components/Splash/SplashRoot.tsx
index dffc345f10c1807db27c75059ce0b012b1a8b542..c1305efcb2f20b33b525a0a8bed4dc0d5bcf6024 100644
--- a/src/components/Splash/SplashRoot.tsx
+++ b/src/components/Splash/SplashRoot.tsx
@@ -8,7 +8,7 @@ import React, {
import { useClient } from 'cozy-client'
import classNames from 'classnames'
import { useDispatch } from 'react-redux'
-import { FluidState, FluidType } from 'enum/fluid.enum'
+import { FluidState } from 'enum/fluid.enum'
import {
toggleAnalysisNotification,
@@ -58,6 +58,10 @@ import { ReleaseNotes } from 'models/releaseNotes.model'
import PartnersInfoService from 'services/partnersInfo.service'
import FluidService from 'services/fluid.service'
import { PartnersInfo } from 'models/partnersInfo.model'
+import {
+ ProfileEcogestureActionTypes,
+ updateProfileEcogestureSuccess,
+} from 'store/profileEcogesture/profileEcogesture.actions'
interface SplashRootProps {
fadeTimer?: number
@@ -81,12 +85,13 @@ const SplashRoot = ({
splashEnd: false,
splashStart: false,
})
- const [error, setError] = useState<Error | null>(null)
+ const [error, setError] = useState<Error | any>(null)
const dispatch: Dispatch<
| ChallengeActionTypes
| ChartActionTypes
| GlobalActionTypes
| ProfileActionTypes
+ | ProfileEcogestureActionTypes
| ProfileTypeActionTypes
> = useDispatch()
@@ -125,6 +130,7 @@ const SplashRoot = ({
// Init profile and update ecogestures, challenges, analysis
const profile = await initializationService.initProfile()
const profileType = await initializationService.initProfileType()
+ const profileEcogesture = await initializationService.initProfileEcogesture()
if (subscribed && profile) {
setValidExploration(UserExplorationID.EXPLORATION007)
const [
@@ -153,6 +159,9 @@ const SplashRoot = ({
if (profileType) {
dispatch(updateProfileType(profileType))
}
+ if (profileEcogesture) {
+ dispatch(updateProfileEcogestureSuccess(profileEcogesture))
+ }
dispatch(toggleAnalysisNotification(!profile.haveSeenLastAnalysis))
}
// Init Fluid status && lastDate for the chart
diff --git a/src/components/Splash/splashRoot.scss b/src/components/Splash/splashRoot.scss
index 2ecb1128187bac7bd228bf2baaf358e17b56a404..c741b89df2d4b25a081bece24bdf780e1bd150a2 100644
--- a/src/components/Splash/splashRoot.scss
+++ b/src/components/Splash/splashRoot.scss
@@ -7,8 +7,8 @@
z-index: $z-splash;
left: 0;
top: 0;
- height: 100vh;
- width: 100vw;
+ height: 100%;
+ width: 100%;
opacity: 1;
overflow: hidden;
background-color: rgba(27, 28, 34, 1);
diff --git a/src/components/Splash/splashScreen.scss b/src/components/Splash/splashScreen.scss
index 293a29e053f1ce79a1c56d67f15c3ea8bf27adf7..60582eb874643e636f80a0e23b1803bf46875f3b 100644
--- a/src/components/Splash/splashScreen.scss
+++ b/src/components/Splash/splashScreen.scss
@@ -4,8 +4,8 @@
display: flex;
flex-direction: column;
align-items: center;
- justify-content: flex-end;
- // flex: 1;
+ justify-content: center;
+ height: 100%;
&:first-child {
margin: auto;
}
@@ -33,5 +33,6 @@
}
button.btn-highlight {
max-width: 50vw;
+ margin: 0.5rem 0 0;
}
}
diff --git a/src/db/ecogestureData.json b/src/db/ecogestureData.json
index a3d584127e2eb57e27f70a05dd376bf6e90ec57c..9be2b2271c7fc2275435096854ac03ea2d69d03e 100644
--- a/src/db/ecogestureData.json
+++ b/src/db/ecogestureData.json
@@ -17,7 +17,10 @@
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0002",
@@ -32,12 +35,15 @@
"room": [0],
"season": "Eté",
"equipment": true,
- "equipmentType": [0],
+ "equipmentType": ["AIR_CONDITIONING"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0003",
@@ -57,7 +63,10 @@
"investment": null,
"action": true,
"actionName": "Je ferme les portes entre les pièces chauffées et moins chauffées.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0004",
@@ -77,7 +86,10 @@
"investment": null,
"action": true,
"actionName": "Je coupe l'eau de la douche pendant que je me savonne.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0005",
@@ -97,7 +109,10 @@
"investment": null,
"action": true,
"actionName": "Je ferme l’eau du robinet quand je me lave les dents.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0006",
@@ -112,12 +127,15 @@
"room": [0],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [1],
+ "equipmentType": ["COMPUTER"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je mets mon ordinateur en veille automatique au bout de 5/10min d'inactivité.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0007",
@@ -132,12 +150,15 @@
"room": [2],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [2],
+ "equipmentType": ["MICROWAVE"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0008",
@@ -157,7 +178,10 @@
"investment": "Couvercle",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0009",
@@ -177,7 +201,10 @@
"investment": null,
"action": true,
"actionName": "Je dépoussière mes radiateurs.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0010",
@@ -197,7 +224,10 @@
"investment": null,
"action": true,
"actionName": "Je me lave les mains uniquement à l'eau froide.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0011",
@@ -217,7 +247,10 @@
"investment": null,
"action": true,
"actionName": "Je rince ma vaisselle à l'eau froide.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0012",
@@ -232,12 +265,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [3],
+ "equipmentType": [],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0013",
@@ -252,12 +288,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [4, 5],
+ "equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0014",
@@ -272,12 +311,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["REFREGIRATOR"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "J’attends que les plats chauds aient refroidi avant de les mettre au réfrigérateur et je les couvre.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0015",
@@ -297,7 +339,10 @@
"investment": null,
"action": true,
"actionName": "Je remets systématiquement mes mitigeurs sur la position la plus froide.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0016",
@@ -317,7 +362,10 @@
"investment": null,
"action": true,
"actionName": "J’éteins systématiquement les lumières quand je sors d’une pièce.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0017",
@@ -332,12 +380,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [3],
+ "equipmentType": [],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0018",
@@ -352,12 +403,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [4, 5],
+ "equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je remplis complètement ma machine à laver et/ou mon lave-vaisselle avant de les faire tourner.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0019",
@@ -372,12 +426,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [6],
+ "equipmentType": ["COOKING_PLATES"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0020",
@@ -392,12 +449,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [4, 5],
+ "equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0021",
@@ -412,12 +472,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [7],
+ "equipmentType": ["DRYER"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0022",
@@ -432,12 +495,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [4, 5],
+ "equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je nettoie le filtre de ma machine à laver.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0023",
@@ -452,12 +518,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [4, 5],
+ "equipmentType": ["WASHING_MACHINE", "DISHWASHER"],
"equipmentInstallation": false,
"investment": "Vinaigre blanc ou produit de détartrage",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0024",
@@ -472,12 +541,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [6],
+ "equipmentType": ["COOKING_PLATES"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0025",
@@ -497,7 +569,10 @@
"investment": null,
"action": true,
"actionName": "Je nettoie mes ampoules et luminaires.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0026",
@@ -517,7 +592,10 @@
"investment": null,
"action": true,
"actionName": "J’ouvre mes rideaux et mes volets dès qu’il fait jour et privilégie les apports de lumière naturelle.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0027",
@@ -537,7 +615,10 @@
"investment": null,
"action": true,
"actionName": "Je débranche mes chargeurs quand ils ne sont pas en fonctionnement.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0028",
@@ -552,12 +633,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["REFREGIRATOR"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je réfléchis à ce que je vais prendre avant d’ouvrir la porte de mon appareil de froid.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0029",
@@ -572,12 +656,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [4],
+ "equipmentType": ["WASHING_MACHINE"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "J'adapte le programme d'essorage de ma machine à laver au type de linge.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0030",
@@ -592,12 +679,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["REFREGIRATOR"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "J’optimise le rangement dans mon réfrigérateur et/ou congélateur.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0031",
@@ -617,7 +707,10 @@
"investment": null,
"action": true,
"actionName": "Je décide de baisser de 2 °C la température de chauffage de mes pièces.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0032",
@@ -637,7 +730,10 @@
"investment": "Thermostat (d’ambiance)",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0033",
@@ -657,7 +753,10 @@
"investment": "Thermostat d’ambiance",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0034",
@@ -672,12 +771,15 @@
"room": [0],
"season": "Eté",
"equipment": false,
- "equipmentType": [0, 11],
+ "equipmentType": ["AIR_CONDITIONING", "FAN"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0035",
@@ -692,12 +794,15 @@
"room": [0],
"season": "Eté",
"equipment": false,
- "equipmentType": [0],
+ "equipmentType": ["AIR_CONDITIONING"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0036",
@@ -717,7 +822,10 @@
"investment": null,
"action": true,
"actionName": "Je met mon chauffage en mode réduit pendant la nuit ou pendant mon absence.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0037",
@@ -737,7 +845,10 @@
"investment": null,
"action": true,
"actionName": "Je décide de baisser d'1 °C la température de chauffage de mes pièces.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0038",
@@ -757,7 +868,10 @@
"investment": null,
"action": true,
"actionName": "Je ne chauffe que les pièces de vie (salon, cuisine, …)",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0039",
@@ -777,7 +891,10 @@
"investment": "Boudins de portes",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0040",
@@ -797,7 +914,10 @@
"investment": null,
"action": true,
"actionName": "Je prends des douches de moins de 5 minutes.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0041",
@@ -817,7 +937,10 @@
"investment": "Eco mousseur",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0042",
@@ -837,7 +960,10 @@
"investment": "Eco mousseur",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0043",
@@ -857,7 +983,10 @@
"investment": null,
"action": true,
"actionName": "Je conserve au maximum la fraicheur de mon logement en fermant les volets et fenêtres quand je m’absente pendant la journée.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0044",
@@ -877,7 +1006,10 @@
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0045",
@@ -892,12 +1024,15 @@
"room": [],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [9],
+ "equipmentType": [],
"equipmentInstallation": false,
"investment": "Seau/ Bac de récupération",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0046",
@@ -912,12 +1047,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [10],
+ "equipmentType": ["BOILER"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0047",
@@ -932,12 +1070,15 @@
"room": [0],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [12],
+ "equipmentType": ["CURTAIN"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0048",
@@ -952,12 +1093,15 @@
"room": [0],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [13],
+ "equipmentType": ["INTERNET_BOX"],
"equipmentInstallation": false,
"investment": "Multiprise avec interrupteur marche/arrêt",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0049",
@@ -972,12 +1116,15 @@
"room": [2],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [2],
+ "equipmentType": ["MICROWAVE"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0050",
@@ -992,12 +1139,15 @@
"room": [0],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [],
+ "equipmentType": ["VENTILATION"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0051",
@@ -1017,7 +1167,10 @@
"investment": null,
"action": true,
"actionName": "Je diminue la luminosité de mon écran d’ordinateur tout en conservant un confort de vue.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0052",
@@ -1032,12 +1185,15 @@
"room": [3],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [7],
+ "equipmentType": ["DRYER"],
"equipmentInstallation": false,
"investment": "Etendage",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0053",
@@ -1057,7 +1213,10 @@
"investment": "Multiprise avec interrupteur marche/arrêt",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0054",
@@ -1077,7 +1236,10 @@
"investment": "Ampoules basses consommation",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0055",
@@ -1092,12 +1254,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [15],
+ "equipmentType": ["REFREGIRATOR", "FREEZER"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je remplis mon congélateur, je ne surcharge pas mon réfrigérateur.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0056",
@@ -1117,7 +1282,10 @@
"investment": "un bac à vaiselle",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0057",
@@ -1132,12 +1300,15 @@
"room": [0],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [],
+ "equipmentType": ["VENTILATION"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0058",
@@ -1157,7 +1328,10 @@
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0059",
@@ -1177,7 +1351,10 @@
"investment": "-",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0060",
@@ -1192,12 +1369,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [15],
+ "equipmentType": ["REFREGIRATOR", "FREEZER"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je dégivre mon réfrigérateur et/ou congélateur.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0061",
@@ -1212,12 +1392,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [15],
+ "equipmentType": ["REFREGIRATOR", "FREEZER"],
"equipmentInstallation": false,
"investment": "Thermomètre",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0062",
@@ -1232,12 +1415,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["REFREGIRATOR"],
"equipmentInstallation": true,
"investment": null,
"action": true,
"actionName": "Je nettoie la grille arrière de mon réfrigérateur.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0063",
@@ -1252,12 +1438,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [15],
+ "equipmentType": ["REFREGIRATOR", "FREEZER"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0064",
@@ -1272,12 +1461,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [3],
+ "equipmentType": [],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0065",
@@ -1297,7 +1489,10 @@
"investment": "Volet/Rideau",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0066",
@@ -1311,13 +1506,16 @@
"difficulty": 3,
"room": [1, 2, 3],
"season": "Sans saison",
- "equipment": true,
- "equipmentType": [16],
+ "equipment": false,
+ "equipmentType": [],
"equipmentInstallation": false,
"investment": "Faire appel à un pro",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0067",
@@ -1337,7 +1535,10 @@
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0068",
@@ -1352,12 +1553,15 @@
"room": [1, 2, 3],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [10],
+ "equipmentType": ["BOILER"],
"equipmentInstallation": false,
"investment": "Faire appel à un pro",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0069",
@@ -1377,7 +1581,10 @@
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0070",
@@ -1392,12 +1599,15 @@
"room": [0],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [17],
+ "equipmentType": ["HYDRAULIC_HEATING"],
"equipmentInstallation": false,
"investment": "Faire appel à un pro",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0071",
@@ -1417,7 +1627,10 @@
"investment": "Panneau réfléchissant",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0072",
@@ -1432,12 +1645,15 @@
"room": [0],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [17],
+ "equipmentType": ["HYDRAULIC_HEATING"],
"equipmentInstallation": false,
"investment": "Isolant",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0073",
@@ -1452,12 +1668,15 @@
"room": [0],
"season": "Sans saison",
"equipment": true,
- "equipmentType": [17],
+ "equipmentType": ["HYDRAULIC_HEATING"],
"equipmentInstallation": false,
"investment": "Faire appel à un pro",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0074",
@@ -1477,7 +1696,10 @@
"investment": "Chasse d’eau à double vitesse: à faire si travaux",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0075",
@@ -1497,7 +1719,10 @@
"investment": null,
"action": true,
"actionName": "Je décide de supprimer une douche pendant la durée du défi.",
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0076",
@@ -1512,12 +1737,15 @@
"room": [2],
"season": "Sans saison",
"equipment": false,
- "equipmentType": [],
+ "equipmentType": ["REFREGIRATOR"],
"equipmentInstallation": true,
"investment": null,
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
},
{
"_id": "ECOGESTURE0077",
@@ -1537,6 +1765,9 @@
"investment": "Travaux de décoration",
"action": false,
"actionName": null,
- "actionDuration": 3
+ "actionDuration": 3,
+ "doing": false,
+ "objective": false,
+ "viewedInSelection": false
}
]
diff --git a/src/db/fluidPrices.json b/src/db/fluidPrices.json
index 2f1689af35321db2208cc71a2e52bbb877070f75..2189788870321c50eed2d8e3fed56937f8a1b7e2 100644
--- a/src/db/fluidPrices.json
+++ b/src/db/fluidPrices.json
@@ -83,6 +83,66 @@
"startDate": "2021-08-01T00:00:00.000Z",
"endDate": null
},
+ {
+ "fluidType": 1,
+ "price": 0.0030735,
+ "startDate": "2012-01-01T00:00:00.000Z",
+ "endDate": "2012-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.0031483,
+ "startDate": "2013-01-01T00:00:00.000Z",
+ "endDate": "2013-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.0031381,
+ "startDate": "2014-01-01T00:00:00.000Z",
+ "endDate": "2014-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.00307,
+ "startDate": "2015-01-01T00:00:00.000Z",
+ "endDate": "2015-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.0031,
+ "startDate": "2016-01-01T00:00:00.000Z",
+ "endDate": "2016-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.00311,
+ "startDate": "2017-01-01T00:00:00.000Z",
+ "endDate": "2017-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.00313,
+ "startDate": "2018-01-01T00:00:00.000Z",
+ "endDate": "2018-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.00313,
+ "startDate": "2019-01-01T00:00:00.000Z",
+ "endDate": "2019-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.00315,
+ "startDate": "2020-01-01T00:00:00.000Z",
+ "endDate": "2020-12-31T23:59:59.000Z"
+ },
+ {
+ "fluidType": 1,
+ "price": 0.00319,
+ "startDate": "2021-01-01T00:00:00.000Z",
+ "endDate": null
+ },
{
"fluidType": 2,
"price": 0.0919,
diff --git a/src/db/profileData.json b/src/db/profileData.json
index e39e2015078379b2685947c5341949516ce5bd81..bbd3db0efaa3bf6dc0e26b4e0a8dbd227e1fa0e5 100644
--- a/src/db/profileData.json
+++ b/src/db/profileData.json
@@ -15,6 +15,7 @@
"isProfileTypeCompleted": false,
"onboarding": {
"isWelcomeSeen": false
- }
+ },
+ "haveSeenEcogestureModal": false
}
]
diff --git a/src/doctypes/com-grandlyon-ecolyo-profileecogesture.ts b/src/doctypes/com-grandlyon-ecolyo-profileecogesture.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6a312fe7d5b10640bba0a874f8d2a82d936de311
--- /dev/null
+++ b/src/doctypes/com-grandlyon-ecolyo-profileecogesture.ts
@@ -0,0 +1,2 @@
+export const PROFILEECOGESTURE_DOCTYPE =
+ 'com.grandlyon.ecolyo.profileecogesture'
diff --git a/src/doctypes/index.ts b/src/doctypes/index.ts
index a52d25ff8e783c3f535b4fbd6bd40982b55030c7..eb711a242a02d5794cca926962def5aa841d3afb 100644
--- a/src/doctypes/index.ts
+++ b/src/doctypes/index.ts
@@ -28,6 +28,7 @@ import { EGL_YEAR_DOCTYPE } from './com-grandlyon-egl-year'
import { EGL_MONTH_DOCTYPE } from './com-grandlyon-egl-month'
import { ENEDIS_MONTHLY_ANALYSIS_DATA_DOCTYPE } from './com-grandlyon-enedis-monthly-analysis-data'
import { ENEDIS_MAXPOWER_DOCTYPE } from './com-grandlyon-enedis-maxpower'
+import { PROFILEECOGESTURE_DOCTYPE } from './com-grandlyon-ecolyo-profileecogesture'
// the documents schema, necessary for CozyClient
const doctypes = {
@@ -179,6 +180,11 @@ const doctypes = {
attributes: {},
relationships: {},
},
+ profileecogesture: {
+ doctype: PROFILEECOGESTURE_DOCTYPE,
+ attributes: {},
+ relationships: {},
+ },
}
export default doctypes
@@ -217,3 +223,4 @@ export * from './com-grandlyon-ecolyo-duel'
export * from './com-grandlyon-ecolyo-quiz'
export * from './com-grandlyon-ecolyo-exploration'
export * from './com-grandlyon-ecolyo-usageevent'
+export * from './com-grandlyon-ecolyo-profileecogesture'
diff --git a/src/enum/ecogesture.enum.ts b/src/enum/ecogesture.enum.ts
index 7cb2f7c697701f193fde6e3c1bf170819448f85a..c14162c8e3820dbe84392f5165f52b07941e59aa 100644
--- a/src/enum/ecogesture.enum.ts
+++ b/src/enum/ecogesture.enum.ts
@@ -23,22 +23,25 @@ export enum Season {
}
export enum EquipmentType {
- AIR_CONDITIONING = 0,
- COMPUTER = 1,
- MICROWAVE = 2,
- OVEN = 3,
- WASHING_MACHINE = 4,
- DISHWASHER = 5,
- COOKING_PLATES = 6,
- DRYER = 7,
- REFREGIRATOR = 8,
- GARDEN = 9,
- WATER_HEATER = 10,
- FAN = 11,
- CURTAIN = 12,
- INTERNET_BOX = 13,
- VENTILATION = 14,
- FREEZER = 15,
- BOILER = 16,
- HYDRAULIC_HEATING = 17,
+ AIR_CONDITIONING = 'AIR_CONDITIONING',
+ COMPUTER = 'COMPUTER',
+ MICROWAVE = 'MICROWAVE',
+ WASHING_MACHINE = 'WASHING_MACHINE',
+ DISHWASHER = 'DISHWASHER',
+ COOKING_PLATES = 'COOKING_PLATES',
+ DRYER = 'DRYER',
+ REFREGIRATOR = 'REFREGIRATOR',
+ FAN = 'FAN',
+ CURTAIN = 'CURTAIN',
+ INTERNET_BOX = 'INTERNET_BOX',
+ VENTILATION = 'VENTILATION',
+ FREEZER = 'FREEZER',
+ BOILER = 'BOILER',
+ HYDRAULIC_HEATING = 'HYDRAULIC_HEATING',
+}
+
+export enum EcogestureStatus {
+ OBJECTIVE = 0,
+ DOING = 1,
+ ALL = 2,
}
diff --git a/src/enum/ecogestureForm.enum.ts b/src/enum/ecogestureForm.enum.ts
new file mode 100644
index 0000000000000000000000000000000000000000..556793f5060848b704ba271f4e2f528cd5b0c29d
--- /dev/null
+++ b/src/enum/ecogestureForm.enum.ts
@@ -0,0 +1,10 @@
+export enum EcogestureStepForm {
+ HEATING_TYPE = 0,
+ WARMING_FLUID = 1,
+ HOT_WATER_TYPE = 2,
+ EQUIPMENTS = 3,
+}
+export enum ProfileEcogestureAnswerType {
+ SINGLE_CHOICE = 0,
+ MULTI_CHOICE = 1,
+}
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 9c1b62804a3bf55c9c44f19de5ba0967c75516c1..df2803bb5a2366380b4cbff7adaa676df1b25dde 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -80,6 +80,7 @@
"ideal_home": "Conso idéale pour votre profil",
"approximative_description": "Pour comparer votre consommation avec un foyer similaire ou avec une conso idéale, veuillez détailler votre profil",
"not_connected": "Non connecté",
+ "no_data_2": "Données non disponibles",
"accessibility": {
"button_go_to_profil": "Aller à la page de profil"
},
@@ -286,9 +287,10 @@
"aie": "Aïe !",
"estimated": "estimés",
"dataModal": {
- "list_title": "2 raisons possibles :",
- "item1": "- le lien entre Ecolyo et le fournisseur de données est rompu : une mise à jour de ce lien (en bas de la page) peut parfois résoudre ce problème.",
- "item2": "- la mise à jour a été effectuée mais les données n'apparaissent toujours pas : le soucis vient du fournisseur de données (Enedis pour l'électricité, GRDF pour le gaz, Eau du Grand Lyon pour l'eau). Cela peut-être dû à un problème technique lié à votre compteur ou à leurs systèmes informatiques. Le mieux est de contacter directement ce partenaire pour tenter de régler le problème avec lui."
+ "list_title": "3 raisons possibles :",
+ "item1": "le lien entre Ecolyo et le fournisseur de données est rompu : une mise à jour de ce lien (en bas de la page) peut résoudre ce problème.",
+ "item2": "un problème technique chez votre gestionnaire : se connecter directement chez ce gestionnaire pour vérifier que cette donnée apparaît.",
+ "item3": "vous n'aviez tout simplement pas de compteur communicant à l'époque !"
},
"modal": {
"window_title": "info estimation des prix",
@@ -355,8 +357,9 @@
}
},
"ecogesture": {
- "title_tab_1": "Tous les écogestes",
- "title_tab_2": "Écogestes adaptés à votre profil",
+ "title_tab_0": "Objectifs",
+ "title_tab_1": "Je fais déjà ",
+ "title_tab_2": "Tous",
"MENU_TITLE": "Filtrer",
"ALL": "Tous les usages",
"HEATING": "Chauffage",
@@ -365,6 +368,9 @@
"COLD_WATER": "Eau froide",
"ELECTRICITY_SPECIFIC": "Électricité courante",
"COOKING": "Cuisson",
+ "selection": "Sélectionner les écogestes les plus adaptés à votre consommation",
+ "selection_2": "vus sur",
+ "button_selection": "Continuer ma sélection",
"no_ecogesture": "Aucun écogeste ne correspond à votre filtrage",
"no_ecogesture_filter": {
"text1": "Nous n'avons pas trouvé d'écogestes adaptés à votre profil dans cette catégorie.",
@@ -375,7 +381,32 @@
"button_go_to_profil": "Ajuster mon profil"
},
"accessibility": {
- "button_go_to_profil": "Aller à la page de profil"
+ "window_title": "Fenêtre d'information'",
+ "button_go_to_profil": "Aller à la page de profil",
+ "button_close": "Fermer la fenetre",
+ "button_selection": "Aller à la page de sélection"
+ },
+ "doing": "Je fais déjà ",
+ "objective": "Objectif",
+ "emptyList": {
+ "obj1": "Les écogestes sont des actions qui vous permettent de réduire vos consommations et donc vos factures.",
+ "obj1_done": "Aucun écogeste n’est indiqué comme objectif actuellement.",
+ "obj2": "Vous pouvez sélectionner ceux à mettre en objectifs et ceux que vous appliquez déjà .",
+ "obj2_done": "Vous pouvez consulter tous les écogestes et ajouter les gestes que vous souhaitez garder en objectif dans cette section.",
+ "doing1": "Aucun écogeste n’est indiqué comme déjà appliqué actuellement.",
+ "doing1_done": "Aucun écogeste n’est indiqué comme déjà appliqué actuellement.",
+ "doing2": "Vous pouvez consulter tous les écogestes et ajouter les gestes que vous mettez déjà en pratique dans cette section.",
+ "doing2_done": "Vous pouvez consulter tous les écogestes et ajouter les gestes que vous mettez déjà en pratique dans cette section.",
+ "btn1": "Voir tous les écogestes",
+ "btn2": "Sélectionner"
+ },
+ "initModal": {
+ "title": "Sélectionner mes écogestes",
+ "text1": "Les écogestes sont des actions qui vous permettent de réduire vos consommations et donc vos factures.",
+ "text2": "Vous pouvez sélectionner ceux à mettre en objectifs et ceux que vous appliquez déjà .",
+ "text3": "Afin de savoir quels écogestes correspondent à votre consommation, merci de répondre à quelques rapides questions.",
+ "btn1": "Plus tard",
+ "btn2": "C'est parti !"
}
},
"ecogesture_modal": {
@@ -402,6 +433,78 @@
"button_close": "Fermer la fenêtre"
}
},
+ "ecogesture_form": {
+ "heating_type": {
+ "title": "Chauffage",
+ "question": "Quel est votre type de chauffage ?",
+ "individual": "Individuel",
+ "collective": "Collectif"
+ },
+ "warming_fluid": {
+ "title": "Source chauffage",
+ "question": "Quelle source d’énergie principale utilisez-vous pour votre chauffage ?",
+ "0": "Électricité",
+ "2": "Gaz",
+ "3": "Bois",
+ "4": "Fioul"
+ },
+ "hot_water_type": {
+ "title": "Eau chaude",
+ "question": "Quel est votre type de production d’eau chaude ?",
+ "individual": "Individuelle",
+ "collective": "Collective"
+ }
+ },
+ "ecogesture_profile": {
+ "equipments": {
+ "question": "Quels équipements possédez-vous ?",
+ "hint": "Plusieurs réponses possibles",
+ "air_conditioning": "Climatisation",
+ "computer": "Ordinateur",
+ "microwave": "Micro-ondes",
+ "oven": "Four",
+ "washing_machine": "Lave-linge",
+ "dishwasher": "Lave-vaisselle",
+ "cooking_plates": "Plaques électriques",
+ "garden": "Jardin",
+ "dryer": "Sèche-linge",
+ "refregirator": "Réfrigérateur",
+ "fan": "Ventilateur",
+ "water_heater": "Chauffe-eau",
+ "curtain": "Rideaux",
+ "internet_box": "Box internet",
+ "ventilation": "VMC",
+ "freezer": "Congélateur",
+ "boiler": "Chaudière",
+ "hydraulic_heating": "Chauffage hydraulique"
+ }
+ },
+ "ecogesture_selection": {
+ "header": "Sélection des écogestes",
+ "title": "Vous avez parcouru un groupe de %{smart_count} écogestes",
+ "text": "Voulez-vous continuer sur votre lancée ou remettre cette sélection à plus tard ?",
+ "title_final": "Félicitations !",
+ "text_final_1": "Vous avez terminé la sélection des écogestes adaptés à votre consommation.",
+ "text_final_2": "Vous pouvez les retrouver dans les sections “Objectifs†et “Je fais déjà †selon que vous les pratiquiez déjà ou non.",
+ "button_go_to_ecogesture": "Plus tard",
+ "button_ok": "J'ai compris",
+ "button_continue": "Poursuivre",
+ "button_objective": "Objectif",
+ "button_doing": "Je fais déjà ",
+ "button_skip": "Pas interessé",
+ "accessibility": {
+ "window_title": "Fenêtre d'information'",
+ "button_close": "Fermer la fenetre",
+ "button_go_to_ecogesture": "Retourner aux ecogestes",
+ "button_continue": "Poursuivre",
+ "button_ok": "Fermer la sélection"
+ },
+ "selectionModal": {
+ "title": "Des écogestes correspondants à votre profil ont été trouvés !",
+ "text": "À vous de choisir ceux que vous souhaitez mettre en objectif et ceux que vous faites déjà .",
+ "button_close": "C'est parti !"
+ }
+ },
"exploration": {
"global_error": "Oups. Une erreur est survenue. Veuillez retourner à l'écran d’accueil des défis",
"button_go_back": "Retour",
@@ -423,6 +526,11 @@
"button_start": "Lancer l'exploration"
}
},
+ "error_page": {
+ "main": "Erreur",
+ "back": "Retour",
+ "no_ecogesture": "Oups ! Nous n'avons pas trouvé l'écogeste demandé."
+ },
"faq": {
"title_faq": "Foire aux questions",
"read_faq": "Lire la FAQ",
@@ -782,7 +890,11 @@
},
"error_no_compare": "comparaison impossible",
"error_no_compare_reason": "(manque de données)",
- "error_no_compare_no_data": "Vos consommations pour cette période sont incomplètes à cause d’un problème technique concernant :"
+ "error_no_compare_no_data": "Vos consommations pour cette période sont incomplètes à cause d’un problème technique concernant :",
+ "fpi": {
+ "no_data": "Données non disponibles",
+ "no_comparison": "Pas de comparaison possible"
+ }
},
"profile": {
"report": {
diff --git a/src/migrations/migration.data.ts b/src/migrations/migration.data.ts
index 094b30109bb5af6a33d3ce27d2da91add7225fd8..b2ce441822b0f252c58e7b8967c8556c6c532d05 100644
--- a/src/migrations/migration.data.ts
+++ b/src/migrations/migration.data.ts
@@ -19,6 +19,7 @@ import { Client } from 'cozy-client'
import { DateTime } from 'luxon'
import { UserQuizState } from 'enum/userQuiz.enum'
import fluidsPricesData from 'db/fluidPrices.json'
+import { FluidType } from 'enum/fluid.enum'
export const SCHEMA_INITIAL_VERSION = 0
@@ -485,4 +486,24 @@ export const migrations: Migration[] = [
})
},
},
+ {
+ baseSchemaVersion: 17,
+ targetSchemaVersion: 18,
+ appVersion: '1.7.0',
+ description: 'Init new fluidPrices for water',
+ releaseNotes: null,
+ docTypes: FLUIDPRICES_DOCTYPE,
+
+ run: async (_client: Client, docs: any[]): Promise<any> => {
+ const waterPricesData = fluidsPricesData.filter(fluidPriceData => {
+ return fluidPriceData.fluidType === FluidType.WATER
+ })
+ const createWaterPricesData = waterPricesData.map(waterPriceData => {
+ waterPriceData.createAction = true
+ waterPriceData.doctype = FLUIDPRICES_DOCTYPE
+ return waterPriceData
+ })
+ return createWaterPricesData
+ },
+ },
]
diff --git a/src/migrations/migration.ts b/src/migrations/migration.ts
index fa9c222a166b647848f991456398fe0d32e1111b..11acfabade7a54242e12b9764fd4343729eaf349 100644
--- a/src/migrations/migration.ts
+++ b/src/migrations/migration.ts
@@ -87,6 +87,8 @@ async function save(_client: Client, docs: any[]): Promise<MigrationResult> {
docs.forEach(async doc => {
if (doc.deleteAction) {
await _client.destroy(doc)
+ } else if (doc.createAction) {
+ await _client.create(doc.doctype, doc)
} else {
await _client.save(doc)
}
diff --git a/src/models/ecogesture.model.ts b/src/models/ecogesture.model.ts
index ef3fbfc276a19b36cbe21dff82853fc223db1e69..79f82d677d19d3dc5bb59a9af046f8c988b2aab2 100644
--- a/src/models/ecogesture.model.ts
+++ b/src/models/ecogesture.model.ts
@@ -20,6 +20,9 @@ export interface Ecogesture {
action: boolean
actionName: string | null
actionDuration: number
+ objective: boolean
+ doing: boolean
+ viewedInSelection: boolean
_id: string
_rev?: string
_type?: string
diff --git a/src/models/profile.model.ts b/src/models/profile.model.ts
index f28a546c819f69d4c4fc31da5262684fe43336a3..5f17419398b7ae090182b69fb60ada24eab9052a 100644
--- a/src/models/profile.model.ts
+++ b/src/models/profile.model.ts
@@ -19,9 +19,11 @@ export interface ProfileEntity {
sendConsumptionAlert: boolean
waterDailyConsumptionLimit: number
isProfileTypeCompleted: boolean
+ isProfileEcogestureCompleted: boolean
onboarding: Onboarding
mailToken: string
partnersIssueDate: string
+ haveSeenEcogestureModal: boolean
_id?: string
_rev?: string
}
diff --git a/src/models/profileEcogesture.model.ts b/src/models/profileEcogesture.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..08187ec483aa0eb76dc7850571df50832717ba5d
--- /dev/null
+++ b/src/models/profileEcogesture.model.ts
@@ -0,0 +1,40 @@
+import { EquipmentType } from 'enum/ecogesture.enum'
+import { ProfileEcogestureAnswerType } from 'enum/ecogestureForm.enum'
+import { FluidType } from 'enum/fluid.enum'
+import {
+ IndividualOrCollective,
+ HotWaterEquipment,
+ WarmingType,
+} from 'enum/profileType.enum'
+
+interface ProfileEcogestureIndexableTypes {
+ [key: string]:
+ | IndividualOrCollective
+ | FluidType
+ | WarmingType
+ | EquipmentType[]
+ | string
+ | null
+}
+export type ProfileEcogestureAnswerChoices =
+ | string
+ | IndividualOrCollective
+ | HotWaterEquipment
+ | FluidType
+ | WarmingType
+ | EquipmentType[]
+ | number
+ | null
+
+export interface ProfileEcogestureAnswer {
+ type: ProfileEcogestureAnswerType
+ attribute: string
+ choices: ProfileEcogestureAnswerChoices[]
+}
+
+export interface ProfileEcogesture extends ProfileEcogestureIndexableTypes {
+ heating: IndividualOrCollective
+ warmingFluid: WarmingType | null
+ hotWater: IndividualOrCollective
+ equipments: EquipmentType[]
+}
diff --git a/src/services/ecogesture.service.spec.ts b/src/services/ecogesture.service.spec.ts
index 3d3aaef11f87549b63000ffbf6ff98cbe60e806c..0b67426935ae2128ccab94f86e5d1dc2b4d35e26 100644
--- a/src/services/ecogesture.service.spec.ts
+++ b/src/services/ecogesture.service.spec.ts
@@ -3,22 +3,19 @@ import { Ecogesture } from 'models'
import EcogestureService from './ecogesture.service'
import mockClient from '../../tests/__mocks__/client'
import {
- ecogesturesAirConditioningData,
- ecogesturesColdWaterData,
- ecogesturesCookingData,
+ BoilerEcogesture,
+ BoilerEcogestureFalse,
ecogesturesData,
ecogesturesECSData,
- ecogesturesElecSpecificData,
ecogesturesHeatingData,
} from '../../tests/__mocks__/ecogesturesData.mock'
-import { ProfileType } from 'models/profileType.model'
import { IndividualOrCollective, WarmingType } from 'enum/profileType.enum'
-import { FluidType } from 'enum/fluid.enum'
-import { mockProfileType2 } from '../../tests/__mocks__/profileType.mock'
+import { mockProfileEcogesture } from '../../tests/__mocks__/profileEcogesture.mock'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import { EquipmentType } from 'enum/ecogesture.enum'
describe('Ecogesture service', () => {
const ecogestureService = new EcogestureService(mockClient)
-
describe('getAllEcogestures', () => {
it('should return all ecogestures', async () => {
const mockQueryResult: QueryResult<Ecogesture[]> = {
@@ -81,172 +78,129 @@ describe('Ecogesture service', () => {
expect(result).toBe(false)
})
})
-
- describe('filteredEcogestureList', () => {
- describe('usage heating', () => {
- it('should return ecogesture with electricity', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesHeatingData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- heating: IndividualOrCollective.INDIVIDUAL,
- warmingFluid: WarmingType.ELECTRICITY,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([mockEcogestureList[0], mockEcogestureList[2]])
- })
- it('should return ecogesture with gas', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesHeatingData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- heating: IndividualOrCollective.INDIVIDUAL,
- warmingFluid: WarmingType.GAS,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([mockEcogestureList[1], mockEcogestureList[2]])
- })
- it('should not return ecogesture when profile heating is collective', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesHeatingData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- heating: IndividualOrCollective.COLLECTIVE,
- warmingFluid: WarmingType.ELECTRICITY,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([])
- })
+ describe('filterByUsage', () => {
+ it('should return ecogesture list including ECS ecogestures', async () => {
+ const mockEcogestureList: Ecogesture[] = ecogesturesECSData
+ const mockProfileEcogesture1: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ hotWater: IndividualOrCollective.INDIVIDUAL,
+ }
+ const result = ecogestureService.filterByUsage(
+ mockEcogestureList,
+ mockProfileEcogesture1
+ )
+ expect(result.includes(ecogesturesECSData[0])).toBeTruthy()
})
-
- describe('usage ECS', () => {
- it('should return ecogesture with electricity', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesECSData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- hotWater: IndividualOrCollective.INDIVIDUAL,
- hotWaterFluid: FluidType.ELECTRICITY,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([mockEcogestureList[0], mockEcogestureList[2]])
- })
- it('should return ecogesture with gas', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesECSData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- hotWater: IndividualOrCollective.INDIVIDUAL,
- hotWaterFluid: FluidType.GAS,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([mockEcogestureList[1], mockEcogestureList[2]])
- })
- it('should not return ecogesture when profile warming is collective', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesECSData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- hotWater: IndividualOrCollective.COLLECTIVE,
- hotWaterFluid: FluidType.ELECTRICITY,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([])
- })
+ it('should return ecogesture list excluding ECS ecogestures', async () => {
+ const mockEcogestureList: Ecogesture[] = ecogesturesECSData
+ const mockProfileEcogesture1: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ hotWater: IndividualOrCollective.COLLECTIVE,
+ }
+ const result = ecogestureService.filterByUsage(
+ mockEcogestureList,
+ mockProfileEcogesture1
+ )
+ expect(result.includes(ecogesturesECSData[1])).toBeFalsy()
})
-
- describe('usage COOKING', () => {
- it('should return ecogesture with electricity', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesCookingData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- cookingFluid: FluidType.ELECTRICITY,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([mockEcogestureList[0], mockEcogestureList[2]])
- })
- it('should return ecogesture with gas', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesCookingData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- cookingFluid: FluidType.GAS,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([mockEcogestureList[1], mockEcogestureList[2]])
- })
+ it('should return ecogesture list including HEATING ecogestures', async () => {
+ const mockEcogestureList: Ecogesture[] = ecogesturesHeatingData
+ const mockProfileEcogesture2: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ heating: IndividualOrCollective.INDIVIDUAL,
+ warmingFluid: WarmingType.ELECTRICITY,
+ }
+ const result = ecogestureService.filterByUsage(
+ mockEcogestureList,
+ mockProfileEcogesture2
+ )
+ expect(result.includes(ecogesturesHeatingData[0])).toBeTruthy()
})
-
- describe('usage COLD_WATER', () => {
- it('should return all water ecogestures', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesColdWaterData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- coldWater: IndividualOrCollective.INDIVIDUAL,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual(mockEcogestureList)
- })
- it('should not return water ecogestures', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesColdWaterData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- coldWater: IndividualOrCollective.COLLECTIVE,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([])
- })
+ it('should return ecogesture list excluding HEATING ecogestures', async () => {
+ const mockEcogestureList: Ecogesture[] = ecogesturesHeatingData
+ const mockProfileEcogesture2: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ heating: IndividualOrCollective.COLLECTIVE,
+ }
+ const result = ecogestureService.filterByUsage(
+ mockEcogestureList,
+ mockProfileEcogesture2
+ )
+ expect(result.includes(ecogesturesHeatingData[0])).toBeFalsy()
+ })
+ })
+ describe('filterByEquipment', () => {
+ it('should return ecogesture list including BOILER equipment and equipment veriication to true', async () => {
+ const mockProfileEcogestureBOILER: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ equipments: [EquipmentType.BOILER],
+ }
+ const result = ecogestureService.filterByEquipment(
+ BoilerEcogesture,
+ mockProfileEcogestureBOILER
+ )
+ expect(result.includes(BoilerEcogesture[0])).toBeTruthy()
+ })
+ it('should return ecogesture list excluding BOILER equipment and equipment veriication to true', async () => {
+ const mockProfileEcogestureBOILER: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ }
+ const result = ecogestureService.filterByEquipment(
+ BoilerEcogesture,
+ mockProfileEcogestureBOILER
+ )
+ expect(result.includes(BoilerEcogesture[0])).toBeFalsy()
+ })
+ it('should return ecogesture list including BOILER equipment with equipment veriication to false but equipment to BOILER', async () => {
+ const mockProfileEcogestureBOILER: ProfileEcogesture = {
+ ...mockProfileEcogesture,
+ equipments: [EquipmentType.BOILER],
+ }
+ const result = ecogestureService.filterByEquipment(
+ BoilerEcogestureFalse,
+ mockProfileEcogestureBOILER
+ )
+ 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],
+ }
+ const mockQueryResult: QueryResult<Ecogesture[]> = {
+ data: ecogesturesData,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
- describe('usage ELECTRICITY_SPECIFIC', () => {
- it('should return all ecogestures', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesElecSpecificData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual(mockEcogestureList)
- })
+ const result = await ecogestureService.getEcogestureListByProfile(
+ mockProfileEcogestureFull
+ )
+ expect(result.length).toBe(2)
+ expect(result[0]).toBe(ecogesturesData[0])
})
+ })
+ describe('getEcogesturesByIds', () => {
+ it('Should return corresponding ecogestures', async () => {
+ const mockQueryResult: QueryResult<Ecogesture[]> = {
+ data: ecogesturesECSData,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
- describe('usage AIR_CONDITIONING', () => {
- it('should not return ecogestures', async () => {
- const mockEcogestureList: Ecogesture[] = ecogesturesAirConditioningData
- const mockProfileType: ProfileType = {
- ...mockProfileType2,
- }
- const result = EcogestureService.getEcogestureListByProfile(
- mockEcogestureList,
- mockProfileType
- )
- expect(result).toEqual([])
- })
+ const result = await ecogestureService.getEcogesturesByIds([
+ 'ECOGESTURE0001',
+ 'ECOGESTURE0002',
+ 'ECOGESTURE0013',
+ ])
+ expect(result.length).toBe(3)
+ expect(result).toBe(ecogesturesECSData)
})
})
})
diff --git a/src/services/ecogesture.service.ts b/src/services/ecogesture.service.ts
index bc1eb9018e26d8ce6ee617d9e94908e479ee71b2..409b2e566549bcf49844c2a8b1d362b00a3fd34b 100644
--- a/src/services/ecogesture.service.ts
+++ b/src/services/ecogesture.service.ts
@@ -5,7 +5,8 @@ import { FluidType } from 'enum/fluid.enum'
import { IndividualOrCollective, WarmingType } from 'enum/profileType.enum'
import { Season } from 'enum/ecogesture.enum'
import { Ecogesture } from 'models'
-import { ProfileType } from 'models/profileType.model'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import { orderBy } from 'lodash'
export default class EcogestureService {
private readonly _client: Client
@@ -14,12 +15,17 @@ export default class EcogestureService {
this._client = _client
}
- public async getAllEcogestures(seasonFilter?: Season): Promise<Ecogesture[]> {
+ public async getAllEcogestures(
+ seasonFilter?: Season,
+ orderByID?: boolean
+ ): Promise<Ecogesture[]> {
let query: QueryDefinition = Q(ECOGESTURE_DOCTYPE)
if (seasonFilter && seasonFilter !== Season.NONE) {
query = query
.where({ season: { $ne: seasonFilter } })
.sortBy([{ season: 'desc' }])
+ } else if (orderByID) {
+ query = query.where({}).sortBy([{ _id: 'asc' }])
} else {
query = query.where({}).sortBy([{ season: 'desc' }])
}
@@ -67,77 +73,119 @@ export default class EcogestureService {
}
/**
- * Return duel with updated thrshold and fluidTypes
- * @param {UserDuel} userDuel - userDuel to update
- * @returns {UserDuel}
+ * Removes ecogestures from the list that doesn't fit with user's usages
+ * @param {Ecogesture[]} ecogestureList
+ * @param {ProfileEcogesture} profileEcogesture
+ * @returns {Ecogesture[]}
*/
- static getEcogestureListByProfile(
+ public filterByUsage(
ecogestureList: Ecogesture[],
- profileType: ProfileType
+ profileEcogesture: ProfileEcogesture
): Ecogesture[] {
- const filteredEcogestureList: Ecogesture[] = ecogestureList.filter(
- ecogesture => {
- switch (ecogesture.usage) {
- case Usage.HEATING:
- if (
- ecogesture.fluidTypes.includes(FluidType.ELECTRICITY) &&
- profileType.heating === IndividualOrCollective.INDIVIDUAL &&
- profileType.warmingFluid === WarmingType.ELECTRICITY
- ) {
- return true
- } else if (
- ecogesture.fluidTypes.includes(FluidType.GAS) &&
- profileType.heating === IndividualOrCollective.INDIVIDUAL &&
- profileType.warmingFluid === WarmingType.GAS
- ) {
- return true
- } else {
- return false
- }
- case Usage.ECS:
- if (
- ecogesture.fluidTypes.includes(FluidType.ELECTRICITY) &&
- profileType.hotWater === IndividualOrCollective.INDIVIDUAL &&
- profileType.hotWaterFluid === FluidType.ELECTRICITY
- ) {
- return true
- } else if (
- ecogesture.fluidTypes.includes(FluidType.GAS) &&
- profileType.hotWater === IndividualOrCollective.INDIVIDUAL &&
- profileType.hotWaterFluid === FluidType.GAS
- ) {
- return true
- } else {
- return false
- }
- case Usage.COOKING:
- if (
- ecogesture.fluidTypes.includes(FluidType.ELECTRICITY) &&
- profileType.cookingFluid === FluidType.ELECTRICITY
- ) {
- return true
- } else if (
- ecogesture.fluidTypes.includes(FluidType.GAS) &&
- profileType.cookingFluid === FluidType.GAS
- ) {
- return true
- } else {
- return false
- }
- case Usage.COLD_WATER:
- if (profileType.coldWater === IndividualOrCollective.INDIVIDUAL) {
- return true
- } else {
- return false
- }
- case Usage.ELECTRICITY_SPECIFIC:
+ const filteredByUsage: Ecogesture[] = ecogestureList.filter(ecogesture => {
+ switch (ecogesture.usage) {
+ case Usage.HEATING:
+ if (
+ ecogesture.fluidTypes.includes(FluidType.ELECTRICITY) &&
+ profileEcogesture.heating === IndividualOrCollective.INDIVIDUAL &&
+ profileEcogesture.warmingFluid === WarmingType.ELECTRICITY
+ ) {
return true
- case Usage.AIR_CONDITIONING:
- default:
+ } else if (
+ ecogesture.fluidTypes.includes(FluidType.GAS) &&
+ profileEcogesture.heating === IndividualOrCollective.INDIVIDUAL &&
+ profileEcogesture.warmingFluid === WarmingType.GAS
+ ) {
+ return true
+ } else {
+ return false
+ }
+ case Usage.ECS:
+ if (
+ profileEcogesture.hotWater === IndividualOrCollective.INDIVIDUAL
+ ) {
+ return true
+ } else {
return false
+ }
+ default:
+ return true
+ }
+ })
+ return filteredByUsage
+ }
+
+ /**
+ * Removes ecogesture from the list that depends on equipment the user hasn't
+ * @param {Ecogesture[]} ecogestureList
+ * @param {ProfileEcogesture} profileEcogesture
+ * @returns {Ecogesture[]}
+ */
+ public filterByEquipment(
+ 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
+ }
+
+ /**
+ * Return a filtered list according to ecogesture profile, the list is sorted by low difficulty and high efficiency
+ * @param {ProfileEcogesture} profileEcogesture
+ * @returns {Ecogesture[]}
+ */
+ public async getEcogestureListByProfile(
+ profileEcogesture: ProfileEcogesture
+ ): Promise<Ecogesture[]> {
+ const ecogestureList: Ecogesture[] = await this.getAllEcogestures()
+ const filteredByUsage: Ecogesture[] = this.filterByUsage(
+ ecogestureList,
+ profileEcogesture
+ )
+ const filteredByEquipment: Ecogesture[] = this.filterByEquipment(
+ filteredByUsage,
+ profileEcogesture
+ )
+ const filteredFlaggedEcogesture: Ecogesture[] = filteredByEquipment.filter(
+ (ecogesture: Ecogesture) =>
+ (ecogesture.objective === false &&
+ ecogesture.doing === false &&
+ ecogesture.viewedInSelection === false) ||
+ ecogesture.viewedInSelection === true
+ )
+ const sortedByDifficultyAndEfficiency: Ecogesture[] = orderBy(
+ filteredFlaggedEcogesture,
+ [
+ ecogesture => {
+ return ecogesture.difficulty
+ },
+ ecogesture => {
+ return ecogesture.efficiency
+ },
+ ],
+ ['asc', 'desc']
)
- return filteredEcogestureList
+ return sortedByDifficultyAndEfficiency
+ }
+
+ /**
+ * Update one ecogesture
+ * @param {Ecogesture} ecogesture - Ecogesture to save
+ * @returns {Ecogesture} Udpated Ecogesture
+ */
+ public async updateEcogesture(ecogesture: Ecogesture): Promise<Ecogesture> {
+ const {
+ data: updatedEcogesture,
+ }: QueryResult<Ecogesture> = await this._client.save(ecogesture)
+ return updatedEcogesture
}
}
diff --git a/src/services/fluidsPrices.service.spec.ts b/src/services/fluidsPrices.service.spec.ts
index a146ffba2a48c385b6562449d888ebf24b66e54a..c3a9fe500ff6e1cda8c6da1c9b674746e28b19d9 100644
--- a/src/services/fluidsPrices.service.spec.ts
+++ b/src/services/fluidsPrices.service.spec.ts
@@ -2,7 +2,10 @@ import FluidPricesService from './fluidsPrices.service'
import mockClient from '../../tests/__mocks__/client'
import { QueryResult } from 'cozy-client'
import { FluidPrice } from 'models'
-import { fluidPrices } from '../../tests/__mocks__/fluidPrice.mock'
+import {
+ fluidPrices,
+ allLastFluidPrices,
+} from '../../tests/__mocks__/fluidPrice.mock'
import { FluidType } from 'enum/fluid.enum'
import { DateTime } from 'luxon'
@@ -60,4 +63,59 @@ describe('FluidPrices service', () => {
expect(mockClient.query).toBeCalled()
})
})
+
+ describe('Fluid Prices - getAllLastPrices', () => {
+ it('should getAllLastPrice', async () => {
+ const mockQueryResult: QueryResult<FluidPrice[]> = {
+ data: fluidPrices,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
+ const prices = await fluidPricesService.getAllLastPrices()
+ console.log('Prix reçus :', prices)
+ console.log('Prix attendus :', allLastFluidPrices)
+ expect(prices).toStrictEqual(allLastFluidPrices)
+ expect(mockClient.query).toBeCalled()
+ })
+ })
+
+ describe('Fluid Prices - deleteAllFluidsPrices', () => {
+ it('should return true when fluidsPrices stored', async () => {
+ const mockQueryResult: QueryResult<FluidPrice[]> = {
+ data: fluidPrices,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
+ const result = await fluidPricesService.deleteAllFluidsPrices()
+ expect(mockClient.destroy).toBeCalledTimes(6)
+ expect(result).toBe(true)
+ })
+ it('should return true when no fluidsPrices stored', async () => {
+ const mockQueryResult: QueryResult<FluidPrice[]> = {
+ data: [],
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
+ const result = await fluidPricesService.deleteAllFluidsPrices()
+ expect(result).toBe(true)
+ })
+ it('should return false when error happened on deletion', async () => {
+ const mockQueryResult: QueryResult<FluidPrice[]> = {
+ data: fluidPrices,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.destroy.mockRejectedValue(new Error())
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
+ const result = await fluidPricesService.deleteAllFluidsPrices()
+ expect(result).toBe(false)
+ })
+ })
})
diff --git a/src/services/fluidsPrices.service.ts b/src/services/fluidsPrices.service.ts
index 8e131cdfa17e3894591772d6e128701ddb294ee9..2304a2f51321eec5319cf2303014ec02f0eaa422 100644
--- a/src/services/fluidsPrices.service.ts
+++ b/src/services/fluidsPrices.service.ts
@@ -85,4 +85,21 @@ export default class FluidPricesService {
return fluidsPrices
}
+
+ /**
+ * Delete all fluidPrices entities from the db
+ * @returns {boolean} - true when deleted with success
+ * @throws {Error}
+ */
+ public async deleteAllFluidsPrices(): Promise<boolean> {
+ const fluidsPrices = await this.getAllPrices()
+ try {
+ for (let index = 0; index < fluidsPrices.length; index++) {
+ await this._client.destroy(fluidsPrices[index])
+ }
+ return true
+ } catch (error) {
+ return false
+ }
+ }
}
diff --git a/src/services/initialization.service.ts b/src/services/initialization.service.ts
index e01aae8adf5df37f3f18d05fdeafab3f722c1083..923c9836d95a51d89a0bd91de10f9785cc8724f5 100644
--- a/src/services/initialization.service.ts
+++ b/src/services/initialization.service.ts
@@ -56,6 +56,8 @@ import { DateTime } from 'luxon'
import ProfileTypeEntityService from './profileTypeEntity.service'
import TermsService from './terms.service'
import log from 'utils/logger'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import ProfileEcogestureService from './profileEcogesture.service'
export default class InitializationService {
private readonly _client: Client
@@ -195,12 +197,26 @@ export default class InitializationService {
throw error
}
}
+ public async initProfileEcogesture(): Promise<ProfileEcogesture | null> {
+ const profileEcogestureService = new ProfileEcogestureService(this._client)
+ try {
+ const loadedProfileEcogesture = await profileEcogestureService.getProfileEcogesture()
+ log.info('[Initialization] ProfileEcogesture loaded')
+ return loadedProfileEcogesture
+ } catch (error) {
+ log.error('Initialization error - initProfileEcogesture: ', error)
+ throw error
+ }
+ }
public async initEcogesture(hash: string): Promise<string> {
const hashEcogestureType = hashFile(ecogestureData)
const ecogestureService = new EcogestureService(this._client)
// Populate data if none ecogesture exists
- const loadedEcogestures = await ecogestureService.getAllEcogestures()
+ const loadedEcogestures = await ecogestureService.getAllEcogestures(
+ undefined,
+ true
+ )
if (
!loadedEcogestures ||
(loadedEcogestures && loadedEcogestures.length === 0)
@@ -220,23 +236,33 @@ export default class InitializationService {
'initEcogesture: Created ecogesture type entities does not match'
)
}
- log.info('[Initialization] Ecogesture created')
+ log.info('[Initialization] Ecogesture list created')
return hashEcogestureType
} catch (error) {
log.error('Initialization error - initEcogesture: ', error)
throw error
}
}
-
// Update if the hash is not the same as the one from profile
if (hash !== hashEcogestureType) {
// Update the doctype
try {
+ loadedEcogestures
// Deletion of all documents
await ecogestureService.deleteAllEcogestures()
// Population with the data
- for (const ecogesture of ecogestureData) {
- await this._client.create(ECOGESTURE_DOCTYPE, ecogesture)
+ for (const [index, ecogesture] of ecogestureData.entries()) {
+ const updateEcogesture = loadedEcogestures[index]
+ ? {
+ ...ecogesture,
+ objective: loadedEcogestures[index].objective ? true : false,
+ doing: loadedEcogestures[index].doing ? true : false,
+ viewedInSelection: loadedEcogestures[index].viewedInSelection
+ ? true
+ : false,
+ }
+ : ecogesture
+ await this._client.create(ECOGESTURE_DOCTYPE, updateEcogesture)
}
// Check of created document based on count
const checkCount = await ecogestureService.getAllEcogestures()
@@ -256,7 +282,7 @@ export default class InitializationService {
}
} else {
// Doctype already up to date
- log.info('[Initialization] Ecogesture loaded')
+ log.info('[Initialization] Ecogesture already up-to-date')
return hashEcogestureType
}
}
diff --git a/src/services/profileEcogesture.service.spec.ts b/src/services/profileEcogesture.service.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1c516dfb9e48b8e0be508115b9db1c1a18ad707d
--- /dev/null
+++ b/src/services/profileEcogesture.service.spec.ts
@@ -0,0 +1,50 @@
+import { QueryResult } from 'cozy-client'
+import { EquipmentType } from 'enum/ecogesture.enum'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import mockClient from '../../tests/__mocks__/client'
+import { mockProfileEcogestureUpdated } from '../../tests/__mocks__/profileEcogesture.mock'
+import ProfileEcogestureService from './profileEcogesture.service'
+
+const profileEcogestureService = new ProfileEcogestureService(mockClient)
+
+describe('ProfileEcogesture service', () => {
+ it('should get the Profile Ecogesture', async () => {
+ const mockQueryResult: QueryResult<ProfileEcogesture> = {
+ data: mockProfileEcogestureUpdated,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValueOnce(mockQueryResult)
+ const result = await profileEcogestureService.getProfileEcogesture()
+ expect(result).toEqual(mockProfileEcogestureUpdated)
+ })
+ it('should update a profile ecogesture', async () => {
+ const ecogestureProfile = {
+ ...mockProfileEcogestureUpdated,
+ equipments: [
+ EquipmentType.BOILER,
+ EquipmentType.INTERNET_BOX,
+ EquipmentType.FREEZER,
+ ],
+ }
+ const mockQueryResult: QueryResult<ProfileEcogesture> = {
+ data: [mockProfileEcogestureUpdated],
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ const mockQueryResultUpdate: QueryResult<ProfileEcogesture> = {
+ data: ecogestureProfile,
+ bookmark: '',
+ next: false,
+ skip: 0,
+ }
+ mockClient.query.mockResolvedValue(mockQueryResult)
+ mockClient.save.mockResolvedValue(mockQueryResultUpdate)
+ const result = await profileEcogestureService.updateProfileEcogesture({
+ equipments: [EquipmentType.FREEZER],
+ })
+ expect(result).toEqual(ecogestureProfile)
+ })
+})
diff --git a/src/services/profileEcogesture.service.ts b/src/services/profileEcogesture.service.ts
new file mode 100644
index 0000000000000000000000000000000000000000..006809ad390dc64e0566382b4b25b9f75eb3de0c
--- /dev/null
+++ b/src/services/profileEcogesture.service.ts
@@ -0,0 +1,50 @@
+import { Client, QueryDefinition, QueryResult, Q } from 'cozy-client'
+import { PROFILEECOGESTURE_DOCTYPE } from 'doctypes'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+
+export default class ProfileEcogestureService {
+ private readonly _client: Client
+
+ constructor(_client: Client) {
+ this._client = _client
+ }
+ /**
+ * Retrieve the ProfileEcogesture from db
+ * @returns {ProfileEcogesture}
+ */
+ public async getProfileEcogesture(): Promise<ProfileEcogesture | null> {
+ const query: QueryDefinition = Q(PROFILEECOGESTURE_DOCTYPE)
+ const {
+ data: profileEcogesture,
+ }: QueryResult<ProfileEcogesture> = await this._client.query(
+ query.limitBy(1)
+ )
+ if (profileEcogesture) return profileEcogesture
+ else return null
+ }
+
+ /**
+ * Saves ProfileEcogesture in database
+ * @returns {ProfileEcogesture}
+ */
+ public async updateProfileEcogesture(
+ attributes: Partial<ProfileEcogesture>
+ ): Promise<ProfileEcogesture | null> {
+ const query: QueryDefinition = Q(PROFILEECOGESTURE_DOCTYPE)
+ const {
+ data: [doc],
+ }: QueryResult<ProfileEcogesture[]> = await this._client.query(
+ query.limitBy(1)
+ )
+ if (doc) {
+ const {
+ data: profileEcogesture,
+ }: QueryResult<ProfileEcogesture | null> = await this._client.save({
+ ...doc,
+ ...attributes,
+ })
+ if (profileEcogesture) return profileEcogesture
+ }
+ return null
+ }
+}
diff --git a/src/services/profileEcogestureForm.service.ts b/src/services/profileEcogestureForm.service.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6717b877190c2f5eb83cdcb90ccfbfb250907175
--- /dev/null
+++ b/src/services/profileEcogestureForm.service.ts
@@ -0,0 +1,105 @@
+import { EquipmentType } from 'enum/ecogesture.enum'
+import {
+ EcogestureStepForm,
+ ProfileEcogestureAnswerType,
+} from 'enum/ecogestureForm.enum'
+import { IndividualOrCollective, WarmingType } from 'enum/profileType.enum'
+import {
+ ProfileEcogesture,
+ ProfileEcogestureAnswer,
+} from 'models/profileEcogesture.model'
+
+export default class ProfileEcogestureFormService {
+ private readonly profileEcogesture: ProfileEcogesture
+
+ constructor(profileEcogesture: ProfileEcogesture) {
+ this.profileEcogesture = profileEcogesture
+ }
+
+ /**
+ * getNextFormStep
+ * @param {EcogestureStepForm} step
+ * @returns {EcogestureStepForm} next step
+ */
+ public getNextFormStep(step: EcogestureStepForm): EcogestureStepForm {
+ switch (step) {
+ case EcogestureStepForm.HEATING_TYPE:
+ return this.profileEcogesture.heating ===
+ IndividualOrCollective.INDIVIDUAL
+ ? EcogestureStepForm.WARMING_FLUID
+ : EcogestureStepForm.HOT_WATER_TYPE
+ case EcogestureStepForm.WARMING_FLUID:
+ return EcogestureStepForm.HOT_WATER_TYPE
+ case EcogestureStepForm.HOT_WATER_TYPE:
+ return EcogestureStepForm.EQUIPMENTS
+ default:
+ return EcogestureStepForm.HEATING_TYPE
+ }
+ }
+
+ /**
+ * getPreviousFormStep
+ * @param {EcogestureStepForm} step
+ * @returns {EcogestureStepForm} previous step
+ */
+ public getPreviousFormStep(step: EcogestureStepForm): EcogestureStepForm {
+ switch (step) {
+ case EcogestureStepForm.EQUIPMENTS:
+ return EcogestureStepForm.HOT_WATER_TYPE
+ case EcogestureStepForm.HOT_WATER_TYPE:
+ return this.profileEcogesture.heating ===
+ IndividualOrCollective.INDIVIDUAL
+ ? EcogestureStepForm.WARMING_FLUID
+ : EcogestureStepForm.HEATING_TYPE
+ case EcogestureStepForm.WARMING_FLUID:
+ return EcogestureStepForm.HEATING_TYPE
+ default:
+ return EcogestureStepForm.HEATING_TYPE
+ }
+ }
+
+ /**
+ * getAnswerForStep
+ * @param {EcogestureStepForm} step
+ * @returns {EcogestureFormAnswer}
+ */
+ static getAnswerForStep(step: EcogestureStepForm): ProfileEcogestureAnswer {
+ switch (step) {
+ case EcogestureStepForm.HEATING_TYPE:
+ return {
+ type: ProfileEcogestureAnswerType.SINGLE_CHOICE,
+ attribute: 'heating',
+ choices: Object.values(IndividualOrCollective),
+ }
+ case EcogestureStepForm.WARMING_FLUID:
+ return {
+ type: ProfileEcogestureAnswerType.SINGLE_CHOICE,
+ attribute: 'warmingFluid',
+ choices: [
+ WarmingType.ELECTRICITY,
+ WarmingType.GAS,
+ WarmingType.WOOD,
+ WarmingType.FUEL,
+ ],
+ }
+ case EcogestureStepForm.HOT_WATER_TYPE:
+ return {
+ type: ProfileEcogestureAnswerType.SINGLE_CHOICE,
+ attribute: 'hotWater',
+ choices: Object.values(IndividualOrCollective),
+ }
+ case EcogestureStepForm.EQUIPMENTS:
+ return {
+ type: ProfileEcogestureAnswerType.MULTI_CHOICE,
+ attribute: 'equipments',
+ choices: Object.keys(EquipmentType),
+ }
+ default:
+ return {
+ type: ProfileEcogestureAnswerType.SINGLE_CHOICE,
+ attribute: 'heating',
+ choices: Object.values(IndividualOrCollective),
+ }
+ }
+ }
+}
diff --git a/src/store/index.ts b/src/store/index.ts
index 45137173e3b1ce548e1a888e82f56f2ab805f0a9..670d74d464eb86d305f3c090be9a50072285d95c 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -23,11 +23,14 @@ import {
} from 'models'
import { ChartState } from 'models/chart.model'
import { Client } from 'cozy-client'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import { profileEcogestureReducer } from './profileEcogesture/profileEcogesture.reducer'
export interface EcolyoState {
global: GlobalState
profile: Profile
profileType: ProfileType
+ profileEcogesture: ProfileEcogesture
chart: ChartState
modal: ModalState
challenge: ChallengeState
@@ -37,6 +40,7 @@ export const ecolyoReducer = combineReducers({
global: globalReducer,
profile: profileReducer,
profileType: profileTypeReducer,
+ profileEcogesture: profileEcogestureReducer,
chart: chartReducer,
modal: modalReducer,
challenge: challengeReducer,
diff --git a/src/store/profile/profile.reducer.ts b/src/store/profile/profile.reducer.ts
index 94fdf371c201f22d05bbd299111d5da1e177a3cb..8334f1a684c59b14e55bf1dca82d547533851e23 100644
--- a/src/store/profile/profile.reducer.ts
+++ b/src/store/profile/profile.reducer.ts
@@ -23,9 +23,11 @@ const initialState: Profile = {
mailToken: '',
monthlyAnalysisDate: DateTime.fromISO('0000-01-01T00:00:00.000Z'),
isProfileTypeCompleted: false,
+ isProfileEcogestureCompleted: false,
onboarding: {
isWelcomeSeen: false,
},
+ haveSeenEcogestureModal: false,
}
export const profileReducer: Reducer<Profile> = (
diff --git a/src/store/profileEcogesture/profileEcogesture.action.spec.ts b/src/store/profileEcogesture/profileEcogesture.action.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..ce271348d47933e93d7c6fa7374afe0faae50bcc
--- /dev/null
+++ b/src/store/profileEcogesture/profileEcogesture.action.spec.ts
@@ -0,0 +1,45 @@
+import {
+ createMockStore,
+ mockInitialEcolyoState,
+} from '../../../tests/__mocks__/store'
+import { mockProfileEcogesture } from '../../../tests/__mocks__/profileEcogesture.mock'
+import {
+ updateProfileEcogesture,
+ UPDATE_PROFILEECOGESTURE,
+} from './profileEcogesture.actions'
+
+const mockUpdateProfileEcogesture = jest.fn()
+const mockNewProfileEcogestureEntry = jest.fn()
+jest.mock('services/profileEcogesture.service', () => {
+ return jest.fn(() => {
+ return {
+ updateProfileEcogesture: mockUpdateProfileEcogesture,
+ newProfileEcogestureEntry: mockNewProfileEcogestureEntry,
+ }
+ })
+})
+
+describe('profileEcogesture actions', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ let store: any
+ beforeEach(() => {
+ store = createMockStore(mockInitialEcolyoState)
+ })
+ it('should create an UPDATE_PROFILEECOGESTURE action when ecogestureProfile is updated', async () => {
+ mockUpdateProfileEcogesture.mockResolvedValueOnce(mockProfileEcogesture)
+ const expectedActions = [
+ {
+ type: UPDATE_PROFILEECOGESTURE,
+ payload: mockProfileEcogesture,
+ },
+ ]
+ await store.dispatch(updateProfileEcogesture(mockProfileEcogesture))
+ expect(store.getActions()).toEqual(expectedActions)
+ })
+
+ it('should not create action when ProfileEcogesture is not updated', async () => {
+ mockUpdateProfileEcogesture.mockResolvedValueOnce(null)
+ await store.dispatch(updateProfileEcogesture(mockProfileEcogesture))
+ expect(store.getActions()).toEqual([])
+ })
+})
diff --git a/src/store/profileEcogesture/profileEcogesture.actions.ts b/src/store/profileEcogesture/profileEcogesture.actions.ts
new file mode 100644
index 0000000000000000000000000000000000000000..ccf17080f183958a421ebb0008c7879acbcd16dc
--- /dev/null
+++ b/src/store/profileEcogesture/profileEcogesture.actions.ts
@@ -0,0 +1,68 @@
+import { Client } from 'cozy-client'
+import { Dispatch } from 'react'
+import { AppStore } from 'store'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import { PROFILEECOGESTURE_DOCTYPE } from 'doctypes/com-grandlyon-ecolyo-profileecogesture'
+import ProfileEcogestureService from 'services/profileEcogesture.service'
+
+export const UPDATE_PROFILEECOGESTURE = 'UPDATE_PROFILEECOGESTURE'
+export const CREATE_NEW_PROFILEECOGESTURE = 'CREATE_NEW_PROFILEECOGESTURE'
+
+export interface UpdateProfileEcogesture {
+ type: typeof UPDATE_PROFILEECOGESTURE
+ payload?: ProfileEcogesture
+}
+
+export interface CreateNewProfileEcogesture {
+ type: typeof CREATE_NEW_PROFILEECOGESTURE
+ payload?: ProfileEcogesture
+}
+
+export type ProfileEcogestureActionTypes =
+ | UpdateProfileEcogesture
+ | CreateNewProfileEcogesture
+
+export function updateProfileEcogestureSuccess(
+ updatedProfileEcogesture: ProfileEcogesture
+): UpdateProfileEcogesture {
+ return {
+ type: UPDATE_PROFILEECOGESTURE,
+ payload: updatedProfileEcogesture,
+ }
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function updateProfileEcogesture(upd: Partial<ProfileEcogesture>): any {
+ return async (
+ dispatch: Dispatch<UpdateProfileEcogesture>,
+ getState: () => AppStore,
+ { client }: { client: Client }
+ ) => {
+ const profileEcogestureService = new ProfileEcogestureService(client)
+ const updatedProfileEcogesture = await profileEcogestureService.updateProfileEcogesture(
+ upd
+ )
+ if (updatedProfileEcogesture) {
+ dispatch(updateProfileEcogestureSuccess(updatedProfileEcogesture))
+ }
+ }
+}
+
+export function newProfileEcogestureEntry(
+ upd: Partial<ProfileEcogesture>
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+): any {
+ return async (
+ dispatch: Dispatch<UpdateProfileEcogesture>,
+ getState: () => AppStore,
+ { client }: { client: Client }
+ ) => {
+ const { data: newProfileEcogesture } = await client.create(
+ PROFILEECOGESTURE_DOCTYPE,
+ upd
+ )
+ if (newProfileEcogesture) {
+ dispatch(updateProfileEcogestureSuccess(newProfileEcogesture))
+ }
+ }
+}
diff --git a/src/store/profileEcogesture/profileEcogesture.reducer.spec.ts b/src/store/profileEcogesture/profileEcogesture.reducer.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..71662a59115b9f27416a35431f9807b51db7b0f5
--- /dev/null
+++ b/src/store/profileEcogesture/profileEcogesture.reducer.spec.ts
@@ -0,0 +1,31 @@
+import { profileEcogestureReducer } from './profileEcogesture.reducer'
+import { UPDATE_PROFILEECOGESTURE } from './profileEcogesture.actions'
+import {
+ mockProfileEcogesture,
+ mockProfileEcogestureUpdated,
+} from '../../../tests/__mocks__/profileEcogesture.mock'
+
+describe('profileEcogesture reducer', () => {
+ it('should return the initial state', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ const result = profileEcogestureReducer(undefined as any, {
+ type: 'default',
+ })
+ expect(result).toEqual(mockProfileEcogesture)
+ })
+
+ it('should handle UPDATE_PROFILEECOGESTURE with payload', () => {
+ const result = profileEcogestureReducer(mockProfileEcogesture, {
+ type: UPDATE_PROFILEECOGESTURE,
+ payload: mockProfileEcogestureUpdated,
+ })
+ expect(result).toEqual(mockProfileEcogestureUpdated)
+ })
+
+ it('should handle UPDATE_PROFILEECOGESTURE without payload', () => {
+ const result = profileEcogestureReducer(mockProfileEcogesture, {
+ type: UPDATE_PROFILEECOGESTURE,
+ })
+ expect(result).toEqual(mockProfileEcogesture)
+ })
+})
diff --git a/src/store/profileEcogesture/profileEcogesture.reducer.ts b/src/store/profileEcogesture/profileEcogesture.reducer.ts
new file mode 100644
index 0000000000000000000000000000000000000000..40646dc63bdf98987d663bd7ef7820cbf04d7480
--- /dev/null
+++ b/src/store/profileEcogesture/profileEcogesture.reducer.ts
@@ -0,0 +1,31 @@
+import { Reducer } from 'redux'
+import { IndividualOrCollective, WarmingType } from 'enum/profileType.enum'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
+import {
+ CREATE_NEW_PROFILEECOGESTURE,
+ ProfileEcogestureActionTypes,
+ UPDATE_PROFILEECOGESTURE,
+} from './profileEcogesture.actions'
+
+const initialState: ProfileEcogesture = {
+ heating: IndividualOrCollective.INDIVIDUAL,
+ warmingFluid: WarmingType.ELECTRICITY,
+ hotWater: IndividualOrCollective.INDIVIDUAL,
+ equipments: [],
+}
+
+export const profileEcogestureReducer: Reducer<ProfileEcogesture> = (
+ state = initialState,
+ action: ProfileEcogestureActionTypes
+): ProfileEcogesture => {
+ switch (action.type) {
+ case UPDATE_PROFILEECOGESTURE:
+ case CREATE_NEW_PROFILEECOGESTURE:
+ return {
+ ...state,
+ ...action.payload,
+ }
+ default:
+ return state
+ }
+}
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 012d283140428fd1ad391c5f2e709ee1597cb7fa..6e47ddb514e9faab0bc57307ebb88ca09e5d2b70 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -52,16 +52,12 @@
--waterColorRadialGradient: #{$water-color-radial-gradient};
}
-html {
- // min-height: calc(100% + env(safe-area-inset-top));
- // padding: env(safe-area-inset-top) env(safe-area-inset-right)
- // env(safe-area-inset-bottom) env(safe-area-inset-left);
-}
-
.application {
- @media #{$large-phone} {
- min-height: 100vh;
- }
+ // @media #{$large-phone} {
+ // min-height: calc(
+ // 100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom)
+ // );
+ // }
overflow-x: hidden;
background-color: $default-background;
}
diff --git a/src/targets/services/fluidsPrices.ts b/src/targets/services/fluidsPrices.ts
index d658871d4e3ebcec0aba0f5e4c8d81d64c3650e5..32a9e11d1e82771656ec72055a2c37b2de2f9eeb 100644
--- a/src/targets/services/fluidsPrices.ts
+++ b/src/targets/services/fluidsPrices.ts
@@ -6,11 +6,7 @@ import FluidPricesService from 'services/fluidsPrices.service'
import { DataloadEntity, TimePeriod } from 'models'
import ConsumptionDataManager from 'services/consumption.service'
import { TimeStep } from 'enum/timeStep.enum'
-import {
- ENEDIS_DAY_DOCTYPE,
- ENEDIS_MINUTE_DOCTYPE,
- GRDF_DAY_DOCTYPE,
-} from 'doctypes'
+import { ENEDIS_DAY_DOCTYPE, GRDF_DAY_DOCTYPE, EGL_DAY_DOCTYPE } from 'doctypes'
import { FluidType } from 'enum/fluid.enum'
import QueryRunner from 'services/queryRunner.service'
const log = logger.namespace('fluidPrices')
@@ -64,7 +60,7 @@ const aggregatePrices = async (
) => {
const tsa = [TimeStep.MONTH, TimeStep.YEAR]
log('debug', `Aggregation...`)
- const aggregartePromises = tsa.map(async ts => {
+ const aggregatePromises = tsa.map(async ts => {
return new Promise<void>(async resolve => {
let date: DateTime = DateTime.local()
Object.assign(date, firstDate)
@@ -97,7 +93,7 @@ const aggregatePrices = async (
})
})
- await Promise.all(aggregartePromises)
+ await Promise.all(aggregatePromises)
log('debug', `Aggregation done`)
}
@@ -108,6 +104,9 @@ const getDoctypeTypeByFluid = (fluidType: FluidType): string => {
if (fluidType === FluidType.GAS) {
return GRDF_DAY_DOCTYPE
}
+ if (fluidType === FluidType.WATER) {
+ return EGL_DAY_DOCTYPE
+ }
log('error', 'Unkown FluidType')
throw new Error()
}
@@ -116,9 +115,10 @@ const getTimeSetByFluid = (fluidType: FluidType): TimeStep[] => {
if (fluidType === FluidType.ELECTRICITY) {
return [TimeStep.DAY, TimeStep.HALF_AN_HOUR]
}
- if (fluidType === FluidType.GAS) {
+ if (fluidType === FluidType.GAS || fluidType === FluidType.WATER) {
return [TimeStep.DAY]
}
+
log('error', 'Unkown FluidType')
throw new Error()
}
@@ -204,8 +204,12 @@ const processPrices = async ({ client }: PricesProps) => {
log('info', `Electricity data done`)
log('info', `Processing gas data...`)
const gas = applyPrices(client, FluidType.GAS)
- await Promise.all([elec, gas])
log('info', `Gas data done`)
+ log('info', `Processing water data...`)
+ const water = applyPrices(client, FluidType.WATER)
+ log('info', `Water data done`)
+ await Promise.all([elec, gas, water])
+ log('info', `processPrices done`)
}
runService(processPrices)
diff --git a/src/utils/hash.spec.ts b/src/utils/hash.spec.ts
index 22f9a2b752a88d26f31f827d475446faf04c4a21..875565bcce2144fa3ba8cbfaae030449e8e6b294 100644
--- a/src/utils/hash.spec.ts
+++ b/src/utils/hash.spec.ts
@@ -5,7 +5,7 @@ describe('hash utilis test', () => {
describe('hashFile test', () => {
it('should return the correct hash of the file', () => {
const result = hashFile(ecogesturesData)
- expect(result).toBe('8360d4805f19a732e6b43a41f972c324c8e06488')
+ expect(result).toBe('a4bfebe7779dbf65f92591b2b6226ac7eb78097e')
})
})
})
diff --git a/tests/__mocks__/actionData.mock.ts b/tests/__mocks__/actionData.mock.ts
index 65c0a353861dc1f07e6500257f03fa920ef38f93..538a3fba4841f3708bde6512d6188f904c7ad04b 100644
--- a/tests/__mocks__/actionData.mock.ts
+++ b/tests/__mocks__/actionData.mock.ts
@@ -16,7 +16,6 @@ export const defaultEcogestureData: Ecogesture[] = [
difficulty: 1,
room: [1, 2],
season: Season.NONE,
-
equipment: false,
equipmentType: [],
equipmentInstallation: true,
@@ -24,6 +23,9 @@ export const defaultEcogestureData: Ecogesture[] = [
action: true,
actionName: "Je me lave les mains uniquement à l'eau froide.",
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
_id: 'ECOGESTURE0014',
@@ -49,6 +51,9 @@ export const defaultEcogestureData: Ecogesture[] = [
actionName:
'J’attends que les plats chauds aient refroidi avant de les mettre au réfrigérateur et je les couvre.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
id: 'ECOGESTURE0030',
@@ -73,6 +78,9 @@ export const defaultEcogestureData: Ecogesture[] = [
actionName:
'J’optimise le rangement dans mon réfrigérateur et/ou congélateur.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
]
@@ -97,6 +105,9 @@ export const ecogestureDefault: Ecogesture = {
action: true,
actionName: "Je me lave les mains uniquement à l'eau froide.",
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
}
export const AllEcogestureData: Ecogesture[] = [
@@ -122,6 +133,9 @@ export const AllEcogestureData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
_id: 'ECOGESTURE0002',
@@ -144,6 +158,9 @@ export const AllEcogestureData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
_id: 'ECOGESTURE0003',
@@ -168,6 +185,9 @@ export const AllEcogestureData: Ecogesture[] = [
actionName:
'Je ferme les portes entre les pièces chauffées et moins chauffées.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
_id: 'ECOGESTURE0004',
@@ -190,6 +210,9 @@ export const AllEcogestureData: Ecogesture[] = [
action: true,
actionName: "Je coupe l'eau de la douche pendant que je me savonne.",
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
_id: 'ECOGESTURE0005',
@@ -212,6 +235,9 @@ export const AllEcogestureData: Ecogesture[] = [
action: true,
actionName: 'Je ferme l’eau du robinet quand je me lave les dents.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
{
_id: 'ECOGESTURE0006',
@@ -234,5 +260,8 @@ export const AllEcogestureData: Ecogesture[] = [
action: true,
actionName: 'Je dépoussière mes radiateurs.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
},
]
diff --git a/tests/__mocks__/ecogesturesData.mock.ts b/tests/__mocks__/ecogesturesData.mock.ts
index 7b055ffe213bfc903d1056966f33e9097284f00e..e20933fb6b988babb8d6202932739e5914a4f7fe 100644
--- a/tests/__mocks__/ecogesturesData.mock.ts
+++ b/tests/__mocks__/ecogesturesData.mock.ts
@@ -24,6 +24,9 @@ export const ecogesturesData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -48,6 +51,9 @@ export const ecogesturesData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
@@ -75,6 +81,9 @@ export const ecogesturesData: Ecogesture[] = [
actionName:
'J’utilise le cycle court à basse température pour laver le linge et la vaisselle.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE0013',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -103,6 +112,9 @@ export const ecogesturesHeatingData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -127,6 +139,9 @@ export const ecogesturesHeatingData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -153,7 +168,9 @@ export const ecogesturesHeatingData: Ecogesture[] = [
actionName:
'J’utilise le cycle court à basse température pour laver le linge et la vaisselle.',
actionDuration: 3,
-
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE0013',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -182,6 +199,9 @@ export const ecogesturesECSData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -206,6 +226,9 @@ export const ecogesturesECSData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -233,7 +256,9 @@ export const ecogesturesECSData: Ecogesture[] = [
actionName:
'J’utilise le cycle court à basse température pour laver le linge et la vaisselle.',
actionDuration: 3,
-
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: 'ECOGESTURE0013',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -262,6 +287,9 @@ export const ecogesturesCookingData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -286,7 +314,9 @@ export const ecogesturesCookingData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
-
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -313,6 +343,9 @@ export const ecogesturesCookingData: Ecogesture[] = [
actionName:
'J’utilise le cycle court à basse température pour laver le linge et la vaisselle.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '0013',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -339,6 +372,9 @@ export const ecogesturesCookingData: Ecogesture[] = [
actionName:
'J’attends que les plats chauds aient refroidi avant de les mettre au réfrigérateur et je les couvre.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '0014',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -367,6 +403,9 @@ export const ecogesturesElecSpecificData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -391,6 +430,9 @@ export const ecogesturesElecSpecificData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -417,6 +459,9 @@ export const ecogesturesElecSpecificData: Ecogesture[] = [
actionName:
'J’utilise le cycle court à basse température pour laver le linge et la vaisselle.',
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '0013',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -445,6 +490,9 @@ export const ecogesturesAirConditioningData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -469,6 +517,9 @@ export const ecogesturesAirConditioningData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -495,7 +546,9 @@ export const ecogesturesAirConditioningData: Ecogesture[] = [
actionName:
'J’utilise le cycle court à basse température pour laver le linge et la vaisselle.',
actionDuration: 3,
-
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '0013',
_rev: '1-0b2761dd4aef79556c7aef144060fde6',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -524,7 +577,9 @@ export const ecogesturesColdWaterData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
-
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '001',
_rev: '1-67f1ea36efdd892c96bf64a8943154cd',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -549,8 +604,68 @@ export const ecogesturesColdWaterData: Ecogesture[] = [
action: false,
actionName: null,
actionDuration: 3,
+ doing: false,
+ objective: false,
+ viewedInSelection: false,
_id: '002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
},
]
+
+export const BoilerEcogesture: Ecogesture[] = [
+ {
+ fluidTypes: [FluidType.ELECTRICITY, FluidType.WATER],
+ id: '0046',
+ longDescription:
+ "Pourquoi continuer à chauffer de l’eau lorsqu’on n’est pas là pour l’utiliser ? Si vous possédez un chauffe-eau à accumulation et que vous partez plusieurs jours, il peut être utile de le couper car il continuera de consommer pour maintenir l’eau à température. Attention cependant à la douche froide du retour, n'oubliez de le remettre en marche en rentrant !",
+ longName: 'Je coupe mon chauffe-eau dès que je pars plus de 4 jours.',
+ shortName: 'Déesse du feu',
+ usage: Usage.ALL,
+ impactLevel: 6,
+ efficiency: 3,
+ difficulty: 2,
+ room: [Room.ALL],
+ season: Season.WINTER,
+ equipment: true,
+ equipmentType: [EquipmentType.BOILER],
+ equipmentInstallation: true,
+ investment: null,
+ action: false,
+ actionName: null,
+ actionDuration: 3,
+ doing: false,
+ objective: false,
+ _id: '001',
+ _rev: '1-67f1ea36efdd892c96bf64a8943154cd',
+ _type: 'com.grandlyon.ecolyo.ecogesture',
+ },
+]
+export const BoilerEcogestureFalse: Ecogesture[] = [
+ {
+ fluidTypes: [FluidType.ELECTRICITY, FluidType.WATER],
+ id: '0046',
+ longDescription:
+ "Pourquoi continuer à chauffer de l’eau lorsqu’on n’est pas là pour l’utiliser ? Si vous possédez un chauffe-eau à accumulation et que vous partez plusieurs jours, il peut être utile de le couper car il continuera de consommer pour maintenir l’eau à température. Attention cependant à la douche froide du retour, n'oubliez de le remettre en marche en rentrant !",
+ longName: 'Je coupe mon chauffe-eau dès que je pars plus de 4 jours.',
+ shortName: 'Déesse du feu',
+ usage: Usage.ALL,
+ impactLevel: 6,
+ efficiency: 3,
+ difficulty: 2,
+ room: [Room.ALL],
+ season: Season.WINTER,
+ equipment: false,
+ equipmentType: [EquipmentType.BOILER],
+ equipmentInstallation: true,
+ investment: null,
+ action: false,
+ actionName: null,
+ actionDuration: 3,
+ doing: false,
+ objective: false,
+ _id: '001',
+ _rev: '1-67f1ea36efdd892c96bf64a8943154cd',
+ _type: 'com.grandlyon.ecolyo.ecogesture',
+ },
+]
diff --git a/tests/__mocks__/fluidPrice.mock.ts b/tests/__mocks__/fluidPrice.mock.ts
index ad5ebb80648710f7f0ac02739c4533260ed63734..63f6b6f5685891810c323a7a27d012aef1357956 100644
--- a/tests/__mocks__/fluidPrice.mock.ts
+++ b/tests/__mocks__/fluidPrice.mock.ts
@@ -17,11 +17,18 @@ export const fluidPrices: FluidPrice[] = [
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
- endDate: '2021-10-31T23:59:59.000Z',
+ endDate: '',
fluidType: 0,
price: 0.1329,
startDate: '2021-10-10T00:00:00.000Z',
},
+ {
+ _id: '03045ea1afecc7a86e5443a52e00b07d',
+ endDate: '',
+ fluidType: 1,
+ price: 0.0039,
+ startDate: '2013-08-01T00:00:00.000Z',
+ },
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
endDate: '2014-10-31T23:59:59.000Z',
@@ -29,28 +36,35 @@ export const fluidPrices: FluidPrice[] = [
price: 1.029,
startDate: '2013-08-01T00:00:00.000Z',
},
+ {
+ _id: '03045ea1afecc7a86e5443a52e00b07d',
+ endDate: '',
+ fluidType: 2,
+ price: 1.029,
+ startDate: '2014-11-01T00:00:00.000Z',
+ },
]
-export const allFluidPrices: FluidPrice[] = [
+export const allLastFluidPrices: FluidPrice[] = [
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
endDate: '',
fluidType: 0,
- price: 0.1429,
- startDate: '2020-08-01T00:00:00.000Z',
+ price: 0.1329,
+ startDate: '2021-10-10T00:00:00.000Z',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
endDate: '',
fluidType: 1,
- price: 0.1529,
- startDate: '2021-01-01T00:00:00.000Z',
+ price: 0.0039,
+ startDate: '2013-08-01T00:00:00.000Z',
},
{
_id: '03045ea1afecc7a86e5443a52e00b07d',
endDate: '',
fluidType: 2,
- price: 0.1329,
- startDate: '2021-10-10T00:00:00.000Z',
+ price: 1.029,
+ startDate: '2014-11-01T00:00:00.000Z',
},
]
diff --git a/tests/__mocks__/profile.mock.ts b/tests/__mocks__/profile.mock.ts
index fa8a65ba639eead6c7876f43225c4b6af7c717ed..aaee9099c64830813737693e0113150e2419adf6 100644
--- a/tests/__mocks__/profile.mock.ts
+++ b/tests/__mocks__/profile.mock.ts
@@ -29,4 +29,6 @@ export const profileData: Profile = {
onboarding: {
isWelcomeSeen: false,
},
+ haveSeenEcogestureModal: false,
+ isProfileEcogestureCompleted: false,
}
diff --git a/tests/__mocks__/profileEcogesture.mock.ts b/tests/__mocks__/profileEcogesture.mock.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5489fead6c303f7c780c3fb55c13c3aad1969510
--- /dev/null
+++ b/tests/__mocks__/profileEcogesture.mock.ts
@@ -0,0 +1,29 @@
+import { EquipmentType } from 'enum/ecogesture.enum'
+import { ProfileEcogestureAnswerType } from 'enum/ecogestureForm.enum'
+import { IndividualOrCollective, WarmingType } from 'enum/profileType.enum'
+import {
+ ProfileEcogesture,
+ ProfileEcogestureAnswer,
+} from 'models/profileEcogesture.model'
+
+export const mockProfileEcogesture: ProfileEcogesture = {
+ heating: IndividualOrCollective.INDIVIDUAL,
+ warmingFluid: WarmingType.ELECTRICITY,
+ hotWater: IndividualOrCollective.INDIVIDUAL,
+ equipments: [],
+}
+export const mockProfileEcogestureUpdated: ProfileEcogesture = {
+ heating: IndividualOrCollective.INDIVIDUAL,
+ warmingFluid: WarmingType.ELECTRICITY,
+ hotWater: IndividualOrCollective.INDIVIDUAL,
+ equipments: [EquipmentType.BOILER, EquipmentType.INTERNET_BOX],
+}
+
+export const mockEcogestureAnswer: ProfileEcogestureAnswer = {
+ type: ProfileEcogestureAnswerType.SINGLE_CHOICE,
+ attribute: 'heating',
+ choices: [
+ IndividualOrCollective.INDIVIDUAL,
+ IndividualOrCollective.COLLECTIVE,
+ ],
+}
diff --git a/tests/__mocks__/store.ts b/tests/__mocks__/store.ts
index 12e187a9ad7100c2c0f94b6719e9239600d3925e..38527720544dd537c7c879b6229fc93dff018f70 100644
--- a/tests/__mocks__/store.ts
+++ b/tests/__mocks__/store.ts
@@ -25,7 +25,7 @@ import configureStore from 'redux-mock-store'
import thunkMiddleware from 'redux-thunk'
import { EcolyoState } from 'store'
import mockClient from './client'
-
+import { mockProfileEcogesture } from './profileEcogesture.mock'
export const mockInitialGlobalState: GlobalState = {
screenType: ScreenType.MOBILE,
challengeExplorationNotification: false,
@@ -117,12 +117,14 @@ export const mockInitialProfileState: Profile = {
sendConsumptionAlert: false,
waterDailyConsumptionLimit: 0,
sendAnalysisNotification: true,
+ isProfileEcogestureCompleted: false,
mailToken: '',
monthlyAnalysisDate: DateTime.fromISO('0000-01-01T00:00:00.000Z'),
isProfileTypeCompleted: false,
onboarding: {
isWelcomeSeen: false,
},
+ haveSeenEcogestureModal: false,
}
export const mockInitialProfileTypeState: ProfileType = {
@@ -175,6 +177,7 @@ export const mockInitialEcolyoState = {
global: mockInitialGlobalState,
profile: mockInitialProfileState,
profileType: mockInitialProfileTypeState,
+ profileEcogesture: mockProfileEcogesture,
chart: mockInitialChartState,
modal: mockInitialModalState,
challenge: mockInitialChallengeState,