diff --git a/src/components/Consumption/ConsumptionView.spec.tsx b/src/components/Consumption/ConsumptionView.spec.tsx
index 124c51accc0156479fc86be1bff71ee0f3e76bf9..c654401923706cd42ec0a7ca9772dfdbf322dee6 100644
--- a/src/components/Consumption/ConsumptionView.spec.tsx
+++ b/src/components/Consumption/ConsumptionView.spec.tsx
@@ -59,7 +59,6 @@ describe('ConsumptionView component', () => {
const store = createMockEcolyoStore({
chart: {
...mockChartState,
- loading: false,
showOfflineData: true,
},
global: {
@@ -83,27 +82,6 @@ describe('ConsumptionView component', () => {
).toBeTruthy()
})
- it('should display a spinner when fluid connected and is loading', () => {
- const store = createMockEcolyoStore({
- chart: {
- ...mockChartState,
- loading: true,
- showOfflineData: true,
- },
- global: {
- fluidStatus: mockFluidStatus,
- releaseNotes: mockInitialEcolyoState.global.releaseNotes,
- },
- modal: mockModalState,
- })
- render(
- <Provider store={store}>
- <ConsumptionView fluidType={FluidType.ELECTRICITY} />
- </Provider>
- )
- expect(screen.getByRole('progressbar')).toBeInTheDocument()
- })
-
it('should set CurrentTimeStep to WEEK when fluid != ELECTRICITY and timeStep = HALF_AN_HOUR', () => {
const store = createMockEcolyoStore({
chart: {
diff --git a/src/components/Consumption/ConsumptionView.tsx b/src/components/Consumption/ConsumptionView.tsx
index a8658aaf03e96f441098b87cd5ca1b0de822083f..de81b40b958bbbc7541ca1817792404b7ce6b863 100644
--- a/src/components/Consumption/ConsumptionView.tsx
+++ b/src/components/Consumption/ConsumptionView.tsx
@@ -1,4 +1,3 @@
-import classNames from 'classnames'
import ExpiredConsentModal from 'components/Connection/ExpiredConsentModal/ExpiredConsentModal'
import Content from 'components/Content/Content'
import CustomPopupModal from 'components/CustomPopup/CustomPopupModal'
@@ -8,7 +7,6 @@ import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
import KonnectorViewerCard from 'components/Konnector/KonnectorViewerCard'
import KonnectorViewerList from 'components/Konnector/KonnectorViewerList'
-import Loader from 'components/Loader/Loader'
import PartnerIssueModal from 'components/PartnerIssue/PartnerIssueModal'
import ReleaseNotesModal from 'components/ReleaseNotesModal/ReleaseNotesModal'
import { useClient } from 'cozy-client'
@@ -43,13 +41,7 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
const dispatch = useAppDispatch()
const isMulti = fluidType === FluidType.MULTIFLUID
const {
- chart: {
- currentTimeStep,
- loading,
- showOfflineData,
- selectedDate,
- currentIndex,
- },
+ chart: { currentTimeStep, showOfflineData, selectedDate, currentIndex },
global: { fluidStatus, releaseNotes },
modal: { partnersIssueModal, customPopupModal },
} = useAppSelector(state => state.ecolyo)
@@ -242,23 +234,12 @@ const ConsumptionView = ({ fluidType }: { fluidType: FluidType }) => {
)}
{showOfflineData && (
<>
- {loading && (
- <div className="consumptionview-loading">
- <Loader fluidType={fluidType} />
- </div>
- )}
- <div
- className={classNames('consumptionview-content', {
- ['--hidden']: loading,
- })}
- >
- <FluidChart
- fluidType={fluidType}
- setActive={setActive}
- key={lastDataDateKey}
- />
- <ConsumptionDetails fluidType={fluidType} />
- </div>
+ <FluidChart
+ fluidType={fluidType}
+ setActive={setActive}
+ key={lastDataDateKey}
+ />
+ <ConsumptionDetails fluidType={fluidType} />
{!isMulti && (
<div className="konnector-section">
<KonnectorViewerCard
diff --git a/src/components/Consumption/consumptionView.scss b/src/components/Consumption/consumptionView.scss
index ce636ccffbc6ca9efe5bd83c55e3a7eba6f8b436..3c53396b42fb1da0041d56384c766dc231ebfc3a 100644
--- a/src/components/Consumption/consumptionView.scss
+++ b/src/components/Consumption/consumptionView.scss
@@ -1,27 +1,11 @@
@import 'src/styles/base/breakpoint';
@import 'src/styles/base/color';
-.consumptionview-loading {
- background-color: $default-background;
- height: 80vh;
- width: 100%;
- display: flex;
- justify-content: center;
- align-items: center;
-}
-.consumptionview-content {
- background-color: $default-background;
- &.--hidden {
- display: none;
- }
-}
+// put these into KonnectorViewerCard ?
.konnector-section {
- background-color: $default-background;
margin: 0 auto;
- box-sizing: border-box;
padding-bottom: 1rem;
max-width: 45.75rem;
- width: 100%;
@media #{$large-phone} {
padding-left: 1rem;
padding-right: 1rem;
diff --git a/src/components/FluidChart/FluidChartSlide.tsx b/src/components/FluidChart/FluidChartSlide.tsx
index 5be0634977f3cfdcd80bd50e2d7f6c64ed82559a..2bae0adb83144a081ccbb6a4798947d5eec69bd2 100644
--- a/src/components/FluidChart/FluidChartSlide.tsx
+++ b/src/components/FluidChart/FluidChartSlide.tsx
@@ -8,7 +8,7 @@ import { Datachart } from 'models'
import React, { useEffect, useState } from 'react'
import ConsumptionService from 'services/consumption.service'
import DateChartService from 'services/dateChart.service'
-import { setCurrentDataChart, setLoading } from 'store/chart/chart.slice'
+import { setCurrentDataChart } from 'store/chart/chart.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import './fluidChartSlide.scss'
@@ -85,7 +85,6 @@ const FluidChartSlide = ({
if (subscribed && graphData && graphData?.actualData.length > 0) {
setChartData(graphData)
setIsDataLoaded(true)
- dispatch(setLoading(false))
}
}
}
diff --git a/src/components/FluidChart/FluidChartSwipe.tsx b/src/components/FluidChart/FluidChartSwipe.tsx
index 68c3ee7b2105658129224995389a0310f3f88fd9..0e5b1693b3eaaf02439d787f9a3e59617b7ae64c 100644
--- a/src/components/FluidChart/FluidChartSwipe.tsx
+++ b/src/components/FluidChart/FluidChartSwipe.tsx
@@ -19,8 +19,9 @@ interface FluidChartSwipeProps {
const FluidChartSwipe = ({ fluidType, setActive }: FluidChartSwipeProps) => {
const dispatch = useAppDispatch()
- const { currentIndex, currentTimeStep, selectedDate, loading } =
- useAppSelector(state => state.ecolyo.chart)
+ const { currentIndex, currentTimeStep, selectedDate } = useAppSelector(
+ state => state.ecolyo.chart
+ )
const swipe = useRef<HTMLDivElement>(null)
const [isSwitching, setIsSwitching] = useState(false)
@@ -53,7 +54,7 @@ const FluidChartSwipe = ({ fluidType, setActive }: FluidChartSwipeProps) => {
dispatch(setCurrentIndex(updatedIndex))
}
- const { height, width } = useChartResize(swipe, loading)
+ const { height, width } = useChartResize(swipe, false)
useEffect(() => {
function initIndex() {
diff --git a/src/components/Hooks/useKonnectorAuth.tsx b/src/components/Hooks/useKonnectorAuth.tsx
index de2e6ca5b1eda7798437604b1a095fdf1178edcf..150ab18e3e73103b3a8d35112253fcce04279cfb 100644
--- a/src/components/Hooks/useKonnectorAuth.tsx
+++ b/src/components/Hooks/useKonnectorAuth.tsx
@@ -12,7 +12,6 @@ import {
import { useState } from 'react'
import AccountService from 'services/account.service'
import ConnectionService from 'services/connection.service'
-import { setLoading } from 'store/chart/chart.slice'
import { updateFluidConnection } from 'store/global/global.slice'
import { useAppDispatch, useAppSelector } from 'store/hooks'
import logApp from 'utils/logger'
@@ -103,8 +102,6 @@ const useKonnectorAuth = (
trigger: trigger,
shouldLaunchKonnector: true,
}
- // TODO this should be dispatched
- setLoading(false)
dispatch(
updateFluidConnection({
fluidType: currentFluidStatus.fluidType,
@@ -112,7 +109,6 @@ const useKonnectorAuth = (
})
)
} catch (error) {
- setLoading(false)
logApp.error(error)
Sentry.captureException(error)
}
@@ -148,7 +144,6 @@ const useKonnectorAuth = (
)
}
} catch (error) {
- setLoading(false)
logApp.error(error)
Sentry.captureException(error)
}
diff --git a/src/models/chart.model.ts b/src/models/chart.model.ts
index 96fa843eb8d5fb4f190d2e46a740ea4315f866d1..b9cfb1b972fd0ad896f397eff1a9c5cd738072ec 100644
--- a/src/models/chart.model.ts
+++ b/src/models/chart.model.ts
@@ -7,7 +7,6 @@ export interface ChartState {
currentDatachartIndex: number
currentIndex: number
currentTimeStep: TimeStep
- loading: boolean
selectedDate: DateTime
showCompare: boolean
showOfflineData: boolean
diff --git a/src/store/chart/chart.slice.spec.ts b/src/store/chart/chart.slice.spec.ts
index 9015e59e329b09ed494600f00def39203bac9ad5..0ab8ecdd791f95139561c2bf02102ed9e935b951 100644
--- a/src/store/chart/chart.slice.spec.ts
+++ b/src/store/chart/chart.slice.spec.ts
@@ -8,7 +8,6 @@ import {
setCurrentDataChartIndex,
setCurrentIndex,
setCurrentTimeStep,
- setLoading,
setSelectedDate,
setShowCompare,
} from './chart.slice'
@@ -100,16 +99,6 @@ describe('chart reducer', () => {
})
})
- describe('setLoading', () => {
- it('should handle setLoading with payload', () => {
- const state = chartSlice.reducer(mockChartState, setLoading(false))
- expect(state).toEqual({
- ...mockChartState,
- loading: false,
- })
- })
- })
-
describe('setShowCompare', () => {
it('should handle setShowCompare', () => {
const state = chartSlice.reducer(mockChartState, setShowCompare(true))
diff --git a/src/store/chart/chart.slice.ts b/src/store/chart/chart.slice.ts
index 60f4790d601c1edbfcf6bf9b35e61af23320d940..92bec2bdd71d70128f1633f417f700ed28d2234f 100644
--- a/src/store/chart/chart.slice.ts
+++ b/src/store/chart/chart.slice.ts
@@ -11,7 +11,6 @@ const initialState: ChartState = {
currentIndex: 0,
currentDatachart: { actualData: [], comparisonData: null },
currentDatachartIndex: 0,
- loading: true,
showCompare: false,
showOfflineData: false,
}
@@ -35,9 +34,6 @@ export const chartSlice = createSlice({
state.showCompare = false
}
},
- setLoading: (state, action: PayloadAction<boolean>) => {
- state.loading = action.payload
- },
setSelectedDate: (state, action: PayloadAction<DateTime>) => {
state.selectedDate = action.payload
},
@@ -55,7 +51,6 @@ export const {
setCurrentDataChartIndex,
setCurrentIndex,
setCurrentTimeStep,
- setLoading,
setSelectedDate,
setShowCompare,
setShowOfflineData,
diff --git a/tests/__mocks__/store/chart.state.mock.ts b/tests/__mocks__/store/chart.state.mock.ts
index df355ad572383eb3e1d9e627a43808852e5fe909..337d9d464df5daea182406cef6a19bb5354a4614 100644
--- a/tests/__mocks__/store/chart.state.mock.ts
+++ b/tests/__mocks__/store/chart.state.mock.ts
@@ -10,7 +10,6 @@ export const mockChartState: ChartState = {
currentIndex: 0,
currentDatachart: { actualData: [], comparisonData: null },
currentDatachartIndex: 0,
- loading: true,
showCompare: false,
showOfflineData: false,
}