Display profile in form if completed + add hint multichoice

src/components/ProfileType/ProfileTypeFormMultiChoice.tsx

@@ -6,7 +6,6 @@ import ProfileTypeProgress from 'components/ProfileType/ProfileTypeProgress'
 import ProfileTypeNavigation from 'components/ProfileType/ProfileTypeNavigation'
 import { remove } from 'lodash'
 import {
-  FacilitiesInstallation,
   IndividualInsulationWork,
   ProfileTypeStepForm,
 } from 'enum/profileType.enum'
@@ -23,6 +22,7 @@ interface ProfileTypeFormMultiChoiceProps {
   answerType: ProfileTypeAnswer
   setNextStep: Function
   setPrevioustStep: Function
+  isProfileTypeComplete: boolean
 }
 
 const ProfileTypeFormMultiChoice: React.FC<ProfileTypeFormMultiChoiceProps> = ({
@@ -32,6 +32,7 @@ const ProfileTypeFormMultiChoice: React.FC<ProfileTypeFormMultiChoiceProps> = ({
   answerType,
   setNextStep,
   setPrevioustStep,
+  isProfileTypeComplete,
 }: ProfileTypeFormMultiChoiceProps) => {
   const { t } = useI18n()
   const [answer, setAnswer] = useState<ProfileTypeAnswerChoices[]>([])
@@ -44,23 +45,15 @@ const ProfileTypeFormMultiChoice: React.FC<ProfileTypeFormMultiChoiceProps> = ({
       remove(tempAnswer, function(n) {
         return n === 'none' || n === value
       })
-      remove(tempAnswer, function(n) {
-        return n === 'collective_heater' || n === value
-      })
       remove(tempAnswer, function(n) {
         return n === 'other' || n === value
       })
-    } else if (value === 'collective_heater' && !tempAnswer.includes(value)) {
-      tempAnswer = [value]
     } else if (value === 'other' && !tempAnswer.includes(value)) {
       tempAnswer = [value]
     } else {
       remove(tempAnswer, function(n) {
         return n === 'none'
       })
-      remove(tempAnswer, function(n) {
-        return n === 'collective_heater'
-      })
       remove(tempAnswer, function(n) {
         return n === 'other'
       })
@@ -82,20 +75,21 @@ const ProfileTypeFormMultiChoice: React.FC<ProfileTypeFormMultiChoiceProps> = ({
   }, [profileType, setPrevioustStep])
 
   const handleNext = useCallback(() => {
-    profileType[answerType.attribute] = answer as
-      | IndividualInsulationWork[]
-      | FacilitiesInstallation[]
+    profileType[answerType.attribute] = answer as IndividualInsulationWork[]
     setNextStep(profileType)
   }, [profileType, setNextStep, answer, answerType.attribute])
 
   useEffect(() => {
+    const attribute = profileType[
+      answerType.attribute
+    ] as IndividualInsulationWork[]
+    setAnswer(attribute)
     if (step < viewedStep) {
-      const attribute = profileType[answerType.attribute] as
-        | IndividualInsulationWork[]
-        | FacilitiesInstallation[]
+      setAnswer(attribute)
+    } else if (isProfileTypeComplete) {
       setAnswer(attribute)
     }
-  }, [step, viewedStep, profileType, answerType])
+  }, [step, viewedStep, profileType, answerType, isProfileTypeComplete])
 
   return (
     <>
@@ -106,6 +100,7 @@ const ProfileTypeFormMultiChoice: React.FC<ProfileTypeFormMultiChoiceProps> = ({
             `profile_type.${ProfileTypeStepForm[step].toLowerCase()}.question`
           )}
         </div>
+        <span>{t('profile_type.multi_choices')}</span>
         {answerType.choices.map(
           (value: ProfileTypeAnswerChoices, index: number) => {
             return value ? (

src/components/ProfileType/ProfileTypeFormNumber.tsx

@@ -17,6 +17,7 @@ interface ProfileTypeFormNumberProps {
   answerType: ProfileTypeAnswer
   setNextStep: Function
   setPrevioustStep: Function
+  isProfileTypeComplete: boolean
 }
 
 const ProfileTypeFormNumber: React.FC<ProfileTypeFormNumberProps> = ({
@@ -26,6 +27,7 @@ const ProfileTypeFormNumber: React.FC<ProfileTypeFormNumberProps> = ({
   answerType,
   setNextStep,
   setPrevioustStep,
+  isProfileTypeComplete,
 }: ProfileTypeFormNumberProps) => {
   const { t } = useI18n()
   const [answer, setAnswer] = useState<ProfileTypeAnswerChoices>('')
@@ -42,8 +44,9 @@ const ProfileTypeFormNumber: React.FC<ProfileTypeFormNumberProps> = ({
   useEffect(() => {
     if (step < viewedStep) {
       setAnswer(profileType[answerType.attribute])
-    }
-  }, [step, viewedStep, profileType, answerType])
+    } else if (isProfileTypeComplete)
+      setAnswer(profileType[answerType.attribute])
+  }, [step, viewedStep, profileType, answerType, isProfileTypeComplete])
 
   return (
     <>

src/components/ProfileType/ProfileTypeFormNumberSelection.tsx

@@ -17,6 +17,7 @@ interface ProfileTypeFormNumberSelectionProps {
   answerType: ProfileTypeAnswer
   setNextStep: Function
   setPrevioustStep: Function
+  isProfileTypeComplete: boolean
 }
 
 const ProfileTypeFormNumberSelection: React.FC<ProfileTypeFormNumberSelectionProps> = ({
@@ -26,6 +27,7 @@ const ProfileTypeFormNumberSelection: React.FC<ProfileTypeFormNumberSelectionPro
   answerType,
   setNextStep,
   setPrevioustStep,
+  isProfileTypeComplete,
 }: ProfileTypeFormNumberSelectionProps) => {
   const { t } = useI18n()
   const [answer, setAnswer] = useState<ProfileTypeAnswerChoices>('')
@@ -57,10 +59,12 @@ const ProfileTypeFormNumberSelection: React.FC<ProfileTypeFormNumberSelectionPro
       )
       foundIndex > -1 && setIndex(foundIndex)
       setAnswer(profileType[answerType.attribute])
-    } else {
+    } else if (isProfileTypeComplete)
+      setAnswer(profileType[answerType.attribute])
+    else {
       setAnswer(answerType.choices[0])
     }
-  }, [step, viewedStep, profileType, answerType])
+  }, [step, viewedStep, profileType, answerType, isProfileTypeComplete])
 
   return (
     <>

src/components/ProfileType/ProfileTypeFormSingleChoice.tsx

@@ -18,6 +18,7 @@ interface ProfileTypeFormSingleChoiceProps {
   answerType: ProfileTypeAnswer
   setNextStep: Function
   setPrevioustStep: Function
+  isProfileTypeComplete: boolean
 }
 
 const ProfileTypeFormSingleChoice: React.FC<ProfileTypeFormSingleChoiceProps> = ({
@@ -27,6 +28,7 @@ const ProfileTypeFormSingleChoice: React.FC<ProfileTypeFormSingleChoiceProps> =
   answerType,
   setNextStep,
   setPrevioustStep,
+  isProfileTypeComplete,
 }: ProfileTypeFormSingleChoiceProps) => {
   const { t } = useI18n()
   const [answer, setAnswer] = useState<ProfileTypeAnswerChoices>('')
@@ -43,8 +45,10 @@ const ProfileTypeFormSingleChoice: React.FC<ProfileTypeFormSingleChoiceProps> =
   useEffect(() => {
     if (step < viewedStep) {
       setAnswer(profileType[answerType.attribute])
+    } else if (isProfileTypeComplete) {
+      setAnswer(profileType[answerType.attribute])
     }
-  }, [step, viewedStep, profileType, answerType])
+  }, [step, viewedStep, profileType, answerType, isProfileTypeComplete])
 
   return (
     <>

src/components/ProfileType/ProfileTypeView.tsx

@@ -24,8 +24,11 @@ import ProfileTypeService from 'services/profileType.service'
 import ProfileTypeFormMultiChoice from 'components/ProfileType/ProfileTypeFormMultiChoice'
 import ProfileTypeFormNumber from 'components/ProfileType/ProfileTypeFormNumber'
 import ProfileTypeFormNumberSelection from 'components/ProfileType/ProfileTypeFormNumberSelection'
+import { useSelector } from 'react-redux'
+import { AppStore } from 'store'
 
 const ProfileTypeView = () => {
+  const profile = useSelector((state: AppStore) => state.ecolyo.profile)
   const [headerHeight, setHeaderHeight] = useState<number>(0)
   const [profileType, setProfileType] = useState<ProfileType>({
     housingType: HousingType.INDIVIDUAL_HOUSE,
@@ -97,6 +100,7 @@ const ProfileTypeView = () => {
           profileType={profileType}
           answerType={answerType}
           setNextStep={setNextStep}
+          isProfileTypeComplete={profile.isProfileTypeCompleted}
           setPrevioustStep={setPrevioustStep}
         />
       )
@@ -109,6 +113,7 @@ const ProfileTypeView = () => {
           answerType={answerType}
           setNextStep={setNextStep}
           setPrevioustStep={setPrevioustStep}
+          isProfileTypeComplete={profile.isProfileTypeCompleted}
         />
       )
     } else if (answerType.type === ProfileTypeFormType.NUMBER) {
@@ -119,6 +124,7 @@ const ProfileTypeView = () => {
           profileType={profileType}
           answerType={answerType}
           setNextStep={setNextStep}
+          isProfileTypeComplete={profile.isProfileTypeCompleted}
           setPrevioustStep={setPrevioustStep}
         />
       )
@@ -130,6 +136,7 @@ const ProfileTypeView = () => {
           profileType={profileType}
           answerType={answerType}
           setNextStep={setNextStep}
+          isProfileTypeComplete={profile.isProfileTypeCompleted}
           setPrevioustStep={setPrevioustStep}
         />
       )
@@ -137,12 +144,15 @@ const ProfileTypeView = () => {
   }
 
   useEffect(() => {
+    if (profile.isProfileTypeCompleted) {
+      setProfileType(profile.profileType)
+    }
     const _answerType: ProfileTypeAnswer = ProfileTypeService.getAnswerForStep(
       step
     )
     setAnswerType(_answerType)
     setIsLoading(false)
-  }, [step])
+  }, [step, profile])
 
   return (
     <>

src/locales/fr.json

@@ -410,6 +410,7 @@
   "profile_type": {
     "title_profile": "Profil de consommation",
     "read_profile": "Ajuster mon profil",
+    "multi_choices": "Plusieurs réponses possibles",
     "title_housing": "Logement",
     "housing_type": {
       "question": "De quel type de logement disposez-vous ?",