Fixed bug with legend toggle.

elastic · Jan 31, 2022 · 20048bc · 20048bc
1 parent 6f49c2f
commit 20048bc
Showing 1 changed file with 16 additions and 12 deletions.
diff --git a/src/plugins/vis_types/pie/public/editor/components/pie.tsx b/src/plugins/vis_types/pie/public/editor/components/pie.tsx
@@ -105,13 +105,6 @@ const PieOptions = (props: PieOptionsProps) => {
     setLegendVisibility(legendUiStateValue);
   }, [legendUiStateValue]);
 
-  useEffect(() => {
-    const newLegendDisplay = getLegendDisplay(legendVisibility);
-    if (newLegendDisplay !== stateParams.legendDisplay) {
-      setValue('legendDisplay', newLegendDisplay);
-    }
-  }, [getLegendDisplay, legendVisibility, setValue, stateParams.legendDisplay]);
-
   useEffect(() => {
     const fetchPalettes = async () => {
       const palettes = await props.palettes?.getPalettes();
@@ -128,6 +121,21 @@ const PieOptions = (props: PieOptionsProps) => {
     [setValue]
   );
 
+  const handleLegendDisplayChange = useCallback(
+    (name: keyof PartitionVisParams, show: boolean) => {
+      setLegendVisibility(show);
+
+      const legendDisplay = getLegendDisplay(show);
+      if (legendDisplay === stateParams[name]) {
+        setValue(name, getLegendDisplay(!show));
+      }
+      setValue(name, legendDisplay);
+
+      props.uiState?.set('vis.legendOpen', show);
+    },
+    [getLegendDisplay, props.uiState, setValue, stateParams]
+  );
+
   return (
     <>
       <EuiPanel paddingSize="s">
@@ -198,11 +206,7 @@ const PieOptions = (props: PieOptionsProps) => {
               })}
               paramName="legendDisplay"
               value={legendVisibility}
-              setValue={(paramName, show) => {
-                props.uiState?.set('vis.legendOpen', show);
-                setLegendVisibility(show);
-                setValue(paramName, getLegendDisplay(show));
-              }}
+              setValue={handleLegendDisplayChange}
               data-test-subj="visTypePieAddLegendSwitch"
             />
             <SwitchOption