From 301befb0ed785a4db9c2d0fa02f4345af6857357 Mon Sep 17 00:00:00 2001 From: Mateusz Winiarczyk <mateusz.winiarczyk@appunite.com> Date: Tue, 27 Feb 2024 22:45:22 +0100 Subject: [PATCH] fix(submap): set proper map id after submap is closed --- .../MapNavigation/MapNavigation.component.test.tsx | 8 +++++++- .../MapNavigation/MapNavigation.component.tsx | 9 ++++++++- src/redux/map/map.reducers.ts | 10 ++++------ src/redux/map/map.types.ts | 6 ++++++ 4 files changed, 25 insertions(+), 8 deletions(-) diff --git a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx index 051bc4d7..3123479d 100644 --- a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx +++ b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx @@ -5,6 +5,7 @@ import { import { StoreType } from '@/redux/store'; import { initialMapDataFixture, openedMapsThreeSubmapsFixture } from '@/redux/map/map.fixtures'; import { act, render, screen, within } from '@testing-library/react'; +import { MODELS_MOCK } from '@/redux/compartmentPathways/compartmentPathways.mock'; import { MapNavigation } from './MapNavigation.component'; const MAIN_MAP_ID = 5053; @@ -101,7 +102,7 @@ describe('MapNavigation - component', () => { expect(modelId).toBe(MAIN_MAP_ID); }); - it('should close map and open main map if closed currently selected map', async () => { + it('should close currently selected map map and open main map', async () => { const { store } = renderComponent({ map: { data: { @@ -112,6 +113,11 @@ describe('MapNavigation - component', () => { loading: 'succeeded', error: { message: '', name: '' }, }, + models: { + loading: 'succeeded', + error: { message: '', name: '' }, + data: MODELS_MOCK, + }, }); const histamineMapButton = screen.getByRole('button', { name: 'Histamine signaling' }); diff --git a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx index 293fba3a..f6c77f04 100644 --- a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx +++ b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx @@ -4,6 +4,7 @@ import { MAIN_MAP } from '@/redux/map/map.constants'; import { mapModelIdSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors'; import { closeMap, closeMapAndSetMainMapActive, setActiveMap } from '@/redux/map/map.slice'; import { OppenedMap } from '@/redux/map/map.types'; +import { mainMapModelSelector } from '@/redux/models/models.selectors'; import { Button } from '@/shared/Button'; import { Icon } from '@/shared/Icon'; import { MouseEvent } from 'react'; @@ -13,6 +14,7 @@ export const MapNavigation = (): JSX.Element => { const dispatch = useAppDispatch(); const openedMaps = useAppSelector(mapOpenedMapsSelector); const currentModelId = useAppSelector(mapModelIdSelector); + const mainMapModel = useAppSelector(mainMapModelSelector); const isActive = (modelId: number): boolean => currentModelId === modelId; const isNotMainMap = (modelName: string): boolean => modelName !== MAIN_MAP; @@ -20,7 +22,12 @@ export const MapNavigation = (): JSX.Element => { const onCloseSubmap = (event: MouseEvent<HTMLDivElement>, map: OppenedMap): void => { event.stopPropagation(); if (isActive(map.modelId)) { - dispatch(closeMapAndSetMainMapActive({ modelId: map.modelId })); + dispatch( + closeMapAndSetMainMapActive({ + modelId: mainMapModel.idObject, + currentModelId: map.modelId, + }), + ); } else { dispatch(closeMap({ modelId: map.modelId })); } diff --git a/src/redux/map/map.reducers.ts b/src/redux/map/map.reducers.ts index eef6f932..50220ebe 100644 --- a/src/redux/map/map.reducers.ts +++ b/src/redux/map/map.reducers.ts @@ -1,8 +1,6 @@ -import { ZERO } from '@/constants/common'; import { DEFAULT_ZOOM } from '@/constants/map'; import { ActionReducerMapBuilder } from '@reduxjs/toolkit'; import { getPointMerged } from '../../utils/object/getPointMerged'; -import { MAIN_MAP } from './map.constants'; import { initMapBackground, initMapPosition, @@ -11,6 +9,7 @@ import { } from './map.thunks'; import { CloseMapAction, + CloseMapActionAndSetMainMapActive, MapState, OpenMapAndSetActiveAction, SetActiveMapAction, @@ -91,13 +90,12 @@ export const closeMapReducer = (state: MapState, action: CloseMapAction): void = export const closeMapAndSetMainMapActiveReducer = ( state: MapState, - action: CloseMapAction, + action: CloseMapActionAndSetMainMapActive, ): void => { state.openedMaps = state.openedMaps.filter( - openedMap => openedMap.modelId !== action.payload.modelId, + openedMap => openedMap.modelId !== action.payload.currentModelId, ); - state.data.modelId = - state.openedMaps.find(openedMap => openedMap.modelName === MAIN_MAP)?.modelId || ZERO; + state.data.modelId = action.payload.modelId; }; export const setMapBackgroundReducer = (state: MapState, action: SetBackgroundAction): void => { diff --git a/src/redux/map/map.types.ts b/src/redux/map/map.types.ts index 3d15719a..b11c5cfe 100644 --- a/src/redux/map/map.types.ts +++ b/src/redux/map/map.types.ts @@ -64,6 +64,12 @@ export type CloseMapActionPayload = Pick<OppenedMap, 'modelId'>; export type CloseMapAction = PayloadAction<CloseMapActionPayload>; +export type CloseMapActionAndSetMainMapActive = PayloadAction< + { + currentModelId: number; + } & Pick<OppenedMap, 'modelId'> +>; + export type InitMapDataActionParams = { queryData: QueryData }; export type InitMapDataAction = PayloadAction<SetMapDataAction>; -- GitLab