[sqllab] async queries - better error handling (#1853)

superset/assets/javascripts/SqlLab/components/HighlightedSql.jsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { Well } from 'react-bootstrap';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 import { github } from 'react-syntax-highlighter/dist/styles';
 import ModalTrigger from '../../components/ModalTrigger';
@@ -45,11 +44,9 @@ class HighlightedSql extends React.Component {
     const props = this.props;
     let shownSql = props.shrink ? this.shrinkSql(props.sql) : props.sql;
     return (
-      <Well>
-        <SyntaxHighlighter language="sql" style={github}>
-          {shownSql}
-        </SyntaxHighlighter>
-      </Well>);
+      <SyntaxHighlighter language="sql" style={github}>
+        {shownSql}
+      </SyntaxHighlighter>);
   }
   generateModal() {
     const props = this.props;

superset/assets/javascripts/SqlLab/components/QueryTable.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 
 import moment from 'moment';
 import { Table } from 'reactable';
-import { Label, ProgressBar } from 'react-bootstrap';
+import { Label, ProgressBar, Well } from 'react-bootstrap';
 import Link from './Link';
 import VisualizeModal from './VisualizeModal';
 import ResultSet from './ResultSet';
@@ -107,7 +107,9 @@ class QueryTable extends React.PureComponent {
         </div>
       );
       q.sql = (
-        <HighlightedSql sql={q.sql} rawSql={q.executedSql} shrink maxWidth={60} />
+        <Well>
+          <HighlightedSql sql={q.sql} rawSql={q.executedSql} shrink maxWidth={60} />
+        </Well>
       );
       if (q.resultsKey) {
         q.output = (

superset/assets/javascripts/SqlLab/components/ResultSet.jsx

@@ -220,7 +220,7 @@ class ResultSet extends React.PureComponent {
         </Button>
       );
     }
-    return (<Alert bsStyle="warning">The query returned no data</Alert>);
+    return <Alert bsStyle="warning">The query returned no data</Alert>;
   }
 }
 ResultSet.propTypes = propTypes;