fix(sqllab): tracking url and error alert padding (#20937)

apache · Aug 2, 2022 · ac58582 · ac58582
1 parent 7beda3b
commit ac58582
Showing 1 changed file with 8 additions and 9 deletions.
diff --git a/superset-frontend/src/SqlLab/components/ResultSet/index.tsx b/superset-frontend/src/SqlLab/components/ResultSet/index.tsx
@@ -78,9 +78,12 @@ interface ResultSetState {
   alertIsOpen: boolean;
 }
 
-const Styles = styled.div`
+const ResultlessStyles = styled.div`
   position: relative;
   minheight: 100px;
+  [role='alert'] {
+    margin-top: ${({ theme }) => theme.gridUnit * 2}px;
+  }
   .sql-result-track-job {
     margin-top: ${({ theme }) => theme.gridUnit * 2}px;
   }
@@ -113,10 +116,6 @@ const ResultSetButtons = styled.div`
   padding-right: ${({ theme }) => 2 * theme.gridUnit}px;
 `;
 
-const ResultSetErrorMessage = styled.div`
-  padding-top: ${({ theme }) => 4 * theme.gridUnit}px;
-`;
-
 export default class ResultSet extends React.PureComponent<
   ResultSetProps,
   ResultSetState
@@ -445,7 +444,7 @@ export default class ResultSet extends React.PureComponent<
     }
     if (query.state === 'failed') {
       return (
-        <ResultSetErrorMessage>
+        <ResultlessStyles>
           <ErrorMessageWithStackTrace
             title={t('Database error')}
             error={query?.errors?.[0]}
@@ -455,7 +454,7 @@ export default class ResultSet extends React.PureComponent<
             source="sqllab"
           />
           {trackingUrl}
-        </ResultSetErrorMessage>
+        </ResultlessStyles>
       );
     }
     if (query.state === 'success' && query.ctas) {
@@ -586,7 +585,7 @@ export default class ResultSet extends React.PureComponent<
         : null;
 
     return (
-      <Styles>
+      <ResultlessStyles>
         <div>{!progressBar && <Loading position="normal" />}</div>
         {/* show loading bar whenever progress bar is completed but needs time to render */}
         <div>{query.progress === 100 && <Loading position="normal" />}</div>
@@ -596,7 +595,7 @@ export default class ResultSet extends React.PureComponent<
         </div>
         <div>{query.progress !== 100 && progressBar}</div>
         {trackingUrl && <div>{trackingUrl}</div>}
-      </Styles>
+      </ResultlessStyles>
     );
   }
 }