diff --git a/superset-frontend/src/components/Chart/Chart.jsx b/superset-frontend/src/components/Chart/Chart.jsx
index 4b8e82975..b7d09dfd3 100644
--- a/superset-frontend/src/components/Chart/Chart.jsx
+++ b/superset-frontend/src/components/Chart/Chart.jsx
@@ -128,6 +128,20 @@ const Styles = styled.div`
}
`;
+const LoadingDiv = styled.div`
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+`;
+
+const MessageSpan = styled.span`
+ display: block;
+ margin: ${({ theme }) => theme.gridUnit * 4}px auto;
+ width: fit-content;
+ color: ${({ theme }) => theme.colors.grayscale.base};
+`;
+
const MonospaceDiv = styled.div`
font-family: ${({ theme }) => theme.typography.families.monospace};
word-break: break-word;
@@ -232,16 +246,49 @@ class Chart extends React.PureComponent {
);
}
+ renderSpinner(databaseName) {
+ const message = databaseName
+ ? t('Waiting on %s', databaseName)
+ : t('Waiting on database...');
+
+ return (
+