swap to single usequery (#1044)

* swap to single usequery * updates per comments
delvtech · May 8, 2024 · 2bc27ca · 2bc27ca
1 parent 263910a
commit 2bc27ca
Show file tree

Hide file tree

Showing 2 changed files with 75 additions and 91 deletions.
diff --git a/apps/hyperdrive-trading/src/ui/hyperdrive/longs/hooks/useTotalLongsValue.ts b/apps/hyperdrive-trading/src/ui/hyperdrive/longs/hooks/useTotalLongsValue.ts
@@ -1,6 +1,6 @@
 import { Long } from "@delvtech/hyperdrive-viem";
 import { HyperdriveConfig } from "@hyperdrive/appconfig";
-import { useQueries } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
 import { parseUnits } from "src/base/parseUnits";
 import { convertSharesToBase } from "src/hyperdrive/convertSharesToBase";
@@ -19,55 +19,47 @@ export function useTotalLongsValue({
 }): { totalLongsValue: bigint | undefined; isLoading: boolean } {
   const readHyperdrive = useReadHyperdrive(hyperdrive.address);
   const { poolInfo } = usePoolInfo({ hyperdriveAddress: hyperdrive.address });
-  let isLoading = true;
 
   const queryEnabled =
     !!account && !!openLongs && !!readHyperdrive && !!poolInfo;
-  const previewCloseLongQueries = useQueries({
-    queries:
-      openLongs?.map((long) => ({
-        queryKey: makeQueryKey("previewCloseLong", {
-          hyperdriveAddress: hyperdrive.address,
-          bondAmountIn: long.bondAmount?.toString(),
-          minOutput: parseUnits("0", 18).toString(),
-          destination: account,
-          asBase: false,
-        }),
-        enabled: queryEnabled,
-        queryFn: queryEnabled
-          ? () =>
-              readHyperdrive?.previewCloseLong({
-                maturityTime: long.maturity,
-                bondAmountIn: long.bondAmount,
-                destination: account,
-                asBase: false,
-                minAmountOut: parseUnits("0", 18),
-                options: {
-                  from: account,
-                },
-              })
-          : undefined,
-      })) ?? [],
-  });
 
-  const allQueriesSucceeded = previewCloseLongQueries.every(
-    (query) => query.status === "success",
-  );
-  let totalLongsValue = 0n;
-  if (allQueriesSucceeded) {
-    previewCloseLongQueries.forEach((query) => {
-      const amountOutInBase = convertSharesToBase({
-        decimals: hyperdrive.decimals,
-        sharesAmount: query.data,
-        vaultSharePrice: poolInfo?.vaultSharePrice,
-      });
-      totalLongsValue += amountOutInBase || 0n;
-    });
-  }
+  const { data: totalLongsValue, isLoading } = useQuery({
+    queryKey: makeQueryKey("totalLongsValue", {
+      hyperdriveAddress: hyperdrive.address,
+      account,
+    }),
+    enabled: queryEnabled,
+    queryFn: queryEnabled
+      ? async () => {
+          const promises = openLongs.map((long) =>
+            readHyperdrive.previewCloseLong({
+              maturityTime: long.maturity,
+              bondAmountIn: long.bondAmount,
+              destination: account,
+              asBase: false,
+              minAmountOut: parseUnits("0", 18),
+              options: {
+                from: account,
+              },
+            }),
+          );
+
+          const results = await Promise.all(promises);
 
-  isLoading = previewCloseLongQueries.some(
-    (query) => query.status === "loading",
-  );
+          let totalLongsValue = 0n;
+          results.forEach((result) => {
+            const amountOutInBase = convertSharesToBase({
+              decimals: hyperdrive.decimals,
+              sharesAmount: result,
+              vaultSharePrice: poolInfo?.vaultSharePrice,
+            });
+            totalLongsValue += amountOutInBase || 0n;
+          });
+
+          return totalLongsValue;
+        }
+      : undefined,
+  });
 
   return { totalLongsValue, isLoading };
 }
diff --git a/apps/hyperdrive-trading/src/ui/hyperdrive/shorts/hooks/useTotalShortsValue.ts b/apps/hyperdrive-trading/src/ui/hyperdrive/shorts/hooks/useTotalShortsValue.ts
@@ -1,6 +1,6 @@
 import { Short } from "@delvtech/hyperdrive-viem";
 import { HyperdriveConfig } from "@hyperdrive/appconfig";
-import { useQueries } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
 import { parseUnits } from "src/base/parseUnits";
 import { convertSharesToBase } from "src/hyperdrive/convertSharesToBase";
@@ -20,54 +20,46 @@ export function useTotalShortsValue({
   const readHyperdrive = useReadHyperdrive(hyperdrive.address);
   const { poolInfo } = usePoolInfo({ hyperdriveAddress: hyperdrive.address });
 
-  let isLoading = true;
   const queryEnabled =
     !!account && !!openShorts && !!readHyperdrive && !!poolInfo;
-  const previewCloseShortQueries = useQueries({
-    queries:
-      openShorts?.map((short) => ({
-        queryKey: makeQueryKey("previewCloseShort", {
-          hyperdriveAddress: hyperdrive.address,
-          maturityTime: short.maturity?.toString(),
-          shortAmountIn: short.bondAmount?.toString(),
-          minAmountOut: parseUnits("0", 18).toString(),
-          destination: account,
-          asBase: false,
-        }),
-        enabled: queryEnabled,
-        queryFn: queryEnabled
-          ? () =>
-              readHyperdrive?.previewCloseShort({
-                maturityTime: short.maturity,
-                shortAmountIn: short.bondAmount,
-                destination: account,
-                asBase: false,
-                minAmountOut: parseUnits("0", 18),
-                options: {
-                  from: account,
-                },
-              })
-          : undefined,
-      })) ?? [],
-  });
-  const allQueriesSucceeded = previewCloseShortQueries.every(
-    (query) => query.status === "success",
-  );
-  let totalShortsValue = 0n;
-  if (allQueriesSucceeded) {
-    previewCloseShortQueries.forEach((query) => {
-      const amountOutInBase = convertSharesToBase({
-        decimals: hyperdrive.decimals,
-        sharesAmount: query.data,
-        vaultSharePrice: poolInfo?.vaultSharePrice,
-      });
-      totalShortsValue += amountOutInBase || 0n;
-    });
-  }
 
-  isLoading = previewCloseShortQueries.some(
-    (query) => query.status === "loading",
-  );
+  const { data: totalShortsValue, isLoading } = useQuery({
+    queryKey: makeQueryKey("totalShortsValue", {
+      hyperdriveAddress: hyperdrive.address,
+      account,
+    }),
+    enabled: queryEnabled,
+    queryFn: queryEnabled
+      ? async () => {
+          const promises = openShorts.map((short) =>
+            readHyperdrive.previewCloseShort({
+              maturityTime: short.maturity,
+              shortAmountIn: short.bondAmount,
+              destination: account,
+              asBase: false,
+              minAmountOut: parseUnits("0", 18),
+              options: {
+                from: account,
+              },
+            }),
+          );
+
+          const results = await Promise.all(promises);
+
+          let totalShortsValue = 0n;
+          results.forEach((result) => {
+            const amountOutInBase = convertSharesToBase({
+              decimals: hyperdrive.decimals,
+              sharesAmount: result,
+              vaultSharePrice: poolInfo?.vaultSharePrice,
+            });
+            totalShortsValue += amountOutInBase || 0n;
+          });
+
+          return totalShortsValue;
+        }
+      : undefined,
+  });
 
   return { totalShortsValue, isLoading };
 }