chore: Displays the dataset description in a tooltip in the datasets …

…list (apache#16392)
opus-42 · Nov 14, 2021 · 05d276d · 05d276d
1 parent bfb85c0
commit 05d276d
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/superset-frontend/src/components/InfoTooltip/index.tsx b/superset-frontend/src/components/InfoTooltip/index.tsx
@@ -52,6 +52,14 @@ const StyledTooltip = styled(Tooltip)`
   }
 `;
 
+const StyledTooltipTitle = styled.span`
+  display: -webkit-box;
+  -webkit-line-clamp: 20;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`;
+
 const defaultOverlayStyle = {
   fontSize: '12px',
   lineHeight: '16px',
@@ -69,7 +77,7 @@ export default function InfoTooltip({
 }: InfoTooltipProps) {
   return (
     <StyledTooltip
-      title={tooltip}
+      title={<StyledTooltipTitle>{tooltip}</StyledTooltipTitle>}
       placement={placement}
       trigger={trigger}
       overlayStyle={overlayStyle}

diff --git a/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx b/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx
@@ -51,6 +51,7 @@ import { Tooltip } from 'src/components/Tooltip';
 import Icons from 'src/components/Icons';
 import FacePile from 'src/components/FacePile';
 import CertifiedIcon from 'src/components/CertifiedIcon';
+import InfoTooltip from 'src/components/InfoTooltip';
 import ImportModelsModal from 'src/components/ImportModal/index';
 import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags';
 import WarningIconWithTooltip from 'src/components/WarningIconWithTooltip';
@@ -228,6 +229,7 @@ const DatasetList: FunctionComponent<DatasetListProps> = ({
             original: {
               extra,
               table_name: datasetTitle,
+              description,
               explore_url: exploreURL,
             },
           },
@@ -249,6 +251,9 @@ const DatasetList: FunctionComponent<DatasetListProps> = ({
                   />
                 )}
                 {titleLink}
+                {description && (
+                  <InfoTooltip tooltip={description} viewBox="0 -1 24 24" />
+                )}
               </FlexRowContainer>
             );
           } catch {