[Mission] Amélioration de la recherche des unités et résolution du bu…

…g à la sélection du type de cible (#923) ## Related Pull Requests & Issues - Resolve #372 - Resolve #921
MTES-MCT · Nov 7, 2023 · bcafa8d · bcafa8d
2 parents 5f3f988 + cc7fcb6
commit bcafa8d
Show file tree

Hide file tree

Showing 25 changed files with 384 additions and 264 deletions.
diff --git a/frontend/cypress/e2e/side_window/mission_list/filters.spec.ts b/frontend/cypress/e2e/side_window/mission_list/filters.spec.ts
@@ -54,12 +54,12 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'CACEM')
     })
+
+    cy.fill('Administration', undefined)
   })
 
   it('Should filter missions by administrations', () => {
-    cy.getDataCy('select-administration-filter').click().wait(100)
-    cy.get('.rs-picker-search-bar-input').type('DDTM').wait(100)
-    cy.get('[data-key="DDTM"]').click().wait(100).clickOutside()
+    cy.fill('Administration', ['DDTM'])
 
     cy.get('.Table-SimpleTable tr').should('have.length.to.be.greaterThan', 0)
     cy.get('.Table-SimpleTable tr').each((row, index) => {
@@ -69,12 +69,11 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'DDTM')
     })
+    cy.fill('Administration', undefined)
   })
 
   it('Should filter missions by units', () => {
-    cy.getDataCy('select-units-filter').click().wait(100)
-    cy.get('.rs-picker-search-bar-input').type('BSN').wait(100)
-    cy.get('[data-key="10015"]').click().wait(100).clickOutside()
+    cy.fill('Unité', ['BSN'])
 
     cy.get('.Table-SimpleTable tr').should('have.length.to.be.greaterThan', 0)
     cy.get('.Table-SimpleTable tr').each((row, index) => {
@@ -84,11 +83,12 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'BSN Ste Maxime')
     })
+
+    cy.fill('Unité', undefined)
   })
 
   it('Should filter missions by types', () => {
-    cy.getDataCy('select-types-filter').click().wait(100)
-    cy.get('[data-key="SEA"]').click().wait(100).clickOutside()
+    cy.fill('Type de mission', ['Mer'])
 
     cy.get('.Table-SimpleTable tr').should('have.length.to.be.greaterThan', 0)
     cy.get('.Table-SimpleTable tr').each((row, index) => {
@@ -98,11 +98,12 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'Mer')
     })
+
+    cy.fill('Type de mission', undefined)
   })
 
   it('Should filter missions by sea fronts', () => {
-    cy.getDataCy('select-seaFronts-filter').click().wait(100)
-    cy.get('[data-key="MED"]').click().wait(100).clickOutside()
+    cy.fill('Facade', ['MED'])
 
     cy.get('.Table-SimpleTable tr').should('have.length.to.be.greaterThan', 0)
     cy.get('.Table-SimpleTable tr').each((row, index) => {
@@ -112,11 +113,12 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'MED')
     })
+
+    cy.fill('Facade', undefined)
   })
 
   it('Should filter missions by statuses', () => {
-    cy.getDataCy('select-statuses-filter').click().wait(100)
-    cy.get('[data-key="PENDING"]').click().wait(100).clickOutside()
+    cy.fill('Statut', ['En cours'])
 
     cy.get('.Table-SimpleTable tr').should('have.length.to.be.greaterThan', 0)
     cy.get('.Table-SimpleTable tr').each((row, index) => {
@@ -126,12 +128,12 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'En cours')
     })
+
+    cy.fill('Statut', undefined)
   })
 
   it('Should filter missions by themes', () => {
-    cy.getDataCy('select-theme-filter').click().wait(100)
-    cy.get('.rs-picker-search-bar-input').type('Police').wait(100)
-    cy.get('[data-key="Police des activités de cultures marines"]').click().wait(100).clickOutside()
+    cy.fill('Thématique', ['Police des activités de cultures marines'])
 
     cy.get('.Table-SimpleTable tr').should('have.length.to.be.greaterThan', 0)
     cy.get('.Table-SimpleTable tr').each((row, index) => {
@@ -141,5 +143,7 @@ context('Side Window > Mission List > Filter Bar', () => {
 
       cy.wrap(row).should('contain', 'Police des activités de cultures marines')
     })
+
+    cy.fill('Thématique', undefined)
   })
 })
diff --git a/frontend/cypress/e2e/side_window/mission_list/missions.spec.ts b/frontend/cypress/e2e/side_window/mission_list/missions.spec.ts
@@ -40,25 +40,20 @@ context('Missions', () => {
 
     cy.log('Units should be filtered')
     cy.get('*[data-cy="edit-mission-38"]').should('exist')
-    cy.get('*[data-cy="select-units-filter"]').click()
-    cy.get('div[role="option"]').find('label').contains('PAM Themis').click({ force: true })
+    cy.fill('Unité', ['PAM Themis'])
     cy.get('*[data-cy="edit-mission-48"]').should('exist')
     cy.get('*[data-cy="edit-mission-38"]').should('not.exist')
 
     cy.log('Units filter should be clear')
-    cy.get('*[data-cy="Missions-numberOfDisplayedMissions"]').click('topLeft')
-    cy.get('*[data-cy="select-units-filter"]').get('[title="Clear"]').click({
-      force: true
-    })
+    cy.fill('Unité', undefined)
     cy.get('*[data-cy="edit-mission-38"]').should('exist')
   })
 
   it('Missions table should display all themes and subthemes of all the actions of the mission', () => {
     cy.visit(`/side_window`).wait(1000)
 
     cy.log('Should filter by theme')
-    cy.get('*[data-cy="select-theme-filter"]').click()
-    cy.get('div[role="option"]').find('label').contains('Police des épaves').click({ force: true })
+    cy.fill('Thématique', ['Police des épaves'])
     cy.get('*[data-cy="cell-envactions-themes"]')
       .eq(0)
       .contains(

diff --git a/frontend/cypress/e2e/side_window/reporting/filters.spec.ts b/frontend/cypress/e2e/side_window/reporting/filters.spec.ts
@@ -0,0 +1,58 @@
+import { ReportingSourceLabels } from '../../../../src/domain/entities/reporting'
+import { SeaFrontLabel } from '../../../../src/domain/entities/seaFrontType'
+
+context('Reportings', () => {
+  beforeEach(() => {
+    cy.viewport(1280, 1024)
+    cy.visit(`/side_window`)
+    cy.intercept('GET', '/bff/v1/reportings*').as('getReportings')
+    cy.clickButton('signalements')
+    cy.wait('@getReportings')
+  })
+
+  it('Reportings should be displayed in Reportings Table and filterable', () => {
+    cy.log('A default period filter should be set')
+    cy.fill('Période', '24 dernières heures')
+    cy.get('*[data-cy="totalReportings"]').contains('5')
+
+    cy.log('Source type should be filtered')
+    cy.fill('Type de source', [ReportingSourceLabels.SEMAPHORE])
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Type Sémaphore')
+    // here we test if the clear button worked correctly
+    cy.fill('Type de source', undefined)
+
+    cy.log('Source should be filtered')
+    cy.fill('Source', ['Sémaphore de Fécamp'])
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Source Sémaphore de Fécamp')
+    cy.fill('Source', undefined)
+
+    cy.log('Reporting type should be filtered')
+    cy.fill('Type de signalement', 'Observation')
+    cy.getDataCy('totalReportings').contains('5')
+
+    cy.log('Themes should be filtered')
+    cy.fill('Thématiques', ['Rejets illicites', 'Police des mouillages'])
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Thème Rejets illicites')
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Thème Police des mouillages')
+    cy.fill('Thématiques', undefined)
+
+    cy.log('Sub-themes should be filtered')
+    cy.fill('Sous-thématiques', ['Arrêté municipal'])
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Sous-thème Arrêté municipal')
+    cy.fill('Sous-thématiques', undefined)
+
+    cy.log('Sea fronts should be filtered')
+    cy.fill('Facade', [SeaFrontLabel.MARTINIQUE, SeaFrontLabel.SOUTH_INDIAN_OCEAN])
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Facade Martinique')
+    cy.getDataCy('reportings-filter-tags').find('.Component-SingleTag > span').contains('Facade Sud Océan Indien')
+    cy.fill('Facade', undefined)
+
+    cy.wait('@getReportings')
+    cy.getDataCy('reinitialize-filters').click()
+    cy.getDataCy('totalReportings').contains('5')
+
+    cy.getDataCy('status-filter-Archivés').click()
+    cy.fill('Période', '30 derniers jours')
+    cy.getDataCy('totalReportings').contains('8')
+  })
+})
diff --git a/frontend/cypress/e2e/side_window/reporting/reportings.spec.ts b/frontend/cypress/e2e/side_window/reporting/reportings.spec.ts
@@ -1,4 +1,4 @@
-context('Missions', () => {
+context('Reportings', () => {
   beforeEach(() => {
     cy.viewport(1280, 1024)
     cy.visit(`/side_window`)
@@ -7,31 +7,6 @@ context('Missions', () => {
     cy.wait('@getReportings')
   })
 
-  it('Reportings should be displayed in Reportings Table and filterable', () => {
-    cy.log('A default period filter should be set')
-    cy.fill('Période', '24 dernières heures')
-    cy.get('*[data-cy="totalReportings"]').contains('5')
-
-    cy.log('Source type should be filtered')
-    cy.get('*[data-cy="select-source-type-filter"]').click()
-    cy.get('div[role="option"]').find('label').contains('Sémaphore').click()
-    cy.get('*[data-cy="totalReportings"]').contains('2')
-
-    cy.log('Source should be filtered')
-    cy.get('*[data-cy="select-source-filter"]').click()
-    cy.get('div[role="option"]').find('label').contains('Sémaphore de Fécamp').click()
-    cy.get('*[data-cy="totalReportings"]').click('topLeft')
-    cy.get('*[data-cy="totalReportings"]').contains('2')
-
-    cy.wait('@getReportings')
-    cy.get('*[data-cy="reinitialize-filters"]').click()
-    cy.get('*[data-cy="totalReportings"]').contains('5')
-
-    cy.get('*[data-cy="status-filter-Archivés"]').click()
-    cy.fill('Période', '30 derniers jours')
-    cy.get('*[data-cy="totalReportings"]').contains('8')
-  })
-
   it('Reportings should be archived in Reportings Table', () => {
     cy.intercept('PUT', '/bff/v1/reportings/5').as('archiveReporting')
     cy.get('*[data-cy="status-filter-Archivés"]').click()

diff --git a/frontend/src/api/missionsAPI.ts b/frontend/src/api/missionsAPI.ts
@@ -8,7 +8,7 @@ type MissionsFilter = {
   missionSource?: string
   missionStatus?: string[]
   missionTypes?: string[]
-  seaFronts: string[]
+  seaFronts?: string[]
   startedAfterDateTime?: string
   startedBeforeDateTime?: string
 }

diff --git a/frontend/src/api/reportingsAPI.ts b/frontend/src/api/reportingsAPI.ts
@@ -7,7 +7,7 @@ import type { Reporting, ReportingDetailed } from '../domain/entities/reporting'
 
 type ReportingsFilter = {
   reportingType: string | undefined
-  seaFronts: string[]
+  seaFronts?: string[]
   sourcesType?: string[]
   startedAfterDateTime?: string
   startedBeforeDateTime?: string

diff --git a/frontend/src/domain/entities/missions.ts b/frontend/src/domain/entities/missions.ts
@@ -45,6 +45,12 @@ export const missionTypeEnum = {
   }
 }
 
+export enum MissionTypeLabel {
+  AIR = 'Air',
+  LAND = 'Terre',
+  SEA = 'Mer'
+}
+
 export enum InfractionTypeEnum {
   WAITING = 'WAITING',
   WITHOUT_REPORT = 'WITHOUT_REPORT',
@@ -182,6 +188,14 @@ export enum MissionStatusEnum {
   PENDING = 'PENDING',
   UPCOMING = 'UPCOMING'
 }
+
+export enum MissionStatusLabel {
+  CLOSED = 'Cloturée',
+  ENDED = 'Terminée',
+  PENDING = 'En cours',
+  UPCOMING = 'À venir'
+}
+
 export const missionStatusLabels = {
   CLOSED: {
     borderColor: THEME.color.slateGray,
@@ -224,6 +238,11 @@ export const missionSourceEnum = {
   }
 }
 
+export enum MissionSourceLabel {
+  MONITORENV = 'CACEM',
+  MONITORFISH = 'CNSP'
+}
+
 export const THEME_REQUIRE_PROTECTED_SPECIES = ['Police des espèces protégées et de leurs habitats (faune et flore)']
 
 export const relevantCourtEnum = {

diff --git a/frontend/src/domain/shared_slices/MissionFilters.ts b/frontend/src/domain/shared_slices/MissionFilters.ts
@@ -1,5 +1,6 @@
 import { customDayjs as dayjs } from '@mtes-mct/monitor-ui'
 import { createSlice, type PayloadAction } from '@reduxjs/toolkit'
+import { isEqual, omit } from 'lodash'
 import { persistReducer } from 'redux-persist'
 import storage from 'redux-persist/lib/storage'
 
@@ -22,14 +23,14 @@ export enum MissionFiltersEnum {
 
 type MissionFilterValues = {
   hasFilters: boolean
-  selectedAdministrationNames: string[]
-  selectedControlUnitIds: number[]
+  selectedAdministrationNames: string[] | undefined
+  selectedControlUnitIds: number[] | undefined
   selectedMissionSource: string | undefined
-  selectedMissionTypes: string[]
+  selectedMissionTypes: string[] | undefined
   selectedPeriod: string
-  selectedSeaFronts: string[]
-  selectedStatuses: string[]
-  selectedThemes: string[]
+  selectedSeaFronts: string[] | undefined
+  selectedStatuses: string[] | undefined
+  selectedThemes: string[] | undefined
   startedAfter?: string
   startedBefore?: string
 }
@@ -42,14 +43,14 @@ export type MissionFiltersState = {
 
 const INITIAL_STATE: MissionFiltersState = {
   hasFilters: false,
-  selectedAdministrationNames: [],
-  selectedControlUnitIds: [],
+  selectedAdministrationNames: undefined,
+  selectedControlUnitIds: undefined,
   selectedMissionSource: undefined,
-  selectedMissionTypes: [],
+  selectedMissionTypes: undefined,
   selectedPeriod: DATE_RANGE_LABEL.WEEK.value,
-  selectedSeaFronts: [],
-  selectedStatuses: [],
-  selectedThemes: [],
+  selectedSeaFronts: undefined,
+  selectedStatuses: undefined,
+  selectedThemes: undefined,
   startedAfter: SEVEN_DAYS_AGO,
   startedBefore: undefined
 }
@@ -79,15 +80,14 @@ const missionFiltersSlice = createSlice({
       return {
         ...state,
         [action.payload.key]: action.payload.value,
-        hasFilters:
-          (action.payload.value && action.payload.value.length > 0) ||
-          state.selectedPeriod !== DATE_RANGE_LABEL.WEEK.value ||
-          state.selectedAdministrationNames.length > 0 ||
-          state.selectedControlUnitIds.length > 0 ||
-          state.selectedMissionTypes.length > 0 ||
-          state.selectedSeaFronts.length > 0 ||
-          state.selectedStatuses.length > 0 ||
-          state.selectedThemes.length > 0
+        hasFilters: !isEqual(
+          omit(INITIAL_STATE, ['hasFilters', 'startedAfter', 'startedBefore']),
+          omit({ ...state, [action.payload.key]: action.payload.value }, [
+            'hasFilters',
+            'startedAfter',
+            'startedBefore'
+          ])
+        )
       }
     }
   }

diff --git a/frontend/src/domain/shared_slices/ReportingsFilters.ts b/frontend/src/domain/shared_slices/ReportingsFilters.ts
@@ -31,29 +31,29 @@ type ReportingsFiltersSliceType = {
   actionsFilter?: string[]
   hasFilters: boolean
   periodFilter: string
-  seaFrontFilter: string[]
-  sourceFilter: SourceFilterProps[]
-  sourceTypeFilter: string[]
+  seaFrontFilter: string[] | undefined
+  sourceFilter: SourceFilterProps[] | undefined
+  sourceTypeFilter: string[] | undefined
   startedAfter: string
   startedBefore?: string
   statusFilter: string[]
-  subThemesFilter: string[]
-  themeFilter: string[]
+  subThemesFilter: string[] | undefined
+  themeFilter: string[] | undefined
   typeFilter?: string | undefined
 }
 
 const initialState: ReportingsFiltersSliceType = {
   actionsFilter: [],
   hasFilters: false,
   periodFilter: ReportingDateRangeEnum.DAY,
-  seaFrontFilter: [],
-  sourceFilter: [],
-  sourceTypeFilter: [],
+  seaFrontFilter: undefined,
+  sourceFilter: undefined,
+  sourceTypeFilter: undefined,
   startedAfter: LAST_24_HOURS,
   startedBefore: undefined,
   statusFilter: [StatusFilterEnum.IN_PROGRESS],
-  subThemesFilter: [],
-  themeFilter: [],
+  subThemesFilter: undefined,
+  themeFilter: undefined,
   typeFilter: undefined
 }