From a370e9edd8f418cbf31f2e9d9509af83f9b2f6e4 Mon Sep 17 00:00:00 2001
From: Bastien DUMONT <bdumont@grandlyon.com>
Date: Tue, 3 May 2022 14:54:32 +0000
Subject: [PATCH] Feat/US769 equipments choice in profile settings
---
.../EcogestureFormEquipment.tsx | 16 +++++--
.../EcogestureForm/EcogestureFormView.tsx | 1 +
.../EcogestureFormEquipment.spec.tsx.snap | 13 +++---
.../ProfileType/ProfileTypeView.tsx | 46 +++++++++++++++----
src/enum/profileType.enum.ts | 6 ++-
src/models/profileType.model.ts | 1 +
src/services/profileType.service.spec.ts | 5 ++
src/services/profileTypeForm.service.ts | 13 +++++-
8 files changed, 76 insertions(+), 25 deletions(-)
diff --git a/src/components/EcogestureForm/EcogestureFormEquipment.tsx b/src/components/EcogestureForm/EcogestureFormEquipment.tsx
index 6d5d656fc..3ea355582 100644
--- a/src/components/EcogestureForm/EcogestureFormEquipment.tsx
+++ b/src/components/EcogestureForm/EcogestureFormEquipment.tsx
@@ -11,15 +11,20 @@ import { newProfileEcogestureEntry } from 'store/profileEcogesture/profileEcoges
import { useDispatch } from 'react-redux'
import { updateProfile } from 'store/profile/profile.actions'
import { useHistory } from 'react-router-dom'
+import { ProfileTypeStepForm } from 'enum/profileType.enum'
interface EcogestureFormEquipmentProps {
profileEcogesture: ProfileEcogesture
setPreviousStep: Function
+ setNextStep?: Function
+ step: ProfileTypeStepForm | EcogestureStepForm
}
const EcogestureFormEquipment: React.FC<EcogestureFormEquipmentProps> = ({
profileEcogesture,
setPreviousStep,
+ setNextStep,
+ step,
}: EcogestureFormEquipmentProps) => {
const { t } = useI18n()
const dispatch = useDispatch()
@@ -30,12 +35,13 @@ const EcogestureFormEquipment: React.FC<EcogestureFormEquipmentProps> = ({
setPreviousStep(profileEcogesture)
}, [profileEcogesture, setPreviousStep])
- const handleFinish = useCallback(() => {
+ const handleNext = useCallback(() => {
profileEcogesture.equipments = answer as EquipmentType[]
dispatch(newProfileEcogestureEntry(profileEcogesture))
dispatch(updateProfile({ isProfileEcogestureCompleted: true }))
- history.push('/ecogesture-selection')
- }, [profileEcogesture, answer, dispatch, history])
+ // Check if gestureForm is used from Big profile or small profile
+ setNextStep ? setNextStep() : history.push('/ecogesture-selection')
+ }, [profileEcogesture, setNextStep, answer, dispatch, history])
const isChecked = useCallback(
(value: string): boolean => {
@@ -103,9 +109,9 @@ const EcogestureFormEquipment: React.FC<EcogestureFormEquipmentProps> = ({
</div>
</div>
<FormNavigation
- step={EcogestureStepForm.EQUIPMENTS}
+ step={step}
handlePrevious={handlePrevious}
- handleNext={handleFinish}
+ handleNext={handleNext}
disableNextButton={answer === []}
isEcogesture={true}
/>
diff --git a/src/components/EcogestureForm/EcogestureFormView.tsx b/src/components/EcogestureForm/EcogestureFormView.tsx
index 5f5e80505..54cdbd650 100644
--- a/src/components/EcogestureForm/EcogestureFormView.tsx
+++ b/src/components/EcogestureForm/EcogestureFormView.tsx
@@ -128,6 +128,7 @@ const EcogestureFormView: React.FC = () => {
<Content height={headerHeight}>
{step === EcogestureStepForm.EQUIPMENTS && (
<EcogestureFormEquipment
+ step={EcogestureStepForm.EQUIPMENTS}
profileEcogesture={profileEcogesture}
setPreviousStep={setPreviousStep}
/>
diff --git a/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap b/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
index 26e73e2ed..454d1f0bd 100644
--- a/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
+++ b/src/components/EcogestureForm/__snapshots__/EcogestureFormEquipment.spec.tsx.snap
@@ -305,7 +305,6 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
handleNext={[Function]}
handlePrevious={[Function]}
isEcogesture={true}
- step={3}
>
<div
className="profile-navigation"
@@ -448,7 +447,7 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
</ForwardRef(Button)>
</WithStyles(ForwardRef(Button))>
<WithStyles(ForwardRef(Button))
- aria-label="profile_type.accessibility.button_end"
+ aria-label="profile_type.accessibility.button_next"
className="profile-navigation-button"
classes={
Object {
@@ -460,7 +459,7 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
onClick={[Function]}
>
<ForwardRef(Button)
- aria-label="profile_type.accessibility.button_end"
+ aria-label="profile_type.accessibility.button_next"
className="profile-navigation-button"
classes={
Object {
@@ -499,7 +498,7 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
onClick={[Function]}
>
<WithStyles(ForwardRef(ButtonBase))
- aria-label="profile_type.accessibility.button_end"
+ aria-label="profile_type.accessibility.button_next"
className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button"
component="button"
disabled={false}
@@ -509,7 +508,7 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
type="button"
>
<ForwardRef(ButtonBase)
- aria-label="profile_type.accessibility.button_end"
+ aria-label="profile_type.accessibility.button_next"
className="MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button"
classes={
Object {
@@ -526,7 +525,7 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
type="button"
>
<button
- aria-label="profile_type.accessibility.button_end"
+ aria-label="profile_type.accessibility.button_next"
className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text profile-navigation-button"
disabled={false}
onBlur={[Function]}
@@ -547,7 +546,7 @@ exports[`EcogestureFormEquipment component should be rendered correctly 1`] = `
<span
className="MuiButton-label text-16-normal"
>
- profile_type.form.button_end
+ profile_type.form.button_next >
</span>
<NoSsr>
<WithStyles(memo)
diff --git a/src/components/ProfileType/ProfileTypeView.tsx b/src/components/ProfileType/ProfileTypeView.tsx
index 76689e60a..83fa274cf 100644
--- a/src/components/ProfileType/ProfileTypeView.tsx
+++ b/src/components/ProfileType/ProfileTypeView.tsx
@@ -29,12 +29,18 @@ import { AppStore } from 'store'
import { DateTime } from 'luxon'
import ProfileTypeFormService from 'services/profileTypeForm.service'
import ProfileTypeFormDateSelection from './ProfileTypeFormDateSelection'
+import EcogestureFormEquipment from 'components/EcogestureForm/EcogestureFormEquipment'
+import { ProfileEcogesture } from 'models/profileEcogesture.model'
const ProfileTypeView = () => {
const profile = useSelector((state: AppStore) => state.ecolyo.profile)
const curProfileType = useSelector(
(state: AppStore) => state.ecolyo.profileType
)
+ const curProfileEcogesture: ProfileEcogesture = useSelector(
+ (state: AppStore) => state.ecolyo.profileEcogesture
+ )
+
const [headerHeight, setHeaderHeight] = useState<number>(0)
const [profileType, setProfileType] = useState<ProfileType>({
updateDate: DateTime.local()
@@ -58,6 +64,7 @@ const ProfileTypeView = () => {
warmingFluid: WarmingType.ELECTRICITY,
hotWaterFluid: FluidType.ELECTRICITY,
cookingFluid: FluidType.ELECTRICITY,
+ equipments: '',
})
const [step, setStep] = useState<ProfileTypeStepForm>(
ProfileTypeStepForm.HOUSING_TYPE
@@ -76,9 +83,17 @@ const ProfileTypeView = () => {
}, [])
const setNextStep = useCallback(
- (_profileType: ProfileType) => {
- setProfileType(_profileType)
- const profileTypeFormService = new ProfileTypeFormService(_profileType)
+ (_profileType?: ProfileType) => {
+ let profileTypeFormService: ProfileTypeFormService
+ if (_profileType) {
+ setProfileType(_profileType)
+ profileTypeFormService = new ProfileTypeFormService(_profileType)
+ } else {
+ // if equipments are updated, keep profileType as it is
+ profileTypeFormService = new ProfileTypeFormService({
+ ...profileType,
+ })
+ }
const nextStep: ProfileTypeStepForm = profileTypeFormService.getNextFormStep(
step,
!profile.isProfileTypeCompleted
@@ -89,10 +104,10 @@ const ProfileTypeView = () => {
}
setStep(nextStep)
},
- [profile.isProfileTypeCompleted, step, viewedStep]
+ [profile.isProfileTypeCompleted, profileType, step, viewedStep]
)
- const setPrevioustStep = useCallback(
+ const setPreviousStep = useCallback(
(_profileType: ProfileType) => {
setProfileType(_profileType)
const profileTypeFormService = new ProfileTypeFormService(_profileType)
@@ -115,7 +130,7 @@ const ProfileTypeView = () => {
answerType={answerType}
setNextStep={setNextStep}
isProfileTypeComplete={profile.isProfileTypeCompleted}
- setPrevioustStep={setPrevioustStep}
+ setPrevioustStep={setPreviousStep}
/>
)
} else if (answerType.type === ProfileTypeFormType.MULTI_CHOICE) {
@@ -126,7 +141,7 @@ const ProfileTypeView = () => {
profileType={profileType}
answerType={answerType}
setNextStep={setNextStep}
- setPrevioustStep={setPrevioustStep}
+ setPrevioustStep={setPreviousStep}
isProfileTypeComplete={profile.isProfileTypeCompleted}
/>
)
@@ -139,7 +154,7 @@ const ProfileTypeView = () => {
answerType={answerType}
setNextStep={setNextStep}
isProfileTypeComplete={profile.isProfileTypeCompleted}
- setPrevioustStep={setPrevioustStep}
+ setPrevioustStep={setPreviousStep}
/>
)
} else if (answerType.type === ProfileTypeFormType.NUMBER_SELECTION) {
@@ -151,7 +166,7 @@ const ProfileTypeView = () => {
answerType={answerType}
setNextStep={setNextStep}
isProfileTypeComplete={profile.isProfileTypeCompleted}
- setPrevioustStep={setPrevioustStep}
+ setPrevioustStep={setPreviousStep}
/>
)
} else if (answerType.type === ProfileTypeFormType.DATE_SELECTION) {
@@ -163,7 +178,18 @@ const ProfileTypeView = () => {
answerType={answerType}
setNextStep={setNextStep}
isProfileTypeComplete={profile.isProfileTypeCompleted}
- setPrevioustStep={setPrevioustStep}
+ setPrevioustStep={setPreviousStep}
+ />
+ )
+ } else if (answerType.type === ProfileTypeFormType.EQUIPMENT_SELECTION) {
+ return (
+ <EcogestureFormEquipment
+ step={step}
+ // viewedStep={viewedStep}
+ // answerType={answerType}
+ profileEcogesture={curProfileEcogesture}
+ setNextStep={setNextStep}
+ setPreviousStep={setPreviousStep}
/>
)
}
diff --git a/src/enum/profileType.enum.ts b/src/enum/profileType.enum.ts
index 78e544a53..01c2b20a5 100644
--- a/src/enum/profileType.enum.ts
+++ b/src/enum/profileType.enum.ts
@@ -73,8 +73,9 @@ export enum ProfileTypeStepForm {
HOT_WATER_FLUID = 13,
HOT_WATER_EQUIPMENT = 14,
COOKING_FLUID = 15,
- UPDATE_DATE = 16,
- END = 17,
+ EQUIPMENTS = 16,
+ UPDATE_DATE = 17,
+ END = 18,
}
export enum ProfileTypeFormType {
@@ -83,4 +84,5 @@ export enum ProfileTypeFormType {
NUMBER_SELECTION = 2,
NUMBER = 3,
DATE_SELECTION = 4,
+ EQUIPMENT_SELECTION = 5,
}
diff --git a/src/models/profileType.model.ts b/src/models/profileType.model.ts
index 33584fddb..cd637842e 100644
--- a/src/models/profileType.model.ts
+++ b/src/models/profileType.model.ts
@@ -48,6 +48,7 @@ export interface ProfileType extends ProfileTypeIndexableTypes {
hotWaterFluid: FluidType | null
cookingFluid: FluidType
updateDate: DateTime
+ equipments: string
}
export interface MonthlyForecast {
diff --git a/src/services/profileType.service.spec.ts b/src/services/profileType.service.spec.ts
index 892f77047..68c0cb574 100644
--- a/src/services/profileType.service.spec.ts
+++ b/src/services/profileType.service.spec.ts
@@ -331,6 +331,11 @@ describe('ProfileType service', () => {
ProfileTypeStepForm.COOKING_FLUID,
false
)
+ expect(nextStep).toEqual(ProfileTypeStepForm.EQUIPMENTS)
+ nextStep = profileTypeFormService.getNextFormStep(
+ ProfileTypeStepForm.EQUIPMENTS,
+ false
+ )
expect(nextStep).toEqual(ProfileTypeStepForm.UPDATE_DATE)
nextStep = profileTypeFormService.getNextFormStep(
ProfileTypeStepForm.UPDATE_DATE,
diff --git a/src/services/profileTypeForm.service.ts b/src/services/profileTypeForm.service.ts
index 1b8ca55ae..1a4b33395 100644
--- a/src/services/profileTypeForm.service.ts
+++ b/src/services/profileTypeForm.service.ts
@@ -1,3 +1,4 @@
+import { EquipmentType } from 'enum/ecogesture.enum'
import { FluidType } from 'enum/fluid.enum'
import {
ConstructionYear,
@@ -72,6 +73,8 @@ export default class ProfileTypeFormService {
case ProfileTypeStepForm.HOT_WATER_EQUIPMENT:
return ProfileTypeStepForm.COOKING_FLUID
case ProfileTypeStepForm.COOKING_FLUID:
+ return ProfileTypeStepForm.EQUIPMENTS
+ case ProfileTypeStepForm.EQUIPMENTS:
return firstProfileType
? ProfileTypeStepForm.END
: ProfileTypeStepForm.UPDATE_DATE
@@ -129,8 +132,10 @@ export default class ProfileTypeFormService {
return this.profileType.hotWater === IndividualOrCollective.INDIVIDUAL
? ProfileTypeStepForm.HOT_WATER_EQUIPMENT
: ProfileTypeStepForm.HOT_WATER
- case ProfileTypeStepForm.UPDATE_DATE:
+ case ProfileTypeStepForm.EQUIPMENTS:
return ProfileTypeStepForm.COOKING_FLUID
+ case ProfileTypeStepForm.UPDATE_DATE:
+ return ProfileTypeStepForm.EQUIPMENTS
default:
return ProfileTypeStepForm.HOUSING_TYPE
}
@@ -244,6 +249,12 @@ export default class ProfileTypeFormService {
attribute: 'cookingFluid',
choices: [FluidType.ELECTRICITY, FluidType.GAS],
}
+ case ProfileTypeStepForm.EQUIPMENTS:
+ return {
+ type: ProfileTypeFormType.EQUIPMENT_SELECTION,
+ attribute: 'equipments',
+ choices: Object.keys(EquipmentType),
+ }
case ProfileTypeStepForm.UPDATE_DATE:
return {
type: ProfileTypeFormType.DATE_SELECTION,
--
GitLab