From 226c76dc93f1e403463bc461268581cdafddc213 Mon Sep 17 00:00:00 2001
From: Leon Sorokin <leeoniya@gmail.com>
Date: Mon, 29 Jan 2024 15:34:43 -0600
Subject: [PATCH] TimeSeries: Simplify hover proximity code (#81518)

---
 package.json                                  |  2 +-
 packages/grafana-data/package.json            |  2 +-
 packages/grafana-ui/package.json              |  2 +-
 .../GraphNG/__snapshots__/utils.test.ts.snap  |  7 ++-
 .../app/core/components/TimeSeries/utils.ts   | 51 +++----------------
 yarn.lock                                     | 14 ++---
 6 files changed, 24 insertions(+), 54 deletions(-)

diff --git a/package.json b/package.json
index 606834bb414..e93968e3b86 100644
--- a/package.json
+++ b/package.json
@@ -397,7 +397,7 @@
     "tinycolor2": "1.6.0",
     "tslib": "2.6.2",
     "tween-functions": "^1.2.0",
-    "uplot": "1.6.29",
+    "uplot": "1.6.30",
     "uuid": "9.0.1",
     "visjs-network": "4.25.0",
     "webpack-assets-manifest": "^5.1.0",
diff --git a/packages/grafana-data/package.json b/packages/grafana-data/package.json
index fc33192de82..c799602065d 100644
--- a/packages/grafana-data/package.json
+++ b/packages/grafana-data/package.json
@@ -58,7 +58,7 @@
     "string-hash": "^1.1.3",
     "tinycolor2": "1.6.0",
     "tslib": "2.6.2",
-    "uplot": "1.6.29",
+    "uplot": "1.6.30",
     "xss": "^1.0.14"
   },
   "devDependencies": {
diff --git a/packages/grafana-ui/package.json b/packages/grafana-ui/package.json
index d616d3b931d..4234d22dbb5 100644
--- a/packages/grafana-ui/package.json
+++ b/packages/grafana-ui/package.json
@@ -106,7 +106,7 @@
     "slate-react": "0.22.10",
     "tinycolor2": "1.6.0",
     "tslib": "2.6.2",
-    "uplot": "1.6.29",
+    "uplot": "1.6.30",
     "uuid": "9.0.1"
   },
   "devDependencies": {
diff --git a/public/app/core/components/GraphNG/__snapshots__/utils.test.ts.snap b/public/app/core/components/GraphNG/__snapshots__/utils.test.ts.snap
index 5e836cca3ac..53a5ef32322 100644
--- a/public/app/core/components/GraphNG/__snapshots__/utils.test.ts.snap
+++ b/public/app/core/components/GraphNG/__snapshots__/utils.test.ts.snap
@@ -61,13 +61,18 @@ exports[`GraphNG utils preparePlotConfigBuilder 1`] = `
     },
   ],
   "cursor": {
-    "dataIdx": [Function],
     "drag": {
       "setScale": false,
     },
     "focus": {
       "prox": 30,
     },
+    "hover": {
+      "prox": [Function],
+      "skip": [
+        null,
+      ],
+    },
     "points": {
       "fill": [Function],
       "size": [Function],
diff --git a/public/app/core/components/TimeSeries/utils.ts b/public/app/core/components/TimeSeries/utils.ts
index 26fd636b457..ff0f1f42170 100644
--- a/public/app/core/components/TimeSeries/utils.ts
+++ b/public/app/core/components/TimeSeries/utils.ts
@@ -561,51 +561,16 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<{
   const hoverProximityPx = 15;
 
   let cursor: Partial<uPlot.Cursor> = {
-    // this scans left and right from cursor position to find nearest data index with value != null
-    // TODO: do we want to only scan past undefined values, but halt at explicit null values?
-    dataIdx: (self, seriesIdx, hoveredIdx, cursorXVal) => {
-      let seriesData = self.data[seriesIdx];
-
-      if (seriesData[hoveredIdx] == null) {
-        let nonNullLft = null,
-          nonNullRgt = null,
-          i;
-
-        i = hoveredIdx;
-        while (nonNullLft == null && i-- > 0) {
-          if (seriesData[i] != null) {
-            nonNullLft = i;
-          }
+    hover: {
+      prox: (self, seriesIdx, hoveredIdx) => {
+        const yVal = self.data[seriesIdx][hoveredIdx];
+        if (yVal === null) {
+          return hoverProximityPx;
         }
 
-        i = hoveredIdx;
-        while (nonNullRgt == null && i++ < seriesData.length) {
-          if (seriesData[i] != null) {
-            nonNullRgt = i;
-          }
-        }
-
-        let xVals = self.data[0];
-
-        let curPos = self.valToPos(cursorXVal, 'x');
-        let rgtPos = nonNullRgt == null ? Infinity : self.valToPos(xVals[nonNullRgt], 'x');
-        let lftPos = nonNullLft == null ? -Infinity : self.valToPos(xVals[nonNullLft], 'x');
-
-        let lftDelta = curPos - lftPos;
-        let rgtDelta = rgtPos - curPos;
-
-        if (lftDelta <= rgtDelta) {
-          if (lftDelta <= hoverProximityPx) {
-            hoveredIdx = nonNullLft!;
-          }
-        } else {
-          if (rgtDelta <= hoverProximityPx) {
-            hoveredIdx = nonNullRgt!;
-          }
-        }
-      }
-
-      return hoveredIdx;
+        return null;
+      },
+      skip: [null],
     },
   };
 
diff --git a/yarn.lock b/yarn.lock
index 3e4c71ba1d7..88243ffac16 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3276,7 +3276,7 @@ __metadata:
     tinycolor2: "npm:1.6.0"
     tslib: "npm:2.6.2"
     typescript: "npm:5.3.3"
-    uplot: "npm:1.6.29"
+    uplot: "npm:1.6.30"
     xss: "npm:^1.0.14"
   peerDependencies:
     react: ^17.0.0 || ^18.0.0
@@ -3864,7 +3864,7 @@ __metadata:
     tinycolor2: "npm:1.6.0"
     tslib: "npm:2.6.2"
     typescript: "npm:5.3.3"
-    uplot: "npm:1.6.29"
+    uplot: "npm:1.6.30"
     uuid: "npm:9.0.1"
     webpack: "npm:5.90.0"
   peerDependencies:
@@ -17680,7 +17680,7 @@ __metadata:
     tslib: "npm:2.6.2"
     tween-functions: "npm:^1.2.0"
     typescript: "npm:5.3.3"
-    uplot: "npm:1.6.29"
+    uplot: "npm:1.6.30"
     uuid: "npm:9.0.1"
     visjs-network: "npm:4.25.0"
     webpack: "npm:5.90.0"
@@ -29633,10 +29633,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"uplot@npm:1.6.29":
-  version: 1.6.29
-  resolution: "uplot@npm:1.6.29"
-  checksum: 0cda54a89cbe7f1ff5eb4a3e75bafa145a6af79e534cef6e8e4a1ace042b18a63ea56b25407d87fc7f073711ebb947a59de8068aa3576bc86b2514f1d058c187
+"uplot@npm:1.6.30":
+  version: 1.6.30
+  resolution: "uplot@npm:1.6.30"
+  checksum: 08ad2f9441b8cfa26d9219362cdbb6f2dc6e5ec9403382df71798ed3e9d3666e7712c8a245e652ebb4a25c5d911cbdc614b52dfd891c0f7ce8705320d2eff81f
   languageName: node
   linkType: hard