From a86bc3284a2f07ddcc4dc5b5ae711dabc27c7588 Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Sun, 14 Mar 2021 14:36:49 +0100 Subject: [PATCH] Flatten modal columns (#4841) * Flatten modal columns * Additional * Additional * Additional * Additional * Additional * Adjust tests * No bids outside ending * s/winners/bids/ * Adjust * lease offsets --- .../page-accounts/src/modals/ChangePass.tsx | 70 +++--- packages/page-accounts/src/modals/Create.tsx | 200 ++++++++---------- .../src/modals/CreateConfirmation.tsx | 49 +++-- .../src/modals/CreateSuriLedger.tsx | 66 +++--- .../page-accounts/src/modals/Delegate.tsx | 94 ++++---- packages/page-accounts/src/modals/Import.tsx | 70 +++--- packages/page-accounts/src/modals/Ledger.tsx | 75 +++---- .../src/modals/MultisigApprove.tsx | 109 ++++------ .../src/modals/MultisigCreate.tsx | 73 +++---- .../src/modals/PasswordInput.tsx | 47 ++-- .../page-accounts/src/modals/ProxiedAdd.tsx | 46 ++-- .../src/modals/ProxyOverview.tsx | 86 ++++---- packages/page-accounts/src/modals/Qr.tsx | 52 ++--- .../page-accounts/src/modals/RecoverSetup.tsx | 77 +++---- .../page-accounts/src/modals/Transfer.tsx | 197 ++++++++--------- .../page-accounts/src/modals/Undelegate.tsx | 17 +- .../src/BountyActions/AwardBounty.tsx | 45 ++-- .../src/BountyActions/BountyAcceptCurator.tsx | 62 ++---- .../BountyActions/BountyInitiateVoting.tsx | 26 +-- .../BountyActions/ProposeCuratorAction.tsx | 74 +++---- packages/page-bounties/src/BountyCreate.tsx | 108 ++++------ .../BountyRejectCurator.tsx | 26 +-- .../src/BountyExtraActions/CloseBounty.tsx | 26 +-- .../ExtendBountyExpiryAction.tsx | 68 +++--- .../src/BountyExtraActions/GiveUp.tsx | 26 +-- .../src/BountyExtraActions/SlashCurator.tsx | 49 ++--- .../page-bounties/test/pages/bountiesPage.tsx | 16 +- packages/page-council/src/Motions/Close.tsx | 36 ++-- .../src/Motions/ProposeExternal.tsx | 44 ++-- .../src/Motions/ProposeMotion.tsx | 65 +++--- .../page-council/src/Motions/Slashing.tsx | 66 +++--- packages/page-council/src/Motions/Voting.tsx | 36 ++-- .../src/Overview/SubmitCandidacy.tsx | 38 ++-- packages/page-council/src/Overview/Vote.tsx | 63 +++--- .../page-democracy/src/Overview/PreImage.tsx | 83 ++++---- .../page-democracy/src/Overview/Propose.tsx | 85 +++----- .../page-democracy/src/Overview/Seconding.tsx | 53 ++--- .../page-democracy/src/Overview/Voting.tsx | 59 +++--- .../page-parachains/src/Auctions/Auction.tsx | 40 ++-- packages/page-parachains/src/Auctions/Bid.tsx | 63 +++--- .../page-parachains/src/Auctions/Summary.tsx | 3 +- .../page-parachains/src/Auctions/WinBlock.tsx | 37 ---- .../src/Auctions/useWinningData.ts | 6 +- .../page-parachains/src/Crowdloan/Fund.tsx | 4 +- .../page-parachains/src/Crowdloan/FundAdd.tsx | 72 +++---- .../src/Crowdloan/FundContribute.tsx | 47 ++-- .../src/Overview/RegisterThread.tsx | 58 +++-- .../page-parachains/src/Overview/Summary.tsx | 15 +- .../page-parachains/src/Overview/Upcoming.tsx | 10 +- .../src/Overview/UpcomingList.tsx | 5 +- .../page-parachains/src/Overview/index.tsx | 10 +- .../page-parachains/src/Overview/types.ts | 10 + .../src/{ => Overview}/useLeasePeriod.ts | 12 +- .../page-parachains/src/Proposals/Propose.tsx | 154 ++++++-------- packages/page-signing/src/Unlock.tsx | 44 ++-- packages/page-society/src/Overview/BidNew.tsx | 38 ++-- .../src/Actions/Account/BondExtra.tsx | 66 +++--- .../src/Actions/Account/InjectKeys.tsx | 73 +++---- .../Actions/Account/SetControllerAccount.tsx | 52 ++--- .../Actions/Account/SetRewardDestination.tsx | 68 +++--- .../src/Actions/Account/Unbond.tsx | 84 ++++---- .../page-staking/src/Actions/NewNominator.tsx | 4 +- .../page-staking/src/Actions/NewValidator.tsx | 4 +- .../src/Actions/partials/Bond.tsx | 153 +++++++------- .../src/Actions/partials/Nominate.tsx | 29 ++- .../src/Actions/partials/SenderInfo.tsx | 30 ++- .../src/Actions/partials/SessionKey.tsx | 52 ++--- .../src/Actions/partials/Validate.tsx | 69 +++--- .../page-staking/src/Payouts/PayButton.tsx | 74 +++---- .../page-staking/src/Targets/Nominate.tsx | 64 +++--- .../page-tech-comm/src/Proposals/Close.tsx | 36 ++-- .../page-treasury/src/Overview/Council.tsx | 44 ++-- .../src/Overview/ProposalCreate.tsx | 87 ++++---- packages/page-treasury/src/Tips/TipCreate.tsx | 80 +++---- .../page-treasury/src/Tips/TipEndorse.tsx | 46 ++-- .../react-components/src/Modal/Column.tsx | 46 ---- .../react-components/src/Modal/Columns.tsx | 42 +++- packages/react-components/src/Modal/index.tsx | 7 +- packages/react-components/src/Modal/types.tsx | 2 +- packages/react-signer/src/Address.tsx | 125 +++++------ packages/react-signer/src/Password.tsx | 42 ++-- packages/react-signer/src/SignFields.tsx | 60 +++--- packages/react-signer/src/Tip.tsx | 44 ++-- packages/react-signer/src/Transaction.tsx | 48 ++--- packages/react-signer/src/TxSigned.tsx | 21 +- 85 files changed, 1959 insertions(+), 2703 deletions(-) delete mode 100644 packages/page-parachains/src/Auctions/WinBlock.tsx create mode 100644 packages/page-parachains/src/Overview/types.ts rename packages/page-parachains/src/{ => Overview}/useLeasePeriod.ts (77%) delete mode 100644 packages/react-components/src/Modal/Column.tsx diff --git a/packages/page-accounts/src/modals/ChangePass.tsx b/packages/page-accounts/src/modals/ChangePass.tsx index 988696b535..87b3a2841a 100644 --- a/packages/page-accounts/src/modals/ChangePass.tsx +++ b/packages/page-accounts/src/modals/ChangePass.tsx @@ -98,47 +98,37 @@ function ChangePass ({ address, className = '', onClose }: Props): React.ReactEl isInline value={address} /> - - - ('The existing account password as specified when this account was created or when it was last changed.')} - isError={!isOldValid} - label={t('your current password')} - onChange={_onChangeOld} - tabIndex={1} - value={oldPass} - /> - - -

{t('The existing account password as specified when this account was created or when it was last changed.')}

- + ('The existing account password as specified when this account was created or when it was last changed.')}> + ('The existing account password as specified when this account was created or when it was last changed.')} + isError={!isOldValid} + label={t('your current password')} + onChange={_onChangeOld} + tabIndex={1} + value={oldPass} + /> - - - ('The new account password. Once set, all future account unlocks will be performed with this new password.')} - isError={!newPass1.isValid} - label={t('your new password')} - onChange={_onChangeNew1} - onEnter={_doChange} - tabIndex={2} - value={newPass1.password} - /> - ('Verify the password entered above.')} - isError={!newPass2.isValid} - label={t('password (repeat)')} - onChange={_onChangeNew2} - onEnter={_doChange} - tabIndex={2} - value={newPass2.password} - /> - - - -

