unify loading states in UI

osmosis-labs · May 31, 2024 · 77167c6 · 77167c6
1 parent ffab0b0
commit 77167c6
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 12 deletions.
diff --git a/packages/web/components/swap-tool/index.tsx b/packages/web/components/swap-tool/index.tsx
@@ -753,7 +753,7 @@ export const SwapTool: FunctionComponent<SwapToolProps> = observer(
               isLoaded={
                 Boolean(swapState.toAsset) &&
                 Boolean(swapState.fromAsset) &&
-                !swapState.isSpotPriceQuoteLoading
+                !isSwapToolLoading
               }
             >
               <button
@@ -975,10 +975,10 @@ export const SwapTool: FunctionComponent<SwapToolProps> = observer(
                 (account?.walletStatus === WalletStatus.Connected &&
                   (swapState.inAmountInput.isEmpty ||
                     !Boolean(swapState.quote) ||
+                    isSwapToolLoading ||
                     Boolean(swapState.error) ||
                     account?.txTypeInProgress !== "" ||
-                    swapState.isLoadingNetworkFee ||
-                    Boolean(swapState.estimateTxError)))
+                    Boolean(swapState.networkFeeError)))
               }
               loadingText={buttonText}
               onClick={sendSwapTx}

diff --git a/packages/web/hooks/use-swap.tsx b/packages/web/hooks/use-swap.tsx
@@ -200,7 +200,7 @@ export function useSwap(
     Boolean(quote);
   const {
     data: networkFee,
-    error: estimateTxError,
+    error: networkFeeError,
     isLoading: isLoadingNetworkFee_,
   } = useEstimateTxFees({
     chainId: chainStore.osmosis.chainId,
@@ -246,18 +246,18 @@ export function useSwap(
 
   const hasOverSpendLimitError = useMemo(() => {
     if (
-      !estimateTxError?.message ||
+      !networkFeeError?.message ||
       !isOneClickTradingEnabled ||
       inAmountInput.isEmpty ||
       inAmountInput.inputAmount == "0" ||
-      !isOverspendErrorMessage({ message: estimateTxError?.message })
+      !isOverspendErrorMessage({ message: networkFeeError?.message })
     ) {
       return false;
     }
 
     return true;
   }, [
-    estimateTxError,
+    networkFeeError,
     inAmountInput.inputAmount,
     inAmountInput.isEmpty,
     isOneClickTradingEnabled,
@@ -302,13 +302,13 @@ export function useSwap(
             messageCanBeSignedWithOneClickTrading &&
             !hasOverSpendLimitError &&
             !hasExceededOneClickTradingGasLimit &&
-            !estimateTxError;
+            !networkFeeError;
 
           if (
             messageCanBeSignedWithOneClickTrading &&
             !hasOverSpendLimitError &&
             !hasExceededOneClickTradingGasLimit &&
-            estimateTxError
+            networkFeeError
           ) {
             try {
               const ONE_CLICK_UNAVAILABLE_TOAST_ID = "ONE_CLICK_UNAVAILABLE";
@@ -416,7 +416,7 @@ export function useSwap(
       accountStore,
       hasOverSpendLimitError,
       hasExceededOneClickTradingGasLimit,
-      estimateTxError,
+      networkFeeError,
       featureFlags.swapToolSimulateFee,
       networkFee,
       swapAssets.fromAsset,
@@ -509,7 +509,9 @@ export function useSwap(
       networkFee?.gasUsdValueToPay?.toDec() ?? new Dec(0),
     ]),
     networkFee,
-    isLoadingNetworkFee,
+    isLoadingNetworkFee:
+      inAmountInput.isLoadingCurrentBalanceNetworkFee || isLoadingNetworkFee,
+    networkFeeError,
     error: precedentError,
     spotPriceQuote,
     isSpotPriceQuoteLoading,
@@ -518,7 +520,6 @@ export function useSwap(
     sendTradeTokenInTx,
     hasOverSpendLimitError,
     hasExceededOneClickTradingGasLimit,
-    estimateTxError,
   };
 }