From 918e944ed434716071a74e80e73bc6a43e9b9a00 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Peter=20Slan=C3=BD?= <47864599+peterslany@users.noreply.github.com> Date: Tue, 30 May 2023 16:23:02 +0200 Subject: [PATCH] Peter/earn strategies feat deposit withdraw form (#1229) * chore: update monetary to latest 0.7.3 * wip * feat(earn-strategies): add deposit and withdrawal form components * refactor: add padding under tabs in earn strategy forms * chore(earn-strategies): change file structure --- src/assets/locales/en/translation.json | 7 +- .../ReceivableAssets/index.tsx} | 14 +-- src/components/index.tsx | 1 + src/lib/form/schemas/earn-strategy.ts | 21 ++++ src/lib/form/schemas/index.ts | 1 + .../components/WithdrawForm/WithdrawForm.tsx | 5 +- .../EarnStrategies/EarnStrategies.style.tsx | 13 +++ src/pages/EarnStrategies/EarnStrategies.tsx | 9 +- .../EarnStrategyDepositForm.tsx | 66 +++++++++++ .../EarnStrategyDepositForm/index.ts | 1 + .../EarnStrategyForm.style.tsx | 34 ++++++ .../EarnStrategyForm/EarnStrategyForm.tsx | 61 ++++++++++ .../EarnStrategyForm/EarnStrategyFormFees.tsx | 35 ++++++ .../EarnStrategyWithdrawalForm.tsx | 104 ++++++++++++++++++ .../EarnStrategyWithdrawalForm/index.ts | 1 + .../components/EarnStrategyForm/index.ts | 1 + src/pages/EarnStrategies/components/index.ts | 1 + src/pages/EarnStrategies/types/form.ts | 18 +++ yarn.lock | 9 ++ 19 files changed, 390 insertions(+), 12 deletions(-) rename src/{pages/AMM/Pools/components/WithdrawForm/WithdrawAssets.tsx => components/ReceivableAssets/index.tsx} (82%) create mode 100644 src/lib/form/schemas/earn-strategy.ts create mode 100644 src/pages/EarnStrategies/EarnStrategies.style.tsx create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/EarnStrategyDepositForm.tsx create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/index.ts create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.style.tsx create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.tsx create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyFormFees.tsx create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/EarnStrategyWithdrawalForm.tsx create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/index.ts create mode 100644 src/pages/EarnStrategies/components/EarnStrategyForm/index.ts create mode 100644 src/pages/EarnStrategies/components/index.ts create mode 100644 src/pages/EarnStrategies/types/form.ts diff --git a/src/assets/locales/en/translation.json b/src/assets/locales/en/translation.json index e3a0d7164b..defab36d41 100644 --- a/src/assets/locales/en/translation.json +++ b/src/assets/locales/en/translation.json @@ -20,6 +20,7 @@ "reimbursed": "Reimbursed", "online": "Online", "offline": "Offline", + "available": "Available", "unavailable": "Unavailable", "ok": "OK", "pending": "Pending", @@ -154,6 +155,7 @@ "unlocks": "Unlocks", "staked": "Staked", "sign_t&cs": "Sign T&Cs", + "receivable_assets": "Receivable Assets", "redeem_page": { "maximum_in_single_request": "Max redeemable in single request", "redeem": "Redeem", @@ -586,7 +588,6 @@ "pool_name": "Pool Name", "add_liquidity": "Add Liquidity", "remove_liquidity": "Remove Liquidity", - "receivable_assets": "Receivable Assets", "initial_rate_warning": "Note: You are setting the initial exchange rate of this pool. Make sure it reflects the exchange rate on other markets, please." }, "swap": "Swap", @@ -631,5 +632,9 @@ "total_governance_locked": "Total {{token}} Locked", "available_to_stake": "Available to stake", "voting_power_governance": "Voting Power {{token}}" + }, + "earn_strategy": { + "withdraw_rewards_in_wrapped": "Withdraw rewards in {{wrappedCurrencySymbol}}:", + "update_position": "Update position" } } diff --git a/src/pages/AMM/Pools/components/WithdrawForm/WithdrawAssets.tsx b/src/components/ReceivableAssets/index.tsx similarity index 82% rename from src/pages/AMM/Pools/components/WithdrawForm/WithdrawAssets.tsx rename to src/components/ReceivableAssets/index.tsx index 0558749d28..9c4fecef5f 100644 --- a/src/pages/AMM/Pools/components/WithdrawForm/WithdrawAssets.tsx +++ b/src/components/ReceivableAssets/index.tsx @@ -7,18 +7,18 @@ import { CoinIcon, Dd, Dl, DlGroup, Dt, Flex, P } from '@/component-library'; import { getTokenPrice } from '@/utils/helpers/prices'; import { Prices } from '@/utils/hooks/api/use-get-prices'; -type WithdrawAssetsProps = { - pooledAmounts: MonetaryAmount[]; +type ReceivableAssetsProps = { + assetAmounts: MonetaryAmount[]; prices?: Prices; }; -const WithdrawAssets = ({ pooledAmounts, prices }: WithdrawAssetsProps): JSX.Element => { +const ReceivableAssets = ({ assetAmounts: pooledAmounts, prices }: ReceivableAssetsProps): JSX.Element => { const { t } = useTranslation(); return (

- {t('amm.pools.receivable_assets')} + {t('receivable_assets')}

{pooledAmounts.map((amount) => { @@ -50,7 +50,7 @@ const WithdrawAssets = ({ pooledAmounts, prices }: WithdrawAssetsProps): JSX.Ele ); }; -WithdrawAssets.displayName = 'WithdrawAssets'; +ReceivableAssets.displayName = 'ReceivableAssets'; -export { WithdrawAssets }; -export type { WithdrawAssetsProps }; +export { ReceivableAssets }; +export type { ReceivableAssetsProps }; diff --git a/src/components/index.tsx b/src/components/index.tsx index 5149bf3220..83fc0ca6aa 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -12,3 +12,4 @@ export type { LoanPositionsTableProps } from './LoanPositionsTable'; export { LoanPositionsTable } from './LoanPositionsTable'; export type { PoolsTableProps } from './PoolsTable'; export { PoolsTable } from './PoolsTable'; +export { ReceivableAssets } from './ReceivableAssets'; diff --git a/src/lib/form/schemas/earn-strategy.ts b/src/lib/form/schemas/earn-strategy.ts new file mode 100644 index 0000000000..75dd1f1b15 --- /dev/null +++ b/src/lib/form/schemas/earn-strategy.ts @@ -0,0 +1,21 @@ +import { EarnStrategyFormType } from '@/pages/EarnStrategies/types/form'; + +import yup, { MaxAmountValidationParams, MinAmountValidationParams } from '../yup.custom'; + +type EarnStrategyValidationParams = MaxAmountValidationParams & MinAmountValidationParams; + +const earnStrategySchema = ( + earnStrategyFormType: EarnStrategyFormType, + params: EarnStrategyValidationParams +): yup.ObjectSchema => { + return yup.object().shape({ + [earnStrategyFormType]: yup + .string() + .requiredAmount(earnStrategyFormType) + .maxAmount(params) + .minAmount(params, earnStrategyFormType) + }); +}; + +export { earnStrategySchema }; +export type { EarnStrategyValidationParams }; diff --git a/src/lib/form/schemas/index.ts b/src/lib/form/schemas/index.ts index a792ef0fbe..87a172bab2 100644 --- a/src/lib/form/schemas/index.ts +++ b/src/lib/form/schemas/index.ts @@ -5,6 +5,7 @@ export type { WithdrawLiquidityPoolValidationParams } from './amm'; export { depositLiquidityPoolSchema, WITHDRAW_LIQUIDITY_POOL_FIELD, withdrawLiquidityPoolSchema } from './amm'; +export { earnStrategySchema } from './earn-strategy'; export type { LoanFormData, LoanValidationParams } from './loans'; export { loanSchema } from './loans'; export type { SwapFormData, SwapValidationParams } from './swap'; diff --git a/src/pages/AMM/Pools/components/WithdrawForm/WithdrawForm.tsx b/src/pages/AMM/Pools/components/WithdrawForm/WithdrawForm.tsx index 4f2ea60b55..2d74a356af 100644 --- a/src/pages/AMM/Pools/components/WithdrawForm/WithdrawForm.tsx +++ b/src/pages/AMM/Pools/components/WithdrawForm/WithdrawForm.tsx @@ -10,7 +10,7 @@ import { newSafeMonetaryAmount } from '@/common/utils/utils'; import { Dd, DlGroup, Dt, Flex, TokenInput } from '@/component-library'; -import { AuthCTA } from '@/components'; +import { AuthCTA, ReceivableAssets } from '@/components'; import { GOVERNANCE_TOKEN, TRANSACTION_FEE_AMOUNT } from '@/config/relay-chains'; import { isFormDisabled, useForm, WITHDRAW_LIQUIDITY_POOL_FIELD } from '@/lib/form'; import { WithdrawLiquidityPoolFormData, withdrawLiquidityPoolSchema } from '@/lib/form/schemas'; @@ -23,7 +23,6 @@ import { Transaction, useTransaction } from '@/utils/hooks/transaction'; import useAccountId from '@/utils/hooks/use-account-id'; import { PoolName } from '../PoolName'; -import { WithdrawAssets } from './WithdrawAssets'; import { StyledDl } from './WithdrawForm.styles'; type WithdrawFormProps = { @@ -126,7 +125,7 @@ const WithdrawForm = ({ pool, slippageModalRef, onWithdraw }: WithdrawFormProps) {...form.getFieldProps(WITHDRAW_LIQUIDITY_POOL_FIELD)} /> - +
diff --git a/src/pages/EarnStrategies/EarnStrategies.style.tsx b/src/pages/EarnStrategies/EarnStrategies.style.tsx new file mode 100644 index 0000000000..8bc1b94263 --- /dev/null +++ b/src/pages/EarnStrategies/EarnStrategies.style.tsx @@ -0,0 +1,13 @@ +import styled from 'styled-components'; + +import { theme } from '@/component-library'; +const StyledEarnStrategiesLayout = styled.div` + display: grid; + gap: ${theme.spacing.spacing6}; + @media (min-width: 80em) { + grid-template-columns: 1fr 1fr; + } + padding: ${theme.spacing.spacing6}; +`; + +export { StyledEarnStrategiesLayout }; diff --git a/src/pages/EarnStrategies/EarnStrategies.tsx b/src/pages/EarnStrategies/EarnStrategies.tsx index 84ab2c0d2b..bd1eac8fdc 100644 --- a/src/pages/EarnStrategies/EarnStrategies.tsx +++ b/src/pages/EarnStrategies/EarnStrategies.tsx @@ -2,8 +2,15 @@ import { withErrorBoundary } from 'react-error-boundary'; import ErrorFallback from '@/legacy-components/ErrorFallback'; +import { EarnStrategyForm } from './components/EarnStrategyForm'; +import { StyledEarnStrategiesLayout } from './EarnStrategies.style'; + const EarnStrategies = (): JSX.Element => { - return

Earn Strategies

; + return ( + + + + ); }; export default withErrorBoundary(EarnStrategies, { diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/EarnStrategyDepositForm.tsx b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/EarnStrategyDepositForm.tsx new file mode 100644 index 0000000000..b0939fd093 --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/EarnStrategyDepositForm.tsx @@ -0,0 +1,66 @@ +import { newMonetaryAmount } from '@interlay/interbtc-api'; +import { mergeProps } from '@react-aria/utils'; +import { useTranslation } from 'react-i18next'; + +import { convertMonetaryAmountToValueInUSD, newSafeMonetaryAmount } from '@/common/utils/utils'; +import { TokenInput } from '@/component-library'; +import { AuthCTA } from '@/components'; +import { TRANSACTION_FEE_AMOUNT, WRAPPED_TOKEN, WRAPPED_TOKEN_SYMBOL } from '@/config/relay-chains'; +import { earnStrategySchema, isFormDisabled, useForm } from '@/lib/form'; +import { useGetBalances } from '@/utils/hooks/api/tokens/use-get-balances'; +import { useGetPrices } from '@/utils/hooks/api/use-get-prices'; +import { useTransaction } from '@/utils/hooks/transaction'; + +import { EarnStrategyDepositFormData } from '../../../types/form'; +import { EarnStrategyFormBaseProps } from '../EarnStrategyForm'; +import { StyledEarnStrategyFormContent } from '../EarnStrategyForm.style'; +import { EarnStrategyFormFees } from '../EarnStrategyFormFees'; + +const EarnStrategyDepositForm = ({ riskVariant, hasActiveStrategy }: EarnStrategyFormBaseProps): JSX.Element => { + const { getAvailableBalance } = useGetBalances(); + const prices = useGetPrices(); + const { t } = useTranslation(); + // TODO: add transaction + const transaction = useTransaction(); + + const handleSubmit = (data: EarnStrategyDepositFormData) => { + // TODO: Execute transaction with params + // transaction.execute(); + console.log(`transaction should be executed with parameters: ${data}, ${riskVariant}`); + }; + + const minAmount = newMonetaryAmount(1, WRAPPED_TOKEN); + const maxDepositAmount = getAvailableBalance(WRAPPED_TOKEN_SYMBOL) || newMonetaryAmount(0, WRAPPED_TOKEN); + + const form = useForm({ + initialValues: { deposit: '' }, + validationSchema: earnStrategySchema('deposit', { maxAmount: maxDepositAmount, minAmount }), + onSubmit: handleSubmit + }); + + const inputMonetaryAmount = newSafeMonetaryAmount(form.values['deposit'] || 0, WRAPPED_TOKEN, true); + const inputUSDValue = convertMonetaryAmountToValueInUSD(inputMonetaryAmount, prices?.[WRAPPED_TOKEN_SYMBOL].usd); + const isSubmitButtonDisabled = isFormDisabled(form); + + return ( +
+ + + + + {hasActiveStrategy ? t('earn_strategy.update_position') : t('deposit')} + + +
+ ); +}; + +export { EarnStrategyDepositForm }; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/index.ts b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/index.ts new file mode 100644 index 0000000000..aaedb7d4bb --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyDepositForm/index.ts @@ -0,0 +1 @@ +export { EarnStrategyDepositForm } from './EarnStrategyDepositForm'; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.style.tsx b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.style.tsx new file mode 100644 index 0000000000..4179c1e7a4 --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.style.tsx @@ -0,0 +1,34 @@ +import styled from 'styled-components'; + +import { Dl, Flex, theme } from '@/component-library'; + +const StyledEarnStrategyForm = styled(Flex)` + margin-top: ${theme.spacing.spacing8}; + background: ${theme.colors.bgPrimary}; + padding: ${theme.spacing.spacing6}; + border-radius: ${theme.rounded.md}; +`; + +const StyledDl = styled(Dl)` + background-color: ${theme.card.bg.secondary}; + padding: ${theme.spacing.spacing4}; + font-size: ${theme.text.xs}; + border-radius: ${theme.rounded.rg}; +`; + +const StyledEarnStrategyFormContent = styled(Flex)` + margin-top: ${theme.spacing.spacing8}; + flex-direction: column; + gap: ${theme.spacing.spacing8}; +`; + +const StyledSwitchLabel = styled('label')` + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + width: 100%; + font-weight: ${theme.fontWeight.bold}; +`; + +export { StyledDl, StyledEarnStrategyForm, StyledEarnStrategyFormContent, StyledSwitchLabel }; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.tsx b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.tsx new file mode 100644 index 0000000000..7f4ba377d5 --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyForm.tsx @@ -0,0 +1,61 @@ +import { newMonetaryAmount } from '@interlay/interbtc-api'; + +import { Tabs, TabsItem } from '@/component-library'; +import { WRAPPED_TOKEN } from '@/config/relay-chains'; + +import { EarnStrategyFormType, EarnStrategyRiskVariant } from '../../types/form'; +import { EarnStrategyDepositForm } from './EarnStrategyDepositForm'; +import { StyledEarnStrategyForm } from './EarnStrategyForm.style'; +import { EarnStrategyWithdrawalForm } from './EarnStrategyWithdrawalForm'; + +interface EarnStrategyFormProps { + riskVariant: EarnStrategyRiskVariant; +} + +interface EarnStrategyFormBaseProps extends EarnStrategyFormProps { + hasActiveStrategy: boolean | undefined; +} + +type TabData = { type: EarnStrategyFormType; title: string }; + +const tabs: Array = [ + { + type: 'deposit', + title: 'Deposit' + }, + { + type: 'withdraw', + title: 'Withdraw' + } +]; + +const EarnStrategyForm = ({ riskVariant }: EarnStrategyFormProps): JSX.Element => { + // TODO: replace with actually withdrawable amount once we know how to get that information, + // for now it's statically set for display purposes + const maxWithdrawableAmount = newMonetaryAmount(1.337, WRAPPED_TOKEN, true); + const hasActiveStrategy = maxWithdrawableAmount && !maxWithdrawableAmount.isZero(); + + return ( + + + {tabs.map(({ type, title }) => ( + + {type === 'deposit' ? ( + + ) : ( + + )} + + ))} + + + ); +}; + +export { EarnStrategyForm }; +export type { EarnStrategyFormBaseProps, EarnStrategyFormProps }; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyFormFees.tsx b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyFormFees.tsx new file mode 100644 index 0000000000..007867f302 --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyFormFees.tsx @@ -0,0 +1,35 @@ +import { GovernanceCurrency } from '@interlay/interbtc-api'; +import { MonetaryAmount } from '@interlay/monetary-js'; +import { useTranslation } from 'react-i18next'; + +import { displayMonetaryAmountInUSDFormat } from '@/common/utils/utils'; +import { Dd, DlGroup, Dt } from '@/component-library'; +import { getTokenPrice } from '@/utils/helpers/prices'; +import { useGetPrices } from '@/utils/hooks/api/use-get-prices'; + +import { StyledDl } from './EarnStrategyForm.style'; + +interface EarnStrategyFormFeesProps { + amount: MonetaryAmount; +} + +const EarnStrategyFormFees = ({ amount }: EarnStrategyFormFeesProps): JSX.Element => { + const prices = useGetPrices(); + const { t } = useTranslation(); + + return ( + + +
+ {t('fees')} +
+
+ {amount.toHuman()} {amount.currency.ticker} ( + {displayMonetaryAmountInUSDFormat(amount, getTokenPrice(prices, amount.currency.ticker)?.usd)}) +
+ + + ); +}; + +export { EarnStrategyFormFees }; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/EarnStrategyWithdrawalForm.tsx b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/EarnStrategyWithdrawalForm.tsx new file mode 100644 index 0000000000..606fec950e --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/EarnStrategyWithdrawalForm.tsx @@ -0,0 +1,104 @@ +import { CurrencyExt, newMonetaryAmount, WrappedCurrency } from '@interlay/interbtc-api'; +import { MonetaryAmount } from '@interlay/monetary-js'; +import { mergeProps } from '@react-aria/utils'; +import { useTranslation } from 'react-i18next'; + +import { convertMonetaryAmountToValueInUSD, newSafeMonetaryAmount } from '@/common/utils/utils'; +import { Switch, TokenInput } from '@/component-library'; +import { AuthCTA, ReceivableAssets } from '@/components'; +import { + RELAY_CHAIN_NATIVE_TOKEN, + TRANSACTION_FEE_AMOUNT, + WRAPPED_TOKEN, + WRAPPED_TOKEN_SYMBOL +} from '@/config/relay-chains'; +import { earnStrategySchema, isFormDisabled, useForm } from '@/lib/form'; +import { useGetPrices } from '@/utils/hooks/api/use-get-prices'; +import { useTransaction } from '@/utils/hooks/transaction'; + +import { EarnStrategyWithdrawalFormData } from '../../../types/form'; +import { EarnStrategyFormBaseProps } from '../EarnStrategyForm'; +import { StyledEarnStrategyFormContent, StyledSwitchLabel } from '../EarnStrategyForm.style'; +import { EarnStrategyFormFees } from '../EarnStrategyFormFees'; + +interface EarnStrategyWithdrawalFormProps extends EarnStrategyFormBaseProps { + maxWithdrawableAmount: MonetaryAmount | undefined; +} + +const calculateReceivableAssets = ( + amountToWithdraw: MonetaryAmount, + withdrawInWrapped: boolean +): Array> => { + if (withdrawInWrapped) { + return [amountToWithdraw]; + } + // TODO: do some magic calculation to get the receivable assets based on input amount here, + // or better move this computation to earn-strategy hook + const mockedReceivableAssets = [ + amountToWithdraw.div(1.2), + newMonetaryAmount(amountToWithdraw.toBig().mul(213.2), RELAY_CHAIN_NATIVE_TOKEN, true) + ]; + + return mockedReceivableAssets; +}; + +const EarnStrategyWithdrawalForm = ({ + riskVariant, + hasActiveStrategy, + maxWithdrawableAmount +}: EarnStrategyWithdrawalFormProps): JSX.Element => { + const { t } = useTranslation(); + const prices = useGetPrices(); + // TODO: add transaction + const transaction = useTransaction(); + + const handleSubmit = (data: EarnStrategyWithdrawalFormData) => { + // TODO: Execute transaction with params + // transaction.execute() + console.log(data, riskVariant); + }; + + const minAmount = newMonetaryAmount(1, WRAPPED_TOKEN); + + const form = useForm({ + initialValues: { withdraw: '', withdrawAsWrapped: true }, + validationSchema: earnStrategySchema('withdraw', { + maxAmount: maxWithdrawableAmount || newMonetaryAmount(0, WRAPPED_TOKEN), + minAmount + }), + onSubmit: handleSubmit + }); + + const inputMonetaryAmount = newSafeMonetaryAmount(form.values['withdraw'] || 0, WRAPPED_TOKEN, true); + const inputUSDValue = convertMonetaryAmountToValueInUSD(inputMonetaryAmount, prices?.[WRAPPED_TOKEN_SYMBOL].usd); + const receivableAssets = calculateReceivableAssets(inputMonetaryAmount, !!form.values['withdrawAsWrapped']); + const isSubmitButtonDisabled = isFormDisabled(form); + + return ( +
+ + + + {t('earn_strategy.withdraw_rewards_in_wrapped', { wrappedCurrencySymbol: WRAPPED_TOKEN_SYMBOL })}{' '} + + + + + + {hasActiveStrategy ? t('earn_strategy.update_position') : t('withdraw')} + + +
+ ); +}; + +export { EarnStrategyWithdrawalForm }; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/index.ts b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/index.ts new file mode 100644 index 0000000000..aa5c13a062 --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/EarnStrategyWithdrawalForm/index.ts @@ -0,0 +1 @@ +export { EarnStrategyWithdrawalForm } from './EarnStrategyWithdrawalForm'; diff --git a/src/pages/EarnStrategies/components/EarnStrategyForm/index.ts b/src/pages/EarnStrategies/components/EarnStrategyForm/index.ts new file mode 100644 index 0000000000..dd8d107bb2 --- /dev/null +++ b/src/pages/EarnStrategies/components/EarnStrategyForm/index.ts @@ -0,0 +1 @@ +export { EarnStrategyForm } from './EarnStrategyForm'; diff --git a/src/pages/EarnStrategies/components/index.ts b/src/pages/EarnStrategies/components/index.ts new file mode 100644 index 0000000000..dd8d107bb2 --- /dev/null +++ b/src/pages/EarnStrategies/components/index.ts @@ -0,0 +1 @@ +export { EarnStrategyForm } from './EarnStrategyForm'; diff --git a/src/pages/EarnStrategies/types/form.ts b/src/pages/EarnStrategies/types/form.ts new file mode 100644 index 0000000000..c912d7e549 --- /dev/null +++ b/src/pages/EarnStrategies/types/form.ts @@ -0,0 +1,18 @@ +type EarnStrategyFormType = 'deposit' | 'withdraw'; +type EarnStrategyRiskVariant = 'low' | 'high'; + +interface EarnStrategyDepositFormData { + deposit?: string; +} + +interface EarnStrategyWithdrawalFormData { + withdraw?: string; + withdrawAsWrapped?: boolean; +} + +export type { + EarnStrategyDepositFormData, + EarnStrategyFormType, + EarnStrategyRiskVariant, + EarnStrategyWithdrawalFormData +}; diff --git a/yarn.lock b/yarn.lock index 77273acb3a..b05034e254 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2156,6 +2156,15 @@ big.js "6.1.1" typescript "^4.3.2" +"@interlay/monetary-js@0.7.3": + version "0.7.3" + resolved "https://registry.yarnpkg.com/@interlay/monetary-js/-/monetary-js-0.7.3.tgz#0bf4c56b15fde2fd0573e6cac185b0703f368133" + integrity sha512-LbCtLRNjl1/LO8R1ay6lJwKgOC/J40YywF+qSuQ7hEjLIkAslY5dLH11heQgQW9hOmqCSS5fTUQWXhmYQr6Ksg== + dependencies: + "@types/big.js" "6.1.2" + big.js "6.1.1" + typescript "^4.3.2" + "@internationalized/date@^3.0.1": version "3.0.1" resolved "https://registry.yarnpkg.com/@internationalized/date/-/date-3.0.1.tgz#66332e9ca8f59b7be010ca65d946bca430ba4b66"