[superset] branch master updated: fix: Database selector overflow (#17369)

[mi...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

michaelsmolina pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/master by this push:
     new ed4a628  fix: Database selector overflow (#17369)
ed4a628 is described below

commit ed4a628861728a6366bc165b291759986c843b76
Author: Michael S. Molina <70...@users.noreply.github.com>
AuthorDate: Mon Nov 8 11:25:16 2021 -0300

    fix: Database selector overflow (#17369)
    
    * fix: Database selector overflow
    
    * Fix TImezoneSelector test
    
    * Removes unused imports
---
 .../src/components/DatabaseSelector/index.tsx            | 16 ++++++++++++++--
 .../TimezoneSelector/TimezoneSelector.test.tsx           |  4 +---
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/superset-frontend/src/components/DatabaseSelector/index.tsx b/superset-frontend/src/components/DatabaseSelector/index.tsx
index 45d91f1..7569f65 100644
--- a/superset-frontend/src/components/DatabaseSelector/index.tsx
+++ b/superset-frontend/src/components/DatabaseSelector/index.tsx
@@ -41,6 +41,7 @@ const DatabaseSelectorWrapper = styled.div`
     }
 
     .select {
+      width: calc(100% - 30px - ${theme.gridUnit}px);
       flex: 1;
     }
 
@@ -55,6 +56,15 @@ const LabelStyle = styled.div`
   flex-direction: row;
   align-items: center;
   margin-left: ${({ theme }) => theme.gridUnit - 2}px;
+
+  .backend {
+    overflow: visible;
+  }
+
+  .name {
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
 `;
 
 type DatabaseValue = {
@@ -97,8 +107,10 @@ const SelectLabel = ({
   databaseName: string;
 }) => (
   <LabelStyle>
-    <Label>{backend}</Label>
-    {databaseName}
+    <Label className="backend">{backend}</Label>
+    <span className="name" title={databaseName}>
+      {databaseName}
+    </span>
   </LabelStyle>
 );
 
diff --git a/superset-frontend/src/components/TimezoneSelector/TimezoneSelector.test.tsx b/superset-frontend/src/components/TimezoneSelector/TimezoneSelector.test.tsx
index faa38b0..7d9d5d7 100644
--- a/superset-frontend/src/components/TimezoneSelector/TimezoneSelector.test.tsx
+++ b/superset-frontend/src/components/TimezoneSelector/TimezoneSelector.test.tsx
@@ -54,9 +54,7 @@ describe('TimezoneSelector', () => {
     });
     expect(select).toBeInTheDocument();
     userEvent.click(select);
-    const selection = await screen.findByTitle(
-      'GMT -06:00 (Mountain Daylight Time)',
-    );
+    const selection = await screen.findByTitle('GMT -06:00 (America/Belize)');
     expect(selection).toBeInTheDocument();
     userEvent.click(selection);
     expect(selection).toBeVisible();