[sql lab] Make sql editor resizable (#3242)

* Update to the version of react-ace with the fixed sizing issues

* Make ace editor resizable

* Use small util method for offset calculation instead of $

* Test ResizableAceEditor

* Make the right pane of the Sql Lab scrollable

* Add default and min height to the ResizableAceEditor

* Implement SplitPane

* Make Splitter fullscreen

* React on resize of the window

* Implement min and max

* Get rid of a magic number + add margin

* Handle resize event with delay + cleanup the code

* Make ResultSet adjustable

* Make QueryHistory adjustable

* Remove ResizableAceEditor

* Make linter happy

* Test SplitPane

* Init sizes properly

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

@@ -36,7 +36,6 @@ export default class ResultSet extends React.PureComponent {
       searchText: '',
       showModal: false,
       data: null,
-      height: props.search ? props.height - RESULT_SET_CONTROLS_HEIGHT : props.height,
     };
   }
   componentDidMount() {
@@ -143,7 +142,8 @@ export default class ResultSet extends React.PureComponent {
     }
   }
   render() {
-    const query = this.props.query;
+    const { query, search, height } = this.props;
+    const tableHeight = search ? height - RESULT_SET_CONTROLS_HEIGHT : height;
     let sql;
 
     if (this.props.showSql) {
@@ -190,7 +190,7 @@ export default class ResultSet extends React.PureComponent {
             <FilterableTable
               data={data}
               orderedColumnKeys={results.columns.map(col => col.name)}
-              height={this.state.height}
+              height={tableHeight}
               filterText={this.state.searchText}
             />
           </div>