fix(electricity): remove loader delay

src/components/Connection/SGEConnect/SgeConnectView.spec.tsx

@@ -2,7 +2,8 @@ import { render, screen } from '@testing-library/react'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { BrowserRouter } from 'react-router-dom'
-import { createMockEcolyoStore } from 'tests/__mocks__/store'
+import { SgeStatusWithAccount } from 'tests/__mocks__/fluidStatusData.mock'
+import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store'
 import SgeConnectView from './SgeConnectView'
 
 jest.mock('components/Content/Content', () => 'mock-content')
@@ -10,6 +11,13 @@ jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
 
 const store = createMockEcolyoStore()
 
+const mockConnect = jest.fn()
+const mockUpdate = jest.fn()
+
+jest.mock('components/Hooks/useKonnectorAuth', () =>
+  jest.fn(() => [mockConnect, mockUpdate])
+)
+
 describe('SgeConnectView component', () => {
   beforeEach(() => {
     jest.clearAllMocks()
@@ -46,4 +54,43 @@ describe('SgeConnectView component', () => {
     expect(prevButton).toBeDisabled()
     expect(nextButton).toBeDisabled()
   })
+
+  describe('should test methods from useKonnectorAuth hook', () => {
+    it('should launch account and trigger creation process', async () => {
+      const store = createMockEcolyoStore({
+        global: {
+          ...mockGlobalState,
+          sgeConnect: {
+            ...mockGlobalState.sgeConnect,
+            shouldLaunchAccount: true,
+          },
+        },
+      })
+
+      render(
+        <Provider store={store}>
+          <SgeConnectView />
+        </Provider>
+      )
+      expect(mockConnect).toHaveBeenCalled()
+    })
+    it('should launch existing account update process', async () => {
+      const store = createMockEcolyoStore({
+        global: {
+          ...mockGlobalState,
+          fluidStatus: [SgeStatusWithAccount],
+          sgeConnect: {
+            ...mockGlobalState.sgeConnect,
+            shouldLaunchAccount: true,
+          },
+        },
+      })
+      render(
+        <Provider store={store}>
+          <SgeConnectView />
+        </Provider>
+      )
+      expect(mockUpdate).toHaveBeenCalled()
+    })
+  })
 })

src/components/Connection/SGEConnect/SgeConnectView.tsx

@@ -3,11 +3,15 @@ import FormProgress from 'components/CommonKit/FormProgress/FormProgress'
 import Content from 'components/Content/Content'
 import CozyBar from 'components/Header/CozyBar'
 import Header from 'components/Header/Header'
-import { SgeStep } from 'enums'
+import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
+import { FluidType, SgeStep } from 'enums'
 import { SgeStore } from 'models'
-import React, { useCallback, useState } from 'react'
-import { useNavigate } from 'react-router'
-import { updateSgeStore } from 'store/global/global.slice'
+import React, { useCallback, useEffect, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import {
+  setShouldRefreshConsent,
+  updateSgeStore,
+} from 'store/global/global.slice'
 import { useAppDispatch, useAppSelector } from 'store/hooks'
 import '../connection.scss'
 import StepAddress from './StepAddress'
@@ -33,6 +37,29 @@ const SgeConnectView = () => {
   const [currentStep, setCurrentStep] = useState<SgeStep>(
     SgeStep.IdentityAndPDL
   )
+  const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
+  const currentFluidStatus = fluidStatus[FluidType.ELECTRICITY]
+  const account = currentFluidStatus.connection.account
+
+  const [connect, update] = useKonnectorAuth(FluidType.ELECTRICITY, {
+    sgeAuthData: sgeConnect,
+  })
+
+  useEffect(() => {
+    async function launchConnect() {
+      if (sgeConnect.shouldLaunchAccount) {
+        dispatch(updateSgeStore({ ...sgeConnect, shouldLaunchAccount: false }))
+        dispatch(setShouldRefreshConsent(false))
+        if (!account) {
+          await connect()
+        } else {
+          await update()
+        }
+        navigate('/consumption/electricity')
+      }
+    }
+    launchConnect()
+  }, [account, connect, dispatch, navigate, sgeConnect, update])
 
   const isNextValid = useCallback(() => {
     switch (currentStep) {
@@ -81,9 +108,8 @@ const SgeConnectView = () => {
       }
       setCurrentSgeState(updatedState)
       dispatch(updateSgeStore(updatedState))
-      navigate('/consumption/electricity')
     }
-  }, [currentStep, isLoading, dispatch, currentSgeState, navigate])
+  }, [currentStep, isLoading, dispatch, currentSgeState])
 
   const handlePrev = useCallback(() => {
     if (currentStep !== SgeStep.IdentityAndPDL) {

src/components/Connection/SGEConnect/SgeInit.spec.tsx

@@ -2,8 +2,7 @@ import { render, screen } from '@testing-library/react'
 import { userEvent } from '@testing-library/user-event'
 import React from 'react'
 import { Provider } from 'react-redux'
-import { SgeStatusWithAccount } from 'tests/__mocks__/fluidStatusData.mock'
-import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store'
+import { createMockEcolyoStore } from 'tests/__mocks__/store'
 import SgeInit from './SgeInit'
 
 const mockedNavigate = jest.fn()
@@ -12,13 +11,6 @@ jest.mock('react-router-dom', () => ({
   useNavigate: () => mockedNavigate,
 }))
 
-const mockConnect = jest.fn()
-const mockUpdate = jest.fn()
-
-jest.mock('components/Hooks/useKonnectorAuth', () =>
-  jest.fn(() => [mockConnect, mockUpdate])
-)
-
 describe('SgeInit component', () => {
   const store = createMockEcolyoStore()
   it('should be rendered correctly', () => {
@@ -38,40 +30,4 @@ describe('SgeInit component', () => {
     await userEvent.click(screen.getAllByRole('button')[0])
     expect(mockedNavigate).toHaveBeenCalled()
   })
-  it('should launch account and trigger creation process', async () => {
-    const store = createMockEcolyoStore({
-      global: {
-        ...mockGlobalState,
-        sgeConnect: {
-          ...mockGlobalState.sgeConnect,
-          shouldLaunchAccount: true,
-        },
-      },
-    })
-
-    render(
-      <Provider store={store}>
-        <SgeInit />
-      </Provider>
-    )
-    expect(mockConnect).toHaveBeenCalled()
-  })
-  it('should launch existing account update process', async () => {
-    const store = createMockEcolyoStore({
-      global: {
-        ...mockGlobalState,
-        fluidStatus: [SgeStatusWithAccount],
-        sgeConnect: {
-          ...mockGlobalState.sgeConnect,
-          shouldLaunchAccount: true,
-        },
-      },
-    })
-    render(
-      <Provider store={store}>
-        <SgeInit />
-      </Provider>
-    )
-    expect(mockUpdate).toHaveBeenCalled()
-  })
 })

src/components/Connection/SGEConnect/SgeInit.tsx

 import { Button } from '@material-ui/core'
 import ElectricityBillIcon from 'assets/icons/visu/onboarding/electricity_bill.svg'
 import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import useKonnectorAuth from 'components/Hooks/useKonnectorAuth'
 import { useI18n } from 'cozy-ui/transpiled/react/I18n'
 import { FluidType } from 'enums'
-import React, { useEffect } from 'react'
+import React from 'react'
 import { useNavigate } from 'react-router-dom'
 import { setShowOfflineData } from 'store/chart/chart.slice'
-import {
-  setShouldRefreshConsent,
-  updateSgeStore,
-} from 'store/global/global.slice'
 import { useAppDispatch, useAppSelector } from 'store/hooks'
 
 const SgeInit = () => {
@@ -18,27 +13,7 @@ const SgeInit = () => {
   const navigate = useNavigate()
   const { fluidStatus } = useAppSelector(state => state.ecolyo.global)
   const currentFluidStatus = fluidStatus[FluidType.ELECTRICITY]
-  const account = currentFluidStatus.connection.account
-  const { sgeConnect } = useAppSelector(state => state.ecolyo.global)
   const dispatch = useAppDispatch()
-  const [connect, update] = useKonnectorAuth(FluidType.ELECTRICITY, {
-    sgeAuthData: sgeConnect,
-  })
-
-  useEffect(() => {
-    async function launchConnect() {
-      if (sgeConnect.shouldLaunchAccount) {
-        dispatch(updateSgeStore({ ...sgeConnect, shouldLaunchAccount: false }))
-        dispatch(setShouldRefreshConsent(false))
-        if (!account) {
-          await connect()
-        } else {
-          await update()
-        }
-      }
-    }
-    launchConnect()
-  }, [account, connect, dispatch, sgeConnect, update])
 
   return (
     <div className="connection-form">