fix(ui): disconnecting source progress indicator being enabled for al…

…l sources
Open-Earth-Foundation · Apr 3, 2024 · 1640b83 · 1640b83
1 parent d12c29b
commit 1640b83
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
@@ -479,24 +479,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");
     }
@@ -747,7 +753,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} />}