From 72ba1b03b11874b2843f0b21a7e20ad97e0f523d Mon Sep 17 00:00:00 2001 From: Bastien DUMONT <bdumont@grandlyon.com> Date: Fri, 23 Aug 2024 08:04:59 +0000 Subject: [PATCH] chore(deps): bump redux to 2.0 --- package.json | 7 +- .../Action/ActionCard/ActionCard.spec.tsx | 6 +- .../Action/ActionList/ActionList.spec.tsx | 3 +- src/components/Action/ActionView.spec.tsx | 9 ++- src/components/Analysis/AnalysisView.spec.tsx | 3 +- .../Analysis/Comparison/Comparison.spec.tsx | 8 +- .../FluidPerformanceIndicator.spec.tsx | 6 +- .../ElecHalfHourChart.spec.tsx | 7 +- .../MaxConsumptionCard.spec.tsx.snap | 8 +- .../ChallengeCardUnlocked.spec.tsx | 3 + src/components/Charts/AxisBottom.spec.tsx | 3 +- src/components/Charts/Bar.spec.tsx | 7 +- src/components/Charts/BarChart.spec.tsx | 7 +- .../ExpiredConsentModal.spec.tsx | 6 +- .../Consumption/ConsumptionView.spec.tsx | 12 +++ src/components/Content/Content.spec.tsx | 3 +- .../Duel/DuelUnlocked/DuelUnlocked.spec.tsx | 4 +- .../Duel/DuelUnlocked/DuelUnlocked.tsx | 1 + .../EcogestureFormView.spec.tsx | 4 +- .../Feedback/FeedbackModal.spec.tsx | 6 +- .../TimeStepSelector.spec.tsx | 6 +- src/components/Header/CozyBar.spec.tsx | 4 +- src/components/Header/Header.spec.tsx | 43 +++++----- src/components/Hooks/useExploration.spec.tsx | 10 ++- src/components/Navbar/Navbar.spec.tsx | 4 +- .../ReportOptions/ReportOptions.spec.tsx | 3 +- .../Quiz/QuizBegin/QuizBegin.spec.tsx | 3 +- .../Quiz/QuizFinish/QuizFinish.spec.tsx | 3 +- src/components/Quiz/QuizFinish/QuizFinish.tsx | 1 + .../QuizQuestionContentCustom.spec.tsx | 4 +- .../Terms/DataShareConsentContent.spec.tsx | 6 +- src/components/Terms/TermsView.spec.tsx | 52 ++++++------ src/store/analysis/analysis.slice.spec.ts | 4 +- src/store/challenge/challenge.slice.spec.ts | 2 +- src/store/chart/chart.slice.spec.ts | 4 +- src/store/global/global.slice.spec.ts | 2 +- src/store/hooks.ts | 6 +- src/store/modal/modal.slice.spec.ts | 6 +- src/store/profile/profile.slice.spec.ts | 4 +- .../profileEcogesture.slice.spec.ts | 4 +- .../profileType/profileType.slice.spec.ts | 4 +- src/store/store.ts | 13 ++- tests/__mocks__/client.mock.ts | 1 + tests/__mocks__/store/store.mock.ts | 20 ++--- yarn.lock | 79 ++++++++----------- 45 files changed, 222 insertions(+), 179 deletions(-) diff --git a/package.json b/package.json index 1c3e6c41e..6f53e0b88 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "@cozy/minilog": "^1.0.0", "@material-ui/core": "~4.12.0", "@material-ui/styles": "^4.11.3", - "@reduxjs/toolkit": "^1.9.5", + "@reduxjs/toolkit": "^2.2.7", "@sentry/react": "^8.26.0", "classnames": "^2.5.1", "cozy-bar": "8.15.0", @@ -71,12 +71,11 @@ "react": "18.2.0", "react-dom": "18.2.0", "react-inspector": "^5.1", - "react-redux": "^8.1.2", + "react-redux": "^9.1.2", "react-router-dom": "^6.6.1", "react-swipeable-views": "0.14.0", "redux-devtools-extension": "^2.13.8", "redux-logger": "^3.0.6", - "redux-thunk": "^2.4.2", "xlsx": "^0.18.5" }, "devDependencies": { @@ -96,7 +95,7 @@ "@types/react": "^18.2.25", "@types/react-dom": "^18.2.11", "@types/react-lottie": "^1.2.3", - "@types/redux-mock-store": "^1.0.2", + "@types/redux-mock-store": "^1.0.6", "@typescript-eslint/eslint-plugin": "^6.0.0", "@typescript-eslint/parser": "^6.0.0", "axios": "^1.3.0", diff --git a/src/components/Action/ActionCard/ActionCard.spec.tsx b/src/components/Action/ActionCard/ActionCard.spec.tsx index 44a22ec8a..9d451bd17 100644 --- a/src/components/Action/ActionCard/ActionCard.spec.tsx +++ b/src/components/Action/ActionCard/ActionCard.spec.tsx @@ -3,13 +3,17 @@ import { userEvent } from '@testing-library/user-event' import React from 'react' import { Provider } from 'react-redux' import { defaultEcogestureData } from 'tests/__mocks__/actionData.mock' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockChallengeState, +} from 'tests/__mocks__/store' import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock' import ActionCard from './ActionCard' describe('ActionCard component', () => { const store = createMockEcolyoStore({ challenge: { + ...mockChallengeState, currentChallenge: userChallengeData[1], }, }) diff --git a/src/components/Action/ActionList/ActionList.spec.tsx b/src/components/Action/ActionList/ActionList.spec.tsx index d18557624..54329b779 100644 --- a/src/components/Action/ActionList/ActionList.spec.tsx +++ b/src/components/Action/ActionList/ActionList.spec.tsx @@ -5,6 +5,7 @@ import { defaultEcogestureData } from 'tests/__mocks__/actionData.mock' import { createMockEcolyoStore, mockChallengeState, + mockGlobalState, mockProfileState, } from 'tests/__mocks__/store' import ActionList from './ActionList' @@ -22,7 +23,7 @@ describe('ActionList component', () => { mockGetDefaultActions.mockResolvedValueOnce(defaultEcogestureData) const store = createMockEcolyoStore({ challenge: { ...mockChallengeState }, - global: { fluidTypes: [0, 1, 2] }, + global: { ...mockGlobalState, fluidTypes: [0, 1, 2] }, profile: mockProfileState, }) const { container } = render( diff --git a/src/components/Action/ActionView.spec.tsx b/src/components/Action/ActionView.spec.tsx index 22933cb1b..25bd7eef0 100644 --- a/src/components/Action/ActionView.spec.tsx +++ b/src/components/Action/ActionView.spec.tsx @@ -3,7 +3,10 @@ import ActionView from 'components/Action/ActionView' import { UserActionState } from 'enums' import React from 'react' import { Provider } from 'react-redux' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockChallengeState, +} from 'tests/__mocks__/store' import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock' jest.mock('components/Header/CozyBar', () => 'mock-cozybar') @@ -26,6 +29,7 @@ describe('ActionView component', () => { it('should render match snapshot with "Unstarted" state', async () => { const store = createMockEcolyoStore({ challenge: { + ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { @@ -45,6 +49,7 @@ describe('ActionView component', () => { it('should render match snapshot with "onGoing" state', async () => { const store = createMockEcolyoStore({ challenge: { + ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { @@ -64,6 +69,7 @@ describe('ActionView component', () => { it('should render match snapshot with "Notification" state', async () => { const store = createMockEcolyoStore({ challenge: { + ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { @@ -83,6 +89,7 @@ describe('ActionView component', () => { it('should render match snapshot with default case', async () => { const store = createMockEcolyoStore({ challenge: { + ...mockChallengeState, currentChallenge: { ...userChallengeData[1], action: { diff --git a/src/components/Analysis/AnalysisView.spec.tsx b/src/components/Analysis/AnalysisView.spec.tsx index 6be3d34fd..e59782947 100644 --- a/src/components/Analysis/AnalysisView.spec.tsx +++ b/src/components/Analysis/AnalysisView.spec.tsx @@ -9,6 +9,7 @@ import { createMockEcolyoStore, mockAnalysisState, mockChartState, + mockGlobalState, mockProfileState, } from 'tests/__mocks__/store' @@ -52,7 +53,7 @@ describe('AnalysisView component', () => { const store = createMockEcolyoStore({ analysis: mockAnalysisState, chart: mockChartState, - global: { analysisNotification: true }, + global: { ...mockGlobalState, analysisNotification: true }, profile: { ...mockProfileState, haveSeenLastAnalysis: true }, }) mockAppDispatch.mockReturnValue(jest.fn()) diff --git a/src/components/Analysis/Comparison/Comparison.spec.tsx b/src/components/Analysis/Comparison/Comparison.spec.tsx index ed2847a86..da099dfcb 100644 --- a/src/components/Analysis/Comparison/Comparison.spec.tsx +++ b/src/components/Analysis/Comparison/Comparison.spec.tsx @@ -5,7 +5,11 @@ import { PerformanceIndicator } from 'models' import React from 'react' import { Provider } from 'react-redux' import { setPeriod } from 'store/analysis/analysis.slice' -import { createMockEcolyoStore, mockAnalysisState } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockAnalysisState, + mockGlobalState, +} from 'tests/__mocks__/store' import Comparison from './Comparison' jest.mock( @@ -61,6 +65,7 @@ describe('Comparison component', () => { const store = createMockEcolyoStore({ analysis: { ...mockAnalysisState, period: 'month' }, global: { + ...mockGlobalState, fluidTypes: mockFluidsWithData, }, }) @@ -99,6 +104,7 @@ describe('Comparison component', () => { const store = createMockEcolyoStore({ analysis: { ...mockAnalysisState }, global: { + ...mockGlobalState, fluidTypes: mockFluidsWithData, }, }) diff --git a/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx b/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx index d25d9aa70..32487e9d4 100644 --- a/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx +++ b/src/components/Analysis/Comparison/FluidPerformanceIndicator.spec.tsx @@ -6,11 +6,13 @@ import { DateTime } from 'luxon' import { PerformanceIndicator } from 'models' import React from 'react' import { Provider } from 'react-redux' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockAnalysisState } from 'tests/__mocks__/store' import FluidPerformanceIndicator from './FluidPerformanceIndicator' const monthlyStore = createMockEcolyoStore() -const yearlyStore = createMockEcolyoStore({ analysis: { period: 'year' } }) +const yearlyStore = createMockEcolyoStore({ + analysis: { ...mockAnalysisState, period: 'year' }, +}) const mockedNavigate = jest.fn() jest.mock('react-router-dom', () => ({ ...jest.requireActual('react-router-dom'), diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourChart.spec.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourChart.spec.tsx index dabce7334..289590c65 100644 --- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourChart.spec.tsx +++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourChart.spec.tsx @@ -3,7 +3,11 @@ import { DateTime } from 'luxon' import React from 'react' import { Provider } from 'react-redux' import { dataLoadArray } from 'tests/__mocks__/chartData.mock' -import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockChartState, + mockGlobalState, +} from 'tests/__mocks__/store' import ElecHalfHourChart from './ElecHalfHourChart' jest.mock('services/dateChart.service', () => { @@ -15,6 +19,7 @@ jest.mock('services/dateChart.service', () => { describe('ElecHalfHourChart component', () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, selectedDate: DateTime.fromISO('2021-07-01T00:00:00.000Z', { zone: 'utc', }), diff --git a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap index 4692b5f9f..d27330fb3 100644 --- a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap +++ b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap @@ -123,7 +123,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = ` transform="translate(54.6875, -40)" > <rect - class="background-false" + class="background-true" fill="#E0E0E0" height="220" width="218.75" @@ -154,7 +154,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = ` </lineargradient> </defs> <path - class="bar-ELECTRICITY disabled bounce-1 delay--0" + class="bar-ELECTRICITY selected disabled bounce-1 delay--0" d=" M0,4 a4,4 0 0 1 4,-4 @@ -175,7 +175,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = ` </title> <defs> <lineargradient - class="bar-ELECTRICITY disabled bounce-1 delay--0" + class="bar-ELECTRICITY selected disabled bounce-1 delay--0" id="gradient" x1="0" x2="0" @@ -193,7 +193,7 @@ exports[`MaxConsumptionCard component should be rendered correctly 1`] = ` </lineargradient> </defs> <path - class="bar-ELECTRICITY disabled bounce-1 delay--0" + class="bar-ELECTRICITY selected disabled bounce-1 delay--0" d=" M0,4 a4,4 0 0 1 4,-4 diff --git a/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx b/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx index 89209571b..d02503c69 100644 --- a/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx +++ b/src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx @@ -48,8 +48,10 @@ describe('ChallengeCardUnlocked component', () => { }) it('should not display ChallengeNoFluidModal and update userChallenge when launching challenge with configured fluid', async () => { + mockStartUserChallenge.mockResolvedValue(userChallengeData[0]) const store = createMockEcolyoStore({ global: { + ...mockGlobalState, fluidTypes: [FluidType.ELECTRICITY], fluidStatus: [ { ...mockGlobalState.fluidStatus[0], status: FluidState.DONE }, @@ -72,6 +74,7 @@ describe('ChallengeCardUnlocked component', () => { }) it('should not be able to launch challenge if another one is active', async () => { + mockStartUserChallenge.mockResolvedValue(userChallengeData[0]) const store = createMockEcolyoStore({ global: mockGlobalState, challenge: { diff --git a/src/components/Charts/AxisBottom.spec.tsx b/src/components/Charts/AxisBottom.spec.tsx index a0b36f53c..7ccd6e039 100644 --- a/src/components/Charts/AxisBottom.spec.tsx +++ b/src/components/Charts/AxisBottom.spec.tsx @@ -5,7 +5,7 @@ import { DateTime } from 'luxon' import React from 'react' import { Provider } from 'react-redux' import { graphData } from 'tests/__mocks__/chartData.mock' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockChartState } from 'tests/__mocks__/store' import AxisBottom from './AxisBottom' const mockXScale: ScaleBand<string> = scaleBand() @@ -24,6 +24,7 @@ const mockProps = { describe('AxisBottom component test', () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, selectedDate: DateTime.fromISO('2020-10-01T00:00:00.000Z', { zone: 'utc', }), diff --git a/src/components/Charts/Bar.spec.tsx b/src/components/Charts/Bar.spec.tsx index 73cf573db..92699761a 100644 --- a/src/components/Charts/Bar.spec.tsx +++ b/src/components/Charts/Bar.spec.tsx @@ -7,7 +7,11 @@ import React from 'react' import { Provider } from 'react-redux' import * as chartActions from 'store/chart/chart.slice' import { graphData } from 'tests/__mocks__/chartData.mock' -import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockChartState, + mockGlobalState, +} from 'tests/__mocks__/store' import { mockXScale } from 'tests/__mocks__/xScale.mock' import Bar from './Bar' @@ -30,6 +34,7 @@ const setSelectedDateSpy = jest.spyOn(chartActions, 'setSelectedDate') describe('Bar component test', () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, selectedDate: DateTime.fromISO('2020-10-01T00:00:00.000Z', { zone: 'utc', }), diff --git a/src/components/Charts/BarChart.spec.tsx b/src/components/Charts/BarChart.spec.tsx index 49177db68..d5dfacfc0 100644 --- a/src/components/Charts/BarChart.spec.tsx +++ b/src/components/Charts/BarChart.spec.tsx @@ -4,12 +4,17 @@ import { DateTime } from 'luxon' import React from 'react' import { Provider } from 'react-redux' import { graphData } from 'tests/__mocks__/chartData.mock' -import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockChartState, + mockGlobalState, +} from 'tests/__mocks__/store' import BarChart from './BarChart' describe('BarChart component', () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, selectedDate: DateTime.fromISO('2020-10-01T00:00:00.000Z', { zone: 'utc', }), diff --git a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx index a5edf1912..ced72db8d 100644 --- a/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx +++ b/src/components/Connection/ExpiredConsentModal/ExpiredConsentModal.spec.tsx @@ -5,7 +5,7 @@ import React from 'react' import { Provider } from 'react-redux' import * as storeHooks from 'store/hooks' import { fluidStatusConnectedData } from 'tests/__mocks__/fluidStatusData.mock' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' import ExpiredConsentModal from './ExpiredConsentModal' const mockedNavigate = jest.fn() @@ -53,7 +53,7 @@ describe('ExpiredConsentModal component', () => { }) it('should launch the update consent process for Enedis', async () => { const store = createMockEcolyoStore({ - global: { fluidStatus: fluidStatusConnectedData }, + global: { ...mockGlobalState, fluidStatus: fluidStatusConnectedData }, }) render( <Provider store={store}> @@ -68,7 +68,7 @@ describe('ExpiredConsentModal component', () => { await act(async () => { await userEvent.click(screen.getByText('consent_outdated.yes')) }) - expect(mockAppDispatch).toHaveBeenCalledTimes(1) + expect(mockAppDispatch).toHaveBeenCalledTimes(2) expect(mockedNavigate).toHaveBeenCalledTimes(1) }) it('should click on close modal', async () => { diff --git a/src/components/Consumption/ConsumptionView.spec.tsx b/src/components/Consumption/ConsumptionView.spec.tsx index 96f96183d..be7f28bdc 100644 --- a/src/components/Consumption/ConsumptionView.spec.tsx +++ b/src/components/Consumption/ConsumptionView.spec.tsx @@ -12,6 +12,7 @@ import { mockTestProfile1 } from 'tests/__mocks__/profileType.mock' import { createMockEcolyoStore, mockChartState, + mockGlobalState, mockInitialEcolyoState, mockModalState, } from 'tests/__mocks__/store' @@ -62,6 +63,7 @@ describe('ConsumptionView component', () => { showOfflineData: true, }, global: { + ...mockGlobalState, fluidStatus: mockFluidStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -89,6 +91,7 @@ describe('ConsumptionView component', () => { currentTimeStep: TimeStep.HALF_AN_HOUR, }, global: { + ...mockGlobalState, fluidStatus: mockInitialEcolyoState.global.fluidStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -107,6 +110,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: [], releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -126,6 +130,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: mockFluidStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -149,6 +154,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: mockFluidStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -175,6 +181,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: updatedStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -203,6 +210,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: updatedStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -231,6 +239,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: updatedStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -249,6 +258,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: updatedStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -265,6 +275,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: mockFluidStatus, releaseNotes: mockInitialEcolyoState.global.releaseNotes, }, @@ -285,6 +296,7 @@ describe('ConsumptionView component', () => { const store = createMockEcolyoStore({ chart: mockChartStateShowOffline, global: { + ...mockGlobalState, fluidStatus: mockFluidStatus, releaseNotes: { show: true, diff --git a/src/components/Content/Content.spec.tsx b/src/components/Content/Content.spec.tsx index 33f840564..a68cc4d18 100644 --- a/src/components/Content/Content.spec.tsx +++ b/src/components/Content/Content.spec.tsx @@ -5,6 +5,7 @@ import { createMockEcolyoStore, mockChallengeState, mockGlobalState, + mockModalState, } from 'tests/__mocks__/store' import Content from './Content' @@ -26,7 +27,7 @@ describe('Content component', () => { const store = createMockEcolyoStore({ global: mockGlobalState, challenge: mockChallengeState, - modal: { isFeedbacksOpen: true }, + modal: { ...mockModalState, isFeedbacksOpen: true }, }) const { container } = render( <Provider store={store}> diff --git a/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx b/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx index 60e1521ee..ac8509e84 100644 --- a/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx +++ b/src/components/Duel/DuelUnlocked/DuelUnlocked.spec.tsx @@ -9,11 +9,10 @@ import { formatNumberValues } from 'utils/utils' import DuelUnlocked from './DuelUnlocked' const mockUserChallengeUpdateFlag = jest.fn() -const mockGetUserChallengeDataload = jest.fn() jest.mock('services/challenge.service', () => { return jest.fn(() => ({ updateUserChallenge: mockUserChallengeUpdateFlag, - getUserChallengeDataload: mockGetUserChallengeDataload, + getUserChallengeDataload: jest.fn(), })) }) @@ -42,6 +41,7 @@ describe('DuelUnlocked component', () => { }) it('should update userChallenge when launching duel with configured fluid', async () => { + mockUserChallengeUpdateFlag.mockResolvedValueOnce(userChallengeData[0]) const store = createMockEcolyoStore({ global: { ...mockGlobalState, diff --git a/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx b/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx index ad7693384..d48f4c5d0 100644 --- a/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx +++ b/src/components/Duel/DuelUnlocked/DuelUnlocked.tsx @@ -31,6 +31,7 @@ const DuelUnlocked = ({ userChallenge }: { userChallenge: UserChallenge }) => { userChallenge, UserChallengeUpdateFlag.DUEL_START ) + const dataloads = await challengeService.getUserChallengeDataload(updatedChallenge) dispatch( diff --git a/src/components/EcogestureForm/EcogestureFormView.spec.tsx b/src/components/EcogestureForm/EcogestureFormView.spec.tsx index f040f1797..1f3081163 100644 --- a/src/components/EcogestureForm/EcogestureFormView.spec.tsx +++ b/src/components/EcogestureForm/EcogestureFormView.spec.tsx @@ -4,7 +4,7 @@ import React from 'react' import { Provider } from 'react-redux' import * as storeHooks from 'store/hooks' import { mockProfileEcogesture } from 'tests/__mocks__/profileEcogesture.mock' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockProfileState } from 'tests/__mocks__/store' import EcogestureFormView from './EcogestureFormView' jest.mock('components/Header/CozyBar', () => 'mock-cozybar') @@ -51,7 +51,7 @@ describe('EcogestureFormView component', () => { }) it('should render profiletype form step because profiletype is completed', async () => { const store = createMockEcolyoStore({ - profile: { isProfileTypeCompleted: true }, + profile: { ...mockProfileState, isProfileTypeCompleted: true }, profileEcogesture: mockProfileEcogesture, }) const { container } = render( diff --git a/src/components/Feedback/FeedbackModal.spec.tsx b/src/components/Feedback/FeedbackModal.spec.tsx index d4b8e53a7..2444ef63d 100644 --- a/src/components/Feedback/FeedbackModal.spec.tsx +++ b/src/components/Feedback/FeedbackModal.spec.tsx @@ -3,7 +3,7 @@ import userEvent from '@testing-library/user-event' import FeedbackModal from 'components/Feedback/FeedbackModal' import React from 'react' import { Provider } from 'react-redux' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockModalState } from 'tests/__mocks__/store' // Value coming from jest.config declare let __SAU_LINK__: string @@ -17,7 +17,9 @@ jest.mock('services/environment.service', () => { jest.mock('components/Hooks/useExploration', () => () => ['', jest.fn()]) describe('FeedbackModal component', () => { - const store = createMockEcolyoStore({ modal: { isFeedbacksOpen: true } }) + const store = createMockEcolyoStore({ + modal: { ...mockModalState, isFeedbacksOpen: true }, + }) beforeEach(() => { jest.clearAllMocks() }) diff --git a/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx b/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx index 91673e4f6..77251e882 100644 --- a/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx +++ b/src/components/FluidChart/TimeStepSelector/TimeStepSelector.spec.tsx @@ -6,7 +6,7 @@ import { DateTime } from 'luxon' import React from 'react' import { Provider } from 'react-redux' import * as chartActions from 'store/chart/chart.slice' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockChartState } from 'tests/__mocks__/store' const setCurrentTimeStepSpy = jest.spyOn(chartActions, 'setCurrentTimeStep') const setCurrentIndexSpy = jest.spyOn(chartActions, 'setCurrentIndex') @@ -20,6 +20,7 @@ describe('TimeStepSelector component', () => { it('should render component properly with 4 timesteps', async () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, currentTimeStep: TimeStep.DAY, selectedDate: DateTime.local().setZone('utc', { keepLocalTime: true, @@ -38,6 +39,7 @@ describe('TimeStepSelector component', () => { it('should render component properly with 5 timesteps', () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, currentTimeStep: TimeStep.DAY, selectedDate: DateTime.local().setZone('utc', { keepLocalTime: true, @@ -55,6 +57,7 @@ describe('TimeStepSelector component', () => { it('should define next TimeStep and dispatch it', async () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, currentTimeStep: TimeStep.YEAR, selectedDate: DateTime.local().setZone('utc', { keepLocalTime: true, @@ -76,6 +79,7 @@ describe('TimeStepSelector component', () => { it('should go to todays day with timestep week', async () => { const store = createMockEcolyoStore({ chart: { + ...mockChartState, currentTimeStep: TimeStep.YEAR, selectedDate: DateTime.local().setZone('utc', { keepLocalTime: true, diff --git a/src/components/Header/CozyBar.spec.tsx b/src/components/Header/CozyBar.spec.tsx index 960d68105..f8ecdef73 100644 --- a/src/components/Header/CozyBar.spec.tsx +++ b/src/components/Header/CozyBar.spec.tsx @@ -5,7 +5,7 @@ import { ScreenType } from 'enums' import React from 'react' import { Provider } from 'react-redux' import * as ModalAction from 'store/modal/modal.slice' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' interface BarProps { children: React.ReactNode @@ -86,7 +86,7 @@ describe('CozyBar component', () => { it('should not be rendered with screen type different from mobile', () => { const store = createMockEcolyoStore({ - global: { screenType: ScreenType.DESKTOP }, + global: { ...mockGlobalState, screenType: ScreenType.DESKTOP }, }) const { container } = render( <Provider store={store}> diff --git a/src/components/Header/Header.spec.tsx b/src/components/Header/Header.spec.tsx index 22c116a71..5d50f14bf 100644 --- a/src/components/Header/Header.spec.tsx +++ b/src/components/Header/Header.spec.tsx @@ -1,14 +1,11 @@ import { act, render, screen } from '@testing-library/react' import userEvent from '@testing-library/user-event' import Header from 'components/Header/Header' +import { ScreenType } from 'enums' import React from 'react' import { Provider } from 'react-redux' import * as ModalAction from 'store/modal/modal.slice' -import { - createMockEcolyoStore, - mockInitialEcolyoState, -} from 'tests/__mocks__/store' -import { ScreenType } from 'enums' +import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' const mockedNavigate = jest.fn() jest.mock('react-router-dom', () => ({ @@ -17,22 +14,18 @@ jest.mock('react-router-dom', () => ({ })) describe('Header component', () => { - const store = createMockEcolyoStore(mockInitialEcolyoState) + const mobileStore = createMockEcolyoStore() + const desktopStore = createMockEcolyoStore({ + global: { ...mockGlobalState, screenType: ScreenType.DESKTOP }, + }) beforeEach(() => { - const state = store.getState() - if (state.ecolyo?.global) { - state.ecolyo.global.screenType = ScreenType.DESKTOP - } + jest.clearAllMocks() }) it('should be rendered correctly on mobile', () => { - const state = store.getState() - if (state.ecolyo?.global) { - state.ecolyo.global.screenType = ScreenType.MOBILE - } const { container } = render( - <Provider store={store}> + <Provider store={mobileStore}> <Header desktopTitleKey="mockKey" /> </Provider> ) @@ -42,7 +35,7 @@ describe('Header component', () => { it('should be rendered correctly on desktop', () => { const { container } = render( - <Provider store={store}> + <Provider store={desktopStore}> <Header desktopTitleKey="mockKey" /> </Provider> ) @@ -52,17 +45,17 @@ describe('Header component', () => { it('should display desktop title text when desktopTitleKey provided', () => { const titleKey = 'Test Title' - const { getByText } = render( - <Provider store={store}> + render( + <Provider store={desktopStore}> <Header desktopTitleKey={titleKey} /> </Provider> ) - expect(getByText(titleKey)).toBeInTheDocument() + expect(screen.getByText(titleKey)).toBeInTheDocument() }) it('should not display desktop title text when desktopTitleKey not provided', () => { const { queryByText } = render( - <Provider store={store}> + <Provider store={desktopStore}> <Header desktopTitleKey="" /> </Provider> ) @@ -72,7 +65,7 @@ describe('Header component', () => { it('should display title and back button when desktopTitle key provided and displayBackArrow is true', () => { const key = 'titleKey' render( - <Provider store={store}> + <Provider store={desktopStore}> <Header desktopTitleKey={key} displayBackArrow={true} /> </Provider> ) @@ -84,7 +77,7 @@ describe('Header component', () => { it('should NOT display back button when displayBackArrow is false', () => { render( - <Provider store={store}> + <Provider store={mobileStore}> <Header desktopTitleKey="test" displayBackArrow={false} /> </Provider> ) @@ -98,7 +91,7 @@ describe('Header component', () => { describe('back functions', () => { it('should call navigate -1 when back button is clicked with NO back fn', async () => { render( - <Provider store={store}> + <Provider store={desktopStore}> <Header desktopTitleKey="KEY" displayBackArrow={true} /> </Provider> ) @@ -113,7 +106,7 @@ describe('Header component', () => { it('should call custom back fn when back button is clicked', async () => { const mockBack = jest.fn() render( - <Provider store={store}> + <Provider store={desktopStore}> <Header desktopTitleKey="KEY" displayBackArrow={true} @@ -132,7 +125,7 @@ describe('Header component', () => { it('should call handleClickFeedbacks when feedback button is clicked', async () => { render( - <Provider store={store}> + <Provider store={mobileStore}> <Header desktopTitleKey="mockKey" /> </Provider> ) diff --git a/src/components/Hooks/useExploration.spec.tsx b/src/components/Hooks/useExploration.spec.tsx index 7b3184ff0..f1fe70cfd 100644 --- a/src/components/Hooks/useExploration.spec.tsx +++ b/src/components/Hooks/useExploration.spec.tsx @@ -2,14 +2,20 @@ import { act, renderHook } from '@testing-library/react' import { UserExplorationID } from 'enums' import React from 'react' import { Provider } from 'react-redux' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { + createMockEcolyoStore, + mockChallengeState, +} from 'tests/__mocks__/store' import { userChallengeExplo1OnGoing } from 'tests/__mocks__/userChallengeData.mock' import useExploration from './useExploration' describe('useExploration Hooks', () => { it('should return "EXPLORATION001"', () => { const store = createMockEcolyoStore({ - challenge: { currentChallenge: userChallengeExplo1OnGoing }, + challenge: { + ...mockChallengeState, + currentChallenge: userChallengeExplo1OnGoing, + }, }) const wrapper = ({ children }: { children: JSX.Element }) => ( diff --git a/src/components/Navbar/Navbar.spec.tsx b/src/components/Navbar/Navbar.spec.tsx index d4d426391..c41d4d1fa 100644 --- a/src/components/Navbar/Navbar.spec.tsx +++ b/src/components/Navbar/Navbar.spec.tsx @@ -3,7 +3,7 @@ import Navbar from 'components/Navbar/Navbar' import React from 'react' import { Provider } from 'react-redux' import { BrowserRouter } from 'react-router-dom' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockGlobalState } from 'tests/__mocks__/store' describe('Navbar component', () => { it('should be rendered correctly with 5 navlink', () => { @@ -21,6 +21,7 @@ describe('Navbar component', () => { it('should be rendered correctly with notifications', () => { const store = createMockEcolyoStore({ global: { + ...mockGlobalState, challengeExplorationNotification: true, challengeActionNotification: false, challengeDuelNotification: false, @@ -41,6 +42,7 @@ describe('Navbar component', () => { it('should be rendered correctly without notifications', () => { const store = createMockEcolyoStore({ global: { + ...mockGlobalState, challengeExplorationNotification: false, challengeActionNotification: false, challengeDuelNotification: false, diff --git a/src/components/Options/ReportOptions/ReportOptions.spec.tsx b/src/components/Options/ReportOptions/ReportOptions.spec.tsx index 14752d0b2..747eb7aa3 100644 --- a/src/components/Options/ReportOptions/ReportOptions.spec.tsx +++ b/src/components/Options/ReportOptions/ReportOptions.spec.tsx @@ -71,7 +71,7 @@ describe('ReportOptions component', () => { describe('should test water alert', () => { const storeWaterDone = createMockEcolyoStore({ global: { ...mockGlobalState, fluidStatus: fluidStatusConnectedData }, - profile: { sendAnalysisNotification: false }, + profile: { ...mockProfileState, sendAnalysisNotification: false }, }) it('should be rendered with sendConsumptionAlert to false and enable it', async () => { render( @@ -93,6 +93,7 @@ describe('ReportOptions component', () => { const storeWaterAlert = createMockEcolyoStore({ global: { ...mockGlobalState, fluidStatus: fluidStatusConnectedData }, profile: { + ...mockProfileState, sendConsumptionAlert: true, waterDailyConsumptionLimit: 100, }, diff --git a/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx b/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx index ccaf243e8..11d1e2a39 100644 --- a/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx +++ b/src/components/Quiz/QuizBegin/QuizBegin.spec.tsx @@ -15,7 +15,8 @@ jest.mock('services/challenge.service', () => { }) describe('QuizBegin component', () => { - it('should be rendered correctly', async () => { + it('should be rendered correctly and launch quiz', async () => { + mockUserChallengeUpdateFlag.mockResolvedValueOnce(userChallengeData[0]) const store = createMockEcolyoStore() const { container } = render( <Provider store={store}> diff --git a/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx b/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx index 9bac2567e..64c31a9f6 100644 --- a/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx +++ b/src/components/Quiz/QuizFinish/QuizFinish.spec.tsx @@ -20,7 +20,8 @@ jest.mock('react-router-dom', () => ({ })) describe('QuizFinish', () => { - it('should be rendered correctly', async () => { + it('should be rendered correctly and go back to challenges page', async () => { + mockUserChallengeUpdateFlag.mockResolvedValueOnce(userChallengeData[0]) const store = createMockEcolyoStore() const { container } = render( <Provider store={store}> diff --git a/src/components/Quiz/QuizFinish/QuizFinish.tsx b/src/components/Quiz/QuizFinish/QuizFinish.tsx index c2c1d8ebe..92e016e4c 100644 --- a/src/components/Quiz/QuizFinish/QuizFinish.tsx +++ b/src/components/Quiz/QuizFinish/QuizFinish.tsx @@ -36,6 +36,7 @@ const QuizFinish = ({ userChallenge }: { userChallenge: UserChallenge }) => { dispatch(updateUserChallengeList(userChallengeUpdated)) navigate('/challenges') } + return ( <div className="quiz-container"> <div className="quiz-finish-container"> diff --git a/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx b/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx index f467eb0be..abffb7e85 100644 --- a/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx +++ b/src/components/Quiz/QuizQuestion/QuizQuestionContentCustom.spec.tsx @@ -23,9 +23,10 @@ jest.mock('services/quiz.service', () => { })) }) +const mockUpdateUserChallenge = jest.fn() jest.mock('services/challenge.service', () => { return jest.fn(() => ({ - updateUserChallenge: jest.fn(), + updateUserChallenge: mockUpdateUserChallenge, })) }) @@ -65,6 +66,7 @@ describe('QuizCustomQuestionContent component', () => { ).toBeInTheDocument() }) it('should display QuizExplanationModal when click on Button', async () => { + mockUpdateUserChallenge.mockResolvedValue(userChallengeData[0]) render( <Provider store={store}> <QuizQuestionContentCustom diff --git a/src/components/Terms/DataShareConsentContent.spec.tsx b/src/components/Terms/DataShareConsentContent.spec.tsx index d2e1baab7..5b0a587b2 100644 --- a/src/components/Terms/DataShareConsentContent.spec.tsx +++ b/src/components/Terms/DataShareConsentContent.spec.tsx @@ -1,13 +1,13 @@ import { render } from '@testing-library/react' import React from 'react' import { Provider } from 'react-redux' -import { createMockEcolyoStore } from 'tests/__mocks__/store' +import { createMockEcolyoStore, mockProfileState } from 'tests/__mocks__/store' import DataShareConsentContent from './DataShareConsentContent' describe('DataShareConsentContent component', () => { it('should be rendered correctly with first connexion text', () => { const store = createMockEcolyoStore({ - profile: { isFirstConnection: true }, + profile: { ...mockProfileState, isFirstConnection: true }, }) const { container } = render( <Provider store={store}> @@ -18,7 +18,7 @@ describe('DataShareConsentContent component', () => { }) it('should be rendered correctly without first connexion text', () => { const store = createMockEcolyoStore({ - profile: { isFirstConnection: false }, + profile: { ...mockProfileState, isFirstConnection: false }, }) const { container } = render( <Provider store={store}> diff --git a/src/components/Terms/TermsView.spec.tsx b/src/components/Terms/TermsView.spec.tsx index 98d0aae76..35a4a7280 100644 --- a/src/components/Terms/TermsView.spec.tsx +++ b/src/components/Terms/TermsView.spec.tsx @@ -40,30 +40,6 @@ describe('TermsView component', () => { await waitFor(() => null, { container }) expect(container).toMatchSnapshot() }) - it('should be unable to click "validate" button first then enable checkboxes and valid consent', async () => { - mockCreateTerm.mockResolvedValueOnce(mockUpToDateTerm) - const { container } = render( - <Provider store={store}> - <TermsView /> - </Provider> - ) - await waitFor(() => null, { container }) - - const acceptButton = screen.getByLabelText( - 'dataShare.accessibility.button_accept' - ) - expect(acceptButton).toBeDisabled() - expect(mockUpdateProfile).toHaveBeenCalledTimes(0) - - const [boxGCU, boxLegal] = screen.getAllByRole('checkbox') - await act(async () => { - await userEvent.click(boxGCU) - await userEvent.click(boxLegal) - await userEvent.click(acceptButton) - }) - - expect(mockAppDispatch).toHaveBeenCalledTimes(3) - }) it('should open CGU modal', async () => { render( @@ -73,7 +49,9 @@ describe('TermsView component', () => { ) await act(async () => { await userEvent.click( - screen.getByRole('button', { name: 'dataShare.validCGU_button' }) + screen.getByRole('button', { + name: 'dataShare.validCGU_button', + }) ) }) expect(screen.getByRole('dialog')).toBeInTheDocument() @@ -92,4 +70,28 @@ describe('TermsView component', () => { }) expect(screen.getByRole('dialog')).toBeInTheDocument() }) + it('should be unable to click "validate" button first then enable checkboxes and valid consent', async () => { + mockCreateTerm.mockResolvedValueOnce(mockUpToDateTerm) + const { container } = render( + <Provider store={store}> + <TermsView /> + </Provider> + ) + await waitFor(() => null, { container }) + + const acceptButton = screen.getByLabelText( + 'dataShare.accessibility.button_accept' + ) + expect(acceptButton).toBeDisabled() + expect(mockUpdateProfile).toHaveBeenCalledTimes(0) + + const [boxGCU, boxLegal] = screen.getAllByRole('checkbox') + await act(async () => { + await userEvent.click(boxGCU) + await userEvent.click(boxLegal) + await userEvent.click(acceptButton) + }) + + expect(mockAppDispatch).toHaveBeenCalledTimes(4) + }) }) diff --git a/src/store/analysis/analysis.slice.spec.ts b/src/store/analysis/analysis.slice.spec.ts index 8e8ac488e..d8e8fec77 100644 --- a/src/store/analysis/analysis.slice.spec.ts +++ b/src/store/analysis/analysis.slice.spec.ts @@ -4,9 +4,7 @@ import { analysisSlice, setAnalysisMonth, setPeriod } from './analysis.slice' describe('analysis reducer', () => { it('should return the initial state', () => { - const initialState = analysisSlice.reducer(undefined, { - type: undefined, - }) + const initialState = analysisSlice.getInitialState() expect(initialState).toEqual({ ...mockAnalysisState, analysisMonth: DateTime.local().minus({ months: 1 }).startOf('day'), diff --git a/src/store/challenge/challenge.slice.spec.ts b/src/store/challenge/challenge.slice.spec.ts index f4a265cdf..600a19afa 100644 --- a/src/store/challenge/challenge.slice.spec.ts +++ b/src/store/challenge/challenge.slice.spec.ts @@ -16,7 +16,7 @@ import { describe('challenge reducer', () => { it('should return the initial state', () => { - const state = challengeSlice.reducer(undefined, { type: undefined }) + const state = challengeSlice.getInitialState() expect(state).toEqual(mockChallengeState) }) diff --git a/src/store/chart/chart.slice.spec.ts b/src/store/chart/chart.slice.spec.ts index 02f68b639..c585209bd 100644 --- a/src/store/chart/chart.slice.spec.ts +++ b/src/store/chart/chart.slice.spec.ts @@ -15,12 +15,12 @@ import { describe('chart reducer', () => { it('should return the initial state', () => { - const initialState = chartSlice.reducer(undefined, { type: undefined }) + const initialState = chartSlice.getInitialState() expect(initialState).toEqual(mockChartState) }) it('should return same state if no action', () => { - const state = chartSlice.reducer(mockChartState, { type: undefined }) + const state = chartSlice.getInitialState() expect(state).toEqual(mockChartState) }) diff --git a/src/store/global/global.slice.spec.ts b/src/store/global/global.slice.spec.ts index 3df92c909..ea4114529 100644 --- a/src/store/global/global.slice.spec.ts +++ b/src/store/global/global.slice.spec.ts @@ -100,7 +100,7 @@ const fluidStatus: FluidStatus[] = [ describe('globalSlice', () => { it('should return the initial state', () => { - const initialState = globalSlice.reducer(undefined, { type: undefined }) + const initialState = globalSlice.getInitialState() expect(initialState).toEqual(mockGlobalState) }) diff --git a/src/store/hooks.ts b/src/store/hooks.ts index 21a319209..66ed0295e 100644 --- a/src/store/hooks.ts +++ b/src/store/hooks.ts @@ -1,9 +1,9 @@ // eslint-disable-next-line @typescript-eslint/no-restricted-imports -import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux' +import { useDispatch, useSelector } from 'react-redux' import { AppDispatch, AppState } from './store' // Typed hooks // https://redux.js.org/tutorials/typescript-quick-start#define-typed-hooks -export const useAppDispatch: () => AppDispatch = useDispatch -export const useAppSelector: TypedUseSelectorHook<AppState> = useSelector +export const useAppDispatch = useDispatch.withTypes<AppDispatch>() +export const useAppSelector = useSelector.withTypes<AppState>() diff --git a/src/store/modal/modal.slice.spec.ts b/src/store/modal/modal.slice.spec.ts index 3ff8dd684..83ba110aa 100644 --- a/src/store/modal/modal.slice.spec.ts +++ b/src/store/modal/modal.slice.spec.ts @@ -10,7 +10,7 @@ import { describe('modal reducer', () => { it('should return the initial state', () => { - const initialState = modalSlice.reducer(undefined, { type: undefined }) + const initialState = modalSlice.getInitialState() expect(initialState).toEqual(mockModalState) }) @@ -31,9 +31,7 @@ describe('modal reducer', () => { grdf: true, } it('should have all partners to false by default', () => { - const state = modalSlice.reducer(mockModalState, { - type: undefined, - }) + const state = modalSlice.getInitialState() const expectedResult: ModalState = { ...mockModalState, partnersIssueModal: { diff --git a/src/store/profile/profile.slice.spec.ts b/src/store/profile/profile.slice.spec.ts index aca5f4bbd..eb1e2b65c 100644 --- a/src/store/profile/profile.slice.spec.ts +++ b/src/store/profile/profile.slice.spec.ts @@ -3,9 +3,7 @@ import { profileSlice } from './profile.slice' describe('profile slice', () => { it('should return the initial state', () => { - const initialState = profileSlice.reducer(undefined, { - type: undefined, - }) + const initialState = profileSlice.getInitialState() expect(initialState).toEqual(mockProfileState) }) }) diff --git a/src/store/profileEcogesture/profileEcogesture.slice.spec.ts b/src/store/profileEcogesture/profileEcogesture.slice.spec.ts index 290c69278..6eedc284f 100644 --- a/src/store/profileEcogesture/profileEcogesture.slice.spec.ts +++ b/src/store/profileEcogesture/profileEcogesture.slice.spec.ts @@ -6,9 +6,7 @@ import { profileEcogestureSlice } from './profileEcogesture.slice' describe('profileEcogesture slice', () => { it('should return the initial state', () => { - const initialState = profileEcogestureSlice.reducer(undefined, { - type: undefined, - }) + const initialState = profileEcogestureSlice.getInitialState() expect(initialState).toEqual(mockProfileEcogesture) }) diff --git a/src/store/profileType/profileType.slice.spec.ts b/src/store/profileType/profileType.slice.spec.ts index d359df254..1b0f2500a 100644 --- a/src/store/profileType/profileType.slice.spec.ts +++ b/src/store/profileType/profileType.slice.spec.ts @@ -18,9 +18,7 @@ import { profileTypeSlice, setProfileType } from './profileType.slice' describe('profileType reducer', () => { it('should return the initial state', () => { - const initialState = profileTypeSlice.reducer(undefined, { - type: undefined, - }) + const initialState = profileTypeSlice.getInitialState() expect(initialState).toEqual(mockProfileTypeState) }) diff --git a/src/store/store.ts b/src/store/store.ts index 3348dcf8f..a9a184c31 100644 --- a/src/store/store.ts +++ b/src/store/store.ts @@ -61,19 +61,26 @@ const ecolyo = combineReducers({ }) /** setupStore function to configure redux store taking an extra argument 'client' */ -export const setupStore = (client: Client) => { +export const setupStore = ( + client: Client, + preloadedState?: Partial<AppState> +) => { const store = configureStore({ reducer: { cozy: client.reducer(), ecolyo, }, + preloadedState, middleware: getDefaultMiddleware => getDefaultMiddleware({ - serializableCheck: false, thunk: { extraArgument: { client } }, + serializableCheck: false, }), devTools: true, - enhancers: [sentryReduxEnhancer], + enhancers: getDefaultEnhancers => + getDefaultEnhancers({ + autoBatch: { type: 'tick' }, + }).concat(sentryReduxEnhancer), }) return store diff --git a/tests/__mocks__/client.mock.ts b/tests/__mocks__/client.mock.ts index f2b7101ee..3038b50b8 100644 --- a/tests/__mocks__/client.mock.ts +++ b/tests/__mocks__/client.mock.ts @@ -20,6 +20,7 @@ const mockClient = { options: { uri: 'http://cozy.tools:8080', // NOSONAR }, + reducer: () => ({}), } as unknown as jest.Mocked<Client> export default mockClient diff --git a/tests/__mocks__/store/store.mock.ts b/tests/__mocks__/store/store.mock.ts index cc4be7aa4..368816a11 100644 --- a/tests/__mocks__/store/store.mock.ts +++ b/tests/__mocks__/store/store.mock.ts @@ -1,7 +1,4 @@ -import { AnyAction } from '@reduxjs/toolkit' -import configureStore from 'redux-mock-store' -import thunkMiddleware from 'redux-thunk' -import { AppState, MockEcolyoState } from 'store/store' +import { AppState, setupStore } from 'store/store' import mockClient from '../client.mock' import { mockProfileEcogesture } from '../profileEcogesture.mock' import { mockAnalysisState } from './analysis.state.mock' @@ -23,21 +20,14 @@ export const mockInitialEcolyoState: AppState['ecolyo'] = { profileEcogesture: mockProfileEcogesture, } -const middlewares = [thunkMiddleware.withExtraArgument({ mockClient })] -const mockStore = configureStore< - { ecolyo: Partial<MockEcolyoState>; cozy: unknown }, - AnyAction ->(middlewares) - /** * Create a mocked Ecolyo store with the default mockInitialEcolyoState - * @argument state - optional, a partial desired state + * @param state - optional, a partial desired state */ export const createMockEcolyoStore = ( - initialState: Partial<MockEcolyoState> = mockInitialEcolyoState + initialState: Partial<AppState['ecolyo']> = mockInitialEcolyoState ) => { - return mockStore({ - ecolyo: initialState, - cozy: {}, + return setupStore(mockClient, { + ecolyo: { ...mockInitialEcolyoState, ...initialState }, }) } diff --git a/yarn.lock b/yarn.lock index 02e372ef8..57418d768 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1570,13 +1570,6 @@ dependencies: regenerator-runtime "^0.13.4" -"@babel/runtime@^7.12.1": - version "7.22.6" - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.6.tgz#57d64b9ae3cff1d67eb067ae117dac087f5bd438" - integrity sha512-wDb5pWm4WDdF6LFUde3Jl8WzPA+3ZbxYqkC6xAXuD3irdEHN1k0NfTRrJD8ZD378SJ61miMLCqIOXYhd8x+AJQ== - dependencies: - regenerator-runtime "^0.13.11" - "@babel/runtime@^7.12.5": version "7.24.4" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.24.4.tgz#de795accd698007a66ba44add6cc86542aff1edd" @@ -2541,15 +2534,15 @@ "@react-spring/core" "9.0.0-rc.3" "@react-spring/shared" "9.0.0-rc.3" -"@reduxjs/toolkit@^1.9.5": - version "1.9.5" - resolved "https://registry.yarnpkg.com/@reduxjs/toolkit/-/toolkit-1.9.5.tgz#d3987849c24189ca483baa7aa59386c8e52077c4" - integrity sha512-Rt97jHmfTeaxL4swLRNPD/zV4OxTes4la07Xc4hetpUW/vc75t5m1ANyxG6ymnEQ2FsLQsoMlYB2vV1sO3m8tQ== +"@reduxjs/toolkit@^2.2.7": + version "2.2.7" + resolved "https://registry.yarnpkg.com/@reduxjs/toolkit/-/toolkit-2.2.7.tgz#199e3d10ccb39267cb5aee92c0262fd9da7fdfb2" + integrity sha512-faI3cZbSdFb8yv9dhDTmGwclW0vk0z5o1cia+kf7gCbaCwHI5e+7tP57mJUv22pNcNbeA62GSrPpfrUfdXcQ6g== dependencies: - immer "^9.0.21" - redux "^4.2.1" - redux-thunk "^2.4.2" - reselect "^4.1.8" + immer "^10.0.3" + redux "^5.0.1" + redux-thunk "^3.1.0" + reselect "^5.1.0" "@remix-run/router@1.2.1": version "1.2.1" @@ -3065,7 +3058,7 @@ dependencies: history "*" -"@types/hoist-non-react-statics@^3.3.0", "@types/hoist-non-react-statics@^3.3.1": +"@types/hoist-non-react-statics@^3.3.0": version "3.3.1" resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f" integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA== @@ -3244,10 +3237,10 @@ "@types/scheduler" "*" csstype "^3.0.2" -"@types/redux-mock-store@^1.0.2": - version "1.0.3" - resolved "https://registry.yarnpkg.com/@types/redux-mock-store/-/redux-mock-store-1.0.3.tgz#895de4a364bc4836661570aec82f2eef5989d1fb" - integrity sha512-Wqe3tJa6x9MxMN4DJnMfZoBRBRak1XTPklqj4qkVm5VBpZnC8PSADf4kLuFQ9NAdHaowfWoEeUMz7NWc2GMtnA== +"@types/redux-mock-store@^1.0.6": + version "1.0.6" + resolved "https://registry.yarnpkg.com/@types/redux-mock-store/-/redux-mock-store-1.0.6.tgz#0a03b2655028b7cf62670d41ac1de5ca1b1f5958" + integrity sha512-eg5RDfhJTXuoJjOMyXiJbaDb1B8tfTaJixscmu+jOusj6adGC0Krntz09Tf4gJgXeCqCrM5bBMd+B7ez0izcAQ== dependencies: redux "^4.0.5" @@ -9970,10 +9963,10 @@ immediate@3.0.6: resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b" integrity sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ== -immer@^9.0.21: - version "9.0.21" - resolved "https://registry.yarnpkg.com/immer/-/immer-9.0.21.tgz#1e025ea31a40f24fb064f1fef23e931496330176" - integrity sha512-bc4NBHqOqSfRW7POMkHd51LvClaeMXpm8dx0e8oE2GORbq5aRK7Bxl4FyzVLdGtLmvLKL7BTDBG5ACQm4HWjTA== +immer@^10.0.3: + version "10.1.1" + resolved "https://registry.yarnpkg.com/immer/-/immer-10.1.1.tgz#206f344ea372d8ea176891545ee53ccc062db7bc" + integrity sha512-s2MPrmjovJcoMaHtx6K11Ra7oD05NT97w1IC5zpMkT6Atjr7H8LjaDd81iIxUYpMKSRRNMJE703M1Fhr/TctHw== immutable@^4.0.0: version "4.1.0" @@ -14660,16 +14653,12 @@ react-redux@^7.2.0: prop-types "^15.7.2" react-is "^17.0.2" -react-redux@^8.1.2: - version "8.1.2" - resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-8.1.2.tgz#9076bbc6b60f746659ad6d51cb05de9c5e1e9188" - integrity sha512-xJKYI189VwfsFc4CJvHqHlDrzyFTY/3vZACbE+rr/zQ34Xx1wQfB4OTOSeOSNrF6BDVe8OOdxIrAnMGXA3ggfw== +react-redux@^9.1.2: + version "9.1.2" + resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-9.1.2.tgz#deba38c64c3403e9abd0c3fbeab69ffd9d8a7e4b" + integrity sha512-0OA4dhM1W48l3uzmv6B7TXPCGmokUU4p1M44DGN2/D9a1FjVPukVjER1PcPX97jIg6aUeLq1XJo1IpfbgULn0w== dependencies: - "@babel/runtime" "^7.12.1" - "@types/hoist-non-react-statics" "^3.3.1" "@types/use-sync-external-store" "^0.0.3" - hoist-non-react-statics "^3.3.2" - react-is "^18.0.0" use-sync-external-store "^1.0.0" react-remove-scroll-bar@^2.3.3: @@ -14984,10 +14973,10 @@ redux-thunk@^2.3.0: resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.4.1.tgz#0dd8042cf47868f4b29699941de03c9301a75714" integrity sha512-OOYGNY5Jy2TWvTL1KgAlVy6dcx3siPJ1wTq741EPyUKfn6W6nChdICjZwCd0p8AZBs5kWpZlbkXW2nE/zjUa+Q== -redux-thunk@^2.4.2: - version "2.4.2" - resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.4.2.tgz#b9d05d11994b99f7a91ea223e8b04cf0afa5ef3b" - integrity sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q== +redux-thunk@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-3.1.0.tgz#94aa6e04977c30e14e892eae84978c1af6058ff3" + integrity sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw== "redux@3 || 4", redux@^4.0.0, redux@^4.0.5: version "4.2.0" @@ -15003,12 +14992,10 @@ redux@4.1.2: dependencies: "@babel/runtime" "^7.9.2" -redux@^4.2.1: - version "4.2.1" - resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.1.tgz#c08f4306826c49b5e9dc901dee0452ea8fce6197" - integrity sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w== - dependencies: - "@babel/runtime" "^7.9.2" +redux@^5.0.1: + version "5.0.1" + resolved "https://registry.yarnpkg.com/redux/-/redux-5.0.1.tgz#97fa26881ce5746500125585d5642c77b6e9447b" + integrity sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w== reflect.getprototypeof@^1.0.4: version "1.0.4" @@ -15263,10 +15250,10 @@ requires-port@^1.0.0: resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff" integrity sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ== -reselect@^4.1.8: - version "4.1.8" - resolved "https://registry.yarnpkg.com/reselect/-/reselect-4.1.8.tgz#3f5dc671ea168dccdeb3e141236f69f02eaec524" - integrity sha512-ab9EmR80F/zQTMNeneUr4cv+jSwPJgIlvEmVwLerwrWVbpLlBuls9XHzIeTFy4cegU2NHBp3va0LKOzU5qFEYQ== +reselect@^5.1.0: + version "5.1.1" + resolved "https://registry.yarnpkg.com/reselect/-/reselect-5.1.1.tgz#c766b1eb5d558291e5e550298adb0becc24bb72e" + integrity sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w== resolve-cwd@^2.0.0: version "2.0.0" -- GitLab