Get query button working in explorev2 (#1581)

* Get query buttonw working in explorev2

 - Create new endpoint for updating explore viz
 - Send over new form_data when query button is pressed

* Added endpoint test

* Changes based on comments

* Added docstring for endpoint, and query spec

* Remove white space around docstring

superset/assets/javascripts/explorev2/components/ExploreViewContainer.jsx

@@ -1,9 +1,24 @@
+/* eslint camelcase: 0 */
 import React from 'react';
+import { bindActionCreators } from 'redux';
+import * as actions from '../actions/exploreActions';
+import { connect } from 'react-redux';
 import ChartContainer from './ChartContainer';
 import ControlPanelsContainer from './ControlPanelsContainer';
 import QueryAndSaveBtns from '../../explore/components/QueryAndSaveBtns';
+const $ = require('jquery');
 
-export default class ExploreViewContainer extends React.Component {
+const propTypes = {
+  form_data: React.PropTypes.object.isRequired,
+  actions: React.PropTypes.object.isRequired,
+  slice_id: React.PropTypes.string.isRequired,
+  slice_name: React.PropTypes.string.isRequired,
+  datasource_id: React.PropTypes.number.isRequired,
+  datasource_type: React.PropTypes.string.isRequired,
+};
+
+
+class ExploreViewContainer extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -11,11 +26,43 @@ export default class ExploreViewContainer extends React.Component {
     };
   }
 
+  onQuery() {
+    const data = {};
+    const form_data = this.props.form_data;
+    Object.keys(form_data).forEach((field) => {
+      // filter out null fields
+      if (form_data[field] !== null) {
+        data[field] = form_data[field];
+      }
+    });
+    // V2 tag temporarily for updating url
+    // Todo: remove after launch
+    data.V2 = true;
+    data.datasource_id = this.props.datasource_id;
+    data.datasource_type = this.props.datasource_type;
+    this.queryFormData(data);
+
+    const params = $.param(data, true);
+    this.updateUrl(params);
+  }
+
   getHeight() {
     const navHeight = 90;
     return `${window.innerHeight - navHeight}px`;
   }
 
+  updateUrl(params) {
+    const baseUrl =
+      `/superset/explore/${this.props.datasource_type}/${this.props.datasource_id}/`;
+    const newEndpoint = `${baseUrl}?${params}`;
+    history.pushState({}, document.title, newEndpoint);
+  }
+
+  queryFormData(data) {
+    this.props.actions.updateExplore(
+      this.props.datasource_type, this.props.datasource_id, data);
+  }
+
   render() {
     return (
       <div
@@ -29,10 +76,13 @@ export default class ExploreViewContainer extends React.Component {
           <div className="col-sm-4">
             <QueryAndSaveBtns
               canAdd="True"
-              onQuery={() => {}}
+              onQuery={this.onQuery.bind(this)}
             />
             <br /><br />
-            <ControlPanelsContainer />
+            <ControlPanelsContainer
+              actions={this.props.actions}
+              form_data={this.props.form_data}
+            />
           </div>
           <div className="col-sm-8">
             <ChartContainer
@@ -44,3 +94,25 @@ export default class ExploreViewContainer extends React.Component {
     );
   }
 }
+
+ExploreViewContainer.propTypes = propTypes;
+
+function mapStateToProps(state) {
+  return {
+    datasource_id: state.datasource_id,
+    datasource_type: state.datasource_type,
+    form_data: state.viz.form_data,
+    slice_id: state.viz.form_data.slice_id,
+    slice_name: state.viz.form_data.slice_name,
+  };
+}
+
+function mapDispatchToProps(dispatch) {
+  return {
+    actions: bindActionCreators(actions, dispatch),
+  };
+}
+
+export { ControlPanelsContainer };
+
+export default connect(mapStateToProps, mapDispatchToProps)(ExploreViewContainer);