From c0740fb73c032cabb5a8968f4a736f361ba788c5 Mon Sep 17 00:00:00 2001
From: Zach Pomerantz <zzmp@uniswap.org>
Date: Thu, 8 Dec 2022 07:56:46 -0800
Subject: [PATCH] fix: error captions (#323)

* fix: do not display error caption for zero amounts

* fix: do not display insufficient liquidity caption when loading initial trade
---
 .../routing/clientSideSmartOrderRouter.ts     |  5 ++--
 src/hooks/swap/index.ts                       |  4 +--
 src/state/routing/slice.ts                    | 26 ++++++++++---------
 src/state/routing/types.ts                    |  3 ++-
 4 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/hooks/routing/clientSideSmartOrderRouter.ts b/src/hooks/routing/clientSideSmartOrderRouter.ts
index 7f46e7339..08f73c16b 100644
--- a/src/hooks/routing/clientSideSmartOrderRouter.ts
+++ b/src/hooks/routing/clientSideSmartOrderRouter.ts
@@ -12,7 +12,7 @@ import {
   UniswapMulticallProvider,
 } from '@uniswap/smart-order-router'
 import JSBI from 'jsbi'
-import { GetQuoteArgs, GetQuoteResult, NO_ROUTE } from 'state/routing/types'
+import { GetQuoteArgs, GetQuoteResult, INITIALIZED, NO_ROUTE } from 'state/routing/types'
 import { isExactInput } from 'utils/tradeType'
 
 import { transformSwapRouteToGetQuoteResult } from './transformSwapRouteToGetQuoteResult'
@@ -103,7 +103,8 @@ async function getQuote(
   const amount = CurrencyAmount.fromRawAmount(baseCurrency, JSBI.BigInt(amountRaw ?? '1')) // a null amountRaw should initialize the route
   const route = await router.route(amount, quoteCurrency, tradeType, /*swapConfig=*/ undefined, routerConfig)
 
-  if (amountRaw === null || !route) return NO_ROUTE
+  if (!amountRaw) return INITIALIZED
+  if (!route) return NO_ROUTE
 
   return transformSwapRouteToGetQuoteResult({ ...route, routeString: routeAmountsToString(route.route) })
 }
diff --git a/src/hooks/swap/index.ts b/src/hooks/swap/index.ts
index 1afad5de0..9da4a757f 100644
--- a/src/hooks/swap/index.ts
+++ b/src/hooks/swap/index.ts
@@ -63,9 +63,9 @@ export function useIsSwapFieldIndependent(field: Field): boolean {
 
 const amountAtom = pickAtom(swapAtom, 'amount')
 
-// check if any amount has been entered by user
+/** Returns true if the user has entered a non-zero amount. */
 export function useIsAmountPopulated() {
-  return Boolean(useAtomValue(amountAtom))
+  return Boolean(Number(useAtomValue(amountAtom)))
 }
 
 export function useSwapAmount(field: Field): [string | undefined, (amount: string, origin?: 'max') => void] {
diff --git a/src/state/routing/slice.ts b/src/state/routing/slice.ts
index e9be7c0b1..1cd85f755 100644
--- a/src/state/routing/slice.ts
+++ b/src/state/routing/slice.ts
@@ -27,11 +27,12 @@ export const routing = createApi({
       async queryFn(args: GetQuoteArgs | SkipToken) {
         if (args === skipToken) return { error: { status: 'CUSTOM_ERROR', error: 'Skipped' } }
 
-        // If enabled, try routing API, falling back to client-side SOR.
-        if (Boolean(args.routerUrl)) {
-          // amount may be null to initialize the client-side SOR. This should be skipped for the server.
-          if (args.amount === undefined) return { error: { status: 'CUSTOM_ERROR', error: 'Skipped' } }
-
+        if (
+          // If enabled, try the routing API, falling back to client-side routing.
+          Boolean(args.routerUrl) &&
+          // A null amount may be passed to initialize the client-side routing.
+          args.amount !== null
+        ) {
           try {
             const { tokenInAddress, tokenInChainId, tokenOutAddress, tokenOutChainId, amount, tradeType } = args
             const type = isExactInput(tradeType) ? 'exactIn' : 'exactOut'
@@ -61,20 +62,21 @@ export const routing = createApi({
 
             const quote: GetQuoteResult = await response.json()
             return { data: quote }
-          } catch (error) {
-            console.warn(`GetQuote failed on routing API, falling back to client: ${error}`)
+          } catch (error: any) {
+            console.warn(
+              `GetQuote failed on routing API, falling back to client: ${error?.message ?? error?.detail ?? error}`
+            )
           }
         }
 
-        // If integrator did not provide a routing API URL param, use clientside SOR
+        // Lazy-load the client-side router to improve initial pageload times.
+        const clientSideSmartOrderRouter = await import('../../hooks/routing/clientSideSmartOrderRouter')
         try {
-          // Lazy-load the client-side router to improve initial pageload times.
-          const clientSideSmartOrderRouter = await import('../../hooks/routing/clientSideSmartOrderRouter')
           const quote = await clientSideSmartOrderRouter.getClientSideQuote(args, { protocols })
           return { data: quote }
-        } catch (error) {
+        } catch (error: any) {
           console.warn(`GetQuote failed on client: ${error}`)
-          return { error: { status: 'CUSTOM_ERROR', error: error.message } }
+          return { error: { status: 'CUSTOM_ERROR', error: error?.message ?? error?.detail ?? error } }
         }
       },
       keepUnusedDataFor: ms`10s`,
diff --git a/src/state/routing/types.ts b/src/state/routing/types.ts
index 32060bfb6..d2749cb66 100644
--- a/src/state/routing/types.ts
+++ b/src/state/routing/types.ts
@@ -82,8 +82,9 @@ export interface QuoteResult {
   routeString: string
 }
 
+export const INITIALIZED = 'Initialized'
 export const NO_ROUTE = 'No Route'
 
-export type GetQuoteResult = QuoteResult | typeof NO_ROUTE
+export type GetQuoteResult = QuoteResult | typeof INITIALIZED | typeof NO_ROUTE
 
 export class InterfaceTrade extends Trade<Currency, Currency, TradeType> {}