Update usePreviewCloseShort to prepare shares out

Author: DannyDelott

apps/hyperdrive-trading/src/ui/hyperdrive/shorts/hooks/usePreviewCloseShort.ts

@@ -1,6 +1,8 @@
 import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
 import { QueryStatusWithIdle, getStatus } from "src/base/queryStatus";
+import { useAppConfig } from "src/ui/appconfig/useAppConfig";
+import { prepareSharesOut } from "src/ui/hyperdrive/hooks/usePrepareSharesOut";
 import { useReadHyperdrive } from "src/ui/hyperdrive/hooks/useReadHyperdrive";
 import { Address } from "viem";
 
@@ -28,6 +30,7 @@ export function usePreviewCloseShort({
   enabled = true,
 }: UsePreviewCloseShortOptions): UsePreviewCloseShortResult {
   const readHyperdrive = useReadHyperdrive(hyperdriveAddress);
+  const appConfig = useAppConfig();
   const queryEnabled =
     !!readHyperdrive && !!maturityTime && !!shortAmountIn && enabled;
 
@@ -41,12 +44,49 @@ export function usePreviewCloseShort({
 
     enabled: queryEnabled,
     queryFn: queryEnabled
-      ? async () =>
-          readHyperdrive.previewCloseShort({
+      ? async () => {
+          const result = await readHyperdrive.previewCloseShort({
             maturityTime,
             shortAmountIn,
             asBase,
-          })
+          });
+
+          // All shares from the sdk need to be prepared for the UI
+          const [finalAmountOut, finalMarketEstimate, finalFlatPlusCurveFee] =
+            asBase
+              ? [
+                  result.amountOut,
+                  result.marketEstimate,
+                  result.flatPlusCurveFee,
+                ]
+              : await Promise.all([
+                  prepareSharesOut({
+                    appConfig,
+                    hyperdriveAddress,
+                    readHyperdrive,
+                    sharesAmount: result.amountOut,
+                  }),
+                  prepareSharesOut({
+                    appConfig,
+                    hyperdriveAddress,
+                    readHyperdrive,
+                    sharesAmount: result.marketEstimate,
+                  }),
+                  prepareSharesOut({
+                    appConfig,
+                    hyperdriveAddress,
+                    readHyperdrive,
+                    sharesAmount: result.flatPlusCurveFee,
+                  }),
+                ]);
+
+          return {
+            ...result,
+            amountOut: finalAmountOut,
+            marketEstimate: finalMarketEstimate,
+            flatPlusCurveFee: finalFlatPlusCurveFee,
+          };
+        }
       : undefined,
   });