[sql_lab]Disabled run query button if sql query editor is empty (#4728)

* Disabled run query button if sql query editor is empty

* Removing unnecessary white space

* Fix failing test for sql props

* Adding sql variable into propTypes and defaultProps

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

@@ -10,9 +10,11 @@ const propTypes = {
   runQuery: PropTypes.func.isRequired,
   selectedText: PropTypes.string,
   stopQuery: PropTypes.func.isRequired,
+  sql: PropTypes.string.isRequired,
 };
 const defaultProps = {
   allowAsync: false,
+  sql: '',
 };
 
 export default function RunQueryActionButton(props) {
@@ -32,6 +34,7 @@ export default function RunQueryActionButton(props) {
       onClick={() => props.runQuery(false)}
       key="run-btn"
       tooltip={t('Run query synchronously')}
+      disabled={!props.sql.trim()}
     >
       <i className="fa fa-refresh" /> {runBtnText}
     </Button>
@@ -43,6 +46,7 @@ export default function RunQueryActionButton(props) {
       onClick={() => props.runQuery(true)}
       key="run-async-btn"
       tooltip={t('Run query asynchronously')}
+      disabled={!props.sql.trim()}
     >
       <i className="fa fa-table" /> {runBtnText}
     </Button>

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

@@ -215,6 +215,7 @@ class SqlEditor extends React.PureComponent {
                 runQuery={this.runQuery}
                 selectedText={qe.selectedText}
                 stopQuery={this.stopQuery}
+                sql={this.state.sql}
               />
             </span>
             <span className="m-r-5">

superset/assets/spec/javascripts/explore/components/RunQueryActionButton_spec.jsx

@@ -16,6 +16,7 @@ describe('RunQueryActionButton', () => {
     runQuery: () => {}, // eslint-disable-line
     selectedText: null,
     stopQuery: () => {}, // eslint-disable-line
+    sql: '',
   };
 
   beforeEach(() => {