EventBus: Add ability to tag events with arbitrary classification meta (#82087)

packages/grafana-data/src/events/types.ts

@@ -19,10 +19,22 @@ export abstract class BusEventBase implements BusEvent {
   readonly payload?: any;
   readonly origin?: EventBus;
 
+  /** @internal */
+  tags?: Set<string>;
+
   constructor() {
     //@ts-ignore
     this.type = this.__proto__.constructor.type;
   }
+
+  /**
+   * @internal
+   * Tag event for finer-grained filtering in subscribers
+   */
+  setTags(tags: string[]) {
+    this.tags = new Set(tags);
+    return this;
+  }
 }
 
 /**

public/app/core/components/GraphNG/GraphNG.tsx

@@ -139,6 +139,11 @@ export class GraphNG extends Component<GraphNGProps, GraphNGState> {
   }
 
   handleCursorUpdate(evt: DataHoverEvent | LegacyGraphHoverEvent) {
+    // ignore uplot-emitted events, since we already use uPlot's sync
+    if (evt.tags?.has('uplot')) {
+      return;
+    }
+
     const time = evt.payload?.point?.time;
     const u = this.plotInstance.current;
     if (u && time) {

public/app/core/components/TimeSeries/utils.ts

@@ -583,7 +583,9 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<{
       data: frame,
     };
 
-    const hoverEvent = new DataHoverEvent(payload);
+    const hoverEvent = new DataHoverEvent(payload).setTags(['uplot']);
+    const clearEvent = new DataHoverClearEvent().setTags(['uplot']);
+
     cursor.sync = {
       key: eventsScope,
       filters: {
@@ -594,9 +596,7 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<{
 
           payload.rowIndex = dataIdx;
           if (x < 0 && y < 0) {
-            payload.point[xScaleUnit] = null;
+            eventBus.publish(clearEvent);
-            payload.point[yScaleKey] = null;
-            eventBus.publish(new DataHoverClearEvent());
           } else {
             // convert the points
             payload.point[xScaleUnit] = src.posToVal(x, xScaleKey);

public/app/core/components/TimelineChart/utils.ts

@@ -180,6 +180,9 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<UPlotConfigOptions> = (
     data: frame,
   };
 
+  const hoverEvent = new DataHoverEvent(payload).setTags(['uplot']);
+  const clearEvent = new DataHoverClearEvent().setTags(['uplot']);
+
   builder.addHook('init', coreConfig.init);
   builder.addHook('drawClear', coreConfig.drawClear);
 
@@ -293,14 +296,12 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<UPlotConfigOptions> = (
           }
           payload.rowIndex = dataIdx;
           if (x < 0 && y < 0) {
-            payload.point[xScaleUnit] = null;
+            eventBus.publish(clearEvent);
-            payload.point[FIXED_UNIT] = null;
-            eventBus.publish(new DataHoverClearEvent());
           } else {
             payload.point[xScaleUnit] = src.posToVal(x, xScaleKey);
             payload.point.panelRelY = y > 0 ? y / h : 1; // used for old graph panel to position tooltip
             payload.down = undefined;
-            eventBus.publish(new DataHoverEvent(payload));
+            eventBus.publish(hoverEvent);
           }
           return true;
         },

public/app/plugins/panel/heatmap/utils.ts

@@ -172,7 +172,9 @@ export function prepConfig(opts: PrepConfigOpts) {
     },
     data: dataRef.current?.heatmap,
   };
-  const hoverEvent = new DataHoverEvent(payload);
+
+  const hoverEvent = new DataHoverEvent(payload).setTags(['uplot']);
+  const clearEvent = new DataHoverClearEvent().setTags(['uplot']);
 
   let pendingOnleave: ReturnType<typeof setTimeout> | 0;
 
@@ -209,9 +211,7 @@ export function prepConfig(opts: PrepConfigOpts) {
         if (!pendingOnleave) {
           pendingOnleave = setTimeout(() => {
             onhover(null);
-            payload.rowIndex = undefined;
+            eventBus.publish(clearEvent);
-            payload.point[xScaleUnit] = null;
-            eventBus.publish(hoverEvent);
           }, 100);
         }
       }