[SIP-4] replace SQL Lab ajax calls with SupersetClient (#5896)

* [superset-client] replace sqllab ajax calls with SupersetClient

* [superset-client][sqllab] replace more misc ajax calls

* [superset-client][tests] call setupSupersetClient() in test shim

* [superset-client] replace more sqllab ajax calls and fix tests

* [superset-client][tests] remove commented lines

* [sqllab][superset-client] fix eslint and tests, add better error handling tests.

* [superset-client] fix tests from rebase

* [cypress][sqllab][superset-client] fix

* [superset-client] use Promises not callbacks in getShortUrl calls

* [superset-client][short-url] don't stringify POST

* [superset-client][short-url][cypress] add data-test attribute for more reliable test

* [cypress] remove .only() call

superset/assets/src/SqlLab/components/QuerySearch.jsx

@@ -2,6 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Button } from 'react-bootstrap';
 import Select from 'react-select';
+import { SupersetClient } from '@superset-ui/core';
+
 import Loading from '../../components/Loading';
 import QueryTable from './QueryTable';
 import {
@@ -14,8 +16,6 @@ import { STATUS_OPTIONS, TIME_OPTIONS } from '../constants';
 import AsyncSelect from '../../components/AsyncSelect';
 import { t } from '../../locales';
 
-const $ = require('jquery');
-
 const propTypes = {
   actions: PropTypes.object.isRequired,
   height: PropTypes.string.isRequired,
@@ -49,28 +49,34 @@ class QuerySearch extends React.PureComponent {
     this.onUserClicked = this.onUserClicked.bind(this);
     this.onDbClicked = this.onDbClicked.bind(this);
   }
+
   componentDidMount() {
     this.refreshQueries();
   }
+
   onUserClicked(userId) {
     this.setState({ userId }, () => {
       this.refreshQueries();
     });
   }
+
   onDbClicked(dbId) {
     this.setState({ databaseId: dbId }, () => {
       this.refreshQueries();
     });
   }
+
   onChange(db) {
     const val = db ? db.value : null;
     this.setState({ databaseId: val });
   }
+
   onKeyDown(event) {
     if (event.keyCode === 13) {
       this.refreshQueries();
     }
   }
+
   getTimeFromSelection(selection) {
     switch (selection) {
       case 'now':
@@ -91,37 +97,45 @@ class QuerySearch extends React.PureComponent {
         return null;
     }
   }
+
   changeFrom(user) {
     const val = user ? user.value : null;
     this.setState({ from: val });
   }
+
   changeTo(status) {
     const val = status ? status.value : null;
     this.setState({ to: val });
   }
+
   changeUser(user) {
     const val = user ? user.value : null;
     this.setState({ userId: val });
   }
+
   insertParams(baseUrl, params) {
     const validParams = params.filter(function (p) {
       return p !== '';
     });
     return baseUrl + '?' + validParams.join('&');
   }
+
   changeStatus(status) {
     const val = status ? status.value : null;
     this.setState({ status: val });
   }
+
   changeSearch(event) {
     this.setState({ searchText: event.target.value });
   }
+
   userLabel(user) {
     if (user.first_name && user.last_name) {
       return user.first_name + ' ' + user.last_name;
     }
     return user.username;
   }
+
   userMutator(data) {
     const options = [];
     for (let i = 0; i < data.pks.length; i++) {
@@ -129,6 +143,7 @@ class QuerySearch extends React.PureComponent {
     }
     return options;
   }
+
   dbMutator(data) {
     const options = data.result.map(db => ({ value: db.id, label: db.database_name }));
     this.props.actions.setDatabases(data.result);
@@ -137,6 +152,7 @@ class QuerySearch extends React.PureComponent {
     }
     return options;
   }
+
   refreshQueries() {
     this.setState({ queriesLoading: true });
     const params = [
@@ -148,13 +164,15 @@ class QuerySearch extends React.PureComponent {
       this.state.to ? `to=${this.getTimeFromSelection(this.state.to)}` : '',
     ];
 
-    const url = this.insertParams('/superset/search_queries', params);
-    $.getJSON(url, (data, status) => {
-      if (status === 'success') {
-        this.setState({ queriesArray: data, queriesLoading: false });
-      }
-    });
+    SupersetClient.get({ endpoint: this.insertParams('/superset/search_queries', params) })
+      .then(({ json }) => {
+        this.setState({ queriesArray: json, queriesLoading: false });
+      })
+      .catch(() => {
+        this.props.actions.addDangerToast(t('An error occurred when refreshing queries'));
+      });
   }
+
   render() {
     return (
       <div>