{t('This will apply to any future use of this account as stored on this browser. Ensure that you securely store this new password and that it is strong and unique to the account.')}

- + ('This will apply to any future use of this account as stored on this browser. Ensure that you securely store this new password and that it is strong and unique to the account.')}> + ('The new account password. Once set, all future account unlocks will be performed with this new password.')} + isError={!newPass1.isValid} + label={t('your new password')} + onChange={_onChangeNew1} + onEnter={_doChange} + tabIndex={2} + value={newPass1.password} + /> + ('Verify the password entered above.')} + isError={!newPass2.isValid} + label={t('password (repeat)')} + onChange={_onChangeNew2} + onEnter={_doChange} + tabIndex={2} + value={newPass2.password} + /> + diff --git a/packages/page-accounts/src/modals/Create.tsx b/packages/page-accounts/src/modals/Create.tsx index ae178870d1..97af8cf1f1 100644 --- a/packages/page-accounts/src/modals/Create.tsx +++ b/packages/page-accounts/src/modals/Create.tsx @@ -306,81 +306,69 @@ function Create ({ className = '', onClose, onStatusChange, seed: propsSeed, typ > - - - + {step === 1 && <> - - - - - -

{t('The secret seed value for this account. Ensure that you keep this in a safe place, with access to the seed you can re-create the account.')}

- + ('The secret seed value for this account. Ensure that you keep this in a safe place, with access to the seed you can re-create the account.')}> + ('Advanced creation options')} > - - - ('Determines what cryptography will be used to create this account. Note that to validate on Polkadot, the session account must use "ed25519".')} - label={t('keypair crypto type')} - onChange={_onChangePairType} - options={ - isEthereum - ? settings.availableCryptosEth - : isLedgerEnabled - ? settings.availableCryptosLedger - : settings.availableCryptos - } - tabIndex={-1} - /> - - -

{t('If you are moving accounts between applications, ensure that you use the correct type.')}

- + ('If you are moving accounts between applications, ensure that you use the correct type.')}> + ('Determines what cryptography will be used to create this account. Note that to validate on Polkadot, the session account must use "ed25519".')} + label={t('keypair crypto type')} + onChange={_onChangePairType} + options={ + isEthereum + ? settings.availableCryptosEth + : isLedgerEnabled + ? settings.availableCryptosLedger + : settings.availableCryptos + } + tabIndex={-1} + /> {pairType === 'ed25519-ledger' ? ( @@ -390,9 +378,13 @@ function Create ({ className = '', onClose, onStatusChange, seed: propsSeed, typ /> ) : ( - - - {(pairType !== 'ethereum' || seedType !== 'raw') && (('The derivation path is only relevant when deriving keys from a mnemonic.') + : t('The derivation path allows you to create different accounts from the same base mnemonic.') + }> + {(pairType !== 'ethereum' || seedType !== 'raw') && ( + ('You can set a custom derivation path for this account using the following syntax "m/////') : t('You can set a custom derivation path for this account using the following syntax "///". The "/" and "//" may be repeated and mixed`. An optional "///" can be used with a mnemonic seed, and may only be specified once.'))} isDisabled={pairType === 'ethereum' && seedType === 'raw'} isError={!!deriveValidation?.error} @@ -411,59 +403,47 @@ function Create ({ className = '', onClose, onStatusChange, seed: propsSeed, typ } tabIndex={-1} value={derivePath} - />)} - {deriveValidation?.error && ( - - )} - {deriveValidation?.warning && ( - - )} - - -

{pairType === 'ethereum' && seedType === 'raw' ? t('The derivation path is only relevant when deriving keys from a mnemonic.') : t('The derivation path allows you to create different accounts from the same base mnemonic.')}

- + /> + )} + {deriveValidation?.error && ( + + )} + {deriveValidation?.warning && ( + + )} )} - - -
- {t('I have saved my mnemonic seed safely')}} - onChange={_toggleMnemonicSaved} - value={isMnemonicSaved} - /> -
- + +
+ {t('I have saved my mnemonic seed safely')}} + onChange={_toggleMnemonicSaved} + value={isMnemonicSaved} + /> +
} {step === 2 && <> - - - ('Name given to this account. You can edit it. To use the account to validate or nominate, it is a good practice to append the function of the account in the name, e.g "name_you_want - stash".')} - isError={!isNameValid} - label={t('name')} - onChange={_onChangeName} - onEnter={_onCommit} - placeholder={t('new account')} - value={name} - /> - - -

{t('The name for this account and how it will appear under your addresses. With an on-chain identity, it can be made available to others.')}

- + ('The name for this account and how it will appear under your addresses. With an on-chain identity, it can be made available to others.')}> + ('Name given to this account. You can edit it. To use the account to validate or nominate, it is a good practice to append the function of the account in the name, e.g "name_you_want - stash".')} + isError={!isNameValid} + label={t('name')} + onChange={_onChangeName} + onEnter={_onCommit} + placeholder={t('new account')} + value={name} + /> - - - + } {step === 3 && address && ( diff --git a/packages/page-accounts/src/modals/CreateConfirmation.tsx b/packages/page-accounts/src/modals/CreateConfirmation.tsx index e0371ee786..f8cd6f5df7 100644 --- a/packages/page-accounts/src/modals/CreateConfirmation.tsx +++ b/packages/page-accounts/src/modals/CreateConfirmation.tsx @@ -29,33 +29,32 @@ function CreateConfirmation ({ address, derivePath, name, pairType, seed }: Prop return ( - - - {address && name && } - {shortSeed && ( - ('partial seed')} - value={shortSeed} - /> - )} - ('keypair type')} - value={pairType} - /> - ('derivation path')} - value={derivePath || t('')} - /> - - +

{t('We will provide you with a generated backup file after your account is created. As long as you have access to your account you can always download this file later by clicking on "Backup" button from the Accounts section.')}

{t('Please make sure to save this file in a secure location as it is required, together with your password, to restore your account.')}

- + + }> + {address && name && } + {shortSeed && ( + ('partial seed')} + value={shortSeed} + /> + )} + ('keypair type')} + value={pairType} + /> + ('derivation path')} + value={derivePath || t('')} + /> ); diff --git a/packages/page-accounts/src/modals/CreateSuriLedger.tsx b/packages/page-accounts/src/modals/CreateSuriLedger.tsx index dd922e1708..bad6aa829e 100644 --- a/packages/page-accounts/src/modals/CreateSuriLedger.tsx +++ b/packages/page-accounts/src/modals/CreateSuriLedger.tsx @@ -45,40 +45,38 @@ function CreateSuriLedger ({ className, onChange, seedType }: Props): React.Reac }, [accIndex, addIndex, chainType, onChange]); return ( - - - {seedType === 'bip' - ? ( - <> - - - - - ) - : ('Derivation for Ledger-type accounts are only available on mnemonic seeds.')} /> - } - - -

{t('The derivation will be constructed from the values you specify.')}

- + ('The derivation will be constructed from the values you specify.')} + > + {seedType === 'bip' + ? ( + <> + + + + + ) + : ('Derivation for Ledger-type accounts are only available on mnemonic seeds.')} /> + } ); } diff --git a/packages/page-accounts/src/modals/Delegate.tsx b/packages/page-accounts/src/modals/Delegate.tsx index d680fd419c..5123a70803 100644 --- a/packages/page-accounts/src/modals/Delegate.tsx +++ b/packages/page-accounts/src/modals/Delegate.tsx @@ -51,59 +51,53 @@ function Delegate ({ onClose, previousAmount, previousConviction, previousDelega size='large' > - - - ('delegating account')} - onChange={setDelegatingAccount} - type='account' - value={delegatingAccount} - /> - ('delegated account')} - onChange={setDelegatedAccount} - type='account' - value={delegatedAccount} - /> - - +

{t('Any democracy vote performed by the delegated account will result in an additional vote from the delegating account')}

{t('If the delegated account is currently voting in a referendum, the delegating vote and conviction will be added.')}

- + + }> + ('delegating account')} + onChange={setDelegatingAccount} + type='account' + value={delegatingAccount} + /> + ('delegated account')} + onChange={setDelegatedAccount} + type='account' + value={delegatedAccount} + /> - - - ('Amount to delegate for any democracy vote. This is adjusted using the available funds on the account.')} - isError={!!amountError?.error} - isZeroable={false} - label={t('delegating amount')} - labelExtra={ - {t('balance')}} - params={delegatingAccount} - /> - } - maxValue={maxBalance} - onChange={setAmount} - value={amount} - /> - - ('The conviction that will be used for each delegated vote.')} - label={t('conviction')} - onChange={setConviction} - value={conviction} - /> - - -

{t('The amount to allocate and the conviction that will be applied to all votes made on a referendum.')}

- + + ('Amount to delegate for any democracy vote. This is adjusted using the available funds on the account.')} + isError={!!amountError?.error} + isZeroable={false} + label={t('delegating amount')} + labelExtra={ + {t('balance')}} + params={delegatingAccount} + /> + } + maxValue={maxBalance} + onChange={setAmount} + value={amount} + /> + + ('The conviction that will be used for each delegated vote.')} + label={t('conviction')} + onChange={setConviction} + value={conviction} + /> diff --git a/packages/page-accounts/src/modals/Import.tsx b/packages/page-accounts/src/modals/Import.tsx index f26a309a73..61cc0ac83c 100644 --- a/packages/page-accounts/src/modals/Import.tsx +++ b/packages/page-accounts/src/modals/Import.tsx @@ -102,49 +102,37 @@ function Import ({ className = '', onClose, onStatusChange }: Props): React.Reac > - - - + - - - ('Select the JSON key file that was downloaded when you created the account. This JSON file contains your private key encrypted with your password.')} - isError={!pair} - label={t('backup file')} - onChange={_onChangeFile} - withLabel - /> - {differentGenesis && ( - ('The network from which this account was originally generated is different than the network you are currently connected to. Once imported ensure you toggle the "allow on any network" option for the account to keep it visible on the current network.')} /> - )} - - -

{t('Supply a backed-up JSON file, encrypted with your account-specific password.')}

- + ('Supply a backed-up JSON file, encrypted with your account-specific password.')}> + ('Select the JSON key file that was downloaded when you created the account. This JSON file contains your private key encrypted with your password.')} + isError={!pair} + label={t('backup file')} + onChange={_onChangeFile} + withLabel + /> + {differentGenesis && ( + ('The network from which this account was originally generated is different than the network you are currently connected to. Once imported ensure you toggle the "allow on any network" option for the account to keep it visible on the current network.')} /> + )} - - - ('Type the password chosen at the account creation. It was used to encrypt your account\'s private key in the backup file.')} - isError={!isPassValid} - label={t('password')} - onChange={_onChangePass} - onEnter={_onSave} - value={password} - /> - - -

{t('The password previously used to encrypt this account.')}

- + ('The password previously used to encrypt this account.')}> + ('Type the password chosen at the account creation. It was used to encrypt your account\'s private key in the backup file.')} + isError={!isPassValid} + label={t('password')} + onChange={_onChangePass} + onEnter={_onSave} + value={password} + /> diff --git a/packages/page-accounts/src/modals/Ledger.tsx b/packages/page-accounts/src/modals/Ledger.tsx index fbb049be07..a9b775d6d6 100644 --- a/packages/page-accounts/src/modals/Ledger.tsx +++ b/packages/page-accounts/src/modals/Ledger.tsx @@ -86,53 +86,38 @@ function LedgerModal ({ className, onClose }: Props): React.ReactElement size='large' > - - - ('Name given to this account to uniquely identity the account to yourself.')} - isError={!isNameValid} - label={t('name')} - onChange={_onChangeName} - placeholder={t('account name')} - value={name} - /> - - - {t('The name for this account as it will appear under your accounts.')} - + ('The name for this account as it will appear under your accounts.')}> + ('Name given to this account to uniquely identity the account to yourself.')} + isError={!isNameValid} + label={t('name')} + onChange={_onChangeName} + placeholder={t('account name')} + value={name} + /> - - - - - - {t('The account type that you wish to create. This is the top-level derivation.')} - + + - - - - {error && ( - - )} - - - {t('The address index on the account that you wish to add. This is the second-level derivation.')} - + + + {error && ( + + )} diff --git a/packages/page-accounts/src/modals/MultisigApprove.tsx b/packages/page-accounts/src/modals/MultisigApprove.tsx index d72edfb3b6..67cc37d26b 100644 --- a/packages/page-accounts/src/modals/MultisigApprove.tsx +++ b/packages/page-accounts/src/modals/MultisigApprove.tsx @@ -149,83 +149,58 @@ function MultisigApprove ({ className = '', onClose, ongoing, threshold, who }: size='large' > - - - ('The call hashes that have not been executed as of yet.')} - label={t('pending hashes')} - onChange={setHash} - options={hashes} - value={hash} - /> - - -

{t('The call hash from the list of available and unapproved calls.')}

- + + ('The call hashes that have not been executed as of yet.')} + label={t('pending hashes')} + onChange={setHash} + options={hashes} + value={hash} + /> - - - ('Either approve or reject this call.')} - label={t('approval type')} - onChange={setType} - options={calltypes} - value={type} - /> - - -

{t('The operation type to apply. For approvals both non-final and final approvals are supported.')}

- + + ('Either approve or reject this call.')} + label={t('approval type')} + onChange={setType} + options={calltypes} + value={type} + /> {whoFilter.length !== 0 && ( <> - - - ('The signatory to send the approval/cancel from')} - label={t('signatory')} - onChange={setSignatory} - /> - - -

{t('For approvals outstanding approvers will be shown, for hashes that should be cancelled the first approver is required.')}

- + + ('The signatory to send the approval/cancel from')} + label={t('signatory')} + onChange={setSignatory} + /> {type === 'aye' && isMultiCall && ( <> {isCallOverride && ( - - - - - -

{t('The call data for this transaction matching the hash. Once sent, the multisig will be executed against this.')}

- + + )} - - - ('Multisig message with call (for final approval)') - : t('Multisig approval with hash (non-final approval)') - } - onChange={setCallOverride} - value={isCallOverride} - /> - - -

{t('Swap to a non-executing approval type, with subsequent calls providing the actual call data.')}

- + + ('Multisig message with call (for final approval)') + : t('Multisig approval with hash (non-final approval)') + } + onChange={setCallOverride} + value={isCallOverride} + /> )} diff --git a/packages/page-accounts/src/modals/MultisigCreate.tsx b/packages/page-accounts/src/modals/MultisigCreate.tsx index 13c53eea09..69b1e5fba8 100644 --- a/packages/page-accounts/src/modals/MultisigCreate.tsx +++ b/packages/page-accounts/src/modals/MultisigCreate.tsx @@ -87,52 +87,41 @@ function Multisig ({ className = '', onClose, onStatusChange }: Props): React.Re size='large' > - - - ('available signatories')} - help={t('The addresses that are able to approve multisig transactions. You can select up to {{maxHelpers}} trusted addresses.', { replace: { maxHelpers: MAX_SIGNATORIES } })} - maxCount={MAX_SIGNATORIES} - onChange={setSignatories} - value={signatories} - valueLabel={t('selected signatories')} - /> - - +

{t('The signatories has the ability to create transactions using the multisig and approve transactions sent by others.Once the threshold is reached with approvals, the multisig transaction is enacted on-chain.')}

{t('Since the multisig function like any other account, once created it is available for selection anywhere accounts are used and needs to be funded before use.')}

- + + }> + ('available signatories')} + help={t('The addresses that are able to approve multisig transactions. You can select up to {{maxHelpers}} trusted addresses.', { replace: { maxHelpers: MAX_SIGNATORIES } })} + maxCount={MAX_SIGNATORIES} + onChange={setSignatories} + value={signatories} + valueLabel={t('selected signatories')} + /> - - - ('The threshold for this multisig')} - isError={!isThresholdValid} - label={t('threshold')} - onChange={_onChangeThreshold} - value={threshold} - /> - - -

{t('The threshold for approval should be less or equal to the number of signatories for this multisig.')}

- + ('The threshold for approval should be less or equal to the number of signatories for this multisig.')}> + ('The threshold for this multisig')} + isError={!isThresholdValid} + label={t('threshold')} + onChange={_onChangeThreshold} + value={threshold} + /> - - - ('Name given to this multisig. You can edit it at any later point in time.')} - isError={!isNameValid} - label={t('name')} - onChange={_onChangeName} - placeholder={t('multisig name')} - /> - - -

{t('The name is for unique identification of the account in your owner lists.')}

- + ('The name is for unique identification of the account in your owner lists.')}> + ('Name given to this multisig. You can edit it at any later point in time.')} + isError={!isNameValid} + label={t('name')} + onChange={_onChangeName} + placeholder={t('multisig name')} + /> diff --git a/packages/page-accounts/src/modals/PasswordInput.tsx b/packages/page-accounts/src/modals/PasswordInput.tsx index 1e4811d826..9a89cf4c55 100644 --- a/packages/page-accounts/src/modals/PasswordInput.tsx +++ b/packages/page-accounts/src/modals/PasswordInput.tsx @@ -46,32 +46,31 @@ export default function PasswordInput ({ onChange, onEnter }: Props): React.Reac ); return ( - - - ('This password is used to encrypt your private key. It must be strong and unique! You will need it to sign transactions with this account. You can recover this account using this password together with the backup file (generated in the next step).')} - isError={!isPass1Valid} - label={t('password')} - onChange={_onPassword1Change} - onEnter={onEnter} - value={password1} - /> - ('Verify the password entered above.')} - isError={!isPass2Valid} - label={t('password (repeat)')} - onChange={onPassword2Change} - onEnter={onEnter} - value={password2} - /> - - - +

{t('The password and password confirmation for this account. This is required to authenticate any transactions made and to encrypt the keypair.')}

{t('Ensure you are using a strong password for proper account protection.')}

- + + }> + ('This password is used to encrypt your private key. It must be strong and unique! You will need it to sign transactions with this account. You can recover this account using this password together with the backup file (generated in the next step).')} + isError={!isPass1Valid} + label={t('password')} + onChange={_onPassword1Change} + onEnter={onEnter} + value={password1} + /> + ('Verify the password entered above.')} + isError={!isPass2Valid} + label={t('password (repeat)')} + onChange={onPassword2Change} + onEnter={onEnter} + value={password2} + /> + ); } diff --git a/packages/page-accounts/src/modals/ProxiedAdd.tsx b/packages/page-accounts/src/modals/ProxiedAdd.tsx index 7410b4e396..d268e00564 100644 --- a/packages/page-accounts/src/modals/ProxiedAdd.tsx +++ b/packages/page-accounts/src/modals/ProxiedAdd.tsx @@ -77,35 +77,25 @@ function ProxyAdd ({ className = '', onClose, onStatusChange }: Props): React.Re size='large' > - - - ('The address that you have a valid proxy setup for.')} - isError={!hasOwned} - label={t('proxied account')} - onChange={setStashAddress} - placeholder={t('stash address')} - /> - - -

{t('The address that has previously setup a proxy to one of the accounts that you control.')}

- + ('The address that has previously setup a proxy to one of the accounts that you control.')}> + ('The address that you have a valid proxy setup for.')} + isError={!hasOwned} + label={t('proxied account')} + onChange={setStashAddress} + placeholder={t('stash address')} + /> - - - ('Name given to this proxied account. You can edit it at any later point in time.')} - isError={!isNameValid} - label={t('name')} - onChange={_onChangeName} - placeholder={t('proxied name')} - /> - - -

{t('The name is for unique identification of the account in your owner lists.')}

- + ('The name is for unique identification of the account in your owner lists.')}> + ('Name given to this proxied account. You can edit it at any later point in time.')} + isError={!isNameValid} + label={t('name')} + onChange={_onChangeName} + placeholder={t('proxied name')} + /> diff --git a/packages/page-accounts/src/modals/ProxyOverview.tsx b/packages/page-accounts/src/modals/ProxyOverview.tsx index ee3d78b58e..16342a7201 100644 --- a/packages/page-accounts/src/modals/ProxyOverview.tsx +++ b/packages/page-accounts/src/modals/ProxyOverview.tsx @@ -241,58 +241,46 @@ function ProxyOverview ({ className, onClose, previousProxy: [existing] = EMPTY_ size='large' > - - - ('proxied account')} - type='account' - value={proxiedAccount} + ('Any account set as proxy will be able to perform actions in place of the proxied account')}> + ('proxied account')} + type='account' + value={proxiedAccount} + /> + + ('If you add several proxy accounts for the same proxy type (e.g 2 accounts set as proxy for Governance), then any of those 2 accounts will be able to perfom governance actions on behalf of the proxied account')}> + {previous.map((value, index) => ( + - - -

{t('Any account set as proxy will be able to perform actions in place of the proxied account')}

- + ))} + {added.map((value, index) => ( + + ))} + +