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/06/26 23:47:42 UTC

[GitHub] williaster closed pull request #5293: fix sqllab css, fix double AddSliceCard margin and drag border

williaster closed pull request #5293: fix sqllab <Loading /> css, fix double AddSliceCard margin and drag border
URL: https://github.com/apache/incubator-superset/pull/5293
 
 
   

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/TODO.md b/superset/assets/src/SqlLab/TODO.md
deleted file mode 100644
index db8f247abf..0000000000
--- a/superset/assets/src/SqlLab/TODO.md
+++ /dev/null
@@ -1,19 +0,0 @@
-
-# TODO
-* Figure out how to organize the left panel, integrate Search
-* collapse sql beyond 10 lines
-* Security per-database (dropdown)
-* Get a to work
-
-## Cosmetic
-* Result set font is too big
-* lmiit/timer/buttons wrap
-* table label is transparent
-* SqlEditor buttons
-* use react-bootstrap-prompt for query title input
-* Make tabs look great
-
-# PROJECT
-* Write Runbook
-* Confirm backups
-* merge chef branch
diff --git a/superset/assets/src/SqlLab/components/ResultSet.jsx b/superset/assets/src/SqlLab/components/ResultSet.jsx
index 67c8fd5e72..6f502ea14e 100644
--- a/superset/assets/src/SqlLab/components/ResultSet.jsx
+++ b/superset/assets/src/SqlLab/components/ResultSet.jsx
@@ -31,6 +31,8 @@ const defaultProps = {
 
 const SEARCH_HEIGHT = 46;
 
+const LOADING_STYLES = { position: 'relative', height: 50 };
+
 export default class ResultSet extends React.PureComponent {
   constructor(props) {
     super(props);
@@ -238,9 +240,9 @@ export default class ResultSet extends React.PureComponent {
       );
     }
     return (
-      <div>
-        <Loading />
+      <div style={LOADING_STYLES}>
         <QueryStateLabel query={query} />
+        {!progressBar && <Loading />}
         {progressBar}
         <div>
           {trackingUrl}
diff --git a/superset/assets/src/SqlLab/components/SouthPane.jsx b/superset/assets/src/SqlLab/components/SouthPane.jsx
index 55ff2a305f..7102880e99 100644
--- a/superset/assets/src/SqlLab/components/SouthPane.jsx
+++ b/superset/assets/src/SqlLab/components/SouthPane.jsx
@@ -86,7 +86,7 @@ class SouthPane extends React.PureComponent {
             title={t('Query History')}
             eventKey="History"
           >
-            <div style={{ height: `${innerTabHeight}px`, overflow: 'scroll' }}>
+            <div style={{ height: `${innerTabHeight}px`, overflow: 'auto' }}>
               <QueryHistory queries={props.editorQueries} actions={props.actions} />
             </div>
           </Tab>
diff --git a/superset/assets/src/SqlLab/main.less b/superset/assets/src/SqlLab/main.less
index df3ba9b95e..be6d364a6b 100644
--- a/superset/assets/src/SqlLab/main.less
+++ b/superset/assets/src/SqlLab/main.less
@@ -45,7 +45,7 @@ body {
   left: 0px;
   right: 0px;
   bottom: 0px;
-  overflow: scroll;
+  overflow: auto;
   margin-right: 0px;
   margin-bottom: 0px;
 }
@@ -302,7 +302,7 @@ a.Link {
     margin-top: 10px;
     position: absolute;
     width: 100%;
-    overflow: scroll;
+    overflow: auto;
 }
 .nav-tabs > li.active > a,
 .nav-tabs > li.active > a:hover,
diff --git a/superset/assets/src/dashboard/components/BuilderComponentPane.jsx b/superset/assets/src/dashboard/components/BuilderComponentPane.jsx
index aafee5dcab..a21ec11de7 100644
--- a/superset/assets/src/dashboard/components/BuilderComponentPane.jsx
+++ b/superset/assets/src/dashboard/components/BuilderComponentPane.jsx
@@ -87,11 +87,9 @@ class BuilderComponentPane extends React.PureComponent {
 
                           <i className="fa fa-arrow-right trigger" />
                         </div>
-
                         <NewTabs />
                         <NewRow />
                         <NewColumn />
-
                         <NewHeader />
                         <NewMarkdown />
                         <NewDivider />
diff --git a/superset/assets/src/dashboard/components/SliceHeader.jsx b/superset/assets/src/dashboard/components/SliceHeader.jsx
index d812181039..f2d715b714 100644
--- a/superset/assets/src/dashboard/components/SliceHeader.jsx
+++ b/superset/assets/src/dashboard/components/SliceHeader.jsx
@@ -12,6 +12,7 @@ const propTypes = {
   isExpanded: PropTypes.bool,
   isCached: PropTypes.bool,
   cachedDttm: PropTypes.string,
+  updatedDttm: PropTypes.number,
   updateSliceName: PropTypes.func,
   toggleExpandSlice: PropTypes.func,
   forceRefresh: PropTypes.func,
@@ -37,6 +38,7 @@ const defaultProps = {
   annotationQuery: {},
   annotationError: {},
   cachedDttm: null,
+  updatedDttm: null,
   isCached: false,
   isExpanded: false,
   sliceName: '',
@@ -51,6 +53,7 @@ class SliceHeader extends React.PureComponent {
       isExpanded,
       isCached,
       cachedDttm,
+      updatedDttm,
       toggleExpandSlice,
       forceRefresh,
       exploreChart,
@@ -102,6 +105,7 @@ class SliceHeader extends React.PureComponent {
               isCached={isCached}
               isExpanded={isExpanded}
               cachedDttm={cachedDttm}
+              updatedDttm={updatedDttm}
               toggleExpandSlice={toggleExpandSlice}
               forceRefresh={forceRefresh}
               exploreChart={exploreChart}
diff --git a/superset/assets/src/dashboard/components/SliceHeaderControls.jsx b/superset/assets/src/dashboard/components/SliceHeaderControls.jsx
index 7d25ab08e6..4116a3431f 100644
--- a/superset/assets/src/dashboard/components/SliceHeaderControls.jsx
+++ b/superset/assets/src/dashboard/components/SliceHeaderControls.jsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import cx from 'classnames';
 import moment from 'moment';
 import { Dropdown, MenuItem } from 'react-bootstrap';
 import {
@@ -17,6 +16,7 @@ const propTypes = {
   isCached: PropTypes.bool,
   isExpanded: PropTypes.bool,
   cachedDttm: PropTypes.string,
+  updatedDttm: PropTypes.number,
   supersetCanExplore: PropTypes.bool,
   sliceCanEdit: PropTypes.bool,
   toggleExpandSlice: PropTypes.func,
@@ -31,6 +31,7 @@ const defaultProps = {
   exploreChart: () => ({}),
   exportCSV: () => ({}),
   cachedDttm: null,
+  updatedDttm: null,
   isCached: false,
   isExpanded: false,
   supersetCanExplore: false,
@@ -101,19 +102,20 @@ class SliceHeaderControls extends React.PureComponent {
   }
 
   render() {
-    const slice = this.props.slice;
-    const isCached = this.props.isCached;
-    const cachedWhen = moment.utc(this.props.cachedDttm).fromNow();
-    const refreshTooltip = isCached ? t('Cached %s', cachedWhen) : '';
-
-    // @TODO account for
-    //  dashboard.dashboard.superset_can_explore
-    //  dashboard.dashboard.slice_can_edit
+    const { slice, isCached, cachedDttm, updatedDttm } = this.props;
+    const cachedWhen = moment.utc(cachedDttm).fromNow();
+    const updatedWhen = updatedDttm ? moment.utc(updatedDttm).fromNow() : '';
+    const refreshTooltip = isCached
+      ? t('Cached %s', cachedWhen)
+      : (updatedWhen && t('Fetched %s', updatedWhen)) || '';
+
     return (
       <Dropdown
         id={`slice_${slice.slice_id}-controls`}
-        className={cx(isCached && 'is-cached')}
         pullRight
+        // react-bootstrap handles visibility, but call toggle to force a re-render
+        // and update the fetched/cached timestamps
+        onToggle={this.toggleControls}
       >
         <Dropdown.Toggle className="slice-header-controls-trigger" noCaret>
           <VerticalDotsTrigger />
@@ -121,11 +123,8 @@ class SliceHeaderControls extends React.PureComponent {
 
         <Dropdown.Menu>
           <MenuItem onClick={this.refreshChart}>
-            {isCached && <span className="dot" />}
             {t('Force refresh')}
-            {isCached && (
-              <div className="refresh-tooltip">{refreshTooltip}</div>
-            )}
+            <div className="refresh-tooltip">{refreshTooltip}</div>
           </MenuItem>
 
           <MenuItem divider />
diff --git a/superset/assets/src/dashboard/components/UndoRedoKeylisteners.jsx b/superset/assets/src/dashboard/components/UndoRedoKeylisteners.jsx
index 5af0934a61..c6de151182 100644
--- a/superset/assets/src/dashboard/components/UndoRedoKeylisteners.jsx
+++ b/superset/assets/src/dashboard/components/UndoRedoKeylisteners.jsx
@@ -21,13 +21,12 @@ class UndoRedoKeylisteners extends React.PureComponent {
   }
 
   handleKeydown(event) {
-    const controlOrCommand = event.keyCode === 90 || event.metaKey;
+    const controlOrCommand = event.ctrlKey || event.metaKey;
     if (controlOrCommand) {
       const isZChar = event.key === 'z' || event.keyCode === 90;
       const isYChar = event.key === 'y' || event.keyCode === 89;
-      const isEditingMarkdown = document.querySelector(
-        '.dashboard-markdown--editing',
-      );
+      const isEditingMarkdown =
+        document && document.querySelector('.dashboard-markdown--editing');
 
       if (!isEditingMarkdown && (isZChar || isYChar)) {
         event.preventDefault();
diff --git a/superset/assets/src/dashboard/components/dnd/AddSliceDragPreview.jsx b/superset/assets/src/dashboard/components/dnd/AddSliceDragPreview.jsx
index 2c1128e9bb..485e4e3171 100644
--- a/superset/assets/src/dashboard/components/dnd/AddSliceDragPreview.jsx
+++ b/superset/assets/src/dashboard/components/dnd/AddSliceDragPreview.jsx
@@ -11,7 +11,6 @@ import {
 
 const staticCardStyles = {
   position: 'fixed',
-  background: 'rgba(255, 255, 255, 0.7)',
   pointerEvents: 'none',
   top: 0,
   left: 0,
diff --git a/superset/assets/src/dashboard/components/gridComponents/Chart.jsx b/superset/assets/src/dashboard/components/gridComponents/Chart.jsx
index 39c1e81dcb..4713c4361a 100644
--- a/superset/assets/src/dashboard/components/gridComponents/Chart.jsx
+++ b/superset/assets/src/dashboard/components/gridComponents/Chart.jsx
@@ -160,7 +160,7 @@ class Chart extends React.Component {
     if (!chart || !slice) return null;
 
     const { width } = this.state;
-    const { queryResponse } = chart;
+    const { queryResponse, chartUpdateEndTime } = chart;
     const isCached = queryResponse && queryResponse.is_cached;
     const cachedDttm = queryResponse && queryResponse.cached_dttm;
     const isOverflowable = OVERFLOWABLE_VIZ_TYPES.has(slice && slice.viz_type);
@@ -173,6 +173,7 @@ class Chart extends React.Component {
           isExpanded={!!isExpanded}
           isCached={isCached}
           cachedDttm={cachedDttm}
+          updatedDttm={chartUpdateEndTime}
           toggleExpandSlice={toggleExpandSlice}
           forceRefresh={this.forceRefresh}
           editMode={editMode}
diff --git a/superset/assets/src/dashboard/containers/Chart.jsx b/superset/assets/src/dashboard/containers/Chart.jsx
index b2f0795acb..97b2bb8e18 100644
--- a/superset/assets/src/dashboard/containers/Chart.jsx
+++ b/superset/assets/src/dashboard/containers/Chart.jsx
@@ -28,7 +28,9 @@ function mapStateToProps(
 
   return {
     chart,
-    datasource: (chart && datasources[chart.form_data.datasource]) || {},
+    datasource:
+      (chart && chart.form_data && datasources[chart.form_data.datasource]) ||
+      {},
     slice: sliceEntities.slices[id],
     timeout: dashboardInfo.common.conf.SUPERSET_WEBSERVER_TIMEOUT,
     filters: filters[id] || EMPTY_FILTERS,
diff --git a/superset/assets/src/dashboard/stylesheets/builder-sidepane.less b/superset/assets/src/dashboard/stylesheets/builder-sidepane.less
index e807bcc30a..17c87a8f3c 100644
--- a/superset/assets/src/dashboard/stylesheets/builder-sidepane.less
+++ b/superset/assets/src/dashboard/stylesheets/builder-sidepane.less
@@ -29,7 +29,6 @@
   .viewport {
     position: absolute;
     transform: none !important;
-    background: white;
     overflow: hidden;
     width: @builder-pane-width;
     height: 100%;
@@ -77,9 +76,10 @@
       border: 1px solid @gray-light;
       font-weight: 200;
       padding: 16px;
-      margin: 16px;
+      margin: 0 16px 16px 16px;
       position: relative;
       cursor: move;
+      background: rgba(255, 255, 255, 0.4);
 
       &:hover {
         background: @gray-bg;
diff --git a/superset/assets/src/dashboard/stylesheets/components/chart.less b/superset/assets/src/dashboard/stylesheets/components/chart.less
index bc0005dbb5..b4e0f776d9 100644
--- a/superset/assets/src/dashboard/stylesheets/components/chart.less
+++ b/superset/assets/src/dashboard/stylesheets/components/chart.less
@@ -83,11 +83,6 @@
   margin: 2px 0;
   display: inline-block;
 
-  .is-cached & {
-    background-color: @pink;
-    box-shadow: 0 0 5px 1.5px rgba(255, 0, 0, 0.3);
-  }
-
   .vertical-dots-container & {
     display: block;
   }


 

----------------------------------------------------------------
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