fix error status chanhing

src/panels/corpglory-dataexporter-panel/components/Panel.tsx

@@ -59,14 +59,19 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) {
   const [selectedTimeRange, setTimeRange] = useState<TimeRange>(timeRange);
 
   const [panelStatus, setPanelStatus] = useState<PanelStatus>(PanelStatus.LOADING);
-  const [isStatusError, setStatusError] = useState<boolean>(false);
+  function setPanelStatusWithValidate(status: PanelStatus): void {
+    if (panelStatus === PanelStatus.DATASOURCE_ERROR || panelStatus === PanelStatus.PERMISSION_ERROR) {
+      return;
+    }
+    return setPanelStatus(status);
+  }
+
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
 
   const timeZoneName = convertTimeZoneTypeToName(timeZone);
 
   if (contextSrv.user.orgRole !== OrgRole.Admin) {
-    // TODO: it shouldn't be overriten
-    setPanelStatus(PanelStatus.PERMISSION_ERROR);
+    setPanelStatusWithValidate(PanelStatus.PERMISSION_ERROR);
   }
 
   useEffect(() => {
@@ -123,17 +128,7 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) {
     setTasksDataFrame(dataFrame);
   }, [tasks]); // eslint-disable-line react-hooks/exhaustive-deps
 
-  useEffect(() => {
-    if (isStatusError) {
-      return;
-    }
-    setPanelStatus(panelStatus);
-    if (panelStatus === PanelStatus.DATASOURCE_ERROR || panelStatus === PanelStatus.PERMISSION_ERROR) {
-      setStatusError(true);
-    }
-  }, [panelStatus]); // eslint-disable-line react-hooks/exhaustive-deps
-
-  useEffect(refresh, []); // eslint-disable-line react-hooks/exhaustive-deps
+  useEffect(fetchTasks, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   useEffect(() => {
     if (queries === null) {
@@ -142,26 +137,26 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) {
     setQueriesDataFrame(getDataFrameForQueriesTable(queries));
   }, [queries]); // eslint-disable-line react-hooks/exhaustive-deps
 
-  function refresh(): void {
+  function fetchTasks(): void {
     getTasks()
       .then((tasks) => {
         setTasks(tasks);
-        setPanelStatus(PanelStatus.OK);
+        setPanelStatusWithValidate(PanelStatus.OK);
         for (let task of tasks) {
           if (task.progress?.status === ExportStatus.EXPORTING) {
-            setTimeout(refresh, 1000);
+            setTimeout(fetchTasks, 1000);
             return;
           }
         }
       })
       .catch((err) => {
-        setPanelStatus(PanelStatus.DATASOURCE_ERROR);
+        setPanelStatusWithValidate(PanelStatus.DATASOURCE_ERROR);
         console.error('some error', err);
         setErrorMessage(`${err.name}: ${err.message}`);
       });
   }
 
-  eventBus.subscribe(RefreshEvent, refresh);
+  eventBus.subscribe(RefreshEvent, fetchTasks);
 
   function getDatasourceByUid(uid?: string): DataSourceSettings | undefined {
     if (_.isNil(uid)) {
@@ -204,7 +199,7 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) {
       },
     });
 
-    refresh();
+    fetchTasks();
 
     onCloseModal();
     unselectAllQueries();
@@ -431,8 +426,8 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) {
   );
   const permissionErrorDiv = (
     <div>
-      <p>Permission Error.</p>
-      <div> DataExporter panel availabel only for Admins </div>
+      <p> Permission Error. </p>
+      <div> DataExporter panel available only for Admins. </div>
     </div>
   );
   const mainDiv = (