feat: log minimum_output_after_slippage to amplitude (#6769)
* feat: log minimum_output_after_slippage to amplitude * fix: memoize logging props * fix: dont memoize at all
This commit is contained in:
parent
5caaaf1b1f
commit
052cc69414
@ -1,5 +1,5 @@
|
|||||||
import { Trans } from '@lingui/macro'
|
import { Trans } from '@lingui/macro'
|
||||||
import { TraceEvent } from '@uniswap/analytics'
|
import { TraceEvent, useTrace } from '@uniswap/analytics'
|
||||||
import { BrowserEvent, InterfaceElementName, SwapEventName } from '@uniswap/analytics-events'
|
import { BrowserEvent, InterfaceElementName, SwapEventName } from '@uniswap/analytics-events'
|
||||||
import { Percent } from '@uniswap/sdk-core'
|
import { Percent } from '@uniswap/sdk-core'
|
||||||
import { useWeb3React } from '@web3-react/core'
|
import { useWeb3React } from '@web3-react/core'
|
||||||
@ -8,6 +8,7 @@ import Column from 'components/Column'
|
|||||||
import { LoadingOpacityContainer } from 'components/Loader/styled'
|
import { LoadingOpacityContainer } from 'components/Loader/styled'
|
||||||
import { RowBetween, RowFixed } from 'components/Row'
|
import { RowBetween, RowFixed } from 'components/Row'
|
||||||
import { SUPPORTED_GAS_ESTIMATE_CHAIN_IDS } from 'constants/chains'
|
import { SUPPORTED_GAS_ESTIMATE_CHAIN_IDS } from 'constants/chains'
|
||||||
|
import { formatEventPropertiesForTrade } from 'lib/utils/analytics'
|
||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import { ChevronDown } from 'react-feather'
|
import { ChevronDown } from 'react-feather'
|
||||||
import { InterfaceTrade } from 'state/routing/types'
|
import { InterfaceTrade } from 'state/routing/types'
|
||||||
@ -102,6 +103,7 @@ export default function SwapDetailsDropdown({ trade, syncing, loading, allowedSl
|
|||||||
const theme = useTheme()
|
const theme = useTheme()
|
||||||
const { chainId } = useWeb3React()
|
const { chainId } = useWeb3React()
|
||||||
const [showDetails, setShowDetails] = useState(false)
|
const [showDetails, setShowDetails] = useState(false)
|
||||||
|
const trace = useTrace()
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Wrapper>
|
<Wrapper>
|
||||||
@ -109,6 +111,10 @@ export default function SwapDetailsDropdown({ trade, syncing, loading, allowedSl
|
|||||||
events={[BrowserEvent.onClick]}
|
events={[BrowserEvent.onClick]}
|
||||||
name={SwapEventName.SWAP_DETAILS_EXPANDED}
|
name={SwapEventName.SWAP_DETAILS_EXPANDED}
|
||||||
element={InterfaceElementName.SWAP_DETAILS_DROPDOWN}
|
element={InterfaceElementName.SWAP_DETAILS_DROPDOWN}
|
||||||
|
properties={{
|
||||||
|
...(trade ? formatEventPropertiesForTrade(trade, allowedSlippage) : {}),
|
||||||
|
...trace,
|
||||||
|
}}
|
||||||
shouldLogImpression={!showDetails}
|
shouldLogImpression={!showDetails}
|
||||||
>
|
>
|
||||||
<StyledHeaderRow
|
<StyledHeaderRow
|
||||||
|
@ -93,6 +93,7 @@ export function useUniversalRouterSwapCallback(
|
|||||||
sendAnalyticsEvent(SwapEventName.SWAP_SIGNED, {
|
sendAnalyticsEvent(SwapEventName.SWAP_SIGNED, {
|
||||||
...formatSwapSignedAnalyticsEventProperties({
|
...formatSwapSignedAnalyticsEventProperties({
|
||||||
trade,
|
trade,
|
||||||
|
allowedSlippage: options.slippageTolerance,
|
||||||
fiatValues,
|
fiatValues,
|
||||||
txHash: response.hash,
|
txHash: response.hash,
|
||||||
}),
|
}),
|
||||||
|
@ -36,31 +36,24 @@ export const getPriceUpdateBasisPoints = (
|
|||||||
|
|
||||||
export const formatSwapSignedAnalyticsEventProperties = ({
|
export const formatSwapSignedAnalyticsEventProperties = ({
|
||||||
trade,
|
trade,
|
||||||
|
allowedSlippage,
|
||||||
fiatValues,
|
fiatValues,
|
||||||
txHash,
|
txHash,
|
||||||
}: {
|
}: {
|
||||||
trade: InterfaceTrade | Trade<Currency, Currency, TradeType>
|
trade: InterfaceTrade | Trade<Currency, Currency, TradeType>
|
||||||
|
allowedSlippage: Percent
|
||||||
fiatValues: { amountIn?: number; amountOut?: number }
|
fiatValues: { amountIn?: number; amountOut?: number }
|
||||||
txHash: string
|
txHash: string
|
||||||
}) => ({
|
}) => ({
|
||||||
transaction_hash: txHash,
|
transaction_hash: txHash,
|
||||||
token_in_address: getTokenAddress(trade.inputAmount.currency),
|
|
||||||
token_out_address: getTokenAddress(trade.outputAmount.currency),
|
|
||||||
token_in_symbol: trade.inputAmount.currency.symbol,
|
|
||||||
token_out_symbol: trade.outputAmount.currency.symbol,
|
|
||||||
token_in_amount: formatToDecimal(trade.inputAmount, trade.inputAmount.currency.decimals),
|
|
||||||
token_out_amount: formatToDecimal(trade.outputAmount, trade.outputAmount.currency.decimals),
|
|
||||||
token_in_amount_usd: fiatValues.amountIn,
|
token_in_amount_usd: fiatValues.amountIn,
|
||||||
token_out_amount_usd: fiatValues.amountOut,
|
token_out_amount_usd: fiatValues.amountOut,
|
||||||
price_impact_basis_points: formatPercentInBasisPointsNumber(computeRealizedPriceImpact(trade)),
|
...formatEventPropertiesForTrade(trade, allowedSlippage),
|
||||||
chain_id:
|
|
||||||
trade.inputAmount.currency.chainId === trade.outputAmount.currency.chainId
|
|
||||||
? trade.inputAmount.currency.chainId
|
|
||||||
: undefined,
|
|
||||||
})
|
})
|
||||||
|
|
||||||
export const formatSwapQuoteReceivedEventProperties = (
|
export const formatEventPropertiesForTrade = (
|
||||||
trade: Trade<Currency, Currency, TradeType>,
|
trade: Trade<Currency, Currency, TradeType>,
|
||||||
|
allowedSlippage: Percent,
|
||||||
gasUseEstimateUSD?: string
|
gasUseEstimateUSD?: string
|
||||||
) => {
|
) => {
|
||||||
return {
|
return {
|
||||||
@ -76,5 +69,7 @@ export const formatSwapQuoteReceivedEventProperties = (
|
|||||||
: undefined,
|
: undefined,
|
||||||
token_in_amount: formatToDecimal(trade.inputAmount, trade.inputAmount.currency.decimals),
|
token_in_amount: formatToDecimal(trade.inputAmount, trade.inputAmount.currency.decimals),
|
||||||
token_out_amount: formatToDecimal(trade.outputAmount, trade.outputAmount.currency.decimals),
|
token_out_amount: formatToDecimal(trade.outputAmount, trade.outputAmount.currency.decimals),
|
||||||
|
minimum_output_after_slippage: trade.minimumAmountOut(allowedSlippage).toSignificant(6),
|
||||||
|
allowed_slippage: formatPercentNumber(allowedSlippage),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -29,7 +29,7 @@ import { useSwapCallback } from 'hooks/useSwapCallback'
|
|||||||
import { useSwitchChain } from 'hooks/useSwitchChain'
|
import { useSwitchChain } from 'hooks/useSwitchChain'
|
||||||
import { useUSDPrice } from 'hooks/useUSDPrice'
|
import { useUSDPrice } from 'hooks/useUSDPrice'
|
||||||
import JSBI from 'jsbi'
|
import JSBI from 'jsbi'
|
||||||
import { formatSwapQuoteReceivedEventProperties } from 'lib/utils/analytics'
|
import { formatEventPropertiesForTrade } from 'lib/utils/analytics'
|
||||||
import { ReactNode, useCallback, useEffect, useMemo, useReducer, useState } from 'react'
|
import { ReactNode, useCallback, useEffect, useMemo, useReducer, useState } from 'react'
|
||||||
import { ArrowDown } from 'react-feather'
|
import { ArrowDown } from 'react-feather'
|
||||||
import { useLocation, useNavigate } from 'react-router-dom'
|
import { useLocation, useNavigate } from 'react-router-dom'
|
||||||
@ -528,10 +528,10 @@ export function Swap({
|
|||||||
|
|
||||||
setSwapQuoteReceivedDate(new Date())
|
setSwapQuoteReceivedDate(new Date())
|
||||||
sendAnalyticsEvent(SwapEventName.SWAP_QUOTE_RECEIVED, {
|
sendAnalyticsEvent(SwapEventName.SWAP_QUOTE_RECEIVED, {
|
||||||
...formatSwapQuoteReceivedEventProperties(trade, trade.gasUseEstimateUSD ?? undefined),
|
...formatEventPropertiesForTrade(trade, allowedSlippage, trade.gasUseEstimateUSD ?? undefined),
|
||||||
...trace,
|
...trace,
|
||||||
})
|
})
|
||||||
}, [prevTrade, trade, trace])
|
}, [prevTrade, trade, trace, allowedSlippage])
|
||||||
|
|
||||||
const showDetailsDropdown = Boolean(
|
const showDetailsDropdown = Boolean(
|
||||||
!showWrap && userHasSpecifiedInputOutput && (trade || routeIsLoading || routeIsSyncing)
|
!showWrap && userHasSpecifiedInputOutput && (trade || routeIsLoading || routeIsSyncing)
|
||||||
|
Loading…
Reference in New Issue
Block a user