Carte – Normalise la position des menus [NE PAS MERGER / REFERENCE]

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

@@ -6,7 +6,7 @@ context('Missions Map Button', () => {
   it('Mission layer Should be showed and hidden', () => {
     // Given
     cy.get('.MISSION_PIN_POINT').should('exist')
-    cy.get('*[data-cy^="missions-menu-box"]').should('not.be.visible')
+    cy.get('*[data-cy^="missions-menu-box"]').should('not.exist')
     cy.get('*[data-cy="mission-label-text"]').should('have.length', 1)
 
     // When

frontend/cypress/e2e/vessel_sidebar/logbook.spec.ts

@@ -198,7 +198,6 @@ context('Vessel sidebar logbook tab', () => {
     // When
     cy.get('*[data-cy^="vessel-menu-fishing"]').click({ timeout: 10000 })
     cy.get('*[data-cy^="vessel-fishing-see-all"]').click({ timeout: 10000 })
-    cy.scrollTo(0, 380)
     cy.get('*[data-cy^="show-fishing-activity"]').eq(8).parent().contains('Retour au port')
     cy.get('*[data-cy^="show-fishing-activity"]').eq(8).scrollIntoView().click({ timeout: 20000 })
 

frontend/package.json

@@ -104,6 +104,7 @@
     "@types/react": "18.3.5",
     "@types/react-dom": "18.3.0",
     "@types/styled-components": "5.1.34",
+    "@types/uuid": "10.0.0",
     "@typescript-eslint/eslint-plugin": "6.2.1",
     "@typescript-eslint/parser": "6.2.1",
     "@vitejs/plugin-react": "4.3.1",

frontend/src/api/APIWorker.tsx

@@ -6,7 +6,6 @@ import { useEffect, useRef, useState } from 'react'
 import { useIsSuperUser } from '../auth/hooks/useIsSuperUser'
 import { SideWindowStatus } from '../domain/entities/sideWindow/constants'
 import { VesselSidebarTab } from '../domain/entities/vessel/vessel'
-import { setIsUpdatingVessels } from '../domain/shared_slices/Global'
 import { getOperationalAlerts } from '../domain/use_cases/alert/getOperationalAlerts'
 import { getSilencedAlerts } from '../domain/use_cases/alert/getSilencedAlerts'
 import getAllBeaconMalfunctions from '../domain/use_cases/beaconMalfunction/getAllBeaconMalfunctions'
@@ -17,6 +16,7 @@ import { getInfractions } from '../domain/use_cases/infraction/getInfractions'
 import { getVesselControls } from '../domain/use_cases/mission/getVesselControls'
 import getAllSpecies from '../domain/use_cases/species/getAllSpecies'
 import { updateVesselTracks } from '../domain/use_cases/vessel/updateVesselTracks'
+import { setIsUpdatingVessels } from '../features/MainWindow/slice'
 import { getAllCurrentReportings } from '../features/Reporting/useCases/getAllCurrentReportings'
 import { useMainAppDispatch } from '../hooks/useMainAppDispatch'
 import { useMainAppSelector } from '../hooks/useMainAppSelector'

frontend/src/api/BackofficeMode.tsx

@@ -1,6 +1,6 @@
 import { useEffect } from 'react'
 
-import { setIsBackoffice } from '../domain/shared_slices/Global'
+import { setIsBackoffice } from '../features/MainWindow/slice'
 import { useMainAppDispatch } from '../hooks/useMainAppDispatch'
 
 export type BackofficeModeProps = {

frontend/src/domain/entities/vessel/vessel.ts

@@ -26,7 +26,7 @@ export const VESSEL_SELECTOR_STYLE = 200
 export class Vessel {
   static vesselIsMovingSpeed = 0.1
 
-  static getVesselFeatureId(vessel) {
+  static getVesselFeatureId(vessel: VesselIdentity) {
     return `${MonitorFishLayer.VESSELS}:${getVesselCompositeIdentifier(vessel)}`
   }
 
@@ -143,7 +143,7 @@ export class Vessel {
 }
 
 export const getOnlyVesselIdentityProperties = (
-  vessel: VesselEnhancedObject | SelectedVessel | VesselTypes.EnrichedVessel | Reporting
+  vessel: VesselEnhancedObject | SelectedVessel | VesselTypes.EnrichedVessel | Reporting | VesselIdentity
 ): VesselIdentity => ({
   beaconNumber: 'beaconNumber' in vessel && !!vessel.beaconNumber ? vessel.beaconNumber : null,
   districtCode: 'districtCode' in vessel && !!vessel.districtCode ? vessel.districtCode : null,
@@ -157,7 +157,7 @@ export const getOnlyVesselIdentityProperties = (
   vesselName: vessel.vesselName ?? null
 })
 
-export const getVesselCompositeIdentifier: (vessel) => VesselCompositeIdentifier = vessel =>
+export const getVesselCompositeIdentifier: (vessel: VesselIdentity) => VesselCompositeIdentifier = vessel =>
   `${vessel.internalReferenceNumber ?? 'UNKNOWN'}/${vessel.ircs ?? 'UNKNOWN'}/${
     vessel.externalReferenceNumber ?? 'UNKNOWN'
   }`

frontend/src/domain/shared_slices/DisplayedComponent.ts

@@ -7,55 +7,58 @@ import type { PayloadAction } from '@reduxjs/toolkit'
 
 const displayedComponentsLocalstorageKey = 'displayedComponents'
 
+// TODO Move this slice either into `MainWindow` slice, or create related feature components slices (LeftMenu, RightMenu, etc.).
 export type DisplayedComponentState = {
   areVesselsDisplayed: boolean
   isAccountMapButtonDisplayed: boolean
-  isAlertsMapButtonDisplayed: boolean
-  isBeaconMalfunctionsMapButtonDisplayed: boolean
+  isAlertsLeftMenuButtonDisplayed: boolean
+  isBeaconMalfunctionsLeftMenuButtonDisplayed: boolean
   isControlUnitDialogDisplayed: boolean
   isControlUnitListDialogDisplayed: boolean
   isControlUnitListMapButtonDisplayed: boolean
   isDrawLayerModalDisplayed: boolean
-  isFavoriteVesselsMapButtonDisplayed: boolean
-  isInterestPointMapButtonDisplayed: boolean
-  isMeasurementMapButtonDisplayed: boolean
+  isFavoriteVesselsLeftMenuButtonDisplayed: boolean
+  isInterestPointRightMenuButtonDisplayed: boolean
+  isMeasurementRightMenuButtonDisplayed: boolean
   isMissionsLayerDisplayed: boolean
-  isMissionsMapButtonDisplayed: boolean
-  isPriorNotificationMapButtonDisplayed: boolean
+  isMissionsLeftMenuButtonDisplayed: boolean
+  isPriorNotificationLeftMenuButtonDisplayed: boolean
+  isRegulationsLeftMenuButtonDisplayed: boolean
   isStationLayerDisplayed: boolean
-  isVesselFiltersMapButtonDisplayed: boolean
-  isVesselLabelsMapButtonDisplayed: boolean
+  isVesselFiltersRightMenuButtonDisplayed: boolean
+  isVesselLabelsRightMenuButtonDisplayed: boolean
   isVesselListDisplayed: boolean
   isVesselListModalDisplayed: boolean
   isVesselSearchDisplayed: boolean
-  isVesselVisibilityMapButtonDisplayed: boolean
+  isVesselVisibilityRightMenuButtonDisplayed: boolean
 }
-const INITIAL_STATE: DisplayedComponentState = {
+export const INITIAL_STATE: DisplayedComponentState = {
   areVesselsDisplayed: true,
   isAccountMapButtonDisplayed: true,
-  isAlertsMapButtonDisplayed: true,
-  isBeaconMalfunctionsMapButtonDisplayed: true,
+  isAlertsLeftMenuButtonDisplayed: true,
+  isBeaconMalfunctionsLeftMenuButtonDisplayed: true,
   isControlUnitDialogDisplayed: false,
   isControlUnitListDialogDisplayed: false,
   isControlUnitListMapButtonDisplayed: true,
   isDrawLayerModalDisplayed: false,
-  isFavoriteVesselsMapButtonDisplayed: true,
-  isInterestPointMapButtonDisplayed: true,
-  isMeasurementMapButtonDisplayed: true,
+  isFavoriteVesselsLeftMenuButtonDisplayed: true,
+  isInterestPointRightMenuButtonDisplayed: true,
+  isMeasurementRightMenuButtonDisplayed: true,
   isMissionsLayerDisplayed: getLocalstorageProperty(
     true,
     displayedComponentsLocalstorageKey,
     'isMissionsLayerDisplayed'
   ),
-  isMissionsMapButtonDisplayed: true,
-  isPriorNotificationMapButtonDisplayed: true,
+  isMissionsLeftMenuButtonDisplayed: true,
+  isPriorNotificationLeftMenuButtonDisplayed: true,
+  isRegulationsLeftMenuButtonDisplayed: true,
   isStationLayerDisplayed: false,
-  isVesselFiltersMapButtonDisplayed: true,
-  isVesselLabelsMapButtonDisplayed: true,
+  isVesselFiltersRightMenuButtonDisplayed: true,
+  isVesselLabelsRightMenuButtonDisplayed: true,
   isVesselListDisplayed: true,
   isVesselListModalDisplayed: false,
   isVesselSearchDisplayed: true,
-  isVesselVisibilityMapButtonDisplayed: true
+  isVesselVisibilityRightMenuButtonDisplayed: true
 }
 
 /**
@@ -67,6 +70,12 @@ const displayedComponentSlice = createSlice({
   initialState: INITIAL_STATE,
   name: 'displayedComponent',
   reducers: {
+    hideAll(state) {
+      Object.keys(INITIAL_STATE).forEach(propertyKey => {
+        state[propertyKey] = false
+      })
+    },
+
     setDisplayedComponents(state, action: PayloadAction<Partial<DisplayedComponentState>>) {
       Object.keys(INITIAL_STATE).forEach(propertyKey => {
         const value = getValueOrDefault(action.payload[propertyKey], state[propertyKey])

frontend/src/domain/shared_slices/Vessel.ts

@@ -195,7 +195,13 @@ const vesselSlice = createSlice({
       state.highlightedVesselTrackPosition = action.payload
     },
 
-    loadingVessel(state, action) {
+    loadingVessel(
+      state,
+      action: PayloadAction<{
+        calledFromCron: boolean
+        vesselIdentity: VesselIdentity
+      }>
+    ) {
       state.selectedVesselIdentity = action.payload.vesselIdentity
       state.vesselSidebarIsOpen = true
       if (!action.payload.calledFromCron) {
@@ -303,7 +309,8 @@ const vesselSlice = createSlice({
       })
 
       if (
-        state.selectedVessel &&
+        !!state.selectedVessel &&
+        !!state.selectedVesselIdentity &&
         Vessel.getVesselFeatureId(state.selectedVesselIdentity) === action.payload.vesselFeatureId
       ) {
         const vesselReportingWithoutFirstFoundReportingType = state.selectedVessel.reportings?.reduce(

frontend/src/domain/use_cases/alert/addSilencedAlert.ts

@@ -1,6 +1,6 @@
 import { alertApi } from '../../../api/alert'
+import { setError } from '../../../features/MainWindow/slice'
 import { setSilencedAlerts } from '../../../features/SideWindow/Alert/slice'
-import { setError } from '../../shared_slices/Global'
 
 import type { MainAppThunk } from '../../../store'
 import type { SilencedAlertData } from '../../entities/alerts/types'

frontend/src/domain/use_cases/alert/getOperationalAlerts.ts

@@ -1,6 +1,6 @@
 import { getOperationalAlertsFromAPI } from '../../../api/alert'
+import { setError } from '../../../features/MainWindow/slice'
 import { setPendingAlerts } from '../../../features/SideWindow/Alert/slice'
-import { setError } from '../../shared_slices/Global'
 
 import type { MainAppThunk } from '../../../store'
 

frontend/src/domain/use_cases/alert/getSilencedAlerts.ts

@@ -1,6 +1,6 @@
 import { getSilencedAlertsFromAPI } from '../../../api/alert'
+import { setError } from '../../../features/MainWindow/slice'
 import { setSilencedAlerts } from '../../../features/SideWindow/Alert/slice'
-import { setError } from '../../shared_slices/Global'
 
 export const getSilencedAlerts = () => dispatch => {
   getSilencedAlertsFromAPI()

frontend/src/domain/use_cases/alert/reactivateSilencedAlert.ts

@@ -1,8 +1,8 @@
 import { deleteSilencedAlertFromAPI } from '../../../api/alert'
+import { setError } from '../../../features/MainWindow/slice'
 import { setSilencedAlerts } from '../../../features/SideWindow/Alert/slice'
 import { deleteListItems } from '../../../utils/deleteListItems'
 import { updateListItemsProp } from '../../../utils/updateListItemsProp'
-import { setError } from '../../shared_slices/Global'
 
 import type { MainAppThunk } from '../../../store'
 import type { LEGACY_SilencedAlert } from '../../entities/alerts/types'

frontend/src/domain/use_cases/alert/silenceAlert.ts

@@ -1,4 +1,5 @@
 import { silenceAlertFromAPI } from '../../../api/alert'
+import { setError } from '../../../features/MainWindow/slice'
 import {
   addToPendingAlertsBeingSilenced,
   removeFromSilencedAlertsQueue,
@@ -7,7 +8,6 @@ import {
 } from '../../../features/SideWindow/Alert/slice'
 import { deleteListItems } from '../../../utils/deleteListItems'
 import { Vessel } from '../../entities/vessel/vessel'
-import { setError } from '../../shared_slices/Global'
 import { removeVesselAlertAndUpdateReporting } from '../../shared_slices/Vessel'
 
 import type { MainAppThunk } from '../../../store'

frontend/src/domain/use_cases/alert/validateAlert.ts

@@ -1,11 +1,11 @@
 import { getVesselReportings } from '@features/Reporting/useCases/getVesselReportings'
 
 import { validateAlertFromAPI } from '../../../api/alert'
+import { setError } from '../../../features/MainWindow/slice'
 import { setPendingAlerts } from '../../../features/SideWindow/Alert/slice'
 import { deleteListItems } from '../../../utils/deleteListItems'
 import { updateListItemsProp } from '../../../utils/updateListItemsProp'
 import { Vessel } from '../../entities/vessel/vessel'
-import { setError } from '../../shared_slices/Global'
 import { removeVesselAlertAndUpdateReporting } from '../../shared_slices/Vessel'
 
 import type { MainAppThunk } from '../../../store'

frontend/src/domain/use_cases/beaconMalfunction/getAllBeaconMalfunctions.js

@@ -1,6 +1,6 @@
 import { getAllBeaconMalfunctionsFromAPI } from '../../../api/beaconMalfunction'
+import { setError } from '../../../features/MainWindow/slice'
 import { setBeaconMalfunctions } from '../../shared_slices/BeaconMalfunction'
-import { setError } from '../../shared_slices/Global'
 
 const getAllBeaconMalfunctions = () => dispatch => {
   getAllBeaconMalfunctionsFromAPI()

frontend/src/domain/use_cases/beaconMalfunction/getVesselBeaconMalfunctions.ts

@@ -2,14 +2,14 @@ import { DisplayedErrorKey } from '@libs/DisplayedError/constants'
 
 import openBeaconMalfunction from './openBeaconMalfunction'
 import { getVesselBeaconsMalfunctionsFromAPI } from '../../../api/beaconMalfunction'
+import { removeError } from '../../../features/MainWindow/slice'
 import { getOnlyVesselIdentityProperties } from '../../entities/vessel/vessel'
 import {
   loadVesselBeaconMalfunctions,
   resetVesselBeaconMalfunctionsResumeAndHistory,
   setVesselBeaconMalfunctionsResumeAndHistory
 } from '../../shared_slices/BeaconMalfunction'
 import { displayedErrorActions } from '../../shared_slices/DisplayedError'
-import { removeError } from '../../shared_slices/Global'
 import { displayOrLogError } from '../error/displayOrLogError'
 
 export const getVesselBeaconMalfunctions = (isFromUserAction: boolean) => async (dispatch, getState) => {

frontend/src/domain/use_cases/beaconMalfunction/openBeaconMalfunction.js

@@ -1,6 +1,6 @@
 import { getBeaconMalfunctionFromAPI } from '../../../api/beaconMalfunction'
+import { setError } from '../../../features/MainWindow/slice'
 import { setOpenedBeaconMalfunction } from '../../shared_slices/BeaconMalfunction'
-import { setError } from '../../shared_slices/Global'
 
 /**
  * Open a single beacon malfunction

frontend/src/domain/use_cases/beaconMalfunction/openBeaconMalfunctionInKanban.ts

@@ -1,6 +1,6 @@
 import { getBeaconMalfunctionFromAPI } from '../../../api/beaconMalfunction'
+import { setError } from '../../../features/MainWindow/slice'
 import { setOpenedBeaconMalfunctionsInKanban } from '../../shared_slices/BeaconMalfunction'
-import { setError } from '../../shared_slices/Global'
 
 /**
  * Open a single beacon malfunction

frontend/src/domain/use_cases/beaconMalfunction/saveBeaconMalfunctionCommentFromKanban.js

@@ -1,10 +1,10 @@
 import { saveBeaconMalfunctionCommentFromAPI } from '../../../api/beaconMalfunction'
+import { setError } from '../../../features/MainWindow/slice'
 import {
   setOpenedBeaconMalfunction,
   setOpenedBeaconMalfunctionsInKanban,
   updateVesselBeaconMalfunctionsResumeAndHistory
 } from '../../shared_slices/BeaconMalfunction'
-import { setError } from '../../shared_slices/Global'
 
 /**
  * Save a new comment to a beacon malfunction
@@ -13,7 +13,7 @@ import { setError } from '../../shared_slices/Global'
  * @param {string} comment
  */
 const saveBeaconMalfunctionCommentFromKanban = (beaconMalfunctionId, comment) => (dispatch, getState) => {
-  const { userType } = getState().global
+  const { userType } = getState().mainWindow
   const newCommentInput = {
     comment,
     userType

frontend/src/domain/use_cases/beaconMalfunction/sendNotification.ts

@@ -1,6 +1,6 @@
 import { sendNotificationFromAPI } from '../../../api/beaconMalfunction'
+import { setError } from '../../../features/MainWindow/slice'
 import { NOTIFICATION_TYPE } from '../../entities/beaconMalfunction/constants'
-import { setError } from '../../shared_slices/Global'
 
 /**
  * Send a notification message

frontend/src/domain/use_cases/beaconMalfunction/updateBeaconMalfunctionFromKanban.js

@@ -1,12 +1,12 @@
 import { updateBeaconMalfunctionFromAPI } from '../../../api/beaconMalfunction'
+import { setError } from '../../../features/MainWindow/slice'
 import {
   setBeaconMalfunctions,
   updateLocalBeaconMalfunction,
   setOpenedBeaconMalfunctionsInKanban,
   setOpenedBeaconMalfunction,
   updateVesselBeaconMalfunctionsResumeAndHistory
 } from '../../shared_slices/BeaconMalfunction'
-import { setError } from '../../shared_slices/Global'
 
 /**
  * Update a beacon malfunction

frontend/src/domain/use_cases/error/displayOrLogError.ts

@@ -1,6 +1,6 @@
+import { setError } from '../../../features/MainWindow/slice'
 import { DisplayedError } from '../../../libs/DisplayedError'
 import { INITIAL_STATE, type DisplayedErrorState, displayedErrorActions } from '../../shared_slices/DisplayedError'
-import { setError } from '../../shared_slices/Global'
 
 import type { MainAppUseCase } from '@store'
 

frontend/src/domain/use_cases/faoAreas/getFAOAreas.js

@@ -1,5 +1,5 @@
 import { getFAOAreasFromAPI } from '../../../api/faoAreas'
-import { setError } from '../../shared_slices/Global'
+import { setError } from '../../../features/MainWindow/slice'
 
 const getFAOAreas = () => dispatch =>
   getFAOAreasFromAPI().catch(error => {

frontend/src/domain/use_cases/gearCode/getAllGearCodes.js

@@ -1,9 +1,9 @@
 import { batch } from 'react-redux'
 
 import { getAllGearsFromAPI } from '../../../api/gearCode'
+import { setError } from '../../../features/MainWindow/slice'
 import { REGULATED_GEARS_KEYS } from '../../entities/backoffice'
 import { setCategoriesToGears, setGears, setGroupsToCategories, setGearsByCode } from '../../shared_slices/Gear'
-import { setError } from '../../shared_slices/Global'
 
 /** *
  * Get gear group name, see SQL init of table fishing_gear_groups:

frontend/src/domain/use_cases/infraction/getInfractions.ts

@@ -1,5 +1,5 @@
 import { getInfractionsFromAPI } from '../../../api/infraction'
-import { setError } from '../../shared_slices/Global'
+import { setError } from '../../../features/MainWindow/slice'
 import { setInfractions } from '../../shared_slices/Infraction'
 
 export const getInfractions = () => dispatch => {