[superset] branch master updated: fix(explore): Filters Tooltip is not showing the full content (#14618)

[su...@apache.org]

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

suddjian 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 1e60148  fix(explore): Filters Tooltip is not showing the full content (#14618)
1e60148 is described below

commit 1e601483e36d1e7247bdfb712017eb191dfc1f25
Author: Geido <60...@users.noreply.github.com>
AuthorDate: Thu May 13 20:03:22 2021 +0300

    fix(explore): Filters Tooltip is not showing the full content (#14618)
    
    * Add getTooltipTitle
    
    * Fix tests
---
 .../explore/components/controls/FilterControl/AdhocFilter/index.js    | 4 ++++
 .../components/controls/FilterControl/AdhocFilterOption/index.jsx     | 1 +
 .../components/controls/OptionControls/OptionControls.test.tsx        | 1 +
 .../src/explore/components/controls/OptionControls/index.tsx          | 4 +++-
 4 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter/index.js b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter/index.js
index 09fde0a..6928f54 100644
--- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter/index.js
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter/index.js
@@ -142,6 +142,10 @@ export default class AdhocFilter {
     return label.length < 43 ? label : `${label.substring(0, 40)}...`;
   }
 
+  getTooltipTitle() {
+    return this.translateToSql();
+  }
+
   translateToSql() {
     return translateToSql(this);
   }
diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/index.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/index.jsx
index 222979c..faf16bf 100644
--- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/index.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/index.jsx
@@ -63,6 +63,7 @@ const AdhocFilterOption = ({
   >
     <OptionControlLabel
       label={adhocFilter.getDefaultLabel()}
+      tooltipTitle={adhocFilter.getTooltipTitle()}
       onRemove={onRemoveFilter}
       onMoveLabel={onMoveLabel}
       onDropLabel={onDropLabel}
diff --git a/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx b/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx
index 9e3a91b..670f372 100644
--- a/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx
+++ b/superset-frontend/src/explore/components/controls/OptionControls/OptionControls.test.tsx
@@ -36,6 +36,7 @@ import {
 
 const defaultProps = {
   label: <span>Test label</span>,
+  tooltipTitle: 'This is a tooltip title',
   onRemove: jest.fn(),
   onMoveLabel: jest.fn(),
   onDropLabel: jest.fn(),
diff --git a/superset-frontend/src/explore/components/controls/OptionControls/index.tsx b/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
index 362ce06..216d606 100644
--- a/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
+++ b/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
@@ -167,6 +167,7 @@ export const OptionControlLabel = ({
   type,
   index,
   isExtra,
+  tooltipTitle,
   ...props
 }: {
   label: string | React.ReactNode;
@@ -181,6 +182,7 @@ export const OptionControlLabel = ({
   type: string;
   index: number;
   isExtra?: boolean;
+  tooltipTitle: string;
 }) => {
   const theme = useTheme();
   const ref = useRef<HTMLDivElement>(null);
@@ -246,7 +248,7 @@ export const OptionControlLabel = ({
     if (savedMetric?.metric_name) {
       return <StyledMetricOption metric={savedMetric} />;
     }
-    return <Tooltip title={label}>{label}</Tooltip>;
+    return <Tooltip title={tooltipTitle}>{label}</Tooltip>;
   };
 
   const getOptionControlContent = () => (