Fix/vistab close

BUG: Wrong vis being closed when multiple vis are open at the same time

Changes:

1. removeVisualization:

• Changed || to ?? for index handling
• Added validation check before operations

2. reorderVisState:

• Added bounds validation check for indices
• Changed the active index updating logic to handle three cases:
  1. Moving the active tab
  2. Moving a tab before current active tab
  3. Moving a tab after current active tab

Some more validation checks added to other reducers

libs/shared/lib/data-access/store/visualizationSlice.ts

@@ -5,8 +5,8 @@ import { isEqual } from 'lodash-es';
 
 export type VisStateSettings = VisualizationSettingsType[];
 export type VisState = {
-  activeVisualizationIndex: number; // uses underscore_case to match data model from backend
-  openVisualizationArray: VisStateSettings; // uses underscore_case to match data model from backend
+  activeVisualizationIndex: number;
+  openVisualizationArray: VisStateSettings;
 };
 
 export const initialState: VisState = {
@@ -19,48 +19,58 @@ export const visualizationSlice = createSlice({
   initialState,
   reducers: {
     removeVisualization: (state, action: PayloadAction<number | undefined>) => {
-      let index = action.payload || state.activeVisualizationIndex;
-      state.openVisualizationArray.splice(index, 1);
-      if (state.activeVisualizationIndex === index) {
-        if (state.openVisualizationArray.length === 0) state.activeVisualizationIndex = -1;
-        else {
-          state.activeVisualizationIndex = Math.max(state.openVisualizationArray.length - 1, 0);
+      const index = action.payload ?? state.activeVisualizationIndex;
+      
+      if (index >= 0 && index < state.openVisualizationArray.length) {
+        state.openVisualizationArray.splice(index, 1);
+      
+        if (state.openVisualizationArray.length === 0) {
+          state.activeVisualizationIndex = -1;
+        } else if (state.activeVisualizationIndex >= state.openVisualizationArray.length) {
+          state.activeVisualizationIndex = state.openVisualizationArray.length - 1;
+        } else if (state.activeVisualizationIndex === index) {
+          state.activeVisualizationIndex = index < state.openVisualizationArray.length ? index : index - 1;
+        } else if (state.activeVisualizationIndex > index) {
+          state.activeVisualizationIndex--;
         }
       }
     },
     setActiveVisualization: (state, action: PayloadAction<number>) => {
-      state.activeVisualizationIndex = action.payload;
+      if (action.payload >= -1 && action.payload < state.openVisualizationArray.length) {
+        state.activeVisualizationIndex = action.payload;
+      }
     },
     setVisualizationState: (state, action: PayloadAction<VisState>) => {
       if (action.payload.activeVisualizationIndex !== undefined && !isEqual(action.payload, state)) {
         state.openVisualizationArray = action.payload.openVisualizationArray || [];
-        state.activeVisualizationIndex = action.payload.activeVisualizationIndex;
+        state.activeVisualizationIndex = Math.min(
+          action.payload.activeVisualizationIndex,
+          state.openVisualizationArray.length - 1
+        );
       }
     },
     updateVisualization: (state, action: PayloadAction<{ id: number; settings: VisualizationSettingsType }>) => {
       const { id, settings } = action.payload;
-      state.openVisualizationArray[id] = settings;
+      if (id >= 0 && id < state.openVisualizationArray.length) {
+        state.openVisualizationArray[id] = settings;
+      }
     },
     addVisualization: (state, action: PayloadAction<VisualizationSettingsType>) => {
       state.openVisualizationArray.push(action.payload);
       state.activeVisualizationIndex = state.openVisualizationArray.length - 1;
     },
     updateActiveVisualization: (state, action: PayloadAction<VisualizationSettingsType>) => {
-      if (state.activeVisualizationIndex === -1) {
-        return;
+      if (state.activeVisualizationIndex >= 0) {
+        state.openVisualizationArray[state.activeVisualizationIndex] = action.payload;
       }
-
-      state.openVisualizationArray[state.activeVisualizationIndex] = action.payload;
     },
     updateActiveVisualizationAttributes: (state, action: PayloadAction<Record<string, any>>) => {
-      if (state.activeVisualizationIndex === -1) {
-        return;
+      if (state.activeVisualizationIndex >= 0) {
+        state.openVisualizationArray[state.activeVisualizationIndex] = {
+          ...state.openVisualizationArray[state.activeVisualizationIndex],
+          ...action.payload,
+        };
       }
-
-      state.openVisualizationArray[state.activeVisualizationIndex] = {
-        ...state.openVisualizationArray[state.activeVisualizationIndex],
-        ...action.payload,
-      };
     },
     reorderVisState: (
       state,
@@ -70,14 +80,30 @@ export const visualizationSlice = createSlice({
       }>,
     ) => {
       const { id, newPosition } = action.payload;
-      const settingsCopy = [...state.openVisualizationArray];
-      settingsCopy.splice(newPosition, 0, settingsCopy.splice(id, 1)[0]);
-      state.openVisualizationArray = settingsCopy;
+      if (
+        id >= 0 && 
+        id < state.openVisualizationArray.length && 
+        newPosition >= 0 && 
+        newPosition < state.openVisualizationArray.length
+      ) {
+        const settingsCopy = [...state.openVisualizationArray];
+        const [movedItem] = settingsCopy.splice(id, 1);
+        settingsCopy.splice(newPosition, 0, movedItem);
+        state.openVisualizationArray = settingsCopy;
 
-      if (state.activeVisualizationIndex === id) {
-        state.activeVisualizationIndex = newPosition;
-      } else if (state.activeVisualizationIndex === newPosition) {
-        state.activeVisualizationIndex = id;
+        if (state.activeVisualizationIndex === id) {
+          state.activeVisualizationIndex = newPosition;
+        } else if (
+          state.activeVisualizationIndex > id && 
+          state.activeVisualizationIndex <= newPosition
+        ) {
+          state.activeVisualizationIndex--;
+        } else if (
+          state.activeVisualizationIndex < id && 
+          state.activeVisualizationIndex >= newPosition
+        ) {
+          state.activeVisualizationIndex++;
+        }
       }
     },
   },
@@ -100,4 +126,4 @@ export const visualizationActive = (state: RootState) =>
   state.visualize.activeVisualizationIndex !== -1
     ? state.visualize.openVisualizationArray?.[state.visualize.activeVisualizationIndex]
     : undefined;
-export default visualizationSlice.reducer;
+export default visualizationSlice.reducer;
\ No newline at end of file