diff --git a/caravel/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx b/caravel/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx
index b011631406a11..4b5cc0c7dd9f6 100644
--- a/caravel/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx
+++ b/caravel/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx
@@ -3,11 +3,7 @@ import CopyToClipboard from '../../components/CopyToClipboard';
import { getShortUrl } from '../../../utils/common';
const propTypes = {
- queryEditor: React.PropTypes.object,
-};
-
-const defaultProps = {
- queryEditor: null,
+ queryEditor: React.PropTypes.object.isRequired,
};
export default class CopyQueryTabUrl extends React.PureComponent {
@@ -19,8 +15,8 @@ export default class CopyQueryTabUrl extends React.PureComponent {
}
componentWillMount() {
- const params = [];
const qe = this.props.queryEditor;
+ const params = [];
if (qe.dbId) params.push('dbid=' + qe.dbId);
if (qe.title) params.push('title=' + encodeURIComponent(qe.title));
if (qe.schema) params.push('schema=' + encodeURIComponent(qe.schema));
@@ -52,4 +48,3 @@ export default class CopyQueryTabUrl extends React.PureComponent {
}
CopyQueryTabUrl.propTypes = propTypes;
-CopyQueryTabUrl.defaultProps = defaultProps;
diff --git a/caravel/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx b/caravel/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx
index 43d126b119237..0a722cb22c390 100644
--- a/caravel/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx
+++ b/caravel/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx
@@ -122,9 +122,11 @@ class TabbedSqlEditors extends React.PureComponent {
-
+ {qe &&
+
+ }
);
diff --git a/caravel/assets/javascripts/SqlLab/components/TableElement.jsx b/caravel/assets/javascripts/SqlLab/components/TableElement.jsx
index a4b0c2a20139d..3bad4b72b8d13 100644
--- a/caravel/assets/javascripts/SqlLab/components/TableElement.jsx
+++ b/caravel/assets/javascripts/SqlLab/components/TableElement.jsx
@@ -1,6 +1,6 @@
import React from 'react';
-import { ButtonGroup, Well } from 'react-bootstrap';
+import { ButtonGroup, Collapse, Well } from 'react-bootstrap';
import shortid from 'shortid';
import CopyToClipboard from '../../components/CopyToClipboard';
@@ -10,11 +10,13 @@ import ModalTrigger from '../../components/ModalTrigger';
const propTypes = {
table: React.PropTypes.object,
actions: React.PropTypes.object,
+ timeout: React.PropTypes.integer, // used for tests
};
const defaultProps = {
- table: null,
actions: {},
+ table: null,
+ timeout: 500,
};
class TableElement extends React.PureComponent {
@@ -22,6 +24,7 @@ class TableElement extends React.PureComponent {
super(props);
this.state = {
sortColumns: false,
+ expanded: true,
};
}
@@ -36,18 +39,17 @@ class TableElement extends React.PureComponent {
this.props.actions.addQueryEditor(qe);
}
- collapseTable(e) {
- e.preventDefault();
- this.props.actions.collapseTable(this.props.table);
- }
-
- expandTable(e) {
+ toggleTable(e) {
e.preventDefault();
- this.props.actions.expandTable(this.props.table);
+ if (this.props.table.expanded) {
+ this.props.actions.collapseTable(this.props.table);
+ } else {
+ this.props.actions.expandTable(this.props.table);
+ }
}
removeTable() {
- this.props.actions.removeTable(this.props.table);
+ this.setState({ expanded: false });
}
dataPreviewModal() {
const query = {
@@ -65,11 +67,8 @@ class TableElement extends React.PureComponent {
this.setState({ sortColumns: !this.state.sortColumns });
}
- render() {
+ renderHeader() {
const table = this.props.table;
- let metadata = null;
- let buttonToggle;
-
let header;
if (table.partitions) {
let partitionQuery;
@@ -101,25 +100,26 @@ class TableElement extends React.PureComponent {
);
}
- if (table.expanded) {
- buttonToggle = (
- { this.collapseTable(e); }}
- >
- {table.name}
-
-
- );
- const cols = table.columns.slice();
+ return header;
+ }
+ renderMetadata() {
+ const table = this.props.table;
+ let cols;
+ if (table.columns) {
+ cols = table.columns.slice();
if (this.state.sortColumns) {
cols.sort((a, b) => a.name.toUpperCase() > b.name.toUpperCase());
}
- metadata = (
+ }
+ const metadata = (
+