Skip to content

Commit

Permalink
refacto: hide some displayed items and restore preview state
Browse files Browse the repository at this point in the history
  • Loading branch information
@maximeperrault
maximeperrault committed Jan 30, 2025
1 parent 5b2f99c commit 7c551e0
Show file tree
Hide file tree
Showing 65 changed files with 272 additions and 285 deletions.
16 changes: 8 additions & 8 deletions frontend/src/components/Menu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,16 +14,16 @@ type MenuProps = {
}

export function Menu({ isSuperUser }: MenuProps) {
const displaySearchSemaphoreButton = useAppSelector(state => state.global.displaySearchSemaphoreButton)
const displaySearchSemaphoreButton = useAppSelector(state => state.global.menus.displaySearchSemaphoreButton)

const displayInterestPoint = useAppSelector(state => state.global.displayInterestPoint)
const displayMeasurement = useAppSelector(state => state.global.displayMeasurement)
const displayMissionMenuButton = useAppSelector(state => state.global.displayMissionMenuButton)
const displayReportingsButton = useAppSelector(state => state.global.displayReportingsButton)
const displayAccountButton = useAppSelector(state => state.global.displayAccountButton)
const displayDashboard = useAppSelector(state => state.global.displayDashboard)
const displayInterestPoint = useAppSelector(state => state.global.menus.displayInterestPoint)
const displayMeasurement = useAppSelector(state => state.global.menus.displayMeasurement)
const displayMissionMenuButton = useAppSelector(state => state.global.menus.displayMissionMenuButton)
const displayReportingsButton = useAppSelector(state => state.global.menus.displayReportingsButton)
const displayAccountButton = useAppSelector(state => state.global.menus.displayAccountButton)
const displayDashboard = useAppSelector(state => state.global.menus.displayDashboard)
const isRightMenuControlUnitListButtonVisible = useAppSelector(
state => state.global.displayRightMenuControlUnitListButton
state => state.global.menus.displayRightMenuControlUnitListButton
)
const hasFullHeightRightDialogOpen = useAppSelector(state => state.mainWindow.hasFullHeightRightDialogOpen)
const isRightMenuOpened = useAppSelector(state => state.mainWindow.isRightMenuOpened)
Expand Down
254 changes: 119 additions & 135 deletions frontend/src/domain/shared_slices/Global.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,124 +34,107 @@ type OverlayCoordinates = {

/* eslint-disable sort-keys-fix/sort-keys-fix, typescript-sort-keys/interface */
type GlobalStateType = {
// state entry for every component /menu displayed on map whose visibility should be controlled
displayAccountButton: boolean
displayMissionMenuButton: boolean
displayDrawModal: boolean
displayLayersSidebar: boolean
displayLocateOnMap: boolean
displayMeasurement: boolean
displayInterestPoint: boolean
displayDashboard: boolean
displaySearchSemaphoreButton: boolean
displayReportingsButton: boolean
displayRightMenuControlUnitListButton: boolean

// state entry for every layer whose visibility should be controlled
isSearchMissionsVisible: boolean
displayMissionEditingLayer: boolean
displayMissionsLayer: boolean
displayMissionSelectedLayer: boolean
displayMissionToAttachLayer: boolean
displayInterestPointLayer: boolean
displayReportingToAttachLayer: boolean
displayVigilanceAreaLayer: boolean
displayDashboardLayer: boolean

// state entry for other children components whom visibility is already handled by parent components

isAccountDialogVisible: boolean

isControlUnitDialogVisible: boolean
isControlUnitListDialogVisible: boolean

isSearchSemaphoreVisible: boolean
displaySemaphoresLayer: boolean

isSearchReportingsVisible: boolean
reportingFormVisibility: ReportingFormVisibilityProps

displayReportingsLayer: boolean
displayReportingsOverlay: boolean
displayReportingEditingLayer: boolean
displayReportingSelectedLayer: boolean

displayStationLayer: boolean

isDashboardDialogVisible: boolean

isLayersSidebarVisible: boolean

isMapToolVisible?: MapToolType

menus: {
displayAccountButton: boolean
displayMissionMenuButton: boolean
displayDrawModal: boolean
displayLayersSidebar: boolean
displayLocateOnMap: boolean
displayMeasurement: boolean
displayInterestPoint: boolean
displayDashboard: boolean
displaySearchSemaphoreButton: boolean
displayReportingsButton: boolean
displayRightMenuControlUnitListButton: boolean
}
visibility: {
isDashboardDialogVisible: boolean
isSearchMissionsVisible: boolean
isLayersSidebarVisible: boolean
isAccountDialogVisible: boolean
isControlUnitDialogVisible: boolean
isControlUnitListDialogVisible: boolean
isSearchSemaphoreVisible: boolean
isSearchReportingsVisible: boolean
reportingFormVisibility: ReportingFormVisibilityProps
isMapToolVisible?: MapToolType
}
layers: {
displayMissionEditingLayer: boolean
displayMissionsLayer: boolean
displayMissionSelectedLayer: boolean
displayMissionToAttachLayer: boolean
displayInterestPointLayer: boolean
displayReportingToAttachLayer: boolean
displayVigilanceAreaLayer: boolean
displayDashboardLayer: boolean

displayReportingsLayer: boolean
displayReportingsOverlay: boolean
displayReportingEditingLayer: boolean
displayReportingSelectedLayer: boolean

displayStationLayer: boolean
isLayersSidebarVisible: boolean
displaySemaphoresLayer: boolean
}
healthcheckTextWarning?: string

overlayCoordinates: OverlayCoordinates[]

toast?: Toast

openedOverlayId?: string
previousDisplayedItems: Record<string, any>
}
const initialState: GlobalStateType = {
// state entry for every component /menu displayed on map whose visibility should be controlled
displayAccountButton: true,
displayMissionMenuButton: true,
displayDrawModal: false,
displayLayersSidebar: true,
displayLocateOnMap: true,
displayMeasurement: true,
displayInterestPoint: true,
displayDashboard: true,
displaySearchSemaphoreButton: true,
displayReportingsButton: true,
displayRightMenuControlUnitListButton: true,

// state entry for every layer whose visibility should be controlled
isSearchMissionsVisible: false,
displayMissionsLayer: true,
displayMissionEditingLayer: true,
displayMissionSelectedLayer: true,
displayMissionToAttachLayer: true,
displayInterestPointLayer: true,
displayReportingToAttachLayer: true,
displayVigilanceAreaLayer: true,
displayDashboardLayer: false,

// state entry for other children components whom visibility is already handled by parent components
isLayersSidebarVisible: false,

// TODO Use `MainWindowDialog` or `MainWindowConfirmationModal`.
isAccountDialogVisible: false,

isControlUnitDialogVisible: false,
isControlUnitListDialogVisible: false,

isSearchSemaphoreVisible: false,
displaySemaphoresLayer: true,

isSearchReportingsVisible: false,
reportingFormVisibility: {
context: ReportingContext.MAP,
visibility: VisibilityState.NONE
menus: {
displayAccountButton: true,
displayMissionMenuButton: true,
displayDrawModal: false,
displayLayersSidebar: true,
displayLocateOnMap: true,
displayMeasurement: true,
displayInterestPoint: true,
displayDashboard: true,
displaySearchSemaphoreButton: true,
displayReportingsButton: true,
displayRightMenuControlUnitListButton: true
},
visibility: {
isDashboardDialogVisible: false,
isSearchMissionsVisible: false,
isLayersSidebarVisible: false,
isAccountDialogVisible: false,
isControlUnitDialogVisible: false,
isControlUnitListDialogVisible: false,
isSearchSemaphoreVisible: false,
isSearchReportingsVisible: false,
reportingFormVisibility: {
context: ReportingContext.MAP,
visibility: VisibilityState.NONE
}
},
layers: {
displayMissionEditingLayer: true,
displayMissionsLayer: true,
displayMissionSelectedLayer: true,
displayMissionToAttachLayer: true,
displayInterestPointLayer: true,
displayReportingToAttachLayer: true,
displayVigilanceAreaLayer: true,
displayDashboardLayer: false,

displayReportingsLayer: true,
displayReportingsOverlay: true,
displayReportingEditingLayer: true,
displayReportingSelectedLayer: true,

displayStationLayer: false,
isLayersSidebarVisible: true,
displaySemaphoresLayer: true
},
displayReportingsLayer: true,
displayReportingsOverlay: true,
displayReportingEditingLayer: true,
displayReportingSelectedLayer: true,

displayStationLayer: false,

isDashboardDialogVisible: false,

isMapToolVisible: undefined,

healthcheckTextWarning: undefined,

overlayCoordinates: [],

toast: undefined,

openedOverlayId: undefined
previousDisplayedItems: {}
}
/* eslint-enable sort-keys-fix/sort-keys-fix, typescript-sort-keys/interface */

Expand All @@ -165,14 +148,14 @@ const globalSlice = createSlice({

// TODO Rename to `hideAllDialogs`.
hideSideButtons(state) {
state.isAccountDialogVisible = false
state.isControlUnitDialogVisible = false
state.isControlUnitListDialogVisible = false
state.isSearchReportingsVisible = false
state.isSearchSemaphoreVisible = false
state.isSearchMissionsVisible = false
state.isMapToolVisible = undefined
state.isDashboardDialogVisible = false
state.visibility.isAccountDialogVisible = false
state.visibility.isControlUnitDialogVisible = false
state.visibility.isControlUnitListDialogVisible = false
state.visibility.isSearchReportingsVisible = false
state.visibility.isSearchSemaphoreVisible = false
state.visibility.isSearchMissionsVisible = false
state.visibility.isMapToolVisible = undefined
state.visibility.isDashboardDialogVisible = false
},

removeOverlayStroke(state) {
Expand All @@ -183,23 +166,24 @@ const globalSlice = createSlice({
state.toast = undefined
},

resetLayoutToDefault(state) {
state.displayDrawModal = false
state.displayInterestPoint = true
state.displayLayersSidebar = true
state.displayLocateOnMap = true
state.displayMeasurement = true
state.displayMissionMenuButton = true
state.displayReportingsButton = true
state.displayReportingsOverlay = true
state.displayRightMenuControlUnitListButton = true
state.displaySearchSemaphoreButton = true
state.displayDashboard = true
state.displayDashboardLayer = false
restorePreviousDisplayedItems(state) {
state.layers = state.previousDisplayedItems.layers
state.menus = state.previousDisplayedItems.menus
state.visibility = state.previousDisplayedItems.visibility
},

setDisplayedItems(state, action: PayloadAction<Partial<GlobalStateType>>) {
return { ...state, ...action.payload }
setDisplayedItems(
state,
action: PayloadAction<{
layers?: Partial<GlobalStateType['layers']>
menus?: Partial<GlobalStateType['menus']>
visibility?: Partial<GlobalStateType['visibility']>
}>
) {
state.previousDisplayedItems = { layers: state.layers, menus: state.menus, visibility: state.visibility }

state.layers = { ...state.layers, ...(action.payload.layers ?? {}) }
state.menus = { ...state.menus, ...(action.payload.menus ?? {}) }
state.visibility = { ...state.visibility, ...(action.payload.visibility ?? {}) }
},

/**
Expand All @@ -215,7 +199,7 @@ const globalSlice = createSlice({
* Set the map tool opened
*/
setIsMapToolVisible(state, action: PayloadAction<MapToolType | undefined>) {
state.isMapToolVisible = action.payload
state.visibility.isMapToolVisible = action.payload
},
setOpenedOverlay(state, action: PayloadAction<string>) {
const featureId = action.payload
Expand All @@ -232,7 +216,7 @@ const globalSlice = createSlice({
},

setReportingFormVisibility(state, action) {
state.reportingFormVisibility = action.payload
state.visibility.reportingFormVisibility = action.payload
},

setToast(state, action: PayloadAction<Toast>) {
Expand All @@ -246,7 +230,7 @@ export const {
hideSideButtons,
removeOverlayStroke,
removeToast,
resetLayoutToDefault,
restorePreviousDisplayedItems,
setDisplayedItems,
setHealthcheckTextWarning,
setIsMapToolVisible,
Expand Down
37 changes: 18 additions & 19 deletions frontend/src/domain/use_cases/map/updateMapInteractionListeners.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { attachMissionToReportingSliceActions } from '@features/Reportings/compo
import { closeAreaOverlay } from './closeAreaOverlay'
import { attachReportingToMissionSliceActions } from '../../../features/Mission/components/MissionForm/AttachReporting/slice'
import { resetInteraction } from '../../shared_slices/Draw'
import { setDisplayedItems, resetLayoutToDefault } from '../../shared_slices/Global'
import { restorePreviousDisplayedItems, setDisplayedItems } from '../../shared_slices/Global'

export enum MapInteractionListenerEnum {
ATTACH_MISSION = 'ATTACH_MISSION',
Expand Down Expand Up @@ -39,14 +39,9 @@ export const updateMapInteractionListeners = (listener: MapInteractionListenerEn

case MapInteractionListenerEnum.NONE:
default:
dispatch(
setDisplayedItems({
displayInterestPointLayer: true
})
)
dispatch(attachMissionToReportingSliceActions.setIsMissionAttachmentInProgress(false))
dispatch(attachReportingToMissionSliceActions.setIsReportingAttachmentInProgress(false))
dispatch(resetLayoutToDefault())
dispatch(restorePreviousDisplayedItems())
dispatch(resetInteraction())
break
}
Expand All @@ -55,18 +50,22 @@ export const updateMapInteractionListeners = (listener: MapInteractionListenerEn
const openDrawLayerModal = (dispatch, hideSidebarAndInterestPoint = true) => {
dispatch(
setDisplayedItems({
displayDashboard: false,
displayDrawModal: true,
displayInterestPoint: false,
displayInterestPointLayer: hideSidebarAndInterestPoint,
displayLayersSidebar: hideSidebarAndInterestPoint,
displayLocateOnMap: true,
displayMeasurement: false,
displayMissionMenuButton: false,
displayReportingsButton: false,
displayReportingsOverlay: false,
displayRightMenuControlUnitListButton: false,
displaySearchSemaphoreButton: false
layers: {
displayInterestPointLayer: hideSidebarAndInterestPoint,
displayReportingsOverlay: false
},
menus: {
displayDashboard: false,
displayDrawModal: true,
displayInterestPoint: false,
displayLayersSidebar: hideSidebarAndInterestPoint,
displayLocateOnMap: true,
displayMeasurement: false,
displayMissionMenuButton: false,
displayReportingsButton: false,
displayRightMenuControlUnitListButton: false,
displaySearchSemaphoreButton: false
}
})
)
}
Loading

0 comments on commit 7c551e0

Please sign in to comment.