From 7b016687292b33ea6f9ce5ec29d134760e270b75 Mon Sep 17 00:00:00 2001
From: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
Date: Tue, 7 Mar 2023 11:08:50 +0100
Subject: [PATCH] Logs sample: Fix scrolling for unwrapped log lines (#64163)

Fix scrolling for logs sample
---
 .../app/features/explore/LogsSamplePanel.tsx  | 25 +++++++++++--------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/public/app/features/explore/LogsSamplePanel.tsx b/public/app/features/explore/LogsSamplePanel.tsx
index 78f6e53cf38..61772745311 100644
--- a/public/app/features/explore/LogsSamplePanel.tsx
+++ b/public/app/features/explore/LogsSamplePanel.tsx
@@ -95,16 +95,18 @@ export function LogsSamplePanel(props: Props) {
     LogsSamplePanelContent = (
       <>
         <OpenInSplitViewButton />
-        <LogRows
-          logRows={logs.rows}
-          dedupStrategy={LogsDedupStrategy.none}
-          showLabels={store.getBool(SETTINGS_KEYS.showLabels, false)}
-          showTime={store.getBool(SETTINGS_KEYS.showTime, true)}
-          wrapLogMessage={store.getBool(SETTINGS_KEYS.wrapLogMessage, true)}
-          prettifyLogMessage={store.getBool(SETTINGS_KEYS.prettifyLogMessage, false)}
-          timeZone={timeZone}
-          enableLogDetails={true}
-        />
+        <div className={styles.logContainer}>
+          <LogRows
+            logRows={logs.rows}
+            dedupStrategy={LogsDedupStrategy.none}
+            showLabels={store.getBool(SETTINGS_KEYS.showLabels, false)}
+            showTime={store.getBool(SETTINGS_KEYS.showTime, true)}
+            wrapLogMessage={store.getBool(SETTINGS_KEYS.wrapLogMessage, true)}
+            prettifyLogMessage={store.getBool(SETTINGS_KEYS.prettifyLogMessage, false)}
+            timeZone={timeZone}
+            enableLogDetails={true}
+          />
+        </div>
       </>
     );
   }
@@ -122,4 +124,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
     top: ${theme.spacing(1)};
     right: ${theme.spacing(1)}; ;
   `,
+  logContainer: css`
+    overflow-x: scroll;
+  `,
 });