src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.spec.tsx

@@ -4,33 +4,17 @@ import toJson from 'enzyme-to-json'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { graphData } from 'tests/__mocks__/chartData.mock'
-import mockClient from 'tests/__mocks__/client'
 import { createMockEcolyoStore } from 'tests/__mocks__/store'
 import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
 import MaxConsumptionCard from './MaxConsumptionCard'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 const mockGetMaxLoad = jest.fn(() => 0)
 const mockGetGraphData = jest.fn(() => graphData)
 jest.mock('services/consumption.service', () => {
-  return jest.fn(() => {
-    return {
-      getMaxLoad: mockGetMaxLoad,
-      getGraphData: mockGetGraphData,
-    }
-  })
-})
-jest.mock('cozy-client', () => {
-  return {
-    useClient: jest.fn(() => {
-      return mockClient
-    }),
-  }
+  return jest.fn(() => ({
+    getMaxLoad: mockGetMaxLoad,
+    getGraphData: mockGetGraphData,
+  }))
 })
 
 jest.mock('components/Charts/BarChart', () => 'mock-BarChart')

src/components/Analysis/MonthlyAnalysis.spec.tsx

@@ -5,20 +5,9 @@ import { PerformanceIndicator } from 'models'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { BrowserRouter } from 'react-router-dom'
-import mockClient from 'tests/__mocks__/client'
 import { createMockEcolyoStore } from 'tests/__mocks__/store'
 import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
