From be5df6f59a311d5305c272d8264f8676e043f7b9 Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Fri, 5 May 2023 09:04:29 +0100
Subject: [PATCH] [v10.0.x] InspectDrawer: Fixes issue with double scrollbars
 (#67888)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

InspectDrawer: Fixes issue with double scrollbars (#67884)

* InspectDrawer: Fixes issue with double scrollbars

* Fixed minor issue

(cherry picked from commit fcb14d2548d68dadb981f24dd76489088dd232d7)

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
---
 packages/grafana-ui/src/components/Table/Table.tsx | 9 ++++++++-
 public/app/features/inspector/InspectDataTab.tsx   | 6 +-----
 public/app/features/inspector/styles.ts            | 2 +-
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/grafana-ui/src/components/Table/Table.tsx b/packages/grafana-ui/src/components/Table/Table.tsx
index 2f59657fbd4..11559e32c57 100644
--- a/packages/grafana-ui/src/components/Table/Table.tsx
+++ b/packages/grafana-ui/src/components/Table/Table.tsx
@@ -318,7 +318,14 @@ export const Table = memo((props: Props) => {
   };
 
   return (
-    <div {...getTableProps()} className={tableStyles.table} aria-label={ariaLabel} role="table" ref={tableDivRef}>
+    <div
+      {...getTableProps()}
+      className={tableStyles.table}
+      aria-label={ariaLabel}
+      role="table"
+      ref={tableDivRef}
+      style={{ width, height }}
+    >
       <CustomScrollbar hideVerticalTrack={true}>
         <div className={tableStyles.tableContentWrapper(totalColumnsWidth)}>
           {!noHeader && (
diff --git a/public/app/features/inspector/InspectDataTab.tsx b/public/app/features/inspector/InspectDataTab.tsx
index 88e93c13984..666eff6d56f 100644
--- a/public/app/features/inspector/InspectDataTab.tsx
+++ b/public/app/features/inspector/InspectDataTab.tsx
@@ -285,11 +285,7 @@ export class InspectDataTab extends PureComponent<Props, State> {
                 return null;
               }
 
-              return (
-                <div style={{ width, height }}>
-                  <Table width={width} height={height} data={dataFrame} showTypeIcons={true} />
-                </div>
-              );
+              return <Table width={width} height={height} data={dataFrame} showTypeIcons={true} />;
             }}
           </AutoSizer>
         </div>
diff --git a/public/app/features/inspector/styles.ts b/public/app/features/inspector/styles.ts
index 9e72803d2fa..888793288ba 100644
--- a/public/app/features/inspector/styles.ts
+++ b/public/app/features/inspector/styles.ts
@@ -17,6 +17,7 @@ export const getPanelInspectorStyles2 = (theme: GrafanaTheme2) => {
       height: 100%;
       width: 100%;
       flex: 1 1 0;
+      min-height: 0;
     `,
     toolbar: css`
       display: flex;
@@ -32,7 +33,6 @@ export const getPanelInspectorStyles2 = (theme: GrafanaTheme2) => {
     content: css`
       flex-grow: 1;
       height: 100%;
-      overflow: scroll;
     `,
     editor: css`
       font-family: monospace;