diff --git a/src/assets/icons/ico/profile.svg b/src/assets/icons/ico/profile.svg
new file mode 100644
index 0000000000000000000000000000000000000000..aff18fe54813cc5f5777ce35bf1ecfb93fc533a7
--- /dev/null
+++ b/src/assets/icons/ico/profile.svg
@@ -0,0 +1,5 @@
+<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="18.5" cy="18.5" r="18" stroke="white"/>
+<circle cx="18.5" cy="13.5" r="5.5" fill="white"/>
+<path d="M8 26C8 22.4735 9.60771 19.4852 13 19C14.3163 20.1296 16.5 21 18.5 21C22 21 22.5 20 24 19C27.3923 19.4852 29 22.4735 29 26V27C29 27 25 28 18.5 28C12 28 8 27 8 27V26Z" fill="white"/>
+</svg>
diff --git a/src/components/Options/OptionsView.tsx b/src/components/Options/OptionsView.tsx
index 7a40b8c63d4474b824e577daef8314b0da346ef8..e58f22d61b9a40c3bd04638138f120eeb62afe80 100644
--- a/src/components/Options/OptionsView.tsx
+++ b/src/components/Options/OptionsView.tsx
@@ -7,6 +7,7 @@ import ReportOptions from 'components/Options/ReportOptions'
import FAQLink from 'components/FAQ/FAQLink'
import LegalNoticeLink from 'components/LegalNotice/LegalNoticeLink'
import Version from 'components/Version/Version'
+import ProfileTypeOptions from './ProfileTypeOptions'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import logoGrandLyon from 'assets/icons/tabbar/grand-lyon.svg'
@@ -29,6 +30,7 @@ const OptionsView: React.FC = () => {
<Content height={headerHeight}>
<KonnectorViewerList isParam={true} />
<ReportOptions />
+ <ProfileTypeOptions />
<FAQLink />
<LegalNoticeLink />
<div className="parameters-logos">
diff --git a/src/components/Options/ProfileTypeOptions.tsx b/src/components/Options/ProfileTypeOptions.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..76eb049e464ddf38f480a7c27ff92b2115dc05e3
--- /dev/null
+++ b/src/components/Options/ProfileTypeOptions.tsx
@@ -0,0 +1,119 @@
+import React, { useState } from 'react'
+import { useSelector } from 'react-redux'
+import { NavLink } from 'react-router-dom'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { AppStore } from 'store'
+import StyledCard from 'components/CommonKit/Card/StyledCard'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import profileIcon from 'assets/icons/ico/profile.svg'
+import './profileTypeOptions.scss'
+
+const ProfileTypeOptions: React.FC = () => {
+ const profile = useSelector((state: AppStore) => state.ecolyo.profile)
+ const { t } = useI18n()
+ return (
+ <div className="profile-type-root">
+ <div className="profile-type-content">
+ <div className="head text-14-normal-uppercase">
+ {t('profile.title_profile')}
+ </div>
+ <div className="profile-container">
+ <div className="fields">
+ <div className="label">{t('profile.title_housing')}</div>
+ <div className="value">
+ {t(`profile.housing_type.${profile.profileType.housingType}`)}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_construction')}</div>
+ <div className="value">
+ {t(
+ `profile.construction_year.${profile.profileType.constructionYear}`
+ )}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_area')}</div>
+ <div className="value">{profile.profileType.area}</div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_occupants')}</div>
+ <div className="value">{profile.profileType.occupantsNumber}</div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_outsideFacingWalls')}</div>
+ <div className="value">
+ {profile.profileType.outsideFacingWalls}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_floor')}</div>
+ <div className="value">
+ {t(`profile.floor.${profile.profileType.floor}`)}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_heating')}</div>
+ <div className="value">
+ {t(`profile.heating.${profile.profileType.heating}`)}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_insulation_work')}</div>
+ <div className="value">
+ {t(
+ `profile.insulation_work.${profile.profileType.individualInsulationWork}`
+ )}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">
+ {t('profile.title_facilities_installation')}
+ </div>
+ <div className="value">
+ {t(
+ `profile.facilities_installation.${profile.profileType.facilitiesInstallation}`
+ )}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_hotWaterEquipment')}</div>
+ <div className="value">
+ {t(
+ `profile.hotWaterEquipment.${profile.profileType.hotWaterEquipment}`
+ )}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_heating_source')}</div>
+ <div className="value">
+ {t(`profile.fluidType.${profile.profileType.warmingFluid}`)}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_warm_water_source')}</div>
+ <div className="value">
+ {t(`profile.fluidType.${profile.profileType.hotWaterFluid}`)}
+ </div>
+ </div>
+ <div className="fields">
+ <div className="label">{t('profile.title_cooking_source')}</div>
+ <div className="value">
+ {t(`profile.fluidType.${profile.profileType.cookingFluid}`)}
+ </div>
+ </div>
+ </div>
+ <NavLink className="profile-link" to="/profile">
+ <StyledCard>
+ <StyledIcon className="profile-icon" icon={profileIcon} size={50} />
+ <span className="link-label text-16-normal">
+ {t('profile.read_profile')}
+ </span>
+ </StyledCard>
+ </NavLink>
+ </div>
+ </div>
+ )
+}
+
+export default ProfileTypeOptions
diff --git a/src/components/Options/profileTypeOptions.scss b/src/components/Options/profileTypeOptions.scss
new file mode 100644
index 0000000000000000000000000000000000000000..a2c116f6cbea1e0a0a5e4f7b0d811dc3b80898a7
--- /dev/null
+++ b/src/components/Options/profileTypeOptions.scss
@@ -0,0 +1,50 @@
+@import 'src/styles/base/color';
+@import 'src/styles/base/breakpoint';
+
+.profile-type-root {
+ margin-top: 2rem;
+ padding: 0 1.5rem;
+ .profile-type-content {
+ margin: 0 auto;
+ width: 100%;
+ @media (min-width: $width-large-phone) {
+ width: 45.75rem;
+ }
+ }
+ .value {
+ color: $white;
+ }
+ .head {
+ color: $grey-bright;
+ }
+ .head {
+ margin-bottom: 1.5rem;
+ }
+ .label {
+ color: $soft-grey;
+ }
+ .profile-container {
+ display: flex;
+ flex-wrap: wrap;
+ white-space: nowrap;
+ }
+ .fields {
+ flex-basis: 50%;
+ margin-bottom: 1rem;
+ }
+ .profile-link {
+ color: $grey-bright;
+ text-decoration: none;
+ .profile-icon {
+ vertical-align: middle;
+ }
+ .link-label {
+ margin-left: 1rem;
+ }
+ button {
+ > div {
+ padding: 0.75rem 1rem;
+ }
+ }
+ }
+}
diff --git a/src/locales/fr.json b/src/locales/fr.json
index a6950b410203e2fd17834df5469556c11eb3f615..555e3d6770643f03cda09a2d736a753b4eb4c8de 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -404,6 +404,72 @@
},
"action": {
"title_action": "Action",
- "select_action" : "Je choisis cette action"
+ "select_action": "Je choisis cette action"
+ },
+ "profile": {
+ "title_profile": "Profil de consommation",
+ "read_profile": "Ajuster mon profil",
+ "title_housing": "Logement",
+ "housing_type": {
+ "individual_house": "Maison individuelle",
+ "appartment": "appartement"
+ },
+ "title_construction": "Construction",
+ "construction_year": {
+ "before_1948": "avant 1948",
+ "between_1948_and_1974": "Entre 1975 et 1989",
+ "between_1975_and_1989": "Entre 1975 et 1989",
+ "between_1990_and_1998": "Entre 1990 et 1998",
+ "after_1999": "après 1999"
+ },
+ "title_area": "Surface",
+ "title_occupants": "Nombre d'occupants",
+ "title_outsideFacingWalls": "Mitoyenneté",
+ "title_floor": "Étage",
+ "floor": {
+ "ground_floor": "RDC",
+ "intermediate_floor": "Étage intermédiaire",
+ "last_floor": "Dernier étage",
+ "not_applicable": "Sans objet"
+ },
+ "title_heating": "Chauffage",
+ "heating": {
+ "individual": "Individuel",
+ "collective": "Collectif"
+ },
+ "title_insulation_work": "Travaux",
+ "insulation_work": {
+ "none": "Aucun",
+ "roof_insulation": "Isolation toîture",
+ "window_replacement": "Remplacement fenêtre",
+ "wall_insulation": "Isolation des murs",
+ "window_replacement_and_wall_insulation": "Rempacement fenêtre et isolation des murs",
+ "window_replacement_and_roof_insulation": "Remplacement fenêtre et isolation toîture",
+ "roof_and_wall_insulation": "Isolation toîture et murs",
+ "window_replacement_and_roof_and_wall_insulation": "Rempacement fenêtre et isolation des murs et isolation toîture",
+ "built_after_1998": "construit après 1998"
+ },
+ "title_facilities_installation": "Équipement",
+ "facilities_installation": {
+ "none": "aucun",
+ "collective_heater": "chauffage collectif",
+ "individual_heater": "chauffage individuel",
+ "individual_ventilation": "ventilation double flux individuel",
+ "individual_heater_and_ventilation": "chauffage et ventilation individuel"
+ },
+ "title_hotWaterEquipment": "Eau chaude",
+ "hotWaterEquipment": {
+ "solar": "solaire",
+ "thermodynamic": "Thermodynamique",
+ "other": "Autre"
+ },
+ "title_heating_source": "Source chauffage",
+ "title_warm_water_source": "Source eau chaude",
+ "title_cooking_source": "Source cuisson",
+ "fluidType": {
+ "0": "Électricité",
+ "1": "Eau",
+ "2": "Gaz"
+ }
}
}