From 9a6bf880208322f0fb2db99a084f6a4c14babc3d Mon Sep 17 00:00:00 2001
From: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
Date: Thu, 25 Jun 2020 11:14:19 +0200
Subject: [PATCH] Explore/Loki: Fix context menu log line highlighting (#25731)

* Add stopPropragation to context

* Remove redundant stopPropagation from header

* Format comment
---
 .../grafana-ui/src/components/Logs/LogRowContext.tsx  | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/packages/grafana-ui/src/components/Logs/LogRowContext.tsx b/packages/grafana-ui/src/components/Logs/LogRowContext.tsx
index aa08fe7ab49..2ff8ca671fc 100644
--- a/packages/grafana-ui/src/components/Logs/LogRowContext.tsx
+++ b/packages/grafana-ui/src/components/Logs/LogRowContext.tsx
@@ -102,11 +102,6 @@ const LogRowContextGroupHeader: React.FunctionComponent<LogRowContextGroupHeader
   const theme = useContext(ThemeContext);
   const { header } = getLogRowContextStyles(theme);
 
-  const onClickLoadMore = (event: React.SyntheticEvent) => {
-    event.stopPropagation();
-    onLoadMoreContext();
-  };
-
   return (
     <div className={header}>
       <span
@@ -125,7 +120,7 @@ const LogRowContextGroupHeader: React.FunctionComponent<LogRowContextGroupHeader
               cursor: pointer;
             }
           `}
-          onClick={onClickLoadMore}
+          onClick={onLoadMoreContext}
         >
           Load 10 more
         </span>
@@ -217,7 +212,9 @@ export const LogRowContext: React.FunctionComponent<LogRowContextProps> = ({
 
   return (
     <ClickOutsideWrapper onClick={onOutsideClick}>
-      <div>
+      {/* e.stopPropagation is necessary so the log details doesn't open when clicked on log line in context
+       * and/or when context log line is being highlighted */}
+      <div onClick={e => e.stopPropagation()}>
         {context.after && (
           <LogRowContextGroup
             rows={context.after}