From 22f20fefcfd67d4861422ec1a7e9f9055071b81e Mon Sep 17 00:00:00 2001
From: Adam Tackett <tackadam@amazon.com>
Date: Mon, 2 Dec 2024 15:58:47 -0800
Subject: [PATCH] add back table height for tree, cap left margin

Signed-off-by: Adam Tackett <tackadam@amazon.com>
---
 .../__snapshots__/span_detail_table.test.tsx.snap         | 8 ++++----
 .../components/traces/span_detail_panel.tsx               | 3 ++-
 .../components/traces/span_detail_table.tsx               | 2 +-
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap b/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap
index 6b552e1e2..7f2ca0604 100644
--- a/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap
+++ b/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap
@@ -447,7 +447,7 @@ exports[`SpanDetailTableHierarchy renders the component with data 1`] = `
   >
     <div
       class="euiDataGrid euiDataGrid--bordersAll euiDataGrid--headerShade euiDataGrid--footerOverline euiDataGrid--rowHoverHighlight euiDataGrid--stickyFooter"
-      style="height: auto; overflow-y: auto;"
+      style="height: 500px; overflow-y: auto;"
     />
   </div>
   <div
@@ -596,7 +596,7 @@ exports[`SpanDetailTableHierarchy renders the empty component 1`] = `
       rowCount={0}
       style={
         Object {
-          "height": "auto",
+          "height": "500px",
           "overflowY": "auto",
         }
       }
@@ -736,7 +736,7 @@ exports[`SpanDetailTableHierarchy renders the empty component 1`] = `
                     onKeyDown={[Function]}
                     style={
                       Object {
-                        "height": "auto",
+                        "height": "500px",
                         "overflowY": "auto",
                       }
                     }
@@ -856,7 +856,7 @@ exports[`SpanDetailTableHierarchy renders the jaeger component with data 1`] = `
   >
     <div
       class="euiDataGrid euiDataGrid--bordersAll euiDataGrid--headerShade euiDataGrid--footerOverline euiDataGrid--rowHoverHighlight euiDataGrid--stickyFooter"
-      style="height: auto; overflow-y: auto;"
+      style="height: 500px; overflow-y: auto;"
     />
   </div>
   <div
diff --git a/public/components/trace_analytics/components/traces/span_detail_panel.tsx b/public/components/trace_analytics/components/traces/span_detail_panel.tsx
index e0c8677e3..d96e8f298 100644
--- a/public/components/trace_analytics/components/traces/span_detail_panel.tsx
+++ b/public/components/trace_analytics/components/traces/span_detail_panel.tsx
@@ -212,7 +212,8 @@ export function SpanDetailPanel(props: {
     const maxLabelLength = Math.max(...yTexts.map((text) => text.length));
 
     // Dynamically set left margin based on the longest label
-    const dynamicLeftMargin = Math.max(150, maxLabelLength * 5);
+    let dynamicLeftMargin = Math.max(150, maxLabelLength * 5);
+    dynamicLeftMargin = Math.min(dynamicLeftMargin, 500);
 
     return {
       plot_bgcolor: 'rgba(0, 0, 0, 0)',
diff --git a/public/components/trace_analytics/components/traces/span_detail_table.tsx b/public/components/trace_analytics/components/traces/span_detail_table.tsx
index 16efeb017..cf8fee70f 100644
--- a/public/components/trace_analytics/components/traces/span_detail_table.tsx
+++ b/public/components/trace_analytics/components/traces/span_detail_table.tsx
@@ -488,7 +488,7 @@ export function SpanDetailTableHierarchy(props: SpanDetailTableProps) {
             showFullScreenSelector: false,
             additionalControls: toolbarButtons,
           }}
-          style={{ height: fullScreenMode ? '100%' : 'auto', overflowY: 'auto' }}
+          style={{ height: fullScreenMode ? '100%' : '500px', overflowY: 'auto' }}
         />
       </FullScreenWrapper>
       {!fullScreenMode && total === 0 && <NoMatchMessage size="xl" />}