From f996bf7655b471a37e7a1263024b19401df53164 Mon Sep 17 00:00:00 2001 From: hexyls Date: Mon, 23 Aug 2021 16:54:36 +1000 Subject: [PATCH 1/6] fix: display error when relay is greater than xdai amount --- .../message_text/warning_message/index.tsx | 2 +- .../market/market_buy/market_buy.tsx | 11 +++ .../market/market_buy/scalar_market_buy.tsx | 11 +++ .../market_pooling/market_pool_liquidity.tsx | 11 +++ .../scalar_market_pool_liquidity.tsx | 11 +++ app/src/hooks/index.ts | 1 + app/src/hooks/useRelay.tsx | 67 +++++++++++++++++++ .../market_sections/market_buy_container.tsx | 16 ++++- .../market_pool_liquidity_container.tsx | 16 ++++- app/src/services/cpk/fns.ts | 16 +++-- app/src/services/index.ts | 1 + 11 files changed, 154 insertions(+), 9 deletions(-) create mode 100644 app/src/hooks/useRelay.tsx diff --git a/app/src/components/market/common_sections/message_text/warning_message/index.tsx b/app/src/components/market/common_sections/message_text/warning_message/index.tsx index 0b9a0c0179..5ac8c8103e 100644 --- a/app/src/components/market/common_sections/message_text/warning_message/index.tsx +++ b/app/src/components/market/common_sections/message_text/warning_message/index.tsx @@ -11,7 +11,7 @@ const Wrapper = styled.div<{ margin?: boolean }>` border: ${({ theme }) => theme.borders.borderLineDisabled}; align-content: center; padding: 4px 20px; - margin-bottom: ${props => (!props.margin ? '20px' : '0')}; + margin-bottom: ${props => (props.margin ? '20px' : '0')}; ` const AlertWrapper = styled.div` diff --git a/app/src/components/market/market_buy/market_buy.tsx b/app/src/components/market/market_buy/market_buy.tsx index eb48fb3a94..05b0732d71 100644 --- a/app/src/components/market/market_buy/market_buy.tsx +++ b/app/src/components/market/market_buy/market_buy.tsx @@ -76,6 +76,7 @@ const MarketBuyWrapper: React.FC = (props: Props) => { potentialProfitFormatted, probabilitiesOrNewPrediction: probabilities, proxyIsUpToDate, + relayFeeGreaterThanAmount, setAmount, setAmountDisplay, setCollateral, @@ -261,6 +262,16 @@ const MarketBuyWrapper: React.FC = (props: Props) => { marginBottom={!showSetAllowance} /> )} + {relayFeeGreaterThanAmount && ( + + )} {showSetAllowance && ( { potentialProfitFormatted, probabilitiesOrNewPrediction: newPrediction, proxyIsUpToDate, + relayFeeGreaterThanAmount, setAmount, setAmountDisplay, setCollateral, @@ -271,6 +272,16 @@ export const ScalarMarketBuy = (props: Props) => { hyperlinkDescription={''} /> )} + {relayFeeGreaterThanAmount && ( + + )} {showSetAllowance && ( = (props: Props) => { message, poolTokens, proxyIsUpToDate, + relayFeeGreaterThanAmount, removeFunding, setActiveTab, setAmountToFund, @@ -303,6 +304,16 @@ const MarketPoolLiquidityWrapper: React.FC = (props: Props) => { href={DOCUMENT_FAQ} hyperlinkDescription="More Info" /> + {activeTab === Tabs.deposit && relayFeeGreaterThanAmount && ( + + )} {isNegativeAmountToFund && ( { message, poolTokens, proxyIsUpToDate, + relayFeeGreaterThanAmount, removeFunding, setActiveTab, setAmountToFund, @@ -331,6 +332,16 @@ export const ScalarMarketPoolLiquidity = (props: Props) => { href={DOCUMENT_FAQ} hyperlinkDescription="More Info" /> + {activeTab === Tabs.deposit && relayFeeGreaterThanAmount && ( + + )} {isNegativeAmountToFund && ( { + const { account, balances, networkId, relay } = useConnectedWeb3Context() + + const [relayAddress, setRelayAddress] = useState('') + const [relayFee, setRelayFee] = useState(new BigNumber('0')) + const [relayFeeGreaterThanAmount, setRelayFeeGreaterThanAmount] = useState(false) + const [relayFeeGreaterThanBalance, setRelayFeeGreaterThanBalance] = useState(false) + + const fetchRelayInfo = async (status?: Status) => { + const relayService = new RelayService() + const { address, fee } = await relayService.getInfo() + if (!status || status.active) { + setRelayAddress(address) + + const feeBN = new BigNumber(fee) + setRelayFee(feeBN) + setRelayFeeGreaterThanBalance(feeBN.gt(balances.xDaiBalance)) + } + } + + useEffect(() => { + const status = { active: true } + if (account && relay) { + fetchRelayInfo(status) + } else { + setRelayAddress('') + setRelayFee(new BigNumber('0')) + setRelayFeeGreaterThanBalance(false) + } + return () => { + status.active = false + } + // eslint-disable-next-line + }, [account, networkId, relay]) + + useEffect(() => { + if (account && relay) { + const native = getNativeAsset(networkId, relay) + const feeGreaterThanAmount = + relay && amount && !amount.isZero() && relayFee.gt(amount) && collateral.address === native.address + setRelayFeeGreaterThanAmount(feeGreaterThanAmount) + } else { + setRelayFeeGreaterThanAmount(false) + } + }, [amount, collateral, account, relay, networkId, relayFee]) + + return { relayAddress, relayFee, relayFeeGreaterThanAmount, relayFeeGreaterThanBalance } +} diff --git a/app/src/pages/market_sections/market_buy_container.tsx b/app/src/pages/market_sections/market_buy_container.tsx index d124616a7e..fa7d475e1e 100644 --- a/app/src/pages/market_sections/market_buy_container.tsx +++ b/app/src/pages/market_sections/market_buy_container.tsx @@ -6,7 +6,14 @@ import { STANDARD_DECIMALS } from '../../common/constants' import { MarketBuy } from '../../components/market/market_buy/market_buy' import { ScalarMarketBuy } from '../../components/market/market_buy/scalar_market_buy' import { ConnectedWeb3Context, useConnectedWeb3Context } from '../../contexts' -import { useAsyncDerivedValue, useCollateralBalance, useContracts, useCpkAllowance, useCpkProxy } from '../../hooks' +import { + useAsyncDerivedValue, + useCollateralBalance, + useContracts, + useCpkAllowance, + useCpkProxy, + useRelay, +} from '../../hooks' import { CPKService, MarketMakerService } from '../../services' import { getNativeAsset, pseudoNativeAssetAddress } from '../../util/networks' import { RemoteData } from '../../util/remote_data' @@ -84,6 +91,7 @@ export type SharedPropsInterface = { txHash: string setTxState: any txState: TransactionStep + relayFeeGreaterThanAmount: boolean } const MarketBuyContainer: React.FC = (props: Props) => { @@ -117,6 +125,8 @@ const MarketBuyContainer: React.FC = (props: Props) => { context, ) + const { relayFeeGreaterThanAmount } = useRelay(amount, collateral) + useEffect(() => { setIsNegativeAmount((amount || Zero).lt(Zero)) }, [amount, collateral.decimals]) @@ -244,7 +254,8 @@ const MarketBuyContainer: React.FC = (props: Props) => { hasEnoughAllowance !== Ternary.True) || amountError !== null || isNegativeAmount || - !isUpdated + !isUpdated || + relayFeeGreaterThanAmount const shouldDisplayMaxButton = collateral.address !== pseudoNativeAssetAddress const sharesTotal = bigNumberToString(tradedShares, collateral.decimals) @@ -312,6 +323,7 @@ const MarketBuyContainer: React.FC = (props: Props) => { txHash: context.txHash, setTxState: context.setTxState, txState: context.txState, + relayFeeGreaterThanAmount, } return ( diff --git a/app/src/pages/market_sections/market_pool_liquidity_container.tsx b/app/src/pages/market_sections/market_pool_liquidity_container.tsx index ec03328e22..5b0d42ace0 100644 --- a/app/src/pages/market_sections/market_pool_liquidity_container.tsx +++ b/app/src/pages/market_sections/market_pool_liquidity_container.tsx @@ -6,7 +6,14 @@ import { STANDARD_DECIMALS } from '../../common/constants' import { MarketPoolLiquidity } from '../../components/market/market_pooling/market_pool_liquidity' import { ScalarMarketPoolLiquidity } from '../../components/market/market_pooling/scalar_market_pool_liquidity' import { useConnectedWeb3Context } from '../../contexts' -import { useCollateralBalance, useContracts, useCpkAllowance, useCpkProxy, useFundingBalance } from '../../hooks' +import { + useCollateralBalance, + useContracts, + useCpkAllowance, + useCpkProxy, + useFundingBalance, + useRelay, +} from '../../hooks' import { getLogger } from '../../util/logger' import { pseudoNativeAssetAddress } from '../../util/networks' import { RemoteData } from '../../util/remote_data' @@ -80,6 +87,7 @@ export type SharedPropsInterface = { setAmountToRemoveDisplay: any amountToRemove: Maybe setAmountToRemove: any + relayFeeGreaterThanAmount: boolean } const MarketPoolLiquidityContainer: React.FC = (props: Props) => { @@ -125,6 +133,8 @@ const MarketPoolLiquidityContainer: React.FC = (props: Props) => { const walletBalance = bigNumberToString(collateralBalance, collateral.decimals, 5) const sharesBalance = bigNumberToString(fundingBalance, collateral.decimals) + const { relayFeeGreaterThanAmount } = useRelay(amountToFund || new BigNumber(0), collateral) + const { proxyIsUpToDate, updateProxy } = useCpkProxy() const isUpdated = RemoteData.hasData(proxyIsUpToDate) ? proxyIsUpToDate.data : true @@ -161,7 +171,8 @@ const MarketPoolLiquidityContainer: React.FC = (props: Props) => { (!cpk?.isSafeApp && collateral.address !== pseudoNativeAssetAddress && hasEnoughAllowance !== Ternary.True) || collateralAmountError !== null || currentDate > resolutionDate || - isNegativeAmountToFund + isNegativeAmountToFund || + relayFeeGreaterThanAmount const totalUserShareAmounts = calcRemoveFundingSendAmounts( fundingBalance, @@ -374,6 +385,7 @@ const MarketPoolLiquidityContainer: React.FC = (props: Props) => { setAmountToRemove, amountToRemoveDisplay, setAmountToRemoveDisplay, + relayFeeGreaterThanAmount, } return ( diff --git a/app/src/services/cpk/fns.ts b/app/src/services/cpk/fns.ts index 0d1a111c37..67ff669755 100644 --- a/app/src/services/cpk/fns.ts +++ b/app/src/services/cpk/fns.ts @@ -103,14 +103,22 @@ export const exec = async (params: ExecParams) => { */ interface FeeParams { - service: CPKService amount: BigNumber + collateral: Token + service: CPKService + native: Token } export const fee = async (params: FeeParams) => { - const { service } = params - const amount = await service.subRelayFee(params.amount) - return { ...params, amount } + const { collateral, native, service } = params + if (service.cpk.relay && collateral.address === native.address) { + const amount = await service.subRelayFee(params.amount) + if (amount.lte(0)) { + throw new Error('Purchase amount is too small') + } + return { ...params, amount } + } + return params } /** diff --git a/app/src/services/index.ts b/app/src/services/index.ts index 8495d5810f..2583e14245 100644 --- a/app/src/services/index.ts +++ b/app/src/services/index.ts @@ -11,3 +11,4 @@ export { OvmService } from './ovm' export { XdaiService } from './xdai' export { AirdropService } from './airdrop' export { OmenGuildService } from './guild' +export { RelayService } from './relay' From 1601119fd6c8083ae7294472e21cf7d1a89fa6dc Mon Sep 17 00:00:00 2001 From: hexyls Date: Tue, 24 Aug 2021 15:58:12 +1000 Subject: [PATCH 2/6] fix: add relay balanace warning to buys, sells and pooling --- .../message_text/warning_message/index.tsx | 2 +- .../market/market_buy/market_buy.tsx | 11 ++++++++++ .../market/market_buy/scalar_market_buy.tsx | 11 ++++++++++ .../steps/items/funding_and_fee_step.tsx | 22 ++++++++++++++++++- .../market_pooling/market_pool_liquidity.tsx | 11 ++++++++++ .../scalar_market_pool_liquidity.tsx | 11 ++++++++++ .../market/market_sell/market_sell.tsx | 10 +++++++++ .../market/market_sell/scalar_market_sell.tsx | 10 +++++++++ app/src/hooks/useRelay.tsx | 4 ++-- .../market_sections/market_buy_container.tsx | 7 ++++-- .../market_pool_liquidity_container.tsx | 7 +++++- .../market_sections/market_sell_container.tsx | 6 ++++- 12 files changed, 104 insertions(+), 8 deletions(-) diff --git a/app/src/components/market/common_sections/message_text/warning_message/index.tsx b/app/src/components/market/common_sections/message_text/warning_message/index.tsx index 5ac8c8103e..10a7c1269d 100644 --- a/app/src/components/market/common_sections/message_text/warning_message/index.tsx +++ b/app/src/components/market/common_sections/message_text/warning_message/index.tsx @@ -59,7 +59,7 @@ export const WarningMessage = (props: Props) => { grayscale, href, hyperlinkDescription, - marginBottom, + marginBottom = true, ...restProps } = props return ( diff --git a/app/src/components/market/market_buy/market_buy.tsx b/app/src/components/market/market_buy/market_buy.tsx index 05b0732d71..b31219ffb8 100644 --- a/app/src/components/market/market_buy/market_buy.tsx +++ b/app/src/components/market/market_buy/market_buy.tsx @@ -77,6 +77,7 @@ const MarketBuyWrapper: React.FC = (props: Props) => { probabilitiesOrNewPrediction: probabilities, proxyIsUpToDate, relayFeeGreaterThanAmount, + relayFeeGreaterThanBalance, setAmount, setAmountDisplay, setCollateral, @@ -272,6 +273,16 @@ const MarketBuyWrapper: React.FC = (props: Props) => { marginBottom={!showSetAllowance} /> )} + {relayFeeGreaterThanBalance && ( + + )} {showSetAllowance && ( { probabilitiesOrNewPrediction: newPrediction, proxyIsUpToDate, relayFeeGreaterThanAmount, + relayFeeGreaterThanBalance, setAmount, setAmountDisplay, setCollateral, @@ -282,6 +283,16 @@ export const ScalarMarketBuy = (props: Props) => { marginBottom={!showSetAllowance} /> )} + {relayFeeGreaterThanBalance && ( + + )} {showSetAllowance && ( = (props: Props) => { const { proxyIsUpToDate, updateProxy } = useCpkProxy(collateral.address === pseudoNativeAssetAddress) const isUpdated = RemoteData.hasData(proxyIsUpToDate) ? proxyIsUpToDate.data : true + const { relayFeeGreaterThanAmount, relayFeeGreaterThanBalance } = useRelay(amount || new BigNumber(0), collateral) + useEffect(() => { dispatch(fetchAccountBalance(account, provider, collateral)) }, [dispatch, account, provider, collateral]) @@ -546,6 +548,24 @@ const FundingAndFeeStep: React.FC = (props: Props) => { style={{ marginBottom: 20 }} /> )} + {relayFeeGreaterThanAmount && ( + + )} + {relayFeeGreaterThanBalance && ( + + )} = (props: Props) => { poolTokens, proxyIsUpToDate, relayFeeGreaterThanAmount, + relayFeeGreaterThanBalance, removeFunding, setActiveTab, setAmountToFund, @@ -314,6 +315,16 @@ const MarketPoolLiquidityWrapper: React.FC = (props: Props) => { marginBottom /> )} + {relayFeeGreaterThanBalance && ( + + )} {isNegativeAmountToFund && ( { poolTokens, proxyIsUpToDate, relayFeeGreaterThanAmount, + relayFeeGreaterThanBalance, removeFunding, setActiveTab, setAmountToFund, @@ -342,6 +343,16 @@ export const ScalarMarketPoolLiquidity = (props: Props) => { marginBottom /> )} + {relayFeeGreaterThanBalance && ( + + )} {isNegativeAmountToFund && ( = (props: Props) => { outcomeIndex, potentialValue, probabilitiesOrNewPrediction: probabilities, + relayFeeGreaterThanBalance, selectedOutcomeBalance, setAmountSharesFromInput, setAmountSharesToDisplay, @@ -162,6 +163,15 @@ const MarketSellWrapper: React.FC = (props: Props) => { marginBottom={true} /> )} + {relayFeeGreaterThanBalance && ( + + )}