From 462f3be9fec6e939d4886b3e0aeb960690ea901e Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <Uladzislau_Lasitsa@epam.com>
Date: Mon, 5 Apr 2021 12:56:02 +0300
Subject: [PATCH 1/7] set "stacked" mode metric if the referenced axis is
 "percentage"

---
 .../__snapshots__/index.test.tsx.snap         |  2 ++
 .../options/metrics_axes/chart_options.tsx    |  1 +
 .../options/metrics_axes/index.test.tsx       | 12 ++++++-
 .../components/options/metrics_axes/index.tsx | 35 ++++++++++++++++---
 .../components/options/metrics_axes/mocks.ts  |  1 +
 .../components/options/metrics_axes/utils.ts  |  1 +
 src/plugins/vis_type_xy/public/types/param.ts |  1 +
 7 files changed, 47 insertions(+), 6 deletions(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap
index 40e53d88f99cf..9a63e3e31f30e 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap
@@ -11,6 +11,7 @@ exports[`MetricsAxisOptions component should init with the default set of props
             "id": "1",
             "label": "Count",
           },
+          "disabledMode": false,
           "drawLinesBetweenPoints": true,
           "interpolate": "linear",
           "lineWidth": 2,
@@ -83,6 +84,7 @@ exports[`MetricsAxisOptions component should init with the default set of props
             "id": "1",
             "label": "Count",
           },
+          "disabledMode": false,
           "drawLinesBetweenPoints": true,
           "interpolate": "linear",
           "lineWidth": 2,
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx
index 6f0b4fc5c9d22..d9d88b99b5f5a 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx
@@ -104,6 +104,7 @@ function ChartOptions({
             })}
             options={collections.chartModes}
             paramName="mode"
+            disabled={chart.disabledMode}
             value={chart.mode}
             setValue={setChart}
           />
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
index 4996018d21120..b5573fbc40b25 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
@@ -14,7 +14,7 @@ import { Position } from '@elastic/charts';
 import { IAggConfig, IAggType } from 'src/plugins/data/public';
 
 import { ChartType } from '../../../../../common';
-import { VisParams, SeriesParam, ValueAxis } from '../../../../types';
+import { VisParams, SeriesParam, ValueAxis, AxisMode, ChartMode } from '../../../../types';
 import MetricsAxisOptions from './index';
 import { ValidationVisOptionsProps } from '../../common';
 import { ValueAxesPanel } from './value_axes_panel';
@@ -128,6 +128,15 @@ describe('MetricsAxisOptions component', () => {
       const updatedSeries = [{ ...chart, data: { id: agg.id, label: agg.makeLabel() } }];
       expect(setValue).toHaveBeenCalledWith(SERIES_PARAMS, updatedSeries);
     });
+
+    it('should set "stacked" mode for metric if the referenced axis is "percentage"', () => {
+      defaultProps.stateParams.valueAxes[0].scale.mode = AxisMode.Percentage;
+      defaultProps.stateParams.seriesParams[0].mode = ChartMode.Normal;
+      mount(<MetricsAxisOptions {...defaultProps} />);
+
+      const updatedSeries = [{ ...chart, disabledMode: true, mode: ChartMode.Stacked }];
+      expect(setValue).toHaveBeenCalledWith(SERIES_PARAMS, updatedSeries);
+    });
   });
 
   describe('updateAxisTitle', () => {
@@ -146,6 +155,7 @@ describe('MetricsAxisOptions component', () => {
     });
 
     it('should set the custom title to match the value axis label when only one agg exists for that axis', () => {
+      defaultProps.stateParams.valueAxes[0].scale.mode = AxisMode.Normal;
       const component = mount(<MetricsAxisOptions {...defaultProps} />);
       const agg = {
         id: aggCount.id,
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
index d25845f02e7a7..2bbc5462cc4c4 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
@@ -13,7 +13,14 @@ import { EuiSpacer } from '@elastic/eui';
 
 import { IAggConfig } from '../../../../../../data/public';
 
-import { VisParams, ValueAxis, SeriesParam, CategoryAxis } from '../../../../types';
+import {
+  VisParams,
+  ValueAxis,
+  SeriesParam,
+  CategoryAxis,
+  ChartMode,
+  AxisMode,
+} from '../../../../types';
 import { ValidationVisOptionsProps } from '../../common';
 import { SeriesPanel } from './series_panel';
 import { CategoryAxisPanel } from './category_axis_panel';
@@ -283,10 +290,11 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
     const updatedSeries = metrics.map((agg) => {
       const params = stateParams.seriesParams.find((param) => param.data.id === agg.id);
       const label = agg.makeLabel();
+      let series: SeriesParam;
 
       // update labels for existing params or create new one
       if (params) {
-        return {
+        series = {
           ...params,
           data: {
             ...params.data,
@@ -294,19 +302,36 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
           },
         };
       } else {
-        const series = makeSerie(
+        series = makeSerie(
           agg.id,
           label,
           firstValueAxesId,
           stateParams.seriesParams[stateParams.seriesParams.length - 1]
         );
-        return series;
       }
+
+      const valueAxisToMetric = stateParams.valueAxes.find(
+        (valueAxis) => valueAxis.id === series.valueAxis
+      );
+      if (valueAxisToMetric) {
+        series.mode =
+          valueAxisToMetric.scale.mode === AxisMode.Percentage ? ChartMode.Stacked : series.mode;
+        series.disabledMode = valueAxisToMetric.scale.mode === AxisMode.Percentage;
+      }
+
+      return series;
     });
 
     setValue('seriesParams', updatedSeries);
     updateAxisTitle(updatedSeries);
-  }, [metrics, firstValueAxesId, setValue, stateParams.seriesParams, updateAxisTitle]);
+  }, [
+    metrics,
+    firstValueAxesId,
+    setValue,
+    stateParams.seriesParams,
+    stateParams.valueAxes,
+    updateAxisTitle,
+  ]);
 
   return isTabSelected ? (
     <>
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts
index 7451f6dea9039..1f5ffdee36392 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts
@@ -68,6 +68,7 @@ const seriesParam: SeriesParam = {
   show: true,
   type: ChartType.Histogram,
   mode: ChartMode.Stacked,
+  disabledMode: false,
   data: {
     label: 'Count',
     id: '1',
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts
index d0d0c08060acf..bc84f6aeb6152 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts
@@ -23,6 +23,7 @@ export const makeSerie = (
   const defaultSerie = {
     show: true,
     mode: ChartMode.Normal,
+    disabledMode: false,
     type: ChartType.Line,
     drawLinesBetweenPoints: true,
     showCircles: true,
diff --git a/src/plugins/vis_type_xy/public/types/param.ts b/src/plugins/vis_type_xy/public/types/param.ts
index 69b6daf077a32..bd0b557b44b18 100644
--- a/src/plugins/vis_type_xy/public/types/param.ts
+++ b/src/plugins/vis_type_xy/public/types/param.ts
@@ -68,6 +68,7 @@ export interface SeriesParam {
   interpolate?: InterpolationMode;
   lineWidth?: number;
   mode: ChartMode;
+  disabledMode: boolean;
   show: boolean;
   showCircles: boolean;
   type: ChartType;

From 4eb2d8ee38f27a73a05eb312737766bfb03e36ff Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <Uladzislau_Lasitsa@epam.com>
Date: Mon, 5 Apr 2021 15:33:38 +0300
Subject: [PATCH 2/7] Fixed CI

---
 .../__snapshots__/chart_options.test.tsx.snap            | 1 +
 .../editor/components/options/metrics_axes/index.tsx     | 9 ++++++---
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/chart_options.test.tsx.snap b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/chart_options.test.tsx.snap
index 56f35ae021173..59a7cf966df91 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/chart_options.test.tsx.snap
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/chart_options.test.tsx.snap
@@ -54,6 +54,7 @@ exports[`ChartOptions component should init with the default set of props 1`] =
     </EuiFlexItem>
     <EuiFlexItem>
       <SelectOption
+        disabled={false}
         id="seriesMode0"
         label="Mode"
         options={
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
index 2bbc5462cc4c4..b653b9b1f03d6 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
@@ -314,9 +314,12 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
         (valueAxis) => valueAxis.id === series.valueAxis
       );
       if (valueAxisToMetric) {
-        series.mode =
-          valueAxisToMetric.scale.mode === AxisMode.Percentage ? ChartMode.Stacked : series.mode;
-        series.disabledMode = valueAxisToMetric.scale.mode === AxisMode.Percentage;
+        if (valueAxisToMetric.scale.mode === AxisMode.Percentage) {
+          series.mode = ChartMode.Stacked;
+          series.disabledMode = true;
+        } else if (series.disabledMode) {
+          series.disabledMode = false;
+        }
       }
 
       return series;

From bc7e3be9182e1d4e196ca15c0c22a38803cda5de Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <Uladzislau_Lasitsa@epam.com>
Date: Tue, 6 Apr 2021 13:49:02 +0300
Subject: [PATCH 3/7] Move logic inside chart_option component

---
 .../__snapshots__/index.test.tsx.snap         |  2 --
 .../metrics_axes/chart_options.test.tsx       | 14 +++++++++++--
 .../options/metrics_axes/chart_options.tsx    | 21 ++++++++++++++++---
 .../options/metrics_axes/index.test.tsx       |  9 --------
 .../components/options/metrics_axes/index.tsx | 21 +------------------
 .../components/options/metrics_axes/mocks.ts  |  1 -
 src/plugins/vis_type_xy/public/types/param.ts |  1 -
 7 files changed, 31 insertions(+), 38 deletions(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap
index 9a63e3e31f30e..40e53d88f99cf 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/__snapshots__/index.test.tsx.snap
@@ -11,7 +11,6 @@ exports[`MetricsAxisOptions component should init with the default set of props
             "id": "1",
             "label": "Count",
           },
-          "disabledMode": false,
           "drawLinesBetweenPoints": true,
           "interpolate": "linear",
           "lineWidth": 2,
@@ -84,7 +83,6 @@ exports[`MetricsAxisOptions component should init with the default set of props
             "id": "1",
             "label": "Count",
           },
-          "disabledMode": false,
           "drawLinesBetweenPoints": true,
           "interpolate": "linear",
           "lineWidth": 2,
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.test.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.test.tsx
index caf14e57fef7e..def24d51f49f3 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.test.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.test.tsx
@@ -7,10 +7,10 @@
  */
 
 import React from 'react';
-import { shallow } from 'enzyme';
+import { shallow, mount } from 'enzyme';
 
 import { ChartOptions, ChartOptionsParams } from './chart_options';
-import { SeriesParam, ChartMode } from '../../../../types';
+import { SeriesParam, ChartMode, AxisMode } from '../../../../types';
 import { LineOptions } from './line_options';
 import { valueAxis, seriesParam } from './mocks';
 import { ChartType } from '../../../../../common';
@@ -71,4 +71,14 @@ describe('ChartOptions component', () => {
 
     expect(setParamByIndex).toBeCalledWith('seriesParams', 0, paramName, ChartMode.Normal);
   });
+
+  it('should set "stacked" mode and disabled control if the referenced axis is "percentage"', () => {
+    defaultProps.valueAxes[0].scale.mode = AxisMode.Percentage;
+    defaultProps.chart.mode = ChartMode.Normal;
+    const paramName = 'mode';
+    const comp = mount(<ChartOptions {...defaultProps} />);
+
+    expect(setParamByIndex).toBeCalledWith('seriesParams', 0, paramName, ChartMode.Stacked);
+    expect(comp.find({ paramName }).prop('disabled')).toBeTruthy();
+  });
 });
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx
index d9d88b99b5f5a..23452a87aae60 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/chart_options.tsx
@@ -6,14 +6,14 @@
  * Side Public License, v 1.
  */
 
-import React, { useMemo, useCallback } from 'react';
+import React, { useMemo, useCallback, useEffect, useState } from 'react';
 
 import { i18n } from '@kbn/i18n';
 import { EuiFlexGroup, EuiFlexItem, EuiSpacer } from '@elastic/eui';
 
 import { SelectOption } from '../../../../../../vis_default_editor/public';
 
-import { SeriesParam, ValueAxis } from '../../../../types';
+import { SeriesParam, ValueAxis, ChartMode, AxisMode } from '../../../../types';
 import { LineOptions } from './line_options';
 import { SetParamByIndex, ChangeValueAxis } from '.';
 import { ChartType } from '../../../../../common';
@@ -38,6 +38,7 @@ function ChartOptions({
   changeValueAxis,
   setParamByIndex,
 }: ChartOptionsParams) {
+  const [disabledMode, setDisabledMode] = useState<boolean>(false);
   const setChart: SetChart = useCallback(
     (paramName, value) => {
       setParamByIndex('seriesParams', index, paramName, value);
@@ -68,6 +69,20 @@ function ChartOptions({
     [valueAxes]
   );
 
+  useEffect(() => {
+    const valueAxisToMetric = valueAxes.find((valueAxis) => valueAxis.id === chart.valueAxis);
+    if (valueAxisToMetric) {
+      if (valueAxisToMetric.scale.mode === AxisMode.Percentage) {
+        setDisabledMode(true);
+        if (chart.mode !== ChartMode.Stacked) {
+          setChart('mode', ChartMode.Stacked);
+        }
+      } else if (disabledMode) {
+        setDisabledMode(false);
+      }
+    }
+  }, [valueAxes, chart, disabledMode, setChart, setDisabledMode]);
+
   return (
     <>
       <SelectOption
@@ -104,7 +119,7 @@ function ChartOptions({
             })}
             options={collections.chartModes}
             paramName="mode"
-            disabled={chart.disabledMode}
+            disabled={disabledMode}
             value={chart.mode}
             setValue={setChart}
           />
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
index b5573fbc40b25..45b282506e3db 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
@@ -128,15 +128,6 @@ describe('MetricsAxisOptions component', () => {
       const updatedSeries = [{ ...chart, data: { id: agg.id, label: agg.makeLabel() } }];
       expect(setValue).toHaveBeenCalledWith(SERIES_PARAMS, updatedSeries);
     });
-
-    it('should set "stacked" mode for metric if the referenced axis is "percentage"', () => {
-      defaultProps.stateParams.valueAxes[0].scale.mode = AxisMode.Percentage;
-      defaultProps.stateParams.seriesParams[0].mode = ChartMode.Normal;
-      mount(<MetricsAxisOptions {...defaultProps} />);
-
-      const updatedSeries = [{ ...chart, disabledMode: true, mode: ChartMode.Stacked }];
-      expect(setValue).toHaveBeenCalledWith(SERIES_PARAMS, updatedSeries);
-    });
   });
 
   describe('updateAxisTitle', () => {
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
index b653b9b1f03d6..1aee5bfc60041 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
@@ -13,14 +13,7 @@ import { EuiSpacer } from '@elastic/eui';
 
 import { IAggConfig } from '../../../../../../data/public';
 
-import {
-  VisParams,
-  ValueAxis,
-  SeriesParam,
-  CategoryAxis,
-  ChartMode,
-  AxisMode,
-} from '../../../../types';
+import { VisParams, ValueAxis, SeriesParam, CategoryAxis } from '../../../../types';
 import { ValidationVisOptionsProps } from '../../common';
 import { SeriesPanel } from './series_panel';
 import { CategoryAxisPanel } from './category_axis_panel';
@@ -310,18 +303,6 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
         );
       }
 
-      const valueAxisToMetric = stateParams.valueAxes.find(
-        (valueAxis) => valueAxis.id === series.valueAxis
-      );
-      if (valueAxisToMetric) {
-        if (valueAxisToMetric.scale.mode === AxisMode.Percentage) {
-          series.mode = ChartMode.Stacked;
-          series.disabledMode = true;
-        } else if (series.disabledMode) {
-          series.disabledMode = false;
-        }
-      }
-
       return series;
     });
 
diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts
index 1f5ffdee36392..7451f6dea9039 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/mocks.ts
@@ -68,7 +68,6 @@ const seriesParam: SeriesParam = {
   show: true,
   type: ChartType.Histogram,
   mode: ChartMode.Stacked,
-  disabledMode: false,
   data: {
     label: 'Count',
     id: '1',
diff --git a/src/plugins/vis_type_xy/public/types/param.ts b/src/plugins/vis_type_xy/public/types/param.ts
index bd0b557b44b18..69b6daf077a32 100644
--- a/src/plugins/vis_type_xy/public/types/param.ts
+++ b/src/plugins/vis_type_xy/public/types/param.ts
@@ -68,7 +68,6 @@ export interface SeriesParam {
   interpolate?: InterpolationMode;
   lineWidth?: number;
   mode: ChartMode;
-  disabledMode: boolean;
   show: boolean;
   showCircles: boolean;
   type: ChartType;

From 9de3f72d4c0c7fa7a3986780318a5304558d7a14 Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <Uladzislau_Lasitsa@epam.com>
Date: Tue, 6 Apr 2021 15:55:31 +0300
Subject: [PATCH 4/7] Fixed CI

---
 .../editor/components/options/metrics_axes/index.test.tsx      | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
index 45b282506e3db..4996018d21120 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.test.tsx
@@ -14,7 +14,7 @@ import { Position } from '@elastic/charts';
 import { IAggConfig, IAggType } from 'src/plugins/data/public';
 
 import { ChartType } from '../../../../../common';
-import { VisParams, SeriesParam, ValueAxis, AxisMode, ChartMode } from '../../../../types';
+import { VisParams, SeriesParam, ValueAxis } from '../../../../types';
 import MetricsAxisOptions from './index';
 import { ValidationVisOptionsProps } from '../../common';
 import { ValueAxesPanel } from './value_axes_panel';
@@ -146,7 +146,6 @@ describe('MetricsAxisOptions component', () => {
     });
 
     it('should set the custom title to match the value axis label when only one agg exists for that axis', () => {
-      defaultProps.stateParams.valueAxes[0].scale.mode = AxisMode.Normal;
       const component = mount(<MetricsAxisOptions {...defaultProps} />);
       const agg = {
         id: aggCount.id,

From f1684ddd1539cb90e6455c6c05b1b786a45c89d5 Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <vlad.lasitsa@gmail.com>
Date: Thu, 8 Apr 2021 15:33:43 +0300
Subject: [PATCH 5/7] Update utils.ts

---
 .../public/editor/components/options/metrics_axes/utils.ts       | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts
index bc84f6aeb6152..d0d0c08060acf 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/utils.ts
@@ -23,7 +23,6 @@ export const makeSerie = (
   const defaultSerie = {
     show: true,
     mode: ChartMode.Normal,
-    disabledMode: false,
     type: ChartType.Line,
     drawLinesBetweenPoints: true,
     showCircles: true,

From 032825c12fcb728adda6fd3f41228d7cae89ed1a Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <vlad.lasitsa@gmail.com>
Date: Thu, 8 Apr 2021 15:34:49 +0300
Subject: [PATCH 6/7] Update index.tsx

---
 .../editor/components/options/metrics_axes/index.tsx     | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
index 1aee5bfc60041..11b3a98658e64 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
@@ -308,14 +308,7 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
 
     setValue('seriesParams', updatedSeries);
     updateAxisTitle(updatedSeries);
-  }, [
-    metrics,
-    firstValueAxesId,
-    setValue,
-    stateParams.seriesParams,
-    stateParams.valueAxes,
-    updateAxisTitle,
-  ]);
+  }, [metrics, firstValueAxesId, setValue, stateParams.seriesParams, updateAxisTitle]);
 
   return isTabSelected ? (
     <>

From f4ddeb7cafcd532c816a1f3e8981d307ba4005e6 Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <vlad.lasitsa@gmail.com>
Date: Thu, 8 Apr 2021 15:41:11 +0300
Subject: [PATCH 7/7] Update index.tsx

---
 .../editor/components/options/metrics_axes/index.tsx      | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
index 11b3a98658e64..d25845f02e7a7 100644
--- a/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
+++ b/src/plugins/vis_type_xy/public/editor/components/options/metrics_axes/index.tsx
@@ -283,11 +283,10 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
     const updatedSeries = metrics.map((agg) => {
       const params = stateParams.seriesParams.find((param) => param.data.id === agg.id);
       const label = agg.makeLabel();
-      let series: SeriesParam;
 
       // update labels for existing params or create new one
       if (params) {
-        series = {
+        return {
           ...params,
           data: {
             ...params.data,
@@ -295,15 +294,14 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<VisParams>) {
           },
         };
       } else {
-        series = makeSerie(
+        const series = makeSerie(
           agg.id,
           label,
           firstValueAxesId,
           stateParams.seriesParams[stateParams.seriesParams.length - 1]
         );
+        return series;
       }
-
-      return series;
     });
 
     setValue('seriesParams', updatedSeries);