From a8f48499115dbce4291a275348d2dcf9c34ee2da Mon Sep 17 00:00:00 2001
From: Maxime Beauchemin <maximebeauchemin@gmail.com>
Date: Thu, 9 Aug 2018 10:53:25 -0700
Subject: [PATCH] [table editor] disable 'Sync table metadata' button for
 Superset views (#5580)

This was a bit tricky since there's a bug in react-bootstrap that make
it tricky to show a tooltip on a disabled button.
---
 superset/assets/src/components/Button.jsx       | 17 +++++++++++++++--
 .../assets/src/datasource/DatasourceEditor.jsx  |  8 +++++++-
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/superset/assets/src/components/Button.jsx b/superset/assets/src/components/Button.jsx
index 120113de7e..d895a02d20 100644
--- a/superset/assets/src/components/Button.jsx
+++ b/superset/assets/src/components/Button.jsx
@@ -12,6 +12,8 @@ const defaultProps = {
   placement: 'top',
 };
 
+const BUTTON_WRAPPER_STYLE = { display: 'inline-block', cursor: 'not-allowed' };
+
 export default function Button(props) {
   const buttonProps = Object.assign({}, props);
   const tooltip = props.tooltip;
@@ -24,8 +26,19 @@ export default function Button(props) {
       {props.children}
     </BootstrapButton>
   );
-  if (props.tooltip) {
-    button = (
+  if (tooltip) {
+    if (props.disabled) {
+      // Working around the fact that tooltips don't get triggered when buttons are disabled
+      // https://github.com/react-bootstrap/react-bootstrap/issues/1588
+      buttonProps.style = { pointerEvents: 'none' };
+      button = (
+        <div style={BUTTON_WRAPPER_STYLE}>
+          <BootstrapButton {...buttonProps} >
+            {props.children}
+          </BootstrapButton>
+        </div>);
+    }
+    return (
       <OverlayTrigger
         placement={placement}
         overlay={<Tooltip id={`${slugify(tooltip)}-tooltip`}>{tooltip}</Tooltip>}
diff --git a/superset/assets/src/datasource/DatasourceEditor.jsx b/superset/assets/src/datasource/DatasourceEditor.jsx
index 12dfdc0ceb..1bb2082178 100644
--- a/superset/assets/src/datasource/DatasourceEditor.jsx
+++ b/superset/assets/src/datasource/DatasourceEditor.jsx
@@ -526,7 +526,13 @@ export class DatasourceEditor extends React.PureComponent {
                   columns={this.state.databaseColumns}
                   onChange={databaseColumns => this.setColumns({ databaseColumns })}
                 />
-                <Button bsStyle="primary" onClick={this.syncMetadata} className="sync-from-source">
+                <Button
+                  bsStyle="primary"
+                  onClick={this.syncMetadata}
+                  className="sync-from-source"
+                  disabled={!!datasource.sql}
+                  tooltip={datasource.sql ? t('This option is not yet available for views') : null}
+                >
                   {t('Sync columns from source')}
                 </Button>
                 {this.state.metadataLoading && <Loading />}