fix index pattern switch bug

Signed-off-by: Anan Zhuang <ananzh@amazon.com>
opensearch-project · Apr 12, 2024 · eaad556 · eaad556
1 parent 4313817
commit eaad556
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/src/plugins/vis_builder/public/application/utils/state_management/visualization_slice.ts b/src/plugins/vis_builder/public/application/utils/state_management/visualization_slice.ts
@@ -118,6 +118,10 @@ export const slice = createSlice({
     setState: (_state, action: PayloadAction<VisualizationState>) => {
       return action.payload;
     },
+    cleanActiveVisualization: (state, action: PayloadAction<void>) => {
+      state.activeVisualization!.aggConfigParams = [];
+      state.activeVisualization!.draftAgg = undefined;
+    },
   },
   extraReducers(builder) {
     builder.addCase(setActiveVisualization, (state, action) => {
@@ -138,4 +142,5 @@ export const {
   setAggParamValue,
   reorderAgg,
   setState,
+  cleanActiveVisualization,
 } = slice.actions;
diff --git a/src/plugins/vis_builder/public/application/utils/use/use_index_pattern.ts b/src/plugins/vis_builder/public/application/utils/use/use_index_pattern.ts
@@ -6,13 +6,15 @@ import { useEffect, useState } from 'react';
 import { i18n } from '@osd/i18n';
 import { IndexPattern } from '../../../../../data/public';
 import { VisBuilderViewServices } from '../../../types';
-import { useTypedSelector, updateIndexPattern } from '../state_management';
+import { useTypedSelector, updateIndexPattern, useTypedDispatch } from '../state_management';
 import { getIndexPatternId } from '../helpers/index_pattern_helper';
+import { cleanActiveVisualization } from '../state_management/visualization_slice';
 
 export const useIndexPattern = (services: VisBuilderViewServices): IndexPattern => {
   const indexPatternIdFromState = useTypedSelector((state) => state.metadata.indexPattern);
   const [indexPattern, setIndexPattern] = useState<IndexPattern>();
   const { data, toastNotifications, uiSettings: config, store } = services;
+  const dispatch = useTypedDispatch();
 
   useEffect(() => {
     let isMounted = true;
@@ -22,6 +24,7 @@ export const useIndexPattern = (services: VisBuilderViewServices): IndexPattern
         .get(id)
         .then((result) => {
           if (isMounted) {
+            dispatch(cleanActiveVisualization());
             setIndexPattern(result);
           }
         })
@@ -45,7 +48,7 @@ export const useIndexPattern = (services: VisBuilderViewServices): IndexPattern
 
     if (!indexPatternIdFromState) {
       data.indexPatterns.getCache().then((indexPatternList) => {
-        const newId = getIndexPatternId('', indexPatternList, config.get('defaultIndex'));
+        const newId = getIndexPatternId('', indexPatternList || [], config.get('defaultIndex'));
         store!.dispatch(updateIndexPattern(newId));
         fetchIndexPatternDetails(newId);
       });
@@ -56,7 +59,7 @@ export const useIndexPattern = (services: VisBuilderViewServices): IndexPattern
     return () => {
       isMounted = false;
     };
-  }, [indexPatternIdFromState, data.indexPatterns, toastNotifications, config, store]);
+  }, [indexPatternIdFromState, data.indexPatterns, toastNotifications, config, store, dispatch]);
 
-  return indexPattern;
+  return indexPattern!;
 };