From 4537ee95a6de70539b91b3723a4c106963514d22 Mon Sep 17 00:00:00 2001
From: "grafana-delivery-bot[bot]"
 <132647405+grafana-delivery-bot[bot]@users.noreply.github.com>
Date: Tue, 27 Aug 2024 23:02:16 +0300
Subject: [PATCH] [v11.2.x] Logs Panel: Only send DataHoverClearEvent on
 container mouse leave event (#92534)

Logs Panel: Only send DataHoverClearEvent on container mouse leave event (#92526)

* fix: stop sending clear events between every row, and only when the mouse leaves the container

(cherry picked from commit 867f3f793c2a3b44007f14909d49a212c2029d11)

Co-authored-by: Galen Kistler <109082771+gtk-grafana@users.noreply.github.com>
---
 public/app/features/logs/components/LogRow.tsx |  3 ---
 public/app/plugins/panel/logs/LogsPanel.tsx    | 10 ++++++----
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/public/app/features/logs/components/LogRow.tsx b/public/app/features/logs/components/LogRow.tsx
index 79bbdbe250c..2db64630c27 100644
--- a/public/app/features/logs/components/LogRow.tsx
+++ b/public/app/features/logs/components/LogRow.tsx
@@ -149,9 +149,6 @@ class UnThemedLogRow extends PureComponent<Props, State> {
 
   onMouseLeave = () => {
     this.setState({ mouseIsOver: false });
-    if (this.props.onLogRowHover) {
-      this.props.onLogRowHover(undefined);
-    }
   };
 
   componentDidMount() {
diff --git a/public/app/plugins/panel/logs/LogsPanel.tsx b/public/app/plugins/panel/logs/LogsPanel.tsx
index a03c2719210..a91811634f0 100644
--- a/public/app/plugins/panel/logs/LogsPanel.tsx
+++ b/public/app/plugins/panel/logs/LogsPanel.tsx
@@ -101,9 +101,7 @@ export const LogsPanel = ({
   const { eventBus, onAddAdHocFilter } = usePanelContext();
   const onLogRowHover = useCallback(
     (row?: LogRowModel) => {
-      if (!row) {
-        eventBus.publish(new DataHoverClearEvent());
-      } else {
+      if (row) {
         eventBus.publish(
           new DataHoverEvent({
             point: {
@@ -116,6 +114,10 @@ export const LogsPanel = ({
     [eventBus]
   );
 
+  const onLogContainerMouseLeave = useCallback(() => {
+    eventBus.publish(new DataHoverClearEvent());
+  }, [eventBus]);
+
   const onCloseContext = useCallback(() => {
     setContextRow(null);
     if (closeCallback.current) {
@@ -308,7 +310,7 @@ export const LogsPanel = ({
         scrollTop={scrollTop}
         scrollRefCallback={(scrollElement) => setScrollElement(scrollElement)}
       >
-        <div className={style.container} ref={logsContainerRef}>
+        <div onMouseLeave={onLogContainerMouseLeave} className={style.container} ref={logsContainerRef}>
           {showCommonLabels && !isAscending && renderCommonLabels()}
           <LogRows
             containerRendered={logsContainerRef.current !== null}