Fix unit tests

frontend/package.json

@@ -74,6 +74,7 @@
     "react-select": "5.8.3",
     "react-toastify": "9.1.3",
     "redux": "5.0.1",
+    "redux-mock-store": "1.5.5",
     "redux-persist": "6.0.0",
     "redux-thunk": "3.1.0",
     "rsuite": "5.54.0",
@@ -138,9 +139,9 @@
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
     "lint-staged": "14.0.1",
+    "madge": "8.0.0",
     "ora": "8.1.1",
     "postgres": "3.4.5",
-    "madge": "8.0.0",
     "prettier": "3.4.1",
     "puppeteer": "22.15.0",
     "strip-json-comments": "5.0.1",

frontend/src/features/Reporting/components/ReportingCard/__tests__/ReportingCard.test.tsx

@@ -1,14 +1,16 @@
 import { Seafront } from '@constants/seafront'
+import { PendingAlertValueType } from '@features/Alert/types'
 import { ReportingCard } from '@features/Reporting/components/ReportingCard'
 import { ReportingType } from '@features/Reporting/types'
 import { afterAll, describe, expect, it, jest } from '@jest/globals'
 import { THEME, ThemeProvider } from '@mtes-mct/monitor-ui'
 import { render, screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { noop } from 'lodash'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
 
 import { VesselIdentifier } from '../../../../../domain/entities/vessel/types'
-import { PendingAlertValueType } from '../../../../Alert/types'
 
 import type { PendingAlertReporting } from '@features/Reporting/types'
 
@@ -24,6 +26,9 @@ describe('ReportingCard()', () => {
 
   it('should display all other dates', async () => {
     // Given
+    const mockStore = configureStore()
+    const store = mockStore({})
+
     const reporting: PendingAlertReporting = {
       creationDate: '2023-10-30T09:10:00Z',
       externalReferenceNumber: '',
@@ -55,17 +60,19 @@ describe('ReportingCard()', () => {
     }
 
     render(
-      <ThemeProvider theme={THEME}>
-        <ReportingCard
-          isArchived={false}
-          onEdit={noop}
-          otherOccurrencesOfSameAlert={[
-            { ...reporting, validationDate: '2024-10-30T15:08:05.845121Z' },
-            { ...reporting, validationDate: '2025-10-30T15:08:05.845121Z' }
-          ]}
-          reporting={reporting}
-        />
-      </ThemeProvider>
+      <Provider store={store}>
+        <ThemeProvider theme={THEME}>
+          <ReportingCard
+            isArchived={false}
+            onEdit={noop}
+            otherOccurrencesOfSameAlert={[
+              { ...reporting, validationDate: '2024-10-30T15:08:05.845121Z' },
+              { ...reporting, validationDate: '2025-10-30T15:08:05.845121Z' }
+            ]}
+            reporting={reporting}
+          />
+        </ThemeProvider>
+      </Provider>
     )
 
     const linkElement = screen.getByText(/Voir les dates des autres alertes/i)

frontend/src/features/Reporting/components/ReportingCard/index.tsx

@@ -1,5 +1,6 @@
 import { ConfirmationModal } from '@components/ConfirmationModal'
 import { getAlertNameFromType } from '@features/Alert/components/SideWindowAlerts/AlertListAndReportingList/utils'
+import { PendingAlertValueType } from '@features/Alert/types'
 import { deleteReporting } from '@features/Reporting/useCases/deleteReporting'
 import { reportingIsAnInfractionSuspicion } from '@features/Reporting/utils'
 import { useMainAppDispatch } from '@hooks/useMainAppDispatch'
@@ -8,7 +9,6 @@ import { useMemo, useState } from 'react'
 import styled from 'styled-components'
 
 import { getFrenchOrdinal, getReportingActorLabel } from './utils'
-import { PendingAlertValueType } from '../../../../domain/entities/alerts/types'
 import { getDateTime } from '../../../../utils'
 import { ReportingType, ReportingTypeCharacteristics } from '../../types'
 import { archiveReporting } from '../../useCases/archiveReporting'

frontend/src/features/Reporting/useCases/__tests__/__mocks__/dummyReporting.ts

@@ -1,7 +1,7 @@
 import { Seafront } from '@constants/seafront'
+import { PendingAlertValueType } from '@features/Alert/types'
 import { ReportingType } from '@features/Reporting/types'
 
-import { PendingAlertValueType } from '../../../../../domain/entities/alerts/types'
 import { VesselIdentifier } from '../../../../../domain/entities/vessel/types'
 
 import type { PendingAlertReporting } from '@features/Reporting/types'

frontend/src/features/Reporting/useCases/__tests__/archiveReporting.test.ts

@@ -1,18 +1,27 @@
+import { PendingAlertValueType } from '@features/Alert/types'
 import { fortyHeightHourAlertReporting } from '@features/Reporting/useCases/__tests__/__mocks__/dummyReporting'
 import { archiveReporting } from '@features/Reporting/useCases/archiveReporting'
-import * as deleteReporting from '@features/Reporting/useCases/deleteReporting'
-import { describe, it, expect, jest, afterAll } from '@jest/globals'
+import { describe, it, expect, afterAll } from '@jest/globals'
 import { dispatchProcessor } from '@store/__tests__/utils'
 
-import { PendingAlertValueType } from '../../../../domain/entities/alerts/types'
 import { VesselIdentifier } from '../../../../domain/entities/vessel/types'
+import { deleteReporting } from '../deleteReporting'
 
+/**
+ * Warning: We could not add `jest` import as it makes the test to fail.
+ * We need to have
+ * @see: https://github.com/swc-project/jest/issues/14#issuecomment-2525330413
+ */
+
+// @ts-ignore
 jest.mock('../../reportingApi', () => jest.fn())
+// @ts-ignore
 jest.mock('../deleteReporting', () => ({
+  // eslint-disable-next-line @typescript-eslint/naming-convention
   __esModule: true,
-  deleteReporting: () => jest.fn()
+  // @ts-ignore
+  deleteReporting: jest.fn()
 }))
-jest.spyOn(deleteReporting, 'deleteReporting')
 
 describe('archiveReporting()', () => {
   const INITIAL_STATE = {
@@ -30,6 +39,7 @@ describe('archiveReporting()', () => {
 
   afterAll(() => {
     // Reset module registry to clear the mock
+    // @ts-ignore
     jest.resetModules()
   })
 
@@ -38,7 +48,7 @@ describe('archiveReporting()', () => {
     dispatchProcessor(archiveReporting(fortyHeightHourAlertReporting), INITIAL_STATE)
 
     // Then
-    expect(deleteReporting.deleteReporting).toHaveBeenCalled()
+    expect(deleteReporting).toHaveBeenCalled()
   })
 
   it('Should not delete reporting When the alert is not an MISSING_FAR_48_HOURS_ALERT', async () => {
@@ -55,6 +65,6 @@ describe('archiveReporting()', () => {
     dispatchProcessor(archiveReporting(otherAlertReporting), INITIAL_STATE)
 
     // Then
-    expect(deleteReporting.deleteReporting).toHaveBeenCalledTimes(0)
+    expect(deleteReporting).toHaveBeenCalledTimes(0)
   })
 })

frontend/src/features/Reporting/useCases/archiveReporting.ts

@@ -1,9 +1,9 @@
+import { PendingAlertValueType } from '@features/Alert/types'
 import { ReportingType } from '@features/Reporting/types'
 import { deleteReporting } from '@features/Reporting/useCases/deleteReporting'
 import { renderVesselFeatures } from '@features/Vessel/useCases/renderVesselFeatures'
 import { DisplayedErrorKey } from '@libs/DisplayedError/constants'
 
-import { PendingAlertValueType } from '../../../domain/entities/alerts/types'
 import { Vessel } from '../../../domain/entities/vessel/vessel'
 import { displayOrLogError } from '../../../domain/use_cases/error/displayOrLogError'
 import { removeVesselReporting } from '../../Vessel/slice'