Merge pull request #413 from Open-Earth-Foundation/fix/disconnecting-…

…source-progress-indicator fix(ui): disconnecting source progress indicator being enabled for all sources
Open-Earth-Foundation · Apr 15, 2024 · 5917cfa · 5917cfa
2 parents b5737b4 + 1640b83
commit 5917cfa
Showing 1 changed file with 20 additions and 11 deletions.
diff --git a/app/src/app/[lng]/[inventory]/data/[step]/page.tsx b/app/src/app/[lng]/[inventory]/data/[step]/page.tsx
@@ -480,24 +480,30 @@ export default function AddDataSteps({
     {},
   );
 
+  const [disconnectingDataSourceId, setDisconnectingDataSourceId] = useState<
+    string | null
+  >(null);
   const [disconnectThirdPartyData, { isLoading: isDisconnectLoading }] =
     api.useDisconnectThirdPartyDataMutation();
 
   const onDisconnectThirdPartyData = async (
     source: DataSourceWithRelations,
   ) => {
     if (isSourceConnected(source)) {
-      source.inventoryValues!.forEach(
-        async (inventoryValue: InventoryValueAttributes) => {
-          await disconnectThirdPartyData({
-            inventoryId: inventoryValue.inventoryId,
-            subCategoryId: inventoryValue.subCategoryId,
-          }).then((res: any) => {
-            // Todo show alert
-            onSearchDataSourcesClicked();
-          });
-        },
+      setDisconnectingDataSourceId(source.datasourceId);
+      await Promise.all(
+        source.inventoryValues!.map(
+          async (inventoryValue: InventoryValueAttributes) => {
+            return await disconnectThirdPartyData({
+              inventoryId: inventoryValue.inventoryId,
+              subCategoryId: inventoryValue.subCategoryId,
+            });
+          },
+        ),
       );
+      // TODO show alert
+      setDisconnectingDataSourceId(null);
+      onSearchDataSourcesClicked();
     } else {
       console.log("Something went wrong");
     }
@@ -748,7 +754,10 @@ export default function AddDataSteps({
                         px={6}
                         py={4}
                         onClick={() => onDisconnectThirdPartyData(source)}
-                        isLoading={isDisconnectLoading}
+                        isLoading={
+                          isDisconnectLoading &&
+                          source.datasourceId === disconnectingDataSourceId
+                        }
                         onMouseEnter={() => onButtonHover(source)}
                         onMouseLeave={() => onMouseLeave(source)}
                         leftIcon={<Icon as={MdCheckCircle} />}