chore(widget): add min receive amounts to TradeParams event (#4222)

apps/cowswap-frontend/src/modules/swap/hooks/useSwapState.tsx

@@ -64,6 +64,7 @@ interface DerivedSwapInfo {
   parsedAmount: CurrencyAmount<Currency> | undefined
   // TODO: remove duplications of the value (trade?.maximumAmountIn(allowedSlippage))
   slippageAdjustedSellAmount: CurrencyAmount<Currency> | null
+  slippageAdjustedBuyAmount: CurrencyAmount<Currency> | null
   inputError?: string
   trade: TradeGp | undefined
   allowedSlippage: Percent
@@ -285,6 +286,7 @@ export function useDerivedSwapInfo(): DerivedSwapInfo {
   // const allowedSlippage = useUserSlippageToleranceWithDefault(autoSlippageTolerance) // mod
   const allowedSlippage = useSwapSlippage()
   const slippageAdjustedSellAmount = trade?.maximumAmountIn(allowedSlippage) || null
+  const slippageAdjustedBuyAmount = trade?.minimumAmountOut(allowedSlippage) || null
 
   const inputError = useMemo(() => {
     let inputError: string | undefined
@@ -337,7 +339,8 @@ export function useDerivedSwapInfo(): DerivedSwapInfo {
         inputError,
         trade,
         allowedSlippage,
-        slippageAdjustedSellAmount: slippageAdjustedSellAmount,
+        slippageAdjustedSellAmount,
+        slippageAdjustedBuyAmount,
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -350,6 +353,7 @@ export function useDerivedSwapInfo(): DerivedSwapInfo {
       // eslint-disable-next-line react-hooks/exhaustive-deps
       JSON.stringify(trade),
       slippageAdjustedSellAmount,
+      slippageAdjustedBuyAmount,
     ] // mod
   )
 }

apps/cowswap-frontend/src/modules/swap/state/useSwapDerivedState.ts

@@ -20,7 +20,8 @@ export function useSwapDerivedState(): SwapDerivedState {
 
 export function useFillSwapDerivedState() {
   const { independentField, recipient, recipientAddress } = useSwapState()
-  const { trade, currencyBalances, currencies, slippageAdjustedSellAmount, parsedAmount } = useDerivedSwapInfo()
+  const { trade, currencyBalances, currencies, slippageAdjustedSellAmount, slippageAdjustedBuyAmount, parsedAmount } =
+    useDerivedSwapInfo()
 
   const isSellTrade = independentField === Field.INPUT
   const inputCurrency = currencies.INPUT || null
@@ -43,6 +44,7 @@ export function useFillSwapDerivedState() {
     inputCurrencyAmount: inputCurrencyAmount || null,
     outputCurrencyAmount: outputCurrencyAmount || null,
     slippageAdjustedSellAmount,
+    slippageAdjustedBuyAmount,
     inputCurrencyBalance,
     outputCurrencyBalance,
     inputCurrencyFiatAmount,

apps/cowswap-frontend/src/modules/trade/hooks/useBuildTradeDerivedState.ts

@@ -34,6 +34,7 @@ export function useBuildTradeDerivedState(stateAtom: Atom<ExtendedTradeRawState>
 
   // In limit orders and advanced orders we don't have "real" buy orders
   const slippageAdjustedSellAmount = inputCurrencyAmount
+  const slippageAdjustedBuyAmount = outputCurrencyAmount
 
   return useSafeMemoObject({
     orderKind,
@@ -44,6 +45,7 @@ export function useBuildTradeDerivedState(stateAtom: Atom<ExtendedTradeRawState>
     inputCurrencyAmount,
     outputCurrencyAmount,
     slippageAdjustedSellAmount,
+    slippageAdjustedBuyAmount,
     inputCurrencyBalance,
     outputCurrencyBalance,
     inputCurrencyFiatAmount,

apps/cowswap-frontend/src/modules/trade/hooks/useNotifyWidgetTrade.ts

@@ -2,7 +2,7 @@ import { useEffect } from 'react'
 
 import { NATIVE_CURRENCY_ADDRESS } from '@cowprotocol/common-const'
 import { getIsNativeToken } from '@cowprotocol/common-utils'
-import { CowEvents, OnTradeParamsPayload } from '@cowprotocol/events'
+import { AtomsAndUnits, CowEvents, OnTradeParamsPayload } from '@cowprotocol/events'
 import { TokenInfo, UiOrderType } from '@cowprotocol/types'
 import { Currency, CurrencyAmount } from '@uniswap/sdk-core'
 
@@ -32,15 +32,16 @@ const TradeTypeToUiOrderType: Record<TradeType, UiOrderType> = {
 function getTradeParamsEventPayload(tradeType: TradeType, state: TradeDerivedState): OnTradeParamsPayload {
   return {
     orderType: TradeTypeToUiOrderType[tradeType],
-    inputCurrency: currencyToTokenInfo(state.inputCurrency),
-    outputCurrency: currencyToTokenInfo(state.outputCurrency),
-    inputCurrencyAmount: currencyAmountToBigInt(state.inputCurrencyAmount),
-    outputCurrencyAmount: currencyAmountToBigInt(state.outputCurrencyAmount),
-    inputCurrencyBalance: currencyAmountToBigInt(state.inputCurrencyBalance),
-    outputCurrencyBalance: currencyAmountToBigInt(state.outputCurrencyBalance),
-    inputCurrencyFiatAmount: state.inputCurrencyFiatAmount?.toExact(),
-    outputCurrencyFiatAmount: state.outputCurrencyFiatAmount?.toExact(),
-    slippageAdjustedSellAmount: currencyAmountToBigInt(state.slippageAdjustedSellAmount),
+    sellToken: currencyToTokenInfo(state.inputCurrency),
+    buyToken: currencyToTokenInfo(state.outputCurrency),
+    sellTokenAmount: currencyAmountToAtomsAndUnits(state.inputCurrencyAmount),
+    buyTokenAmount: currencyAmountToAtomsAndUnits(state.outputCurrencyAmount),
+    sellTokenBalance: currencyAmountToAtomsAndUnits(state.inputCurrencyBalance),
+    buyTokenBalance: currencyAmountToAtomsAndUnits(state.outputCurrencyBalance),
+    sellTokenFiatAmount: state.inputCurrencyFiatAmount?.toExact(),
+    buyTokenFiatAmount: state.outputCurrencyFiatAmount?.toExact(),
+    maximumSendSellAmount: currencyAmountToAtomsAndUnits(state.slippageAdjustedSellAmount),
+    minimumReceiveBuyAmount: currencyAmountToAtomsAndUnits(state.slippageAdjustedBuyAmount),
     recipient: state.recipient || undefined,
     orderKind: state.orderKind,
   }
@@ -58,8 +59,11 @@ function currencyToTokenInfo(currency: Currency | null): TokenInfo | undefined {
   }
 }
 
-function currencyAmountToBigInt(currency: CurrencyAmount<Currency> | null): bigint | undefined {
+function currencyAmountToAtomsAndUnits(currency: CurrencyAmount<Currency> | null): AtomsAndUnits | undefined {
   if (!currency) return undefined
 
-  return BigInt(currency.quotient.toString())
+  return {
+    atoms: BigInt(currency.quotient.toString()),
+    units: currency.toExact(),
+  }
 }

apps/cowswap-frontend/src/modules/trade/types/TradeDerivedState.ts

@@ -20,6 +20,7 @@ export interface TradeDerivedState {
    * So, the final sell amount will be 552 COW + 2% = 563.04
    */
   readonly slippageAdjustedSellAmount: CurrencyAmount<Currency> | null
+  readonly slippageAdjustedBuyAmount: CurrencyAmount<Currency> | null
   readonly inputCurrencyBalance: CurrencyAmount<Currency> | null
   readonly outputCurrencyBalance: CurrencyAmount<Currency> | null
   readonly inputCurrencyFiatAmount: CurrencyAmount<Currency> | null
@@ -36,6 +37,7 @@ export const DEFAULT_TRADE_DERIVED_STATE: TradeDerivedState = {
   inputCurrencyAmount: null,
   outputCurrencyAmount: null,
   slippageAdjustedSellAmount: null,
+  slippageAdjustedBuyAmount: null,
   inputCurrencyBalance: null,
   outputCurrencyBalance: null,
   inputCurrencyFiatAmount: null,

libs/events/src/types/trade.ts

@@ -1,16 +1,27 @@
 import { TokenInfo, UiOrderType } from '@cowprotocol/types'
 import { OrderKind } from '@cowprotocol/cow-sdk'
 
+export type AtomsAndUnits = { atoms: bigint; units: string }
+
 export type OnTradeParamsPayload = { orderType: UiOrderType } & Partial<{
-  inputCurrency: TokenInfo
-  outputCurrency: TokenInfo
-  inputCurrencyAmount: bigint
-  outputCurrencyAmount: bigint
-  inputCurrencyBalance: bigint
-  outputCurrencyBalance: bigint
-  inputCurrencyFiatAmount: string
-  outputCurrencyFiatAmount: string
-  slippageAdjustedSellAmount: bigint
+  sellToken: TokenInfo
+  buyToken: TokenInfo
+  sellTokenAmount: AtomsAndUnits
+  buyTokenAmount: AtomsAndUnits
+  sellTokenBalance: AtomsAndUnits
+  buyTokenBalance: AtomsAndUnits
+  sellTokenFiatAmount: string
+  buyTokenFiatAmount: string
+  /**
+   * Sell amount including slippage and fees.
+   * For sell orders, this value should be the same with inputCurrencyAmount
+   */
+  maximumSendSellAmount: AtomsAndUnits
+  /**
+   * Buy amount including slippage and fees.
+   * For buy orders, this value should be the same with outputCurrencyAmount
+   */
+  minimumReceiveBuyAmount: AtomsAndUnits
   orderKind: OrderKind
   recipient: string
 }>