From c20445ec9cfcb1d077b5cff8210005bd53506f9a Mon Sep 17 00:00:00 2001
From: gcarron <gcarron@grandlyon.com>
Date: Mon, 8 Feb 2021 15:03:28 +0100
Subject: [PATCH] Display profile in form if completed + add hint multichoice
---
.../ProfileTypeFormMultiChoice.tsx | 27 ++++++++-----------
.../ProfileType/ProfileTypeFormNumber.tsx | 7 +++--
.../ProfileTypeFormNumberSelection.tsx | 8 ++++--
.../ProfileTypeFormSingleChoice.tsx | 6 ++++-
.../ProfileType/ProfileTypeView.tsx | 12 ++++++++-
src/locales/fr.json | 1 +
6 files changed, 39 insertions(+), 22 deletions(-)
diff --git a/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx b/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx
index 039cd2a1c..10fccddd0 100644
--- a/src/components/ProfileType/ProfileTypeFormMultiChoice.tsx
+++ b/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 ? (
diff --git a/src/components/ProfileType/ProfileTypeFormNumber.tsx b/src/components/ProfileType/ProfileTypeFormNumber.tsx
index 1815e037e..8807b7fbf 100644
--- a/src/components/ProfileType/ProfileTypeFormNumber.tsx
+++ b/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 (
<>
diff --git a/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx b/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx
index facad6e7f..ab9fc2051 100644
--- a/src/components/ProfileType/ProfileTypeFormNumberSelection.tsx
+++ b/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 (
<>
diff --git a/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx b/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx
index 9e42efe6a..ce03c51b3 100644
--- a/src/components/ProfileType/ProfileTypeFormSingleChoice.tsx
+++ b/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 (
<>
diff --git a/src/components/ProfileType/ProfileTypeView.tsx b/src/components/ProfileType/ProfileTypeView.tsx
index 0fedddde4..c7888a221 100644
--- a/src/components/ProfileType/ProfileTypeView.tsx
+++ b/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 (
<>
diff --git a/src/locales/fr.json b/src/locales/fr.json
index e30f5d7e3..7edc6ee9f 100644
--- a/src/locales/fr.json
+++ b/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 ?",
--
GitLab