-
Notifications
You must be signed in to change notification settings - Fork 181
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(fix): Abstract
LeavePool, use as depositor unbond (#2370)
- Loading branch information
Showing
7 changed files
with
175 additions
and
147 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,140 @@ | ||
| // Copyright 2024 @polkadot-cloud/polkadot-staking-dashboard authors & contributors | ||
| // SPDX-License-Identifier: GPL-3.0-only | ||
|
|
||
| import { faChevronLeft } from '@fortawesome/free-solid-svg-icons' | ||
| import { planckToUnit } from '@w3ux/utils' | ||
| import { PoolUnbond } from 'api/tx/poolUnbond' | ||
| import { useActiveAccounts } from 'contexts/ActiveAccounts' | ||
| import { useApi } from 'contexts/Api' | ||
| import { useBalances } from 'contexts/Balances' | ||
| import { useNetwork } from 'contexts/Network' | ||
| import { useActivePool } from 'contexts/Pools/ActivePool' | ||
| import { useTransferOptions } from 'contexts/TransferOptions' | ||
| import { getUnixTime } from 'date-fns' | ||
| import { useErasToTimeLeft } from 'hooks/useErasToTimeLeft' | ||
| import { useSignerWarnings } from 'hooks/useSignerWarnings' | ||
| import { useSubmitExtrinsic } from 'hooks/useSubmitExtrinsic' | ||
| import { useOverlay } from 'kits/Overlay/Provider' | ||
| import { ModalPadding } from 'kits/Overlay/structure/ModalPadding' | ||
| import { ModalWarnings } from 'kits/Overlay/structure/ModalWarnings' | ||
| import { ActionItem } from 'library/ActionItem' | ||
| import { Warning } from 'library/Form/Warning' | ||
| import { SubmitTx } from 'library/SubmitTx' | ||
| import { StaticNote } from 'overlay/modals/Utils/StaticNote' | ||
| import { useEffect, useState } from 'react' | ||
| import { useTranslation } from 'react-i18next' | ||
| import { ButtonSubmitInvert } from 'ui-buttons' | ||
| import { planckToUnitBn, timeleftAsString } from 'utils' | ||
|
|
||
| export const LeavePool = ({ | ||
| onResize, | ||
| onClick, | ||
| }: { | ||
| onResize?: () => void | ||
| onClick?: () => void | ||
| }) => { | ||
| const { t } = useTranslation('modals') | ||
| const { consts } = useApi() | ||
| const { | ||
| network, | ||
| networkData: { units, unit }, | ||
| } = useNetwork() | ||
| const { activePool } = useActivePool() | ||
| const { getPoolMembership } = useBalances() | ||
| const { erasToSeconds } = useErasToTimeLeft() | ||
| const { setModalStatus } = useOverlay().modal | ||
| const { activeAccount } = useActiveAccounts() | ||
| const { getSignerWarnings } = useSignerWarnings() | ||
| const { getTransferOptions } = useTransferOptions() | ||
|
|
||
| const allTransferOptions = getTransferOptions(activeAccount) | ||
| const { active: activeBn } = allTransferOptions.pool | ||
| const { bondDuration } = consts | ||
| const pendingRewards = activePool?.pendingRewards || 0n | ||
| const membership = getPoolMembership(activeAccount) | ||
| const bondDurationFormatted = timeleftAsString( | ||
| t, | ||
| getUnixTime(new Date()) + 1, | ||
| erasToSeconds(bondDuration), | ||
| true | ||
| ) | ||
| const freeToUnbond = planckToUnitBn(activeBn, units) | ||
| const pendingRewardsUnit = planckToUnit(pendingRewards, units) | ||
|
|
||
| const [paramsValid, setParamsValid] = useState<boolean>(false) | ||
|
|
||
| useEffect(() => { | ||
| setParamsValid(BigInt(membership?.points || 0) > 0 && !!activePool?.id) | ||
| }, [freeToUnbond.toString()]) | ||
|
|
||
| const getTx = () => { | ||
| let tx = null | ||
| if (!activeAccount || !membership) { | ||
| return tx | ||
| } | ||
| tx = new PoolUnbond(network, activeAccount, BigInt(membership.points)).tx() | ||
| return tx | ||
| } | ||
|
|
||
| const submitExtrinsic = useSubmitExtrinsic({ | ||
| tx: getTx(), | ||
| from: activeAccount, | ||
| shouldSubmit: paramsValid, | ||
| callbackSubmit: () => { | ||
| setModalStatus('closing') | ||
| }, | ||
| }) | ||
|
|
||
| const warnings = getSignerWarnings( | ||
| activeAccount, | ||
| false, | ||
| submitExtrinsic.proxySupported | ||
| ) | ||
|
|
||
| if (pendingRewards > 0) { | ||
| warnings.push( | ||
| `${t('unbondingWithdraw')} ${pendingRewardsUnit.toString()} ${unit}.` | ||
| ) | ||
| } | ||
|
|
||
| return ( | ||
| <> | ||
| <ModalPadding horizontalOnly> | ||
| {warnings.length > 0 ? ( | ||
| <ModalWarnings withMargin> | ||
| {warnings.map((text, i) => ( | ||
| <Warning key={`warning${i}`} text={text} /> | ||
| ))} | ||
| </ModalWarnings> | ||
| ) : null} | ||
| <ActionItem | ||
| text={`${t('unbond')} ${freeToUnbond.toString()} ${unit}`} | ||
| /> | ||
| <StaticNote | ||
| value={bondDurationFormatted} | ||
| tKey="onceUnbonding" | ||
| valueKey="bondDurationFormatted" | ||
| deps={[bondDuration]} | ||
| /> | ||
| </ModalPadding> | ||
| <SubmitTx | ||
| valid={paramsValid} | ||
| buttons={ | ||
| onClick | ||
| ? [ | ||
| <ButtonSubmitInvert | ||
| key="button_back" | ||
| text={t('back')} | ||
| iconLeft={faChevronLeft} | ||
| iconTransform="shrink-1" | ||
| onClick={onClick} | ||
| />, | ||
| ] | ||
| : undefined | ||
| } | ||
| onResize={onResize} | ||
| {...submitExtrinsic} | ||
| /> | ||
| </> | ||
| ) | ||
| } |
129 changes: 3 additions & 126 deletions
129
packages/app/src/overlay/modals/ManagePool/Forms/LeavePool/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,136 +1,13 @@ | ||
| // Copyright 2024 @polkadot-cloud/polkadot-staking-dashboard authors & contributors | ||
| // SPDX-License-Identifier: GPL-3.0-only | ||
|
|
||
| import { faChevronLeft } from '@fortawesome/free-solid-svg-icons' | ||
| import { planckToUnit } from '@w3ux/utils' | ||
| import { PoolUnbond } from 'api/tx/poolUnbond' | ||
| import { useActiveAccounts } from 'contexts/ActiveAccounts' | ||
| import { useApi } from 'contexts/Api' | ||
| import { useBalances } from 'contexts/Balances' | ||
| import { useNetwork } from 'contexts/Network' | ||
| import { useActivePool } from 'contexts/Pools/ActivePool' | ||
| import { useTransferOptions } from 'contexts/TransferOptions' | ||
| import { getUnixTime } from 'date-fns' | ||
| import { useErasToTimeLeft } from 'hooks/useErasToTimeLeft' | ||
| import { useSignerWarnings } from 'hooks/useSignerWarnings' | ||
| import { useSubmitExtrinsic } from 'hooks/useSubmitExtrinsic' | ||
| import { useOverlay } from 'kits/Overlay/Provider' | ||
| import { ModalPadding } from 'kits/Overlay/structure/ModalPadding' | ||
| import { ModalWarnings } from 'kits/Overlay/structure/ModalWarnings' | ||
| import { ActionItem } from 'library/ActionItem' | ||
| import { Warning } from 'library/Form/Warning' | ||
| import { SubmitTx } from 'library/SubmitTx' | ||
| import { StaticNote } from 'overlay/modals/Utils/StaticNote' | ||
| import { useEffect, useState, type Dispatch, type SetStateAction } from 'react' | ||
| import { useTranslation } from 'react-i18next' | ||
| import { ButtonSubmitInvert } from 'ui-buttons' | ||
| import { planckToUnitBn, timeleftAsString } from 'utils' | ||
| import { LeavePool as LeavePoolModal } from 'overlay/modals/LeavePool' | ||
| import { type Dispatch, type SetStateAction } from 'react' | ||
|
|
||
| export const LeavePool = ({ | ||
| setSection, | ||
| onResize, | ||
| }: { | ||
| setSection: Dispatch<SetStateAction<number>> | ||
| onResize: () => void | ||
| }) => { | ||
| const { t } = useTranslation('modals') | ||
| const { consts } = useApi() | ||
| const { | ||
| network, | ||
| networkData: { units, unit }, | ||
| } = useNetwork() | ||
| const { activePool } = useActivePool() | ||
| const { getPoolMembership } = useBalances() | ||
| const { erasToSeconds } = useErasToTimeLeft() | ||
| const { setModalStatus } = useOverlay().modal | ||
| const { activeAccount } = useActiveAccounts() | ||
| const { getSignerWarnings } = useSignerWarnings() | ||
| const { getTransferOptions } = useTransferOptions() | ||
|
|
||
| const allTransferOptions = getTransferOptions(activeAccount) | ||
| const { active: activeBn } = allTransferOptions.pool | ||
| const { bondDuration } = consts | ||
| const pendingRewards = activePool?.pendingRewards || 0n | ||
| const membership = getPoolMembership(activeAccount) | ||
| const bondDurationFormatted = timeleftAsString( | ||
| t, | ||
| getUnixTime(new Date()) + 1, | ||
| erasToSeconds(bondDuration), | ||
| true | ||
| ) | ||
| const freeToUnbond = planckToUnitBn(activeBn, units) | ||
| const pendingRewardsUnit = planckToUnit(pendingRewards, units) | ||
|
|
||
| const [paramsValid, setParamsValid] = useState<boolean>(false) | ||
|
|
||
| useEffect(() => { | ||
| setParamsValid(BigInt(membership?.points || 0) > 0 && !!activePool?.id) | ||
| }, [freeToUnbond.toString()]) | ||
|
|
||
| const getTx = () => { | ||
| let tx = null | ||
| if (!activeAccount || !membership) { | ||
| return tx | ||
| } | ||
| tx = new PoolUnbond(network, activeAccount, BigInt(membership.points)).tx() | ||
| return tx | ||
| } | ||
|
|
||
| const submitExtrinsic = useSubmitExtrinsic({ | ||
| tx: getTx(), | ||
| from: activeAccount, | ||
| shouldSubmit: paramsValid, | ||
| callbackSubmit: () => { | ||
| setModalStatus('closing') | ||
| }, | ||
| }) | ||
|
|
||
| const warnings = getSignerWarnings( | ||
| activeAccount, | ||
| false, | ||
| submitExtrinsic.proxySupported | ||
| ) | ||
|
|
||
| if (pendingRewards > 0) { | ||
| warnings.push( | ||
| `${t('unbondingWithdraw')} ${pendingRewardsUnit.toString()} ${unit}.` | ||
| ) | ||
| } | ||
|
|
||
| return ( | ||
| <> | ||
| <ModalPadding horizontalOnly> | ||
| {warnings.length > 0 ? ( | ||
| <ModalWarnings withMargin> | ||
| {warnings.map((text, i) => ( | ||
| <Warning key={`warning${i}`} text={text} /> | ||
| ))} | ||
| </ModalWarnings> | ||
| ) : null} | ||
| <ActionItem | ||
| text={`${t('unbond')} ${freeToUnbond.toString()} ${unit}`} | ||
| /> | ||
| <StaticNote | ||
| value={bondDurationFormatted} | ||
| tKey="onceUnbonding" | ||
| valueKey="bondDurationFormatted" | ||
| deps={[bondDuration]} | ||
| /> | ||
| </ModalPadding> | ||
| <SubmitTx | ||
| valid={paramsValid} | ||
| buttons={[ | ||
| <ButtonSubmitInvert | ||
| key="button_back" | ||
| text={t('back')} | ||
| iconLeft={faChevronLeft} | ||
| iconTransform="shrink-1" | ||
| onClick={() => setSection(0)} | ||
| />, | ||
| ]} | ||
| onResize={onResize} | ||
| {...submitExtrinsic} | ||
| /> | ||
| </> | ||
| ) | ||
| } | ||
| }) => <LeavePoolModal onResize={onResize} onClick={() => setSection(0)} /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters