From f19f2c3ac884b270e7d9bf8629ed933b0fa98a7c Mon Sep 17 00:00:00 2001
From: AAfghahi <48933336+AAfghahi@users.noreply.github.com>
Date: Mon, 5 Apr 2021 18:54:28 -0400
Subject: [PATCH] fix: Floating Menu in SQL Left Bar (#13858)

* floating table git issue

* made changes

* floating table git issue

* made changes

* long table names

* floating table git issue

* made changes

* floating table git issue

* made changes

* long table names

* floating table git issue

* made changes

* floating table git issue

* made changes

* long table names

* table values

* aligned

* active key

* changed to customStyle

* update dropdown styles

Co-authored-by: Elizabeth Thompson <eschutho@gmail.com>
---
 .../javascripts/datasource/DatasourceEditor_spec.jsx  |  2 +-
 superset-frontend/src/SqlLab/main.less                |  1 +
 superset-frontend/src/datasource/DatasourceEditor.jsx | 11 +++++++++--
 superset-frontend/src/datasource/DatasourceModal.tsx  |  4 ++++
 4 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/superset-frontend/spec/javascripts/datasource/DatasourceEditor_spec.jsx b/superset-frontend/spec/javascripts/datasource/DatasourceEditor_spec.jsx
index e006aaa8d..8c6a06141 100644
--- a/superset-frontend/spec/javascripts/datasource/DatasourceEditor_spec.jsx
+++ b/superset-frontend/spec/javascripts/datasource/DatasourceEditor_spec.jsx
@@ -61,7 +61,7 @@ describe('DatasourceEditor', () => {
   });
 
   it('renders Tabs', () => {
-    expect(wrapper.find(Tabs)).toExist();
+    expect(wrapper.find('#table-tabs')).toExist();
   });
 
   it('makes an async request', () =>
diff --git a/superset-frontend/src/SqlLab/main.less b/superset-frontend/src/SqlLab/main.less
index 6600ff6dc..0b79b86c2 100644
--- a/superset-frontend/src/SqlLab/main.less
+++ b/superset-frontend/src/SqlLab/main.less
@@ -300,6 +300,7 @@ div.Workspace {
   .schemaPane-enter-done,
   .schemaPane-exit {
     transform: translateX(0);
+    z-index: 1020;
   }
 
   .schemaPane-exit-active {
diff --git a/superset-frontend/src/datasource/DatasourceEditor.jsx b/superset-frontend/src/datasource/DatasourceEditor.jsx
index 67512f70b..e056d9c7c 100644
--- a/superset-frontend/src/datasource/DatasourceEditor.jsx
+++ b/superset-frontend/src/datasource/DatasourceEditor.jsx
@@ -79,6 +79,13 @@ const FlexRowContainer = styled.div`
   }
 `;
 
+const StyledTableTabs = styled(Tabs)`
+  overflow: visible;
+  .ant-tabs-content-holder {
+    overflow: visible;
+  }
+`;
+
 const EditLockContainer = styled.div`
   font-size: ${supersetTheme.typography.sizes.s}px;
   display: flex;
@@ -995,7 +1002,7 @@ class DatasourceEditor extends React.PureComponent {
             </>
           }
         />
-        <Tabs
+        <StyledTableTabs
           fullWidth={false}
           id="table-tabs"
           data-test="edit-dataset-tabs"
@@ -1086,7 +1093,7 @@ class DatasourceEditor extends React.PureComponent {
               </Col>
             </div>
           </Tabs.TabPane>
-        </Tabs>
+        </StyledTableTabs>
       </DatasourceContainer>
     );
   }
diff --git a/superset-frontend/src/datasource/DatasourceModal.tsx b/superset-frontend/src/datasource/DatasourceModal.tsx
index 1174e7913..5fcff68e7 100644
--- a/superset-frontend/src/datasource/DatasourceModal.tsx
+++ b/superset-frontend/src/datasource/DatasourceModal.tsx
@@ -49,6 +49,10 @@ const StyledDatasourceModal = styled(Modal)`
   .modal-footer {
     flex: 0 1 auto;
   }
+
+  .ant-modal-body {
+    overflow: visible;
+  }
 `;
 
 interface DatasourceModalProps {