fix: Inaccurate quote after on chain verification (#10808)

<!--
Before opening a pull request, please read the [contributing
guidelines](https://github.com/pancakeswap/pancake-frontend/blob/develop/CONTRIBUTING.md)
first
-->


<!-- start pr-codex -->

---

## PR-Codex overview
This PR adds gas usage estimates to the quote functionality in the
`@pancakeswap/routing-sdk-addon-quoter`. It modifies the quote fetching
logic and updates types to include gas usage information, enhancing the
functionality for users to better understand transaction costs.

### Detailed summary
- Updated `fetchV3Quote.ts` to return `gasUseEstimate` alongside the
quote.
- Modified `fetchQuotes.ts` to include `gasUseEstimate` in the results.
- Revised `types.ts` to define a new `Quote` type that includes
`gasUseEstimate`.
- Enhanced `useTradeVerifiedByQuoter.ts` to handle the new quote
structure and adjust amounts based on gas estimates.
- Introduced a `reviseGasUseEstimate` function to adjust gas estimates
based on trade type.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your
question}`

<!-- end pr-codex -->

.changeset/red-mangos-try.md

@@ -0,0 +1,5 @@
+---
+'@pancakeswap/routing-sdk-addon-quoter': major
+---
+
+Add gas use estimate to quote

apps/web/src/hooks/useTradeVerifiedByQuoter.ts

@@ -1,8 +1,8 @@
 import { V4Router } from '@pancakeswap/smart-router'
-import { Currency, CurrencyAmount, TradeType } from '@pancakeswap/swap-sdk-core'
+import { CurrencyAmount, Fraction, TradeType } from '@pancakeswap/swap-sdk-core'
 import { keepPreviousData, useQuery } from '@tanstack/react-query'
 import { useMemo } from 'react'
-import { fetchQuotes } from '@pancakeswap/routing-sdk-addon-quoter'
+import { fetchQuotes, Quote } from '@pancakeswap/routing-sdk-addon-quoter'
 
 import { getViemClients } from 'utils/viem'
 import { toRoutingSDKTrade } from 'utils/convertTrade'
@@ -37,19 +37,27 @@ export function useTradeVerifiedByQuoter<P extends Params>(p: P): P {
       if (quotes.some((q) => q === undefined)) {
         throw new Error('Fail to validate')
       }
-      const quote = quotes.reduce<CurrencyAmount<Currency>>(
-        (total, q) => total.add(CurrencyAmount.fromRawAmount(quoteCurrency, q!.quotient)),
-        CurrencyAmount.fromRawAmount(quoteCurrency, 0n),
+      const { quote, gasUseEstimate } = quotes.reduce<NonNullable<Quote>>(
+        (total, q) => ({
+          quote: total.quote.add(CurrencyAmount.fromRawAmount(quoteCurrency, q!.quote.quotient)),
+          gasUseEstimate: total.gasUseEstimate + q!.gasUseEstimate,
+        }),
+        {
+          quote: CurrencyAmount.fromRawAmount(quoteCurrency, 0n),
+          gasUseEstimate: 0n,
+        },
       )
       return {
         ...trade,
         routes: trade.routes.map((r, index) => ({
           ...r,
-          inputAmount: isExactIn ? r.inputAmount : quotes[index],
-          outputAmount: isExactIn ? quotes[index] : r.outputAmount,
+          inputAmount: isExactIn ? r.inputAmount : quotes[index]?.quote,
+          outputAmount: isExactIn ? quotes[index]?.quote : r.outputAmount,
+          ...reviseGasUseEstimate(trade.tradeType, r, quotes[index]!.gasUseEstimate),
         })),
         inputAmount: isExactIn ? trade.inputAmount : quote,
         outputAmount: isExactIn ? quote : trade.outputAmount,
+        ...reviseGasUseEstimate(trade.tradeType, trade, gasUseEstimate),
       }
     },
     refetchOnWindowFocus: false,
@@ -64,3 +72,37 @@ export function useTradeVerifiedByQuoter<P extends Params>(p: P): P {
     error: error ?? p.error,
   }
 }
+
+type GasUseEstimate = Pick<
+  V4Router.V4TradeWithoutGraph<TradeType>,
+  | 'gasUseEstimate'
+  | 'inputAmountWithGasAdjusted'
+  | 'outputAmountWithGasAdjusted'
+  | 'gasUseEstimateBase'
+  | 'gasUseEstimateQuote'
+>
+
+function reviseGasUseEstimate(
+  tradeType: TradeType,
+  estimate: GasUseEstimate,
+  actualGasUseEstimate: bigint,
+): GasUseEstimate {
+  const isExactIn = tradeType === TradeType.EXACT_INPUT
+  const factor = new Fraction(actualGasUseEstimate, estimate.gasUseEstimate)
+  const gasUseEstimateBase = estimate.gasUseEstimateBase.multiply(factor)
+  const gasUseEstimateQuote = estimate.gasUseEstimateQuote.multiply(factor)
+  const inputAmountWithGasAdjusted = isExactIn
+    ? estimate.inputAmountWithGasAdjusted
+    : estimate.inputAmountWithGasAdjusted.subtract(estimate.gasUseEstimateQuote).add(gasUseEstimateQuote)
+  const outputAmountWithGasAdjusted = isExactIn
+    ? estimate.outputAmountWithGasAdjusted.add(estimate.gasUseEstimateQuote).subtract(gasUseEstimateQuote)
+    : estimate.outputAmountWithGasAdjusted
+
+  return {
+    gasUseEstimateBase,
+    gasUseEstimateQuote,
+    inputAmountWithGasAdjusted,
+    outputAmountWithGasAdjusted,
+    gasUseEstimate: actualGasUseEstimate,
+  }
+}

packages/routing-sdk/addons/quoter/src/fetchQuotes.ts

@@ -25,7 +25,10 @@ export const fetchQuotes: FetchQuotes<SupportedPool> = async ({ routes, client }
     }
     const { path: currentPath } = routes[i]
     const outCurrency = isExactOut ? currentPath[0] : currentPath[currentPath.length - 1]
-    const [quote] = result.result
-    return CurrencyAmount.fromRawAmount(outCurrency, quote)
+    const [quote, , , gasUseEstimate] = result.result
+    return {
+      quote: CurrencyAmount.fromRawAmount(outCurrency, quote),
+      gasUseEstimate,
+    }
   })
 }

packages/routing-sdk/addons/quoter/src/fetchV3Quote.ts

@@ -33,7 +33,10 @@ export const fetchV3Quote: FetchQuote<SupportedPool> = async ({ route, client })
     allowFailure: false,
   })
 
-  const [[quote]] = result
+  const [[quote, , , gasUseEstimate]] = result
   const outCurrency = isExactOut ? path[0] : path[path.length - 1]
-  return CurrencyAmount.fromRawAmount(outCurrency, quote)
+  return {
+    quote: CurrencyAmount.fromRawAmount(outCurrency, quote),
+    gasUseEstimate,
+  }
 }

packages/routing-sdk/addons/quoter/src/types.ts

@@ -16,10 +16,11 @@ export type FetchQuotesParams<P extends Pool = Pool> = {
   routes: QuoteRoute<P>[]
 }
 
-export type FetchQuote<P extends Pool = Pool> = (
-  params: FetchQuoteParams<P>,
-) => Promise<CurrencyAmount<Currency> | undefined>
+export type Quote = {
+  quote: CurrencyAmount<Currency>
+  gasUseEstimate: bigint
+}
+
+export type FetchQuote<P extends Pool = Pool> = (params: FetchQuoteParams<P>) => Promise<Quote | undefined>
 
-export type FetchQuotes<P extends Pool = Pool> = (
-  params: FetchQuotesParams<P>,
-) => Promise<(CurrencyAmount<Currency> | undefined)[]>
+export type FetchQuotes<P extends Pool = Pool> = (params: FetchQuotesParams<P>) => Promise<(Quote | undefined)[]>