-jest.mock('cozy-client', () => ({
-  useClient: () => mockClient,
-}))
-
 const mockPI: PerformanceIndicator[] = [
   { value: 5, compareValue: 10, percentageVariation: 50 },
   { value: 5, compareValue: 10, percentageVariation: 50 },
@@ -28,6 +17,7 @@ jest.mock('services/consumption.service', () => {
   return jest.fn(() => {
     return {
       getFluidsWithDataForTimePeriod: jest.fn(() => [0, 1, 2]),
+      getFluidsWithIncompleteData: jest.fn(() => [0]),
       getPerformanceIndicators: jest.fn(() => mockPI),
     }
   })

src/components/Analysis/MonthlyAnalysis.tsx

@@ -9,6 +9,7 @@ import PerformanceIndicatorService from 'services/performanceIndicator.service'
 import { useAppSelector } from 'store/hooks'
 import Comparison from './Comparison/Comparison'
 import ElecHalfHourMonthlyAnalysis from './ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis'
+import IncompleteDataWarning from './IncompleteDataWarning/IncompleteDataWarning'
 import MaxConsumptionCard from './MaxConsumptionCard/MaxConsumptionCard'
 import ProfileComparator from './ProfileComparator/ProfileComparator'
 import TotalAnalysisChart from './TotalAnalysisChart/TotalAnalysisChart'
@@ -37,6 +38,9 @@ const MonthlyAnalysis = ({
 
   const [loadAnalysis, setLoadAnalysis] = useState<boolean>(true)
   const [fluidsWithData, setFluidsWithData] = useState<FluidType[]>([])
+  const [incompleteDataFluids, setIncompleteDataFluids] = useState<FluidType[]>(
+    []
+  )
   const [performanceIndicators, setPerformanceIndicators] = useState<
     PerformanceIndicator[]
   >([])
@@ -67,6 +71,13 @@ const MonthlyAnalysis = ({
           timePeriod
         )
 
+      const fetchedIncompleteDataFluids =
+        await consumptionService.getFluidsWithIncompleteData(
+          [FluidType.ELECTRICITY, FluidType.WATER, FluidType.GAS],
+          timePeriod.startDate
+        )
+      setIncompleteDataFluids(fetchedIncompleteDataFluids)
+
       const fetchedPerformanceIndicators =
         await consumptionService.getPerformanceIndicators(
           timePeriod,
@@ -121,6 +132,13 @@ const MonthlyAnalysis = ({
       {!loadAnalysis && (
         <Fade in={!loadAnalysis}>
           <div className="analysis-root">
+            {incompleteDataFluids.length !== 0 && (
+              <div className="analysis-content">
+                <IncompleteDataWarning
+                  incompleteDataFluids={incompleteDataFluids}
+                />
+              </div>
+            )}
             <div className="analysis-content">
               <Comparison
                 fluidsWithData={fluidsWithData}

src/components/Analysis/ProfileComparator/ProfileComparator.spec.tsx

@@ -15,39 +15,29 @@ import { createMockEcolyoStore, mockAnalysisState } from 'tests/__mocks__/store'
 import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
 import ProfileComparator from './ProfileComparator'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 const mockedNavigate = jest.fn()
 jest.mock('react-router-dom', () => ({
   ...jest.requireActual('react-router-dom'),
   useNavigate: () => mockedNavigate,
 }))
 
-const mockgetMonthlyForecast = jest.fn()
+const mockGetMonthlyForecast = jest.fn()
 jest.mock('services/profileType.service', () => {
-  return jest.fn(() => {
-    return {
-      getMonthlyForecast: mockgetMonthlyForecast,
-    }
-  })
+  return jest.fn(() => ({
+    getMonthlyForecast: mockGetMonthlyForecast,
+  }))
 })
 
-const mockgetProfileTypeData = jest.fn()
+const mockGetProfileTypeData = jest.fn()
 jest.mock('services/profileTypeEntity.service', () => {
-  return jest.fn(() => {
-    return {
-      getProfileType: mockgetProfileTypeData,
-    }
-  })
+  return jest.fn(() => ({
+    getProfileType: mockGetProfileTypeData,
+  }))
 })
 
 jest.mock(
   'components/Analysis/ProfileComparator/ProfileComparatorRow',
-  () => () => <div id="profilecomparatorrow" />
+  () => 'mock-profileComparatorRow'
 )
 
 const modifiedProfile = { ...profileData, isProfileTypeCompleted: true }
@@ -93,7 +83,7 @@ describe('AnalysisConsumption component', () => {
     )
     await waitForComponentToPaint(wrapper)
     expect(wrapper.find(Accordion).exists()).toBeTruthy()
-    expect(wrapper.find('#profilecomparatorrow').length).toBe(4)
+    expect(wrapper.find('mock-profileComparatorRow').length).toBe(4)
   })
 
   it('should be rendered correctly with no profil set', async () => {
@@ -132,7 +122,7 @@ describe('AnalysisConsumption component', () => {
     )
     await waitForComponentToPaint(wrapper)
     expect(wrapper.find(Accordion).exists()).toBeTruthy()
-    expect(wrapper.find('#profilecomparatorrow').length).toBe(4)
+    expect(wrapper.find('mock-profileComparatorRow').length).toBe(4)
   })
 
   it('should be rendered correctly without fluid', async () => {
@@ -147,7 +137,7 @@ describe('AnalysisConsumption component', () => {
     )
     await waitForComponentToPaint(wrapper)
     expect(
-      wrapper.find('#profilecomparatorrow').first().parent().prop('fluid')
+      wrapper.find('mock-profileComparatorRow').first().prop('fluid')
     ).toBe(FluidType.MULTIFLUID)
   })
 
@@ -163,7 +153,7 @@ describe('AnalysisConsumption component', () => {
         analysisMonth: profileData.monthlyAnalysisDate,
       },
     })
-    mockgetMonthlyForecast.mockReturnValue(
+    mockGetMonthlyForecast.mockReturnValue(
       mockMonthlyForecastJanuaryTestProfile1
     )
     const wrapper = mount(
@@ -176,11 +166,11 @@ describe('AnalysisConsumption component', () => {
       </Provider>
     )
     await waitForComponentToPaint(wrapper)
-    expect(mockgetMonthlyForecast).toHaveBeenCalledWith(
+    expect(mockGetMonthlyForecast).toHaveBeenCalledWith(
       profileData.monthlyAnalysisDate.month - 1
     )
     expect(
-      wrapper.find('#profilecomparatorrow').first().parent().prop('fluid')
+      wrapper.find('mock-profileComparatorRow').first().prop('fluid')
     ).toBe(FluidType.MULTIFLUID)
   })
 
@@ -190,7 +180,7 @@ describe('AnalysisConsumption component', () => {
       global: { fluidTypes: [FluidType.ELECTRICITY, FluidType.WATER] },
       analysis: { analysisMonth: profileData.monthlyAnalysisDate },
     })
-    mockgetMonthlyForecast.mockReturnValue(
+    mockGetMonthlyForecast.mockReturnValue(
       mockMonthlyForecastJanuaryTestProfile1
     )
     const wrapper = mount(
@@ -203,11 +193,11 @@ describe('AnalysisConsumption component', () => {
       </Provider>
     )
     await waitForComponentToPaint(wrapper)
-    expect(mockgetMonthlyForecast).toHaveBeenCalledWith(
+    expect(mockGetMonthlyForecast).toHaveBeenCalledWith(
       profileData.monthlyAnalysisDate.month - 1
     )
     expect(
-      wrapper.find('#profilecomparatorrow').first().parent().prop('fluid')
+      wrapper.find('mock-profileComparatorRow').first().prop('fluid')
     ).toBe(FluidType.MULTIFLUID)
   })
 

src/components/Analysis/ProfileComparator/ProfileComparatorRow.spec.tsx

@@ -5,12 +5,6 @@ import React from 'react'
 import { mockMonthlyForecastJanuaryTestProfile1 } from 'tests/__mocks__/profileType.mock'
 import ProfileComparatorRow from './ProfileComparatorRow'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 describe('AnalysisConsumptionRow component', () => {
   const userPriceConsumption = 20
   const homePriceConsumption = 18

src/components/Analysis/TotalAnalysisChart/PieChart.spec.tsx

@@ -5,12 +5,6 @@ import { DataloadValueDetail } from 'models'
 import React from 'react'
 import PieChart from './PieChart'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 describe('PieChart component', () => {
   const mockDataloadValueDetailArray: DataloadValueDetail[] = [
     { value: 10, state: DataloadState.VALID },

src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.spec.tsx

@@ -10,11 +10,6 @@ import { createMockEcolyoStore } from 'tests/__mocks__/store'
 import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
 import TotalAnalysisChart from './TotalAnalysisChart'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
 const mockGetGraphData = jest.fn()
 jest.mock('services/consumption.service', () => {
   return jest.fn(() => ({

src/components/Analysis/__snapshots__/MonthlyAnalysis.spec.tsx.snap

@@ -80,6 +80,67 @@ exports[`MonthlyAnalysis component should be rendered correctly 1`] = `
                 }
               }
             >
+              <div
+                className="analysis-content"
+              >
+                <IncompleteDataWarning
+                  incompleteDataFluids={
+                    Array [
+                      0,
+                    ]
+                  }
+                >
+                  <div
+                    className="analysis-warning"
+                  >
+                    <div
+                      className="warning-header"
+                    >
+                      <StyledIcon
+                        icon="test-file-stub"
+                        size={30}
+                      >
+                        <Icon
+                          aria-hidden={true}
+                          icon="test-file-stub"
+                          size={30}
+                          spin={false}
+                        >
+                          <Component
+                            aria-hidden={true}
+                            className="styles__icon___23x3R"
+                            height={30}
+                            style={Object {}}
+                            width={30}
+                          >
+                            <svg
+                              aria-hidden={true}
+                              className="styles__icon___23x3R"
+                              height={30}
+                              style={Object {}}
+                              width={30}
+                            >
+                              <use
+                                xlinkHref="#test-file-stub"
+                              />
+                            </svg>
+                          </Component>
+                        </Icon>
+                      </StyledIcon>
+                      <h1>
+                        analysis.warning_title
+                      </h1>
+                    </div>
+                    <div
+                      className="warning-content"
+                    >
+                      <p>
+                        analysis.warning_text
+                      </p>
+                    </div>
+                  </div>
+                </IncompleteDataWarning>
+              </div>
               <div
                 className="analysis-content"
               >

src/components/Challenge/ChallengeCard/ChallengeCard.spec.tsx

@@ -6,12 +6,6 @@ import ChallengeCardOnGoing from '../ChallengeCardOnGoing/ChallengeCardOnGoing'
 import ChallengeCardUnlocked from '../ChallengeCardUnlocked/ChallengeCardUnlocked'
 import ChallengeCard from './ChallengeCard'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 const mockMoveToSlide = jest.fn()
 
 describe('ChallengeCard component', () => {

src/components/Challenge/ChallengeCardDone/ChallengeCardDone.spec.tsx

@@ -9,33 +9,11 @@ import * as storeHooks from 'store/hooks'
 import { waitForComponentToPaint } from 'tests/__mocks__/testUtils'
 import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-const mockFormatNumberValues = jest.fn()
-jest.mock('utils/utils', () => {
-  return {
-    importIconById: jest.fn(() => null),
-    formatNumberValues: jest.fn(() => mockFormatNumberValues),
-    getChallengeTitleWithLineReturn: jest.fn(() => 'Challenge 1'),
-  }
-})
-
-const mockedNavigate = jest.fn()
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
-  useNavigate: () => mockedNavigate,
-}))
-
 const mockUpdateUserChallenge = jest.fn()
 jest.mock('services/challenge.service', () => {
-  return jest.fn(() => {
-    return {
-      updateUserChallenge: mockUpdateUserChallenge,
-    }
-  })
+  return jest.fn(() => ({
+    updateUserChallenge: mockUpdateUserChallenge,
+  }))
 })
 
 const mockStore = configureStore([])
@@ -60,8 +38,7 @@ describe('ChallengeCardDone component', () => {
 
   describe('Reset final challenge', () => {
     beforeEach(() => {
-      mockUpdateUserChallenge.mockClear()
-      mockDispatch.mockClear()
+      jest.clearAllMocks()
     })
     it('should reset challenge if no other challenge is on going', async () => {
       mockAppDispatch.mockImplementationOnce(() => mockDispatch)

src/components/Challenge/ChallengeCardDone/__snapshots__/ChallengeCardDone.spec.tsx.snap

@@ -164,7 +164,8 @@ exports[`ChallengeCardDone component should be rendered correctly 1`] = `
       <div
         className="challengeName text-22-bold"
       >
-        Challenge 1
+        Simone
+VEILLE
       </div>
       <div
         className="iconResult"
@@ -218,9 +219,7 @@ exports[`ChallengeCardDone component should be rendered correctly 1`] = `
           <span
             className="text-18-bold"
           >
-            function () {
-        return fn.apply(this, arguments);
-      } 
+            0,00 
             €
           </span>
           <br />

src/components/Challenge/ChallengeCardLast/ChallengeCardLast.spec.tsx

@@ -6,12 +6,6 @@ import ChallengeCardLast from './ChallengeCardLast'
 // Value coming from jest.config
 declare let __SAU_IDEA_DIRECT_LINK__: string
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 describe('ChallengeCardLast component', () => {
   it('should be rendered correctly', async () => {
     const wrapper = mount(<ChallengeCardLast />)

src/components/Challenge/ChallengeCardLocked/ChallengeCardLocked.spec.tsx

@@ -3,12 +3,6 @@ import React from 'react'
 import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock'
 import ChallengeCardLocked from './ChallengeCardLocked'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 describe('ChallengeCardLocked component', () => {
   it('should be rendered correctly', () => {
     const component = shallow(

src/components/Challenge/ChallengeCardUnlocked/ChallengeCardUnlocked.spec.tsx

 import { Button } from '@material-ui/core'
-import defaultIcon from 'assets/icons/visu/challenge/challengeLocked.svg'
 import { FluidType } from 'enums'
 import { mount } from 'enzyme'
 import React from 'react'
@@ -15,27 +14,13 @@ import { userChallengeData } from 'tests/__mocks__/userChallengeData.mock'
 import ChallengeNoFluidModal from '../ChallengeNoFluidModal/ChallengeNoFluidModal'
 import ChallengeCardUnlocked from './ChallengeCardUnlocked'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 const mockStartUserChallenge = jest.fn()
 jest.mock('services/challenge.service', () => {
-  return jest.fn(() => {
-    return {
-      startUserChallenge: mockStartUserChallenge,
-    }
-  })
-})
-const mockImportIconById = jest.fn(() => defaultIcon)
-jest.mock('utils/utils', () => {
-  return {
-    importIconById: jest.fn(() => mockImportIconById),
-    getChallengeTitleWithLineReturn: jest.fn(() => 'Challenge 1'),
-  }
+  return jest.fn(() => ({
+    startUserChallenge: mockStartUserChallenge,
+  }))
 })
+
 jest.mock('services/usageEvent.service')
 const mockAddEvent = jest.fn()
 UsageEventService.addEvent = mockAddEvent
@@ -48,9 +33,7 @@ describe('ChallengeCardUnlocked component', () => {
         <ChallengeCardUnlocked userChallenge={userChallengeData[0]} />
       </Provider>
     )
-    expect(wrapper.find('.challengeTitle').text()).toEqual(
-      userChallengeData[0].title
-    )
+    expect(wrapper.find('.challengeTitle').text()).toEqual('Simone\nVEILLE')
     expect(wrapper.find('.btn-duel-active').exists()).toBeTruthy()
     expect(wrapper.find(ChallengeNoFluidModal).exists()).toBeTruthy()
     expect(wrapper.find(ChallengeNoFluidModal).prop('open')).toBeFalsy()

src/components/Challenge/ChallengeNoFluidModal/ChallengeNoFluidModal.spec.tsx

@@ -2,12 +2,6 @@ import { shallow } from 'enzyme'
 import React from 'react'
 import ChallengeNoFluidModal from './ChallengeNoFluidModal'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 describe('ChallengeNoFluidModal component', () => {
   it('should be rendered correctly opened', () => {
     const handleClose = jest.fn()

src/components/Challenge/ChallengeView.spec.tsx

@@ -6,12 +6,6 @@ import { Provider } from 'react-redux'
 import { challengeStateDataFull } from 'tests/__mocks__/challengeStateData.mock'
 import { createMockEcolyoStore } from 'tests/__mocks__/store'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
 jest.mock('components/Header/Header', () => 'mock-header')
 jest.mock('components/Content/Content', () => 'mock-content')
@@ -19,6 +13,10 @@ jest.mock(
   'components/Challenge/ChallengeCard/ChallengeCard',
   () => 'mock-challengecard'
 )
+jest.mock(
+  'components/Challenge/ChallengeCard/ChallengeCard',
+  () => 'mock-challengecard'
+)
 
 describe('ChallengeView component', () => {
   const store = createMockEcolyoStore({

src/components/Charts/AxisBottom.spec.tsx

@@ -29,9 +29,6 @@ describe('AxisBottom component test', () => {
       }),
     },
   })
-  beforeEach(() => {
-    store.clearActions()
-  })
 
   it('should correctly render YEAR format of AxisBottom', () => {
     const wrapper = mount(

src/components/Charts/AxisRight.spec.tsx

@@ -4,12 +4,6 @@ import { mount } from 'enzyme'
 import React from 'react'
 import AxisRight from './AxisRight'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
-
 const mockProps = {
   yScale: scaleLinear(),
   fluidType: FluidType.ELECTRICITY,

src/components/Charts/Bar.spec.tsx

@@ -33,18 +33,8 @@ const mockParam = {
 }
 
 const setSelectedDateSpy = jest.spyOn(chartActions, 'setSelectedDate')
-const setCurrentDatachartIndexSpy = jest.spyOn(
-  chartActions,
-  'setCurrentDataChartIndex'
-)
 
 describe('Bar component test', () => {
-  beforeEach(() => {
-    store.clearActions()
-    setSelectedDateSpy.mockClear()
-    setCurrentDatachartIndexSpy.mockClear()
-  })
-
   const store = createMockEcolyoStore({
     chart: {
       selectedDate: DateTime.fromISO('2020-10-01T00:00:00.000Z', {

src/components/CommonKit/ErrorPage/ErrorPage.spec.tsx

@@ -5,23 +5,15 @@ import toJson from 'enzyme-to-json'
 import React from 'react'
 import ErrorPage from './ErrorPage'
 
-jest.mock('cozy-ui/transpiled/react/I18n', () => ({
-  useI18n: jest.fn(() => ({
-    t: (str: string) => str,
-  })),
-}))
 const mockedNavigate = jest.fn()
 jest.mock('react-router-dom', () => ({
   ...jest.requireActual('react-router-dom'),
   useNavigate: () => mockedNavigate,
 }))
 
-jest.mock('components/Header/Header', () => () => <div id="Header" />)
-jest.mock('components/Header/CozyBar', () => () => <div id="CozyBar" />)
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-jest.mock('components/Content/Content', () => (props: any) => (
-  <div id="content">{props.children}</div>
-))
+jest.mock('components/Header/Header', () => 'mock-header')
+jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
+jest.mock('components/Content/Content', () => 'mock-content')
 
 describe('ErrorPage component', () => {
   it('should be rendered correctly', async () => {