fix: fix initialization of Superset embedded dashboard

Author: csm-thu

src/charts/SupersetReport/SupersetReport.js

@@ -34,6 +34,8 @@ export const SupersetReport = ({
     if (!report?.id || !options?.supersetUrl) return;
 
     const loadSuperset = async () => {
+      if (isEmbedded || guestToken === '') return;
+
       try {
         const embedded = await embedDashboard({
           id: report.id,
@@ -60,7 +62,7 @@ export const SupersetReport = ({
       if (dashboard?.destroy) dashboard.destroy();
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [report.id, options.supersetUrl]);
+  }, [report.id, options.supersetUrl, guestToken]);
 
   const placeholder = useMemo(() => {
     const scenarioDTO = PowerBIUtils.constructScenarioDTO(scenario, visibleScenarios);
@@ -78,7 +80,8 @@ export const SupersetReport = ({
   }, [alwaysShowReports, disabled, downloadLogsFile, report, scenario, visibleScenarios, labels]);
 
   const isReportVisible = isEmbedded && placeholder == null;
-  const display = isReportVisible ? undefined : 'none';
+  const reportContainerDisplay = isReportVisible ? undefined : 'none';
+  const showLoadingSpinner = placeholder == null && (isLoading || !isEmbedded)
   return (
     <Box
       sx={{
@@ -90,10 +93,17 @@ export const SupersetReport = ({
       }}
     >
       {placeholder}
-      <Backdrop open={isLoading || !isEmbedded} sx={{ color: '#fff', zIndex: (theme) => theme.zIndex.drawer + 1 }}>
+      <Backdrop
+        open={showLoadingSpinner}
+        sx={{ position: 'absolute', color: '#fff', zIndex: (theme) => theme.zIndex.drawer + 1 }}
+      >
         <CircularProgress color="inherit" sx={{ position: 'absolute' }} />
       </Backdrop>
-      <Box data-cy="superset-report-container" ref={containerRef} sx={{ width: '100%', height: '100%', display }} />
+      <Box
+        data-cy="superset-report-container"
+        ref={containerRef}
+        sx={{ width: '100%', height: '100%', display: reportContainerDisplay }}
+      />
     </Box>
   );
 };