diff --git a/components/AccountSwitcher.vue b/components/AccountSwitcher.vue index fac600b..71fcdd0 100644 --- a/components/AccountSwitcher.vue +++ b/components/AccountSwitcher.vue @@ -108,11 +108,13 @@ diff --git a/components/Spinner.vue b/components/Spinner.vue new file mode 100644 index 0000000..1174ca9 --- /dev/null +++ b/components/Spinner.vue @@ -0,0 +1,14 @@ + + + diff --git a/components/ValidationErrors.vue b/components/ValidationErrors.vue new file mode 100644 index 0000000..3be9115 --- /dev/null +++ b/components/ValidationErrors.vue @@ -0,0 +1,32 @@ + + + diff --git a/components/common/ProgressBar.vue b/components/common/ProgressBar.vue new file mode 100644 index 0000000..0a4e805 --- /dev/null +++ b/components/common/ProgressBar.vue @@ -0,0 +1,37 @@ + + + diff --git a/components/common/input/ButtonCTA.vue b/components/common/input/ButtonCTA.vue new file mode 100644 index 0000000..51d2d81 --- /dev/null +++ b/components/common/input/ButtonCTA.vue @@ -0,0 +1,41 @@ + + + diff --git a/components/common/input/ToggleButton.vue b/components/common/input/ToggleButton.vue new file mode 100644 index 0000000..f4bfff3 --- /dev/null +++ b/components/common/input/ToggleButton.vue @@ -0,0 +1,60 @@ + + + diff --git a/components/sidebar/context/SidebarContextHeading.vue b/components/sidebar/context/SidebarContextHeading.vue new file mode 100644 index 0000000..c54bf8c --- /dev/null +++ b/components/sidebar/context/SidebarContextHeading.vue @@ -0,0 +1,3 @@ + diff --git a/components/sidebar/context/SidebarContextRootContainer.vue b/components/sidebar/context/SidebarContextRootContainer.vue index 5765089..930a322 100644 --- a/components/sidebar/context/SidebarContextRootContainer.vue +++ b/components/sidebar/context/SidebarContextRootContainer.vue @@ -3,7 +3,7 @@
-
+
diff --git a/components/sidebar/context/aaveV2/SidebarAaveV2Supply.vue b/components/sidebar/context/aaveV2/SidebarAaveV2Supply.vue index 5e9d542..aa98db7 100644 --- a/components/sidebar/context/aaveV2/SidebarAaveV2Supply.vue +++ b/components/sidebar/context/aaveV2/SidebarAaveV2Supply.vue @@ -2,15 +2,65 @@ - + - +
- + +
+ +
+ +
+
+
Set Max
+ + +
+ + Projected Debt Position + +
+ + + +
+ + + + + +
+ +
+ + Supply + +
+ +
@@ -19,37 +69,122 @@ import { computed, defineComponent, ref } from '@nuxtjs/composition-api' import InputNumeric from '~/components/common/input/InputNumeric.vue' import { useAaveV2Position } from '~/composables/useAaveV2Position' +import { useBalances } from '~/composables/useBalances' +import { useBigNumber } from '~/composables/useBigNumber' import { useFormatting } from '~/composables/useFormatting' +import { useValidators } from '~/composables/useValidators' +import { useValidation } from '~/composables/useValidation' import { useToken } from '~/composables/useToken' +import { useParsing } from '~/composables/useParsing' +import { useMaxAmountActive } from '~/composables/useMaxAmountActive' +import { useWeb3 } from '~/composables/useWeb3' +import atokens from '~/constant/atokens' +import ToggleButton from '~/components/common/input/ToggleButton.vue' +import { useDSA } from '~/composables/useDSA' +import ButtonCTA from '~/components/common/input/ButtonCTA.vue' +import { useNotification } from '~/composables/useNotification' export default defineComponent({ - components: { InputNumeric }, + components: { InputNumeric, ToggleButton, ButtonCTA }, props: { tokenKey: { type: String, required: true }, }, setup(props) { - const { status, displayPositions } = useAaveV2Position() - // const { formatUsd, formatUsdMax, formatNumber, formatDecimal } = useFormatting() + const { showTransaction } = useNotification() + const { networkName, account } = useWeb3() + const { dsa } = useDSA() + const { getTokenByKey, valInt } = useToken() + const { getBalanceByKey } = useBalances() + const { formatNumber, formatUsdMax, formatUsd } = useFormatting() + const { isZero, gt, plus } = useBigNumber() + const { parseSafeFloat } = useParsing() + + const { status, displayPositions, maxLiquidation, liquidationPrice, liquidationMaxPrice } = useAaveV2Position({ + overridePosition: (position) => { + if (rootTokenKey.value !== position.key) return position + + return { + ...position, + supply: plus(position.supply, amountParsed.value).toFixed(), + } + }, + }) const amount = ref('') + const amountParsed = computed(() => parseSafeFloat(amount.value)) - const rootTokenKey = computed(() => 'eth') + const rootTokenKey = computed(() => atokens[networkName.value].rootTokens.includes(props.tokenKey) ? props.tokenKey : 'eth') - const { getTokenByKey } = useToken() - - const token = computed(() => getTokenByKey(props.tokenKey)) + const token = computed(() => getTokenByKey(rootTokenKey.value)) const symbol = computed(() => token.value?.symbol) + const decimals = computed(() => token.value?.decimals) + const balance = computed(() => getBalanceByKey(rootTokenKey.value)) + const address = computed(() => token.value?.address) + const factor = computed( + () => displayPositions.value?.find((position) => rootTokenKey.value === position.key)?.factor + ) - const balance = computed(() => "0") + const { toggle, isMaxAmount } = useMaxAmountActive(amount, balance) + + const { validateAmount, validateLiquidation, validateIsLoggedIn } = useValidators() + const errors = computed(() => { + const hasAmountValue = !isZero(amount.value) + const liqValid = gt(factor.value, '0') ? validateLiquidation(status.value, maxLiquidation.value) : null + + return { + amount: { message: validateAmount(amountParsed.value, balance.value), show: hasAmountValue }, + liquidation: { message: liqValid, show: hasAmountValue }, + auth: { message: validateIsLoggedIn(!!account.value), show: true }, + } + }) + const { errorMessages, isValid } = useValidation(errors) + + const pending = ref(false) + + async function cast() { + pending.value = true + + const amount = isMaxAmount.value ? dsa.value.maxValue : valInt(amountParsed.value, decimals.value) + + const spells = dsa.value.Spell() + + spells.add({ + connector: 'aave_v2', + method: 'deposit', + args: [address.value, amount, 0, 0], + }) + + window.dsa = dsa.value + + const txHash = await dsa.value.cast({ + spells, + from: account.value, + }) + + pending.value = false + } return { + pending, + cast, + errors, amount, status, rootTokenKey, token, symbol, balance, + formatNumber, + formatUsdMax, + formatUsd, + toggle, + isMaxAmount, + maxLiquidation, + liquidationPrice, + liquidationMaxPrice, + errorMessages, + isValid } }, }) diff --git a/components/sidebar/context/components/SidebarSectionStatus.vue b/components/sidebar/context/components/SidebarSectionStatus.vue index d1f3db8..480502d 100644 --- a/components/sidebar/context/components/SidebarSectionStatus.vue +++ b/components/sidebar/context/components/SidebarSectionStatus.vue @@ -8,18 +8,20 @@
{{ formatPercent(status) }}
- +