From 9641de157259cddb035e05d5b8c1cf3ebfa9ed5a Mon Sep 17 00:00:00 2001
From: Enzo Martellucci <enzomartellucci@gmail.com>
Date: Tue, 18 Nov 2025 11:23:16 +0100
Subject: [PATCH 1/3] fix(datasets): prevent viewport overflow in dataset
 creation layout

---
 superset-frontend/src/features/datasets/styles.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/src/features/datasets/styles.ts b/superset-frontend/src/features/datasets/styles.ts
index cd66aad0971a..105e6cfc1c6c 100644
--- a/superset-frontend/src/features/datasets/styles.ts
+++ b/superset-frontend/src/features/datasets/styles.ts
@@ -46,7 +46,8 @@ const Row = styled.div`
 `;
 
 export const OuterRow = styled(Row)`
-  flex: 1 0 auto;
+  flex: 1 0 0;
+  min-height: 0;
   position: relative;
 `;
 

From ce17d33100e06ef82dca42ffe61aad8d3e382449 Mon Sep 17 00:00:00 2001
From: Enzo Martellucci <enzomartellucci@gmail.com>
Date: Tue, 18 Nov 2025 11:24:33 +0100
Subject: [PATCH 2/3] style(dataset): increase table icon size

---
 .../features/datasets/AddDataset/DatasetPanel/DatasetPanel.tsx  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/superset-frontend/src/features/datasets/AddDataset/DatasetPanel/DatasetPanel.tsx b/superset-frontend/src/features/datasets/AddDataset/DatasetPanel/DatasetPanel.tsx
index 38de6ebf143a..b54c83548705 100644
--- a/superset-frontend/src/features/datasets/AddDataset/DatasetPanel/DatasetPanel.tsx
+++ b/superset-frontend/src/features/datasets/AddDataset/DatasetPanel/DatasetPanel.tsx
@@ -331,7 +331,7 @@ const DatasetPanel = ({
             }
             title={tableName || ''}
           >
-            <Icons.InsertRowAboveOutlined />
+            <Icons.InsertRowAboveOutlined iconSize="xxl" />
             {tableName}
           </StyledHeader>
         </>

From c43a04ddc2de0ad442964758ec841be501de486e Mon Sep 17 00:00:00 2001
From: Enzo Martellucci <enzomartellucci@gmail.com>
Date: Tue, 18 Nov 2025 11:26:37 +0100
Subject: [PATCH 3/3] test(DatasetLayout): add RTL test to check layout
 maintains viewport constraints with large content

---
 .../DatasetLayout/DatasetLayout.test.tsx      | 69 +++++++++++++++++++
 1 file changed, 69 insertions(+)

diff --git a/superset-frontend/src/features/datasets/DatasetLayout/DatasetLayout.test.tsx b/superset-frontend/src/features/datasets/DatasetLayout/DatasetLayout.test.tsx
index 1b52afdf30d2..15c6268f2c7e 100644
--- a/superset-frontend/src/features/datasets/DatasetLayout/DatasetLayout.test.tsx
+++ b/superset-frontend/src/features/datasets/DatasetLayout/DatasetLayout.test.tsx
@@ -21,6 +21,7 @@ import DatasetLayout from 'src/features/datasets/DatasetLayout';
 import Header from 'src/features/datasets/AddDataset/Header';
 import LeftPanel from 'src/features/datasets/AddDataset/LeftPanel';
 import DatasetPanel from 'src/features/datasets/AddDataset/DatasetPanel';
+import DatasetPanelComponent from 'src/features/datasets/AddDataset/DatasetPanel/DatasetPanel';
 import RightPanel from 'src/features/datasets/AddDataset/RightPanel';
 import Footer from 'src/features/datasets/AddDataset/Footer';
 
@@ -90,4 +91,72 @@ describe('DatasetLayout', () => {
 
     expect(screen.getByText(/Cancel/i)).toBeVisible();
   });
+
+  test('layout has proper flex constraints to prevent viewport overflow', () => {
+    const { container } = render(
+      <DatasetLayout
+        leftPanel={<LeftPanel setDataset={() => null} />}
+        datasetPanel={<DatasetPanel />}
+        footer={<Footer url="" />}
+      />,
+      {
+        useRedux: true,
+        useRouter: true,
+      },
+    );
+
+    // Find the wrapper
+    const layoutWrapper = container.querySelector(
+      '[data-test="dataset-layout-wrapper"]',
+    );
+    expect(layoutWrapper).toBeInTheDocument();
+
+    const outerRow = layoutWrapper?.firstElementChild as HTMLElement;
+    expect(outerRow).toBeInTheDocument();
+
+    if (outerRow) {
+      const styles = window.getComputedStyle(outerRow);
+      // Verify the critical flex properties that prevent viewport overflow
+      expect(styles.flexGrow).toBe('1');
+      expect(styles.minHeight).toBe('0');
+      expect(styles.display).toBe('flex');
+      expect(styles.flexDirection).toBe('row');
+    }
+  });
+
+  test('layout maintains viewport constraints with large content', () => {
+    const manyColumns = Array.from({ length: 100 }, (_, i) => ({
+      name: `column_${i}`,
+      type: 'VARCHAR',
+    }));
+
+    const { container } = render(
+      <DatasetLayout
+        header={<Header setDataset={() => null} />}
+        leftPanel={<LeftPanel setDataset={() => null} />}
+        datasetPanel={
+          <DatasetPanelComponent
+            tableName="large_table"
+            columnList={manyColumns}
+            hasError={false}
+            loading={false}
+          />
+        }
+        footer={<Footer url="" />}
+      />,
+      {
+        useRedux: true,
+        useRouter: true,
+      },
+    );
+
+    const layoutWrapper = container.querySelector(
+      '[data-test="dataset-layout-wrapper"]',
+    );
+    expect(layoutWrapper).toBeInTheDocument();
+
+    // Verify footer is always present in DOM (should be visible)
+    const footer = screen.getByText(/Cancel/i);
+    expect(footer).toBeInTheDocument();
+  });
 });