From 9e41850a352a24446a0c49bacffccf93df2547fb Mon Sep 17 00:00:00 2001
From: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
Date: Thu, 7 Dec 2023 10:31:38 +0100
Subject: [PATCH] [Lens] fixed equality check for visualization (#172685)

## Summary

Fixed an equality check bug for attributesChanged calculation. It wasn't
taking into account that visualization can also have references (to
dataview for annotations) and a custom isEqual function.
---
 .../lens_configuration_flyout.tsx             | 35 ++++++++++++++++---
 1 file changed, 30 insertions(+), 5 deletions(-)

diff --git a/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/lens_configuration_flyout.tsx b/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/lens_configuration_flyout.tsx
index 5e2583506d9055..232bd5442f0ca4 100644
--- a/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/lens_configuration_flyout.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/lens_configuration_flyout.tsx
@@ -73,7 +73,9 @@ export function LensEditConfigurationFlyout({
   const datasourceState = attributes.state.datasourceStates[datasourceId];
   const activeVisualization = visualizationMap[attributes.visualizationType];
   const activeDatasource = datasourceMap[datasourceId];
-  const { datasourceStates, visualization, isLoading } = useLensSelector((state) => state.lens);
+  const { datasourceStates, visualization, isLoading, annotationGroups } = useLensSelector(
+    (state) => state.lens
+  );
   const framePublicAPI = useLensSelector((state) => selectFramePublicAPI(state, datasourceMap));
   const suggestsLimitedColumns = activeDatasource?.suggestsLimitedColumns?.(datasourceState);
 
@@ -113,10 +115,33 @@ export function LensEditConfigurationFlyout({
         : false;
 
     const visualizationState = visualization.state;
-    return (
-      !isEqual(visualizationState, previousAttrs.state.visualization) || !datasourceStatesAreSame
-    );
-  }, [attributes.references, datasourceId, datasourceMap, datasourceStates, visualization.state]);
+    const customIsEqual = visualizationMap[previousAttrs.visualizationType]?.isEqual;
+    const visualizationStateIsEqual = customIsEqual
+      ? (() => {
+          try {
+            return customIsEqual(
+              previousAttrs.state.visualization,
+              previousAttrs.references,
+              visualizationState,
+              attributes.references,
+              annotationGroups
+            );
+          } catch (err) {
+            return false;
+          }
+        })()
+      : isEqual(visualizationState, previousAttrs.state.visualization);
+
+    return !visualizationStateIsEqual || !datasourceStatesAreSame;
+  }, [
+    attributes.references,
+    datasourceId,
+    datasourceMap,
+    datasourceStates,
+    visualizationMap,
+    annotationGroups,
+    visualization.state,
+  ]);
 
   const onCancel = useCallback(() => {
     const previousAttrs = previousAttributes.current;