feat: uniswapX default feature flag (#7246)
* feat: uniswapX default feature flag * fix: bad merge * fix: toggle behavior and style issues * fix: toggle behavior
This commit is contained in:
parent
28ea390863
commit
24d62d9594
@ -8,6 +8,7 @@ import { useInfoPoolPageFlag } from 'featureFlags/flags/infoPoolPage'
|
||||
import { useInfoTDPFlag } from 'featureFlags/flags/infoTDP'
|
||||
import { useMultichainUXFlag } from 'featureFlags/flags/multichainUx'
|
||||
import { TraceJsonRpcVariant, useTraceJsonRpcFlag } from 'featureFlags/flags/traceJsonRpc'
|
||||
import { useUniswapXDefaultEnabledFlag } from 'featureFlags/flags/uniswapXDefault'
|
||||
import { useUniswapXEthOutputFlag } from 'featureFlags/flags/uniswapXEthOutput'
|
||||
import { useUniswapXExactOutputFlag } from 'featureFlags/flags/uniswapXExactOutput'
|
||||
import { useUniswapXSyntheticQuoteFlag } from 'featureFlags/flags/uniswapXUseSyntheticQuote'
|
||||
@ -228,6 +229,25 @@ export default function FeatureFlagModal() {
|
||||
<X size={24} />
|
||||
</CloseButton>
|
||||
</Header>
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useCurrencyConversionFlag()}
|
||||
featureFlag={FeatureFlag.currencyConversion}
|
||||
label="Enable currency conversion"
|
||||
/>
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useMultichainUXFlag()}
|
||||
featureFlag={FeatureFlag.multichainUX}
|
||||
label="Updated Multichain UX"
|
||||
/>
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useFotAdjustmentsFlag()}
|
||||
featureFlag={FeatureFlag.fotAdjustedmentsEnabled}
|
||||
label="Enable fee-on-transfer UI and slippage adjustments"
|
||||
/>
|
||||
<FeatureFlagGroup name="UniswapX Flags">
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useUniswapXSyntheticQuoteFlag()}
|
||||
@ -248,22 +268,11 @@ export default function FeatureFlagModal() {
|
||||
/>
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useCurrencyConversionFlag()}
|
||||
featureFlag={FeatureFlag.currencyConversion}
|
||||
label="Enable currency conversion"
|
||||
/>
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useMultichainUXFlag()}
|
||||
featureFlag={FeatureFlag.multichainUX}
|
||||
label="Updated Multichain UX"
|
||||
/>
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
value={useFotAdjustmentsFlag()}
|
||||
featureFlag={FeatureFlag.fotAdjustedmentsEnabled}
|
||||
label="Enable fee-on-transfer UI and slippage adjustments"
|
||||
value={useUniswapXDefaultEnabledFlag()}
|
||||
featureFlag={FeatureFlag.uniswapXDefaultEnabled}
|
||||
label="Enable UniswapX by default"
|
||||
/>
|
||||
</FeatureFlagGroup>
|
||||
<FeatureFlagGroup name="Info Site Migration">
|
||||
<FeatureFlagOption
|
||||
variant={BaseVariant}
|
||||
|
@ -5,9 +5,10 @@ import UniswapXBrandMark from 'components/Logo/UniswapXBrandMark'
|
||||
import { RowBetween, RowFixed } from 'components/Row'
|
||||
import Toggle from 'components/Toggle'
|
||||
import { isUniswapXSupportedChain } from 'constants/chains'
|
||||
import { useUniswapXDefaultEnabled } from 'featureFlags/flags/uniswapXDefault'
|
||||
import { useAppDispatch } from 'state/hooks'
|
||||
import { RouterPreference } from 'state/routing/types'
|
||||
import { useRouterPreference } from 'state/user/hooks'
|
||||
import { useRouterPreference, useUserDisabledUniswapX } from 'state/user/hooks'
|
||||
import { updateDisabledUniswapX } from 'state/user/reducer'
|
||||
import styled from 'styled-components'
|
||||
import { Divider, ExternalLink, ThemedText } from 'theme'
|
||||
@ -26,6 +27,13 @@ export default function RouterPreferenceSettings() {
|
||||
const [routerPreference, setRouterPreference] = useRouterPreference()
|
||||
const uniswapXEnabled = chainId && isUniswapXSupportedChain(chainId)
|
||||
const dispatch = useAppDispatch()
|
||||
const userDisabledUniswapX = useUserDisabledUniswapX()
|
||||
const isUniswapXDefaultEnabled = useUniswapXDefaultEnabled()
|
||||
const isUniswapXOverrideEnabled = isUniswapXDefaultEnabled && !userDisabledUniswapX
|
||||
|
||||
const uniswapXInEffect =
|
||||
routerPreference === RouterPreference.X ||
|
||||
(routerPreference !== RouterPreference.CLIENT && isUniswapXOverrideEnabled)
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -47,13 +55,16 @@ export default function RouterPreferenceSettings() {
|
||||
</RowFixed>
|
||||
<Toggle
|
||||
id="toggle-uniswap-x-button"
|
||||
isActive={routerPreference === RouterPreference.X}
|
||||
// If UniswapX-by-default is enabled we need to render this as active even if routerPreference === RouterPreference.API
|
||||
// because we're going to default to the UniswapX quote.
|
||||
// If the user manually toggles it off, this doesn't apply.
|
||||
isActive={uniswapXInEffect}
|
||||
toggle={() => {
|
||||
if (routerPreference === RouterPreference.X) {
|
||||
if (uniswapXInEffect) {
|
||||
// We need to remember if a user disables Uniswap X, so we don't show the opt-in flow again.
|
||||
dispatch(updateDisabledUniswapX({ disabledUniswapX: true }))
|
||||
}
|
||||
setRouterPreference(routerPreference === RouterPreference.X ? RouterPreference.API : RouterPreference.X)
|
||||
setRouterPreference(uniswapXInEffect ? RouterPreference.API : RouterPreference.X)
|
||||
}}
|
||||
/>
|
||||
</RowBetween>
|
||||
@ -73,7 +84,11 @@ export default function RouterPreferenceSettings() {
|
||||
isActive={routerPreference === RouterPreference.CLIENT}
|
||||
toggle={() =>
|
||||
setRouterPreference(
|
||||
routerPreference === RouterPreference.CLIENT ? RouterPreference.API : RouterPreference.CLIENT
|
||||
routerPreference === RouterPreference.CLIENT
|
||||
? isUniswapXDefaultEnabled
|
||||
? RouterPreference.X
|
||||
: RouterPreference.API
|
||||
: RouterPreference.CLIENT
|
||||
)
|
||||
}
|
||||
/>
|
||||
|
9
src/featureFlags/flags/uniswapXDefault.ts
Normal file
9
src/featureFlags/flags/uniswapXDefault.ts
Normal file
@ -0,0 +1,9 @@
|
||||
import { BaseVariant, FeatureFlag, useBaseFlag } from '../index'
|
||||
|
||||
export function useUniswapXDefaultEnabledFlag(): BaseVariant {
|
||||
return useBaseFlag(FeatureFlag.uniswapXDefaultEnabled)
|
||||
}
|
||||
|
||||
export function useUniswapXDefaultEnabled(): boolean {
|
||||
return useUniswapXDefaultEnabledFlag() === BaseVariant.Enabled
|
||||
}
|
@ -18,6 +18,7 @@ export enum FeatureFlag {
|
||||
infoTDP = 'info_tdp',
|
||||
infoPoolPage = 'info_pool_page',
|
||||
infoLiveViews = 'info_live_views',
|
||||
uniswapXDefaultEnabled = 'uniswapx_default_enabled',
|
||||
}
|
||||
|
||||
interface FeatureFlagsContextType {
|
||||
|
@ -152,6 +152,7 @@ export function useUniversalRouterSwapCallback(
|
||||
}, [
|
||||
account,
|
||||
analyticsContext,
|
||||
blockNumber,
|
||||
chainId,
|
||||
fiatValues,
|
||||
options.deadline,
|
||||
|
@ -1,5 +1,6 @@
|
||||
import { SkipToken, skipToken } from '@reduxjs/toolkit/query/react'
|
||||
import { Currency, CurrencyAmount, Percent, TradeType } from '@uniswap/sdk-core'
|
||||
import { useUniswapXDefaultEnabled } from 'featureFlags/flags/uniswapXDefault'
|
||||
import { useUniswapXEthOutputEnabled } from 'featureFlags/flags/uniswapXEthOutput'
|
||||
import { useUniswapXExactOutputEnabled } from 'featureFlags/flags/uniswapXExactOutput'
|
||||
import { useUniswapXSyntheticQuoteEnabled } from 'featureFlags/flags/uniswapXUseSyntheticQuote'
|
||||
@ -36,6 +37,7 @@ export function useRoutingAPIArguments({
|
||||
const userDisabledUniswapX = useUserDisabledUniswapX()
|
||||
const uniswapXEthOutputEnabled = useUniswapXEthOutputEnabled()
|
||||
const uniswapXExactOutputEnabled = useUniswapXExactOutputEnabled()
|
||||
const isUniswapXDefaultEnabled = useUniswapXDefaultEnabled()
|
||||
|
||||
return useMemo(
|
||||
() =>
|
||||
@ -59,6 +61,7 @@ export function useRoutingAPIArguments({
|
||||
userDisabledUniswapX,
|
||||
uniswapXEthOutputEnabled,
|
||||
uniswapXExactOutputEnabled,
|
||||
isUniswapXDefaultEnabled,
|
||||
inputTax,
|
||||
outputTax,
|
||||
},
|
||||
@ -73,6 +76,7 @@ export function useRoutingAPIArguments({
|
||||
uniswapXForceSyntheticQuotes,
|
||||
userDisabledUniswapX,
|
||||
uniswapXEthOutputEnabled,
|
||||
isUniswapXDefaultEnabled,
|
||||
inputTax,
|
||||
outputTax,
|
||||
]
|
||||
|
@ -32,6 +32,7 @@ import TokenSafetyModal from 'components/TokenSafety/TokenSafetyModal'
|
||||
import { getChainInfo } from 'constants/chainInfo'
|
||||
import { asSupportedChain, isSupportedChain } from 'constants/chains'
|
||||
import { getSwapCurrencyId, TOKEN_SHORTHANDS } from 'constants/tokens'
|
||||
import { useUniswapXDefaultEnabled } from 'featureFlags/flags/uniswapXDefault'
|
||||
import { useCurrency, useDefaultActiveTokens } from 'hooks/Tokens'
|
||||
import { useIsSwapUnsupported } from 'hooks/useIsSwapUnsupported'
|
||||
import { useLocalCurrencyPrice } from 'hooks/useLocalCurrencyPrice'
|
||||
@ -565,6 +566,7 @@ export function Swap({
|
||||
const switchingChain = useAppSelector((state) => state.wallets.switchingChain)
|
||||
const showOptInSmall = !useScreenSize().navSearchInputVisible
|
||||
const isDark = useIsDarkMode()
|
||||
const isUniswapXDefaultEnabled = useUniswapXDefaultEnabled()
|
||||
|
||||
const swapElement = (
|
||||
<SwapWrapper isDark={isDark} className={className} id="swap-page">
|
||||
@ -791,14 +793,14 @@ export function Swap({
|
||||
)}
|
||||
</div>
|
||||
</AutoColumn>
|
||||
{!showOptInSmall && <UniswapXOptIn isSmall={false} swapInfo={swapInfo} />}
|
||||
{!showOptInSmall && !isUniswapXDefaultEnabled && <UniswapXOptIn isSmall={false} swapInfo={swapInfo} />}
|
||||
</SwapWrapper>
|
||||
)
|
||||
|
||||
return (
|
||||
<>
|
||||
{swapElement}
|
||||
{showOptInSmall && <UniswapXOptIn isSmall swapInfo={swapInfo} />}
|
||||
{showOptInSmall && !isUniswapXDefaultEnabled && <UniswapXOptIn isSmall swapInfo={swapInfo} />}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
@ -46,6 +46,7 @@ export interface GetQuoteArgs {
|
||||
uniswapXEthOutputEnabled: boolean
|
||||
uniswapXExactOutputEnabled: boolean
|
||||
userDisabledUniswapX: boolean
|
||||
isUniswapXDefaultEnabled: boolean
|
||||
inputTax: Percent
|
||||
outputTax: Percent
|
||||
}
|
||||
|
@ -192,11 +192,20 @@ export async function transformRoutesToTrade(
|
||||
data: URAQuoteResponse,
|
||||
quoteMethod: QuoteMethod
|
||||
): Promise<TradeResult> {
|
||||
const { tradeType, needsWrapIfUniswapX, routerPreference, account, amount } = args
|
||||
const {
|
||||
tradeType,
|
||||
needsWrapIfUniswapX,
|
||||
routerPreference,
|
||||
account,
|
||||
amount,
|
||||
isUniswapXDefaultEnabled,
|
||||
inputTax,
|
||||
outputTax,
|
||||
} = args
|
||||
|
||||
// During the opt-in period, only return UniswapX quotes if the user has turned on the setting,
|
||||
// even if it is the better quote.
|
||||
const showUniswapXTrade = data.routing === URAQuoteType.DUTCH_LIMIT && routerPreference === RouterPreference.X
|
||||
const showUniswapXTrade =
|
||||
data.routing === URAQuoteType.DUTCH_LIMIT &&
|
||||
(routerPreference === RouterPreference.X || (isUniswapXDefaultEnabled && routerPreference === RouterPreference.API))
|
||||
|
||||
const [currencyIn, currencyOut] = getTradeCurrencies(args, showUniswapXTrade)
|
||||
const { gasUseEstimateUSD, blockNumber, routes, gasUseEstimate } = getClassicTradeDetails(
|
||||
@ -247,13 +256,13 @@ export async function transformRoutesToTrade(
|
||||
isUniswapXBetter,
|
||||
requestId: data.quote.requestId,
|
||||
quoteMethod,
|
||||
inputTax: args.inputTax,
|
||||
outputTax: args.outputTax,
|
||||
inputTax,
|
||||
outputTax,
|
||||
})
|
||||
|
||||
// During the opt-in period, only return UniswapX quotes if the user has turned on the setting,
|
||||
// even if it is the better quote.
|
||||
if (isUniswapXBetter && args.routerPreference === RouterPreference.X) {
|
||||
if (isUniswapXBetter && (routerPreference === RouterPreference.X || isUniswapXDefaultEnabled)) {
|
||||
const orderInfo = toDutchOrderInfo(data.quote.orderInfo)
|
||||
const wrapInfo = await getWrapInfo(needsWrapIfUniswapX, account, currencyIn.chainId, amount, usdCostPerGas)
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user