[Missions] Correction sur les missions (#3153)

## Linked issues

- Resolve #3152
- Resolve #3150 

----

- [ ] Tests E2E (Cypress)

frontend/cypress/e2e/missions/controls_overlay.spec.ts

@@ -18,7 +18,7 @@ context('Controls overlay', () => {
     cy.get('*[data-cy="mission-overlay"]').contains('À compléter')
     cy.get('*[data-cy="mission-overlay"]').contains('Mission Terre / Mer')
     cy.get('*[data-cy="mission-overlay"]').contains('1 contrôle réalisé')
-    cy.get('*[data-cy="mission-overlay"]').contains('Actions CACEM et CNSP')
+    cy.get('*[data-cy="mission-overlay"]').contains('Actions CNSP')
 
     // Open the control overlay
     cy.get('#root').click(405, 624)

frontend/cypress/e2e/missions/missions_overlay.spec.ts

@@ -12,7 +12,7 @@ context('Missions overlay', () => {
     cy.get('*[data-cy="mission-overlay"]').contains('Terminée')
     cy.get('*[data-cy="mission-overlay"]').contains('À compléter')
     cy.get('*[data-cy="mission-overlay"]').contains('0 contrôle réalisé')
-    cy.get('*[data-cy="mission-overlay"]').contains('Actions CACEM')
+    cy.get('*[data-cy="mission-overlay"]').contains('Aucune action')
 
     cy.get('*[data-cy="mission-overlay-close"]').click()
     cy.get('*[data-cy="mission-overlay"]').should('not.exist')

frontend/src/features/Mission/__tests__/getMissionCompletionStatus.test.ts

@@ -33,6 +33,6 @@ describe('domain/entities/mission/utils.getMissionCompletionFrontStatus()', () =
     const missionCompletionUpcoming = getMissionCompletionFrontStatus(DUMMY_MISSION_UPCOMING, [
       CompletionStatus.TO_COMPLETE
     ])
-    expect(missionCompletionUpcoming).toBeUndefined()
+    expect(missionCompletionUpcoming).toBe(FrontCompletionStatus.TO_COMPLETE)
   })
 })

frontend/src/features/Mission/components/MissionForm/ActionList/ActionCard.tsx

@@ -98,4 +98,5 @@ const InnerWrapper = styled.div<{
   flex-direction: column;
   flex-grow: 1;
   padding: 18px 16px 14px 16px;
+  overflow: hidden;
 `

frontend/src/features/Mission/components/MissionForm/hooks/useGetMissionFrontCompletion.ts

@@ -4,7 +4,7 @@ import { useMainAppSelector } from '@hooks/useMainAppSelector'
 
 import FrontCompletionStatus = MissionAction.FrontCompletionStatus
 
-export function useGetMissionFrontCompletion(): FrontCompletionStatus | undefined {
+export function useGetMissionFrontCompletion(): FrontCompletionStatus {
   const draft = useMainAppSelector(state => state.missionForm.draft)
   const actionsCompletion = draft?.actionsFormValues?.map(action => action.completion)
 

frontend/src/features/Mission/components/MissionForm/shared/CompletionStatusTag.tsx

@@ -5,13 +5,9 @@ import FrontCompletionStatus = MissionAction.FrontCompletionStatus
 import FrontCompletionStatusLabel = MissionAction.FrontCompletionStatusLabel
 
 type CompletionStatusTagProps = {
-  completion: FrontCompletionStatus | undefined
+  completion: FrontCompletionStatus
 }
 export function CompletionStatusTag({ completion }: CompletionStatusTagProps) {
-  if (!completion) {
-    return null
-  }
-
   switch (completion) {
     case FrontCompletionStatus.COMPLETED:
       return (

frontend/src/features/Mission/components/MissionOverlay/MissionDetails.tsx

@@ -28,7 +28,7 @@ export function MissionDetails({ isSelected, mission, overlayPosition }: Mission
   }
 
   function getActions() {
-    let actions: string[] = ['CACEM']
+    let actions: string[] = []
     if (mission.hasEnvActions) {
       actions = actions.concat('CACEM')
     }

frontend/src/features/Mission/constants.ts

@@ -1,2 +1,4 @@
 export const LAND_CONTROL_ZONE_RADIUS = 1500
 export const SEA_CONTROL_ZONE_RADIUS = 3000
+
+export const MISSION_ACTION_ZONE_FEATURE_ID = 'MISSION_ACTION_ZONE'

frontend/src/features/Mission/filters/completionStatusFilterFunction.ts

@@ -14,9 +14,6 @@ export function completionStatusFilterFunction(
 
   const actionsCompletion = mission.actions.map(action => action.completion)
   const frontCompletionStatus = getMissionCompletionFrontStatus(mission, actionsCompletion)
-  if (!frontCompletionStatus) {
-    return false
-  }
 
   // we don't make difference between TO_COMPLETE and TO_COMPLETE_MISSION_ENDED in filters
   if (frontCompletionStatus === FrontCompletionStatus.TO_COMPLETE_MISSION_ENDED) {

frontend/src/features/Mission/index.ts

@@ -11,7 +11,7 @@ import Point from 'ol/geom/Point'
 import { circular } from 'ol/geom/Polygon'
 import { transform } from 'ol/proj'
 
-import { LAND_CONTROL_ZONE_RADIUS, SEA_CONTROL_ZONE_RADIUS } from './constants'
+import { LAND_CONTROL_ZONE_RADIUS, MISSION_ACTION_ZONE_FEATURE_ID, SEA_CONTROL_ZONE_RADIUS } from './constants'
 import { getNumberOfInfractions, getNumberOfInfractionsWithRecord } from '../../domain/entities/controls'
 import { MonitorFishLayer } from '../../domain/entities/layers/types'
 import { OpenLayersGeometryType } from '../../domain/entities/map/constants'
@@ -145,6 +145,9 @@ export const getMissionActionFeature = (
   return feature
 }
 
+/**
+ * A feature to display a zone around a control.
+ */
 export const getMissionActionFeatureZone = (
   action: MissionAction.MissionAction | MissionActionFormValues
 ): Feature | undefined => {
@@ -156,16 +159,12 @@ export const getMissionActionFeatureZone = (
 
   const actionId = action.id || random(1000)
   const feature = new Feature({
-    actionType: action.actionType,
-    dateTime: getDateTime(action.actionDatetimeUtc, true),
     geometry: circular([action.longitude, action.latitude], radius, 64).transform(
       WSG84_PROJECTION,
       OPENLAYERS_PROJECTION
-    ),
-    isGeometryComputedFromControls: true,
-    missionId: action.missionId
+    )
   })
-  feature.setId(`MISSION_ACTION_ZONE:${actionId}`)
+  feature.setId(`${MISSION_ACTION_ZONE_FEATURE_ID}:${actionId}`)
 
   return feature
 }

frontend/src/features/Mission/layers/SelectedMissionActionsLayer/index.tsx

@@ -38,6 +38,10 @@ export function UnmemoizedSelectedMissionActionsLayer() {
     )
   }, [selectedMissionGeoJSON, missions])
 
+  /**
+   * If the mission geometry is defined from actions, we create new OpenLayers Features
+   * to create and display the zones around the controls.
+   */
   const selectedMissionActionsZones = useMemo(() => {
     if (!selectedMissionGeoJSON) {
       return []
@@ -110,9 +114,13 @@ export function UnmemoizedSelectedMissionActionsLayer() {
       .map(action => getMissionActionFeature({ ...action, missionId: missionId || NEW_MISSION_ID }))
       .filter((action): action is Feature => !!action)
 
+    /**
+     * If the mission geometry is defined from actions, we create new OpenLayers Features
+     * to create and display the zones around the controls.
+     */
     const actionZonesFeatures = draft?.mainFormValues?.isGeometryComputedFromControls
       ? draft.actionsFormValues
-          .map(action => getMissionActionFeatureZone({ ...action, missionId: missionId || NEW_MISSION_ID }))
+          .map(action => getMissionActionFeatureZone({ ...action }))
           .filter((action): action is Feature => !!action)
       : []
 

frontend/src/features/Mission/layers/SelectedMissionActionsLayer/styles.ts

@@ -1,3 +1,4 @@
+import { MISSION_ACTION_ZONE_FEATURE_ID } from '@features/Mission/constants'
 import { missionZoneStyle } from '@features/Mission/layers/MissionLayer/styles'
 import { THEME } from '@mtes-mct/monitor-ui'
 import { getCenter } from 'ol/extent'
@@ -80,7 +81,7 @@ export const selectedMissionActionsStyles = [
   new Style({
     fill: missionZoneStyle.getFill() ?? undefined,
     geometry: feature => {
-      if (!feature.get('isGeometryComputedFromControls')) {
+      if (!feature.getId()?.toString()?.includes(MISSION_ACTION_ZONE_FEATURE_ID)) {
         return undefined
       }
 

frontend/src/features/Mission/mission.types.ts

@@ -99,7 +99,7 @@ export namespace Mission {
     isSeaMission: number
     // A 0 ou 1 number is required for WebGL to understand boolean
     isUpcoming: number
-    missionCompletion: MissionAction.FrontCompletionStatus | undefined
+    missionCompletion: MissionAction.FrontCompletionStatus
     missionId: number
     missionStatus: MissionStatus | undefined
     missionTypes: MissionType[]

frontend/src/features/Mission/utils.ts

@@ -65,7 +65,7 @@ export function getMissionCompletionStatus(
 export function getMissionCompletionFrontStatus(
   mission: Partial<MissionMainFormValues> | Mission.Mission | undefined,
   actionsCompletion: (CompletionStatus | undefined)[] | undefined
-): FrontCompletionStatus | undefined {
+): FrontCompletionStatus {
   const missionCompletion = getMissionCompletionStatus(mission, actionsCompletion)
 
   if (!mission) {
@@ -90,5 +90,5 @@ export function getMissionCompletionFrontStatus(
     return FrontCompletionStatus.TO_COMPLETE_MISSION_ENDED
   }
 
-  return undefined
+  return FrontCompletionStatus.TO_COMPLETE
 }