You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by GitBox <gi...@apache.org> on 2018/08/20 05:43:02 UTC
[GitHub] williaster closed pull request #5662: Minor improvements to SQL Lab
UI
williaster closed pull request #5662: Minor improvements to SQL Lab UI
URL: https://github.com/apache/incubator-superset/pull/5662
This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:
As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):
diff --git a/superset/assets/src/SqlLab/components/CopyQueryTabUrl.jsx b/superset/assets/src/SqlLab/components/CopyQueryTabUrl.jsx
index fed7c28bbe..e48fe1be8f 100644
--- a/superset/assets/src/SqlLab/components/CopyQueryTabUrl.jsx
+++ b/superset/assets/src/SqlLab/components/CopyQueryTabUrl.jsx
@@ -27,10 +27,13 @@ export default class CopyQueryTabUrl extends React.PureComponent {
inMenu
copyNode={(
<div>
- <i className="fa fa-clipboard" /> <span>{t('share query')}</span>
+ <div className="icon-container">
+ <i className="fa fa-clipboard" />
+ </div>
+ <span>{t('Share query')}</span>
</div>
)}
- tooltipText={t('copy URL to clipboard')}
+ tooltipText={t('Copy URL to clipboard')}
shouldShowText={false}
getText={this.getUrl.bind(this)}
/>
diff --git a/superset/assets/src/SqlLab/components/SouthPane.jsx b/superset/assets/src/SqlLab/components/SouthPane.jsx
index b55fdda422..65d17f7768 100644
--- a/superset/assets/src/SqlLab/components/SouthPane.jsx
+++ b/superset/assets/src/SqlLab/components/SouthPane.jsx
@@ -55,7 +55,7 @@ class SouthPane extends React.PureComponent {
}
const dataPreviewTabs = props.dataPreviewQueries.map(query => (
<Tab
- title={t('Preview for %s', query.tableName)}
+ title={t('Preview: `%s`', query.tableName)}
eventKey={query.id}
key={query.id}
>
diff --git a/superset/assets/src/SqlLab/components/SqlEditorLeftBar.jsx b/superset/assets/src/SqlLab/components/SqlEditorLeftBar.jsx
index a255ca631b..d20d494bcf 100644
--- a/superset/assets/src/SqlLab/components/SqlEditorLeftBar.jsx
+++ b/superset/assets/src/SqlLab/components/SqlEditorLeftBar.jsx
@@ -2,7 +2,7 @@
/* eslint no-undef: 2 */
import React from 'react';
import PropTypes from 'prop-types';
-import { Button } from 'react-bootstrap';
+import { ControlLabel, Button } from 'react-bootstrap';
import Select from 'react-virtualized-select';
import createFilterOptions from 'react-select-fast-filter-options';
@@ -189,13 +189,25 @@ class SqlEditorLeftBar extends React.PureComponent {
onChange={this.changeSchema.bind(this)}
/>
</div>
+ <hr />
<div className="m-t-5">
+ <ControlLabel>
+ {t('See table schema')}
+
+ <small>
+ ({this.state.tableOptions.length}
+ {t('in')}
+ <i>
+ {this.props.queryEditor.schema}
+ </i>)
+ </small>
+ </ControlLabel>
{this.props.queryEditor.schema &&
<Select
name="select-table"
ref="selectTable"
isLoading={this.state.tableLoading}
- placeholder={t('Add a table (%s)', this.state.tableOptions.length)}
+ placeholder={t('Select table or type table name')}
autosize={false}
onChange={this.changeTable.bind(this)}
filterOptions={this.state.filterOptions}
diff --git a/superset/assets/src/SqlLab/components/TabbedSqlEditors.jsx b/superset/assets/src/SqlLab/components/TabbedSqlEditors.jsx
index 3325afe185..cf94b5f5bb 100644
--- a/superset/assets/src/SqlLab/components/TabbedSqlEditors.jsx
+++ b/superset/assets/src/SqlLab/components/TabbedSqlEditors.jsx
@@ -169,18 +169,30 @@ class TabbedSqlEditors extends React.PureComponent {
<div>
<TabStatusIcon onClose={this.removeQueryEditor.bind(this, qe)} tabState={state} />{' '}
{qe.title}{' '}
- <DropdownButton bsSize="small" id={'ddbtn-tab-' + i} title="">
+ <DropdownButton
+ bsSize="small"
+ id={'ddbtn-tab-' + i}
+ className="ddbtn-tab"
+ title=""
+ >
<MenuItem eventKey="1" onClick={this.removeQueryEditor.bind(this, qe)}>
- <i className="fa fa-close" /> {t('close tab')}
+ <div className="icon-container">
+ <i className="fa fa-close" />
+ </div>
+ {t('Close tab')}
</MenuItem>
<MenuItem eventKey="2" onClick={this.renameTab.bind(this, qe)}>
- <i className="fa fa-i-cursor" /> {t('rename tab')}
+ <div className="icon-container">
+ <i className="fa fa-i-cursor" />
+ </div>
+ {t('Rename tab')}
</MenuItem>
{qe && <CopyQueryTabUrl queryEditor={qe} />}
<MenuItem eventKey="4" onClick={this.toggleLeftBar.bind(this)}>
- <i className="fa fa-cogs" />
-
- {this.state.hideLeftBar ? t('expand tool bar') : t('hide tool bar')}
+ <div className="icon-container">
+ <i className="fa fa-cogs" />
+ </div>
+ {this.state.hideLeftBar ? t('Expand tool bar') : t('Hide tool bar')}
</MenuItem>
</DropdownButton>
</div>
diff --git a/superset/assets/src/SqlLab/components/TableElement.jsx b/superset/assets/src/SqlLab/components/TableElement.jsx
index 624a0ed1c7..b1e53a9c74 100644
--- a/superset/assets/src/SqlLab/components/TableElement.jsx
+++ b/superset/assets/src/SqlLab/components/TableElement.jsx
@@ -165,10 +165,10 @@ class TableElement extends React.PureComponent {
className="table-name"
onClick={(e) => { this.toggleTable(e); }}
>
- <strong>{table.name}</strong>
- <small className="m-l-5">
+ <small className="m-r-5">
<i className={`fa fa-${table.expanded ? 'minus' : 'plus'}-square-o`} />
</small>
+ <strong>`{table.name}`</strong>
</a>
</div>
<div className="pull-right">
@@ -197,11 +197,10 @@ class TableElement extends React.PureComponent {
>
<div>
{this.renderWell()}
- <div className="table-columns">
+ <div className="table-columns m-t-5">
{cols && cols.map(col => (
<ColumnElement column={col} key={col.name} />
))}
- <hr />
</div>
</div>
</Collapse>
@@ -217,7 +216,7 @@ class TableElement extends React.PureComponent {
transitionAppear
onExited={this.removeFromStore.bind(this)}
>
- <div className="TableElement">
+ <div className="TableElement m-b-10">
{this.renderHeader()}
<div>
{this.renderBody()}
diff --git a/superset/assets/src/SqlLab/components/TemplateParamsEditor.jsx b/superset/assets/src/SqlLab/components/TemplateParamsEditor.jsx
index d22b9abfae..8a3387ad54 100644
--- a/superset/assets/src/SqlLab/components/TemplateParamsEditor.jsx
+++ b/superset/assets/src/SqlLab/components/TemplateParamsEditor.jsx
@@ -65,7 +65,7 @@ export default class TemplateParamsEditor extends React.Component {
(example: <code>{'{"my_table": "foo"}'}</code>),
and they become available
in your SQL (example: <code>SELECT * FROM {'{{ my_table }}'} </code>)
- by using
+ by using
<a
href="http://superset.apache.org/sqllab.html#templating-with-jinja"
target="_blank"
diff --git a/superset/assets/src/SqlLab/main.less b/superset/assets/src/SqlLab/main.less
index be6d364a6b..9ed25be8d3 100644
--- a/superset/assets/src/SqlLab/main.less
+++ b/superset/assets/src/SqlLab/main.less
@@ -248,6 +248,13 @@ div.tablePopover:hover {
min-width: 100%;
width: inherit;
}
+.Select-clear {
+ margin-top: -2px;
+}
+.Select-arrow {
+ margin-top: 5px;
+}
+
.ace_content {
background-color: #f4f4f4;
}
@@ -266,6 +273,10 @@ div.tablePopover:hover {
padding: 5px 10px;
}
+.TableElement .ws-el-controls {
+ margin-right: -.3em;
+}
+
.QueryTable .label {
display: inline-block;
}
@@ -309,6 +320,18 @@ a.Link {
.nav-tabs > li.active > a:focus {
padding-bottom: 8px;
}
+.nav-tabs .dropdown-toggle.btn .caret {
+ margin-top: -12px;
+}
+.nav-tabs .ddbtn-tab {
+ margin-left: 5px;
+ padding-right: 0;
+}
+.icon-container {
+ display: inline-block;
+ width: 30px;
+ text-align: center;
+}
.search-date-filter-container {
display: flex;
diff --git a/superset/assets/src/SqlLab/reducers.js b/superset/assets/src/SqlLab/reducers.js
index a55a022721..ec880278f9 100644
--- a/superset/assets/src/SqlLab/reducers.js
+++ b/superset/assets/src/SqlLab/reducers.js
@@ -81,7 +81,7 @@ export const sqlLabReducer = function (state = {}, action) {
at.id = shortid.generate();
// for new table, associate Id of query for data preview
at.dataPreviewQueryId = null;
- let newState = addToArr(state, 'tables', at);
+ let newState = addToArr(state, 'tables', at, true);
if (action.query) {
newState = alterInArr(newState, 'tables', at, { dataPreviewQueryId: action.query.id });
}
diff --git a/superset/assets/src/reduxUtils.js b/superset/assets/src/reduxUtils.js
index 8b1062a8ca..4a8d944c4f 100644
--- a/superset/assets/src/reduxUtils.js
+++ b/superset/assets/src/reduxUtils.js
@@ -54,13 +54,17 @@ export function getFromArr(arr, id) {
return obj;
}
-export function addToArr(state, arrKey, obj) {
+export function addToArr(state, arrKey, obj, prepend = false) {
const newObj = Object.assign({}, obj);
if (!newObj.id) {
newObj.id = shortid.generate();
}
const newState = {};
- newState[arrKey] = [...state[arrKey], newObj];
+ if (prepend) {
+ newState[arrKey] = [newObj, ...state[arrKey]];
+ } else {
+ newState[arrKey] = [...state[arrKey], newObj];
+ }
return Object.assign({}, state, newState);
}
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org