Fixing PropTypes warning messages (#2670)

* Fixing PropTypes warning message

React recently started warning on the upcoming deprecation of
React.PropTypes, the new approach is to use the `prop-types`
npm package instead.

* Fixing the tests

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import AceEditor from 'react-ace';
 import 'brace/mode/sql';
 import 'brace/theme/github';
@@ -25,12 +26,12 @@ const sqlWords = sqlKeywords.map(s => ({
 }));
 
 const propTypes = {
-  actions: React.PropTypes.object.isRequired,
-  onBlur: React.PropTypes.func,
-  onAltEnter: React.PropTypes.func,
-  sql: React.PropTypes.string.isRequired,
-  tables: React.PropTypes.array,
-  queryEditor: React.PropTypes.object.isRequired,
+  actions: PropTypes.object.isRequired,
+  onBlur: PropTypes.func,
+  onAltEnter: PropTypes.func,
+  sql: PropTypes.string.isRequired,
+  tables: PropTypes.array,
+  queryEditor: PropTypes.object.isRequired,
 };
 
 const defaultProps = {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
@@ -79,8 +80,8 @@ class App extends React.PureComponent {
 }
 
 App.propTypes = {
-  alerts: React.PropTypes.array,
-  actions: React.PropTypes.object,
+  alerts: PropTypes.array,
+  actions: PropTypes.object,
 };
 
 function mapStateToProps(state) {

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

@@ -1,9 +1,10 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 
 import { OverlayTrigger, Tooltip } from 'react-bootstrap';
 
 const propTypes = {
-  column: React.PropTypes.object.isRequired,
+  column: PropTypes.object.isRequired,
 };
 
 const iconMap = {

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

@@ -1,9 +1,10 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import CopyToClipboard from '../../components/CopyToClipboard';
 import { storeQuery } from '../../../utils/common';
 
 const propTypes = {
-  queryEditor: React.PropTypes.object.isRequired,
+  queryEditor: PropTypes.object.isRequired,
 };
 
 export default class CopyQueryTabUrl extends React.PureComponent {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import { Modal } from 'react-bootstrap';
@@ -7,10 +8,10 @@ import * as Actions from '../actions';
 import ResultSet from './ResultSet';
 
 const propTypes = {
-  queries: React.PropTypes.object,
-  actions: React.PropTypes.object,
-  showDataPreviewModal: React.PropTypes.bool,
-  dataPreviewQueryId: React.PropTypes.string,
+  queries: PropTypes.object,
+  actions: PropTypes.object,
+  showDataPreviewModal: PropTypes.bool,
+  dataPreviewQueryId: PropTypes.string,
 };
 
 class DataPreviewModal extends React.PureComponent {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 import { github } from 'react-syntax-highlighter/dist/styles';
 import ModalTrigger from '../../components/ModalTrigger';
@@ -10,11 +11,11 @@ const defaultProps = {
 };
 
 const propTypes = {
-  sql: React.PropTypes.string.isRequired,
-  rawSql: React.PropTypes.string,
-  maxWidth: React.PropTypes.number,
-  maxLines: React.PropTypes.number,
-  shrink: React.PropTypes.bool,
+  sql: PropTypes.string.isRequired,
+  rawSql: PropTypes.string,
+  maxWidth: PropTypes.number,
+  maxLines: PropTypes.number,
+  shrink: PropTypes.bool,
 };
 
 class HighlightedSql extends React.Component {

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

@@ -1,14 +1,15 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { OverlayTrigger, Tooltip } from 'react-bootstrap';
 
 const propTypes = {
-  children: React.PropTypes.node,
-  className: React.PropTypes.string,
-  href: React.PropTypes.string,
-  onClick: React.PropTypes.func,
-  placement: React.PropTypes.string,
-  style: React.PropTypes.object,
-  tooltip: React.PropTypes.string,
+  children: PropTypes.node,
+  className: PropTypes.string,
+  href: PropTypes.string,
+  onClick: PropTypes.func,
+  placement: PropTypes.string,
+  style: PropTypes.object,
+  tooltip: PropTypes.string,
 };
 const defaultProps = {
   className: '',

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import * as Actions from '../actions';
@@ -48,9 +49,9 @@ class QueryAutoRefresh extends React.PureComponent {
   }
 }
 QueryAutoRefresh.propTypes = {
-  queries: React.PropTypes.object.isRequired,
-  actions: React.PropTypes.object.isRequired,
-  queriesLastUpdate: React.PropTypes.number.isRequired,
+  queries: PropTypes.object.isRequired,
+  actions: PropTypes.object.isRequired,
+  queriesLastUpdate: PropTypes.number.isRequired,
 };
 
 function mapStateToProps(state) {

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

@@ -1,11 +1,12 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Alert } from 'react-bootstrap';
 
 import QueryTable from './QueryTable';
 
 const propTypes = {
-  queries: React.PropTypes.array.isRequired,
-  actions: React.PropTypes.object.isRequired,
+  queries: PropTypes.array.isRequired,
+  actions: PropTypes.object.isRequired,
 };
 
 const QueryHistory = (props) => {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Button } from 'react-bootstrap';
 import Select from 'react-select';
 import QueryTable from './QueryTable';
@@ -10,8 +11,8 @@ import AsyncSelect from '../../components/AsyncSelect';
 const $ = window.$ = require('jquery');
 
 const propTypes = {
-  actions: React.PropTypes.object.isRequired,
-  height: React.PropTypes.number.isRequired,
+  actions: PropTypes.object.isRequired,
+  height: PropTypes.number.isRequired,
 };
 
 class QuerySearch extends React.PureComponent {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 
 import moment from 'moment';
 import { Table } from 'reactable';
@@ -13,11 +14,11 @@ import { fDuration } from '../../modules/dates';
 import { storeQuery } from '../../../utils/common';
 
 const propTypes = {
-  columns: React.PropTypes.array,
-  actions: React.PropTypes.object,
-  queries: React.PropTypes.array,
-  onUserClicked: React.PropTypes.func,
-  onDbClicked: React.PropTypes.func,
+  columns: PropTypes.array,
+  actions: PropTypes.object,
+  queries: PropTypes.array,
+  onUserClicked: PropTypes.func,
+  onDbClicked: PropTypes.func,
 };
 const defaultProps = {
   columns: ['started', 'duration', 'rows'],

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Alert, Button, ButtonGroup, ProgressBar } from 'react-bootstrap';
 import shortid from 'shortid';
 
@@ -7,14 +8,14 @@ import HighlightedSql from './HighlightedSql';
 import FilterableTable from '../../components/FilterableTable/FilterableTable';
 
 const propTypes = {
-  actions: React.PropTypes.object,
-  csv: React.PropTypes.bool,
-  query: React.PropTypes.object,
-  search: React.PropTypes.bool,
-  showSql: React.PropTypes.bool,
-  visualize: React.PropTypes.bool,
-  cache: React.PropTypes.bool,
-  height: React.PropTypes.number.isRequired,
+  actions: PropTypes.object,
+  csv: PropTypes.bool,
+  query: PropTypes.object,
+  search: PropTypes.bool,
+  showSql: PropTypes.bool,
+  visualize: PropTypes.bool,
+  cache: PropTypes.bool,
+  height: PropTypes.number.isRequired,
 };
 const defaultProps = {
   search: true,

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

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import Button from '../../components/Button';
 
 const propTypes = {

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

@@ -1,15 +1,16 @@
 /* global notify */
 import React from 'react';
+import PropTypes from 'prop-types';
 import { FormControl, FormGroup, Overlay, Popover, Row, Col } from 'react-bootstrap';
 import Button from '../../components/Button';
 
 const propTypes = {
-  defaultLabel: React.PropTypes.string,
-  sql: React.PropTypes.string,
-  schema: React.PropTypes.string,
-  dbId: React.PropTypes.number,
-  animation: React.PropTypes.bool,
-  onSave: React.PropTypes.func,
+  defaultLabel: PropTypes.string,
+  sql: PropTypes.string,
+  schema: PropTypes.string,
+  dbId: PropTypes.number,
+  animation: PropTypes.bool,
+  onSave: PropTypes.func,
 };
 const defaultProps = {
   defaultLabel: 'Undefined',

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import shortid from 'shortid';
 import { Alert, Tab, Tabs } from 'react-bootstrap';
 import { connect } from 'react-redux';
@@ -13,10 +14,10 @@ import ResultSet from './ResultSet';
     dataPrebiewQueries are all queries executed for preview of table data (from SqlEditorLeft)
 */
 const propTypes = {
-  editorQueries: React.PropTypes.array.isRequired,
-  dataPreviewQueries: React.PropTypes.array.isRequired,
-  actions: React.PropTypes.object.isRequired,
-  activeSouthPaneTab: React.PropTypes.string,
+  editorQueries: PropTypes.array.isRequired,
+  dataPreviewQueries: PropTypes.array.isRequired,
+  actions: PropTypes.object.isRequired,
+  activeSouthPaneTab: PropTypes.string,
 };
 
 const defaultProps = {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import {
   Col,
   FormGroup,
@@ -23,15 +24,15 @@ import { STATE_BSSTYLE_MAP } from '../constants';
 import RunQueryActionButton from './RunQueryActionButton';
 
 const propTypes = {
-  actions: React.PropTypes.object.isRequired,
-  height: React.PropTypes.string.isRequired,
-  database: React.PropTypes.object,
-  latestQuery: React.PropTypes.object,
-  tables: React.PropTypes.array.isRequired,
-  editorQueries: React.PropTypes.array.isRequired,
-  dataPreviewQueries: React.PropTypes.array.isRequired,
-  queryEditor: React.PropTypes.object.isRequired,
-  hideLeftBar: React.PropTypes.bool,
+  actions: PropTypes.object.isRequired,
+  height: PropTypes.string.isRequired,
+  database: PropTypes.object,
+  latestQuery: PropTypes.object,
+  tables: PropTypes.array.isRequired,
+  editorQueries: PropTypes.array.isRequired,
+  dataPreviewQueries: PropTypes.array.isRequired,
+  queryEditor: PropTypes.object.isRequired,
+  hideLeftBar: PropTypes.bool,
 };
 
 const defaultProps = {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Button } from 'react-bootstrap';
 import Select from 'react-virtualized-select';
 import createFilterOptions from 'react-select-fast-filter-options';
@@ -9,10 +10,10 @@ import AsyncSelect from '../../components/AsyncSelect';
 const $ = window.$ = require('jquery');
 
 const propTypes = {
-  queryEditor: React.PropTypes.object.isRequired,
-  height: React.PropTypes.number.isRequired,
-  tables: React.PropTypes.array,
-  actions: React.PropTypes.object,
+  queryEditor: PropTypes.object.isRequired,
+  height: PropTypes.number.isRequired,
+  tables: PropTypes.array,
+  actions: PropTypes.object,
 };
 
 const defaultProps = {

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { DropdownButton, MenuItem, Tab, Tabs } from 'react-bootstrap';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
@@ -10,14 +11,14 @@ import CopyQueryTabUrl from './CopyQueryTabUrl';
 import { areArraysShallowEqual } from '../../reduxUtils';
 
 const propTypes = {
-  actions: React.PropTypes.object.isRequired,
-  defaultDbId: React.PropTypes.number,
-  databases: React.PropTypes.object.isRequired,
-  queries: React.PropTypes.object.isRequired,
-  queryEditors: React.PropTypes.array,
-  tabHistory: React.PropTypes.array.isRequired,
-  tables: React.PropTypes.array.isRequired,
-  editorHeight: React.PropTypes.string.isRequired,
+  actions: PropTypes.object.isRequired,
+  defaultDbId: PropTypes.number,
+  databases: PropTypes.object.isRequired,
+  queries: PropTypes.object.isRequired,
+  queryEditors: PropTypes.array,
+  tabHistory: PropTypes.array.isRequired,
+  tables: PropTypes.array.isRequired,
+  editorHeight: PropTypes.string.isRequired,
 };
 const defaultProps = {
   queryEditors: [],

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 
 import { ButtonGroup, Collapse, Well } from 'react-bootstrap';
 import shortid from 'shortid';
@@ -9,9 +10,9 @@ import ColumnElement from './ColumnElement';
 import ModalTrigger from '../../components/ModalTrigger';
 
 const propTypes = {
-  table: React.PropTypes.object,
-  actions: React.PropTypes.object,
-  timeout: React.PropTypes.number,  // used for tests
+  table: PropTypes.object,
+  actions: PropTypes.object,
+  timeout: PropTypes.number,  // used for tests
 };
 
 const defaultProps = {

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

@@ -1,5 +1,6 @@
 /* global notify */
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Alert, Button, Col, Modal } from 'react-bootstrap';
 
 import Select from 'react-select';
@@ -16,9 +17,9 @@ const CHART_TYPES = [
 ];
 
 const propTypes = {
-  onHide: React.PropTypes.func,
-  query: React.PropTypes.object,
-  show: React.PropTypes.bool,
+  onHide: PropTypes.func,
+  query: PropTypes.object,
+  show: PropTypes.bool,
 };
 const defaultProps = {
   show: false,