temporarily hude the usdc value, use the disable multihop setting in the v3 routing

src/components/CurrencyInputPanel/index.tsx

@@ -1,5 +1,4 @@
-import { Pair, Trade as V2Trade } from '@uniswap/v2-sdk'
-import { Trade as V3Trade } from '@uniswap/v3-sdk'
+import { Pair } from '@uniswap/v2-sdk'
 import { Currency } from '@uniswap/sdk-core'
 import React, { useState, useCallback } from 'react'
 import styled from 'styled-components'
@@ -12,16 +11,11 @@ import { RowBetween, RowFixed } from '../Row'
 import { TYPE } from '../../theme'
 import { Input as NumericalInput } from '../NumericalInput'
 import { ReactComponent as DropDown } from '../../assets/images/dropdown.svg'
-
-import { computeTradePriceBreakdown } from '../../utils/prices'
-import { SmallFormattedPriceImpact } from '../swap/FormattedPriceImpact'
-
 import { useActiveWeb3React } from '../../hooks'
 import { useTranslation } from 'react-i18next'
 import useTheme from '../../hooks/useTheme'
 import { Lock } from 'react-feather'
 import { AutoColumn } from 'components/Column'
-import Tooltip from 'components/Tooltip'
 
 const InputPanel = styled.div<{ hideInput?: boolean }>`
   ${({ theme }) => theme.flexColumnNoWrap}
@@ -158,7 +152,6 @@ interface CurrencyInputPanelProps {
   disableCurrencySelect?: boolean
   hideBalance?: boolean
   pair?: Pair | null
-  trade?: V2Trade | V3Trade | null
   hideInput?: boolean
   otherCurrency?: Currency | null
   id: string
@@ -182,7 +175,6 @@ export default function CurrencyInputPanel({
   disableCurrencySelect = false,
   hideBalance = false,
   pair = null, // used for double token logo
-  trade,
   hideInput = false,
   locked = false,
   ...rest
@@ -194,13 +186,6 @@ export default function CurrencyInputPanel({
   const selectedCurrencyBalance = useCurrencyBalance(account ?? undefined, currency ?? undefined)
   const theme = useTheme()
 
-  const { priceImpactWithoutFee } = computeTradePriceBreakdown(trade)
-
-  const [showToolTip, setShowToolTip] = useState<boolean>(false)
-
-  const open = useCallback(() => setShowToolTip(true), [setShowToolTip])
-  const close = useCallback(() => setShowToolTip(false), [setShowToolTip])
-
   const handleDismissSearch = useCallback(() => {
     setModalOpen(false)
   }, [setModalOpen])
@@ -223,8 +208,7 @@ export default function CurrencyInputPanel({
                 {label}
               </TYPE.body>
 
-              <RowFixed>
-                {/* Need to compute the real USD price here... Show */}
+              {/*<RowFixed>
                 <TYPE.body color={theme.text3} fontWeight={500} fontSize={14}>
                   {currency && value ? '$250' + value : '$ -'}
                 </TYPE.body>
@@ -241,7 +225,7 @@ export default function CurrencyInputPanel({
                     </Tooltip>
                   </span>
                 )}
-              </RowFixed>
+              </RowFixed>*/}
             </RowBetween>
           </LabelRow>
         )}

src/hooks/useAllV3Routes.ts

@@ -1,6 +1,7 @@
 import { ChainId, Currency } from '@uniswap/sdk-core'
 import { Pool, Route } from '@uniswap/v3-sdk'
 import { useMemo } from 'react'
+import { useUserSingleHopOnly } from '../state/user/hooks'
 import { wrappedCurrency } from '../utils/wrappedCurrency'
 import { useActiveWeb3React } from './index'
 import { useV3SwapPools } from './useV3SwapPools'
@@ -54,10 +55,12 @@ export function useAllV3Routes(currencyIn?: Currency, currencyOut?: Currency): {
   const { chainId } = useActiveWeb3React()
   const { pools, loading: poolsLoading } = useV3SwapPools(currencyIn, currencyOut)
 
+  const [singleHopOnly] = useUserSingleHopOnly()
+
   return useMemo(() => {
     if (poolsLoading || !chainId || !pools || !currencyIn || !currencyOut) return { loading: true, routes: [] }
 
-    const routes = computeAllRoutes(currencyIn, currencyOut, pools, chainId)
+    const routes = computeAllRoutes(currencyIn, currencyOut, pools, chainId, [], [], currencyIn, singleHopOnly ? 1 : 2)
     return { loading: false, routes }
-  }, [chainId, currencyIn, currencyOut, pools, poolsLoading])
+  }, [chainId, currencyIn, currencyOut, pools, poolsLoading, singleHopOnly])
 }

src/hooks/useBestV3Trade.ts

@@ -6,7 +6,7 @@ import { useSingleContractMultipleData } from '../state/multicall/hooks'
 import { useAllV3Routes } from './useAllV3Routes'
 import { useV3Quoter } from './useContract'
 
-enum V3TradeState {
+export enum V3TradeState {
   LOADING,
   INVALID,
   NO_ROUTE_FOUND,
@@ -81,8 +81,10 @@ export function useBestV3TradeExactIn(
       }
     }
 
+    const isSyncing = quotesResults.some(({ syncing }) => syncing)
+
     return {
-      state: V3TradeState.VALID,
+      state: isSyncing ? V3TradeState.SYNCING : V3TradeState.VALID,
       trade: Trade.createUncheckedTrade({
         route: bestRoute,
         tradeType: TradeType.EXACT_INPUT,
@@ -163,8 +165,10 @@ export function useBestV3TradeExactOut(
       }
     }
 
+    const isSyncing = quotesResults.some(({ syncing }) => syncing)
+
     return {
-      state: V3TradeState.VALID,
+      state: isSyncing ? V3TradeState.SYNCING : V3TradeState.VALID,
       trade: Trade.createUncheckedTrade({
         route: bestRoute,
         tradeType: TradeType.EXACT_INPUT,

src/pages/Swap/index.tsx

@@ -108,7 +108,7 @@ export default function Swap({ history }: RouteComponentProps) {
     ? undefined
     : {
         [Version.v2]: v2Trade,
-        [Version.v3]: v3Trade,
+        [Version.v3]: v3Trade.trade ?? undefined,
       }[toggledVersion]
 
   const parsedAmounts = showWrap
@@ -360,7 +360,6 @@ export default function Swap({ history }: RouteComponentProps) {
                 otherCurrency={currencies[Field.INPUT]}
                 showCommonBases={true}
                 id="swap-currency-output"
-                trade={trade}
               />
             </div>
 

src/state/swap/hooks.ts

@@ -1,5 +1,5 @@
 import { Trade as V3Trade } from '@uniswap/v3-sdk'
-import { useBestV3TradeExactIn, useBestV3TradeExactOut } from '../../hooks/useBestV3Trade'
+import { useBestV3TradeExactIn, useBestV3TradeExactOut, V3TradeState } from '../../hooks/useBestV3Trade'
 import useENS from '../../hooks/useENS'
 import { parseUnits } from '@ethersproject/units'
 import { Currency, CurrencyAmount, ETHER, Token, TokenAmount } from '@uniswap/sdk-core'
@@ -116,7 +116,7 @@ export function useDerivedSwapInfo(): {
   parsedAmount: CurrencyAmount | undefined
   v2Trade: V2Trade | undefined
   inputError?: string
-  v3Trade: V3Trade | undefined
+  v3Trade: { trade: V3Trade | null; state: V3TradeState }
 } {
   const { account } = useActiveWeb3React()
 
@@ -206,7 +206,7 @@ export function useDerivedSwapInfo(): {
     parsedAmount,
     v2Trade: v2Trade ?? undefined,
     inputError,
-    v3Trade: v3Trade.trade ?? undefined,
+    v3Trade,
   }
 }