(superset) branch sc-75386 updated (dc2f308c76 -> 35ecd281bb)

[be...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

beto pushed a change to branch sc-75386
in repository https://gitbox.apache.org/repos/asf/superset.git


 discard dc2f308c76 WIP
     new 35ecd281bb feat: show more information when loading chart

This update added new revisions after undoing existing revisions.
That is to say, some revisions that were in the old version of the
branch are not in the new version.  This situation occurs
when a user --force pushes a change and generates a repository
containing something like this:

 * -- * -- B -- O -- O -- O   (dc2f308c76)
            \
             N -- N -- N   refs/heads/sc-75386 (35ecd281bb)

You should already have received notification emails for all of the O
revisions, and so the following emails describe only the N revisions
from the common base, B.

Any revisions marked "omit" are not gone; other references still
refer to them.  Any revisions marked "discard" are gone forever.

The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 superset-frontend/src/components/Chart/Chart.jsx | 47 +++++++++++++++---------
 1 file changed, 30 insertions(+), 17 deletions(-)

(superset) 01/01: feat: show more information when loading chart

[be...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

beto pushed a commit to branch sc-75386
in repository https://gitbox.apache.org/repos/asf/superset.git

commit 35ecd281bb7788f1061902a876bafbc5f4d897e9
Author: Beto Dealmeida <ro...@dealmeida.net>
AuthorDate: Thu Feb 22 15:44:15 2024 -0500

    feat: show more information when loading chart
---
 superset-frontend/src/components/Chart/Chart.jsx | 70 +++++++++++++++++++-----
 1 file changed, 56 insertions(+), 14 deletions(-)

diff --git a/superset-frontend/src/components/Chart/Chart.jsx b/superset-frontend/src/components/Chart/Chart.jsx
index 4b8e82975e..927f51f2ce 100644
--- a/superset-frontend/src/components/Chart/Chart.jsx
+++ b/superset-frontend/src/components/Chart/Chart.jsx
@@ -19,6 +19,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import {
+  css,
   ensureIsArray,
   FeatureFlag,
   isFeatureEnabled,
@@ -232,16 +233,68 @@ class Chart extends React.PureComponent {
     );
   }
 
+  renderSpinner(chartStatus, databaseName) {
+    const messages = {
+      loading: t('Fetching data from %s', databaseName),
+      success: t('Rendering chart'),
+      rendered: t('Success'),
+    };
+
+    return (
+      <div
+        css={css`
+          position: absolute;
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%, -50%);
+        `}
+      >
+        <Loading position="inline-centered" />
+        <span
+          // eslint-disable-next-line theme-colors/no-literal-colors
+          css={css`
+            display: block;
+            margin: 16px auto;
+            width: fit-content;
+            color: #666666;
+          `}
+        >
+          {messages[chartStatus]}
+        </span>
+      </div>
+    );
+  }
+
+  renderChartContainer() {
+    return (
+      <div className="slice_container" data-test="slice-container">
+        {this.props.isInView ||
+        !isFeatureEnabled(FeatureFlag.DashboardVirtualization) ||
+        isCurrentUserBot() ? (
+          <ChartRenderer
+            {...this.props}
+            source={this.props.dashboardId ? 'dashboard' : 'explore'}
+            data-test={this.props.vizType}
+          />
+        ) : (
+          <Loading />
+        )}
+      </div>
+    );
+  }
+
   render() {
     const {
       height,
       chartAlert,
       chartStatus,
+      datasource,
       errorMessage,
       chartIsStale,
       queriesResponse = [],
       width,
     } = this.props;
+    const databaseName = datasource?.database?.name;
 
     const isLoading = chartStatus === 'loading';
     this.renderContainerStartTime = Logger.getTimestamp();
@@ -297,20 +350,9 @@ class Chart extends React.PureComponent {
           height={height}
           width={width}
         >
-          <div className="slice_container" data-test="slice-container">
-            {this.props.isInView ||
-            !isFeatureEnabled(FeatureFlag.DashboardVirtualization) ||
-            isCurrentUserBot() ? (
-              <ChartRenderer
-                {...this.props}
-                source={this.props.dashboardId ? 'dashboard' : 'explore'}
-                data-test={this.props.vizType}
-              />
-            ) : (
-              <Loading />
-            )}
-          </div>
-          {isLoading && <Loading />}
+          {isLoading
+            ? this.renderSpinner(chartStatus, databaseName)
+            : this.renderChartContainer()}
         </Styles>
       </ErrorBoundary>
     );