Allow for verifier signature (#5405)
* Allow for verifier signature * Update packages/page-parachains/src/Crowdloan/Contribute.tsx
This commit is contained in:
parent
83d6d89743
commit
9109ae59a1
@ -4,30 +4,37 @@
|
||||
import type BN from 'bn.js';
|
||||
import type { Balance, BalanceOf, BlockNumber, ParaId } from '@polkadot/types/interfaces';
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import React, { useMemo, useState } from 'react';
|
||||
|
||||
import { Button, InputAddress, InputBalance, MarkWarning, Modal, TxButton } from '@polkadot/react-components';
|
||||
import { Button, Input, InputAddress, InputBalance, MarkWarning, Modal, TxButton } from '@polkadot/react-components';
|
||||
import { useAccounts, useApi, useToggle } from '@polkadot/react-hooks';
|
||||
import { formatBalance } from '@polkadot/util';
|
||||
import { formatBalance, isHex } from '@polkadot/util';
|
||||
|
||||
import { useTranslation } from '../translate';
|
||||
|
||||
interface Props {
|
||||
cap: Balance;
|
||||
className?: string;
|
||||
needsSignature: boolean;
|
||||
paraId: ParaId;
|
||||
raised: Balance;
|
||||
}
|
||||
|
||||
function Contribute ({ cap, className, paraId, raised }: Props): React.ReactElement<Props> {
|
||||
function Contribute ({ cap, className, needsSignature, paraId, raised }: Props): React.ReactElement<Props> {
|
||||
const { t } = useTranslation();
|
||||
const { api } = useApi();
|
||||
const { hasAccounts } = useAccounts();
|
||||
const [isOpen, toggleOpen] = useToggle();
|
||||
const [accountId, setAccountId] = useState<string | null>(null);
|
||||
const [amount, setAmount] = useState<BN | undefined>();
|
||||
const [signature, setSignature] = useState<string | null>(null);
|
||||
|
||||
// TODO verifier signature
|
||||
const isSignatureError = useMemo(
|
||||
() => needsSignature
|
||||
? !isHex(signature)
|
||||
: false,
|
||||
[needsSignature, signature]
|
||||
);
|
||||
|
||||
const remaining = cap.sub(raised);
|
||||
const isAmountBelow = !amount || amount.lt(api.consts.crowdloan.minContribution as BalanceOf);
|
||||
@ -73,6 +80,15 @@ function Contribute ({ cap, className, paraId, raised }: Props): React.ReactElem
|
||||
<MarkWarning content={t<string>('The amount is more than the remaining contribution needed {{value}}', { replace: { value: formatBalance(remaining) } })} />
|
||||
)}
|
||||
</Modal.Columns>
|
||||
{needsSignature && (
|
||||
<Modal.Columns hint={t<string>('The verifier signature that is to be associated with this contribution.')}>
|
||||
<Input
|
||||
isError={isSignatureError}
|
||||
label={t<string>('verifier signature')}
|
||||
onChange={setSignature}
|
||||
/>
|
||||
</Modal.Columns>
|
||||
)}
|
||||
<Modal.Columns hint={t<string>('The above contribution should more than minimum contribution amount and less than the remaining value.')}>
|
||||
<InputBalance
|
||||
defaultValue={api.consts.crowdloan.minContribution as BalanceOf}
|
||||
@ -90,10 +106,10 @@ function Contribute ({ cap, className, paraId, raised }: Props): React.ReactElem
|
||||
<TxButton
|
||||
accountId={accountId}
|
||||
icon='plus'
|
||||
isDisabled={isAmountError}
|
||||
isDisabled={isAmountError || isSignatureError}
|
||||
label={t<string>('Contribute')}
|
||||
onStart={toggleOpen}
|
||||
params={[paraId, amount, null]}
|
||||
params={[paraId, amount, signature]}
|
||||
tx={api.tx.crowdloan.contribute}
|
||||
/>
|
||||
</Modal.Actions>
|
||||
|
||||
@ -42,7 +42,7 @@ function extractContributors (allAccounts: string[], keys: StorageKey[]): Contri
|
||||
};
|
||||
}
|
||||
|
||||
function Fund ({ bestNumber, className, isOngoing, leasePeriod, value: { childKey, info: { cap, depositor, end, firstPeriod, lastPeriod, raised }, isCapped, isEnded, isWinner, paraId } }: Props): React.ReactElement<Props> {
|
||||
function Fund ({ bestNumber, className, isOngoing, leasePeriod, value: { childKey, info: { cap, depositor, end, firstPeriod, lastPeriod, raised, verifier }, isCapped, isEnded, isWinner, paraId } }: Props): React.ReactElement<Props> {
|
||||
const { t } = useTranslation();
|
||||
const { api } = useApi();
|
||||
const { allAccounts, isAccount } = useAccounts();
|
||||
@ -164,6 +164,7 @@ function Fund ({ bestNumber, className, isOngoing, leasePeriod, value: { childKe
|
||||
{isOngoing && canContribute && (
|
||||
<Contribute
|
||||
cap={cap}
|
||||
needsSignature={verifier.isSome}
|
||||
paraId={paraId}
|
||||
raised={raised}
|
||||
/>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user