remove state from store

src/components/Connection/SGEConnect/SgeConnectView.tsx

@@ -9,10 +9,7 @@ import { FluidType, SgeStep } from 'enums'
 import { SgeStore } from 'models'
 import React, { useCallback, useEffect, useRef, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
-import {
-  setShouldRefreshConsent,
-  updateSgeStore,
-} from 'store/global/global.slice'
+import { setShouldRefreshConsent } from 'store/global/global.slice'
 import { useAppDispatch, useAppSelector } from 'store/hooks'
 import '../connection.scss'
 import { useFormData, type FormData } from '../useForm'
@@ -50,13 +47,9 @@ const SgeConnectView = () => {
   const client = useClient()
   const navigate = useNavigate()
   const dispatch = useAppDispatch()
-  // const { sgeConnect } = useAppSelector(state => state.ecolyo.global)
   const { formData } = useFormData()
   const [isLoading, setIsLoading] = useState(false)
-  console.log('🚀 ~ SgeConnectView ~ formData:', formData?.lastName)
-  const [sgeState, setCurrentSgeState] = useState<SgeStore>(
-    createInitialState()
-  )
+  const [sgeState, setSgeState] = useState<SgeStore>(createInitialState())
   const [currentStep, setCurrentStep] = useState<SgeStep>(
     SgeStep.IdentityAndPDL
   )
@@ -73,19 +66,22 @@ const SgeConnectView = () => {
     sgeAuthData: sgeState,
   })
 
-  useEffect(() => {
-    if (formData) {
-      setCurrentSgeState(prevState => ({
-        ...prevState,
-        ...createInitialState(formData),
-      }))
-    }
-  }, [formData])
+  useEffect(
+    function applyFormData() {
+      if (formData) {
+        setSgeState(prevState => ({
+          ...prevState,
+          ...createInitialState(formData),
+        }))
+      }
+    },
+    [formData]
+  )
 
   useEffect(() => {
     async function launchConnect() {
       if (sgeState.shouldLaunchAccount) {
-        dispatch(updateSgeStore({ ...sgeState, shouldLaunchAccount: false }))
+        setSgeState({ ...sgeState, shouldLaunchAccount: false })
         dispatch(setShouldRefreshConsent(false))
         if (!account) {
           await connect()
@@ -134,15 +130,15 @@ const SgeConnectView = () => {
   const handleNext = useCallback(() => {
     if (currentStep < SgeStep.Consent) {
       setCurrentStep(prev => prev + 1)
-      dispatch(updateSgeStore(sgeState))
-      // handle write to form doctype
-      // TODO only at final step
-      console.log(sgeState)
+
       client.save({
         ...formData,
         firstName: sgeState.firstName,
         lastName: sgeState.lastName,
         pdl: sgeState.pdl,
+        address: sgeState.address,
+        city: sgeState.city,
+        zipCode: sgeState.zipCode,
       })
     }
     if (currentStep === SgeStep.Consent && !isLoading) {
@@ -152,19 +148,17 @@ const SgeConnectView = () => {
         city: sgeState.city.trim(),
         shouldLaunchAccount: true,
       }
-      setCurrentSgeState(updatedState)
-      dispatch(updateSgeStore(updatedState))
+      setSgeState(updatedState)
     }
     focusMainContent()
-  }, [currentStep, isLoading, dispatch, sgeState, client, formData])
+  }, [currentStep, isLoading, sgeState, client, formData])
 
   const handlePrev = useCallback(() => {
     if (currentStep !== SgeStep.IdentityAndPDL) {
       setCurrentStep(prev => prev - 1)
     }
-    dispatch(updateSgeStore(sgeState))
     focusMainContent()
-  }, [sgeState, currentStep, dispatch])
+  }, [currentStep])
 
   const onChange = useCallback(
     (
@@ -178,7 +172,7 @@ const SgeConnectView = () => {
         ...sgeState,
         [key]: value,
       }
-      setCurrentSgeState(updatedState)
+      setSgeState(updatedState)
     },
     [sgeState]
   )

src/models/global.model.ts

@@ -3,7 +3,6 @@ import { TermsStatus } from 'models'
 import { FluidStatus } from './fluid.model'
 import { PartnersInfo } from './partnersInfo.model'
 import { ReleaseNotes } from './releaseNotes.model'
-import { SgeStore } from './sgeStore.model'
 
 export interface GlobalState {
   screenType: ScreenType
@@ -16,7 +15,6 @@ export interface GlobalState {
   fluidStatus: FluidStatus[]
   fluidTypes: FluidType[]
   shouldRefreshConsent: boolean
-  sgeConnect: SgeStore
   partnersInfo: PartnersInfo
   ecogestureFilter: Usage
   lastEpglLogin: string

src/store/global/global.slice.spec.ts

@@ -2,7 +2,6 @@
 import { FluidSlugType, FluidState, FluidType, ScreenType, Usage } from 'enums'
 import { DateTime } from 'luxon'
 import { FluidStatus, PartnersInfo, TermsStatus } from 'models'
-import { SgeStore } from 'models/sgeStore.model'
 import { accountsData } from 'tests/__mocks__/accountsData.mock'
 import { konnectorsData } from 'tests/__mocks__/konnectorsData.mock'
 import { mockGlobalState } from 'tests/__mocks__/store'
@@ -22,7 +21,6 @@ import {
   toggleChallengeExplorationNotification,
   updateEcogestureFilter,
   updateFluidConnection,
-  updateSgeStore,
   updateTermsStatus,
 } from './global.slice'
 
@@ -232,28 +230,6 @@ describe('globalSlice', () => {
       shouldRefreshConsent: true,
     })
   })
-  it('should handle setSgeConnect', () => {
-    const expectedSgeConnect: SgeStore = {
-      address: 'address',
-      city: 'city',
-      currentStep: 1,
-      dataConsent: true,
-      firstName: 'firstName',
-      lastName: 'lastName',
-      pdl: 12345678901234,
-      pdlConfirm: true,
-      shouldLaunchAccount: true,
-      zipCode: 99999,
-    }
-    const state = globalSlice.reducer(
-      mockGlobalState,
-      updateSgeStore(expectedSgeConnect)
-    )
-    expect(state).toEqual({
-      ...mockGlobalState,
-      sgeConnect: expectedSgeConnect,
-    })
-  })
   it('should handle updateFluidConnection', () => {
     const state = globalSlice.reducer(
       mockGlobalState,

src/store/global/global.slice.ts

@@ -7,7 +7,6 @@ import {
   GlobalState,
   Notes,
   PartnersInfo,
-  SgeStore,
   TermsStatus,
 } from 'models'
 
@@ -107,18 +106,6 @@ const initialState: GlobalState = {
     notification_activated: false,
   },
   shouldRefreshConsent: false,
-  sgeConnect: {
-    currentStep: 0,
-    firstName: '',
-    lastName: '',
-    pdl: null,
-    address: '',
-    zipCode: null,
-    city: '',
-    dataConsent: false,
-    pdlConfirm: false,
-    shouldLaunchAccount: false,
-  },
   ecogestureFilter: Usage.ALL,
   lastEpglLogin: '',
 }
@@ -208,9 +195,6 @@ export const globalSlice = createSlice({
     setLastEpglLogin: (state, action: PayloadAction<string>) => {
       state.lastEpglLogin = action.payload
     },
-    updateSgeStore: (state, action: PayloadAction<SgeStore>) => {
-      state.sgeConnect = action.payload
-    },
     updateEcogestureFilter: (state, action: PayloadAction<Usage>) => {
       state.ecogestureFilter = action.payload
     },
@@ -231,6 +215,5 @@ export const {
   toggleChallengeExplorationNotification,
   updateEcogestureFilter,
   updateFluidConnection,
-  updateSgeStore,
   updateTermsStatus,
 } = globalSlice.actions

tests/__mocks__/store/global.state.mock.ts

@@ -94,17 +94,5 @@ export const mockGlobalState: GlobalState = {
   ],
   fluidTypes: [],
   shouldRefreshConsent: false,
-  sgeConnect: {
-    address: '',
-    city: '',
-    currentStep: 0,
-    dataConsent: false,
-    firstName: '',
-    lastName: '',
-    pdl: null,
-    pdlConfirm: false,
-    zipCode: null,
-    shouldLaunchAccount: false,
-  },
   ecogestureFilter: Usage.ALL,
 }