addressing comments

Signed-off-by: abbyhu2000 <abigailhu2000@gmail.com>

CHANGELOG.md

@@ -64,7 +64,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [Multiple DataSource] Add support for SigV4 authentication ([#3058](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/3058))
 - Make build scripts find and use the latest version of Node.js that satisfies `engines.node` ([#3467](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/3467))
 - [Multiple DataSource] Refactor test connection to support SigV4 auth type ([#3456](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/3456))
-- [Vis Builder] Add metric to metric, bucket to bucket aggregation persistence ([#3495](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3495))
+- [Vis Builder] Add metric-to-metric, bucket-to-bucket aggregation persistence ([#3495](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3495))
 
 ### 🐛 Bug Fixes
 

src/plugins/vis_builder/public/application/components/right_nav.tsx

@@ -34,8 +34,13 @@ export const RightNav = () => {
   const StyleSection = ui.containerConfig.style.render;
 
   const { activeVisualization } = useTypedSelector((state) => state.visualization);
-  const oldAggParams = activeVisualization?.aggConfigParams ?? [];
-  const persistedAggParams = usePersistedAggParams(types, oldAggParams, activeVisName, newVisType);
+  const aggConfigParams = activeVisualization?.aggConfigParams ?? [];
+  const persistedAggParams = usePersistedAggParams(
+    types,
+    aggConfigParams,
+    activeVisName,
+    newVisType
+  );
 
   const options: Array<EuiSuperSelectOption<string>> = types.all().map(({ name, icon, title }) => ({
     value: name,
@@ -77,7 +82,7 @@ export const RightNav = () => {
               setActiveVisualization({
                 name: newVisType,
                 style: types.get(newVisType)?.ui.containerConfig.style.defaults,
-                aggParams: persistedAggParams,
+                aggConfigParams: persistedAggParams,
               })
             );
 

src/plugins/vis_builder/public/application/utils/state_management/shared_actions.ts

@@ -10,7 +10,7 @@ import { VisualizationType } from '../../../services/type_service/visualization_
 interface ActiveVisPayload {
   name: VisualizationType['name'];
   style: VisualizationType['ui']['containerConfig']['style']['defaults'];
-  aggParams: CreateAggConfigParams[];
+  aggConfigParams: CreateAggConfigParams[];
 }
 
 export const setActiveVisualization = createAction<ActiveVisPayload>('setActiveVisualzation');

src/plugins/vis_builder/public/application/utils/state_management/visualization_slice.ts

@@ -123,7 +123,7 @@ export const slice = createSlice({
     builder.addCase(setActiveVisualization, (state, action) => {
       state.activeVisualization = {
         name: action.payload.name,
-        aggConfigParams: action.payload.aggParams,
+        aggConfigParams: action.payload.aggConfigParams,
       };
     });
   },

src/plugins/vis_builder/public/application/utils/use/use_persisted_agg_params.ts

@@ -3,24 +3,23 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { integer } from '@opensearch-project/opensearch/api/types';
 import { AggGroupNames, CreateAggConfigParams } from '../../../../../data/common';
 import { Schema } from '../../../../../vis_default_editor/public';
 
 export const usePersistedAggParams = (
   types,
-  oldAggParams: CreateAggConfigParams[],
+  aggConfigParams: CreateAggConfigParams[],
   oldVisType?: string,
   newVisType?: string
 ): CreateAggConfigParams[] => {
   if (oldVisType && newVisType) {
     const oldVisualizationType = types.get(oldVisType)?.ui.containerConfig.data.schemas.all;
     const newVisualizationType = types.get(newVisType)?.ui.containerConfig.data.schemas.all;
     const aggMapping = getSchemaMapping(oldVisualizationType, newVisualizationType);
-    const newAggParams = oldAggParams.map((newAggParam: CreateAggConfigParams) =>
-      updateAggParams(newAggParam, aggMapping)
+    const updatedAggConfigParams = aggConfigParams.map((aggConfigParam: CreateAggConfigParams) =>
+      updateAggParams(aggConfigParam, aggMapping)
     );
-    return newAggParams;
+    return updatedAggConfigParams;
   }
   return [];
 };
@@ -41,8 +40,8 @@ export const getSchemaMapping = (
 
 export interface AggMapping {
   name: string;
-  maxCount: integer;
-  currentCount: integer;
+  maxCount: number;
+  currentCount: number;
 }
 
 export const mapAggParamsSchema = (
@@ -70,29 +69,27 @@ export const updateAggParams = (
   oldAggParam: CreateAggConfigParams,
   aggMap: Map<string, AggMapping>
 ) => {
-  const newAggParam = {
-    params: oldAggParam.params,
-    type: oldAggParam.type,
-    enabled: oldAggParam.enabled,
-    id: oldAggParam.id,
-    schema: oldAggParam.schema,
-  };
+  const newAggParam = { ...oldAggParam };
   if (oldAggParam.schema) {
     const newSchema = aggMap.get(oldAggParam.schema);
-    if (newSchema) {
-      if (newSchema.currentCount < newSchema.maxCount) {
-        newAggParam.schema = aggMap.get(oldAggParam.schema)?.name;
-        aggMap.set(oldAggParam.schema, {
-          name: newSchema.name,
-          maxCount: newSchema.maxCount,
-          currentCount: newSchema.currentCount + 1,
-        });
-      } else {
-        newAggParam.schema = undefined;
-      }
-    } else {
-      newAggParam.schema = undefined;
-    }
+    newAggParam.schema = newSchema
+      ? newSchema.currentCount < newSchema.maxCount
+        ? assignNewSchemaType(oldAggParam, aggMap, newSchema)
+        : undefined
+      : undefined;
   }
   return newAggParam;
 };
+
+export const assignNewSchemaType = (
+  oldAggParam: any,
+  aggMap: Map<string, AggMapping>,
+  newSchema: AggMapping
+) => {
+  aggMap.set(oldAggParam.schema, {
+    name: newSchema.name,
+    maxCount: newSchema.maxCount,
+    currentCount: newSchema.currentCount + 1,
+  });
+  return aggMap.get(oldAggParam.schema)?.name;
+};