diff --git a/packages/app-accounts/src/modals/Transfer.tsx b/packages/app-accounts/src/modals/Transfer.tsx index 440b049bc115..13f1a071f097 100644 --- a/packages/app-accounts/src/modals/Transfer.tsx +++ b/packages/app-accounts/src/modals/Transfer.tsx @@ -109,8 +109,10 @@ function Transfer ({ className, onClose, recipientId: propRecipientId, senderId: type='allPlus' /> void; onEnter?: () => void; @@ -28,7 +30,7 @@ interface Props extends BareProps { withLabel?: boolean; } -export default function Password ({ autoFocus, children, className, defaultValue, help, isDisabled, isError, label, name, onChange, onEnter, onEscape, style, tabIndex, value, withLabel }: Props): React.ReactElement { +export default function Password ({ autoFocus, children, className, defaultValue, help, isDisabled, isError, isFull, label, labelExtra, name, onChange, onEnter, onEscape, style, tabIndex, value, withLabel }: Props): React.ReactElement { const [isVisible, setIsVisible] = useState(false); const _toggleVisible = (): void => setIsVisible(!isVisible); @@ -42,7 +44,9 @@ export default function Password ({ autoFocus, children, className, defaultValue isAction isDisabled={isDisabled} isError={isError} + isFull={isFull} label={label} + labelExtra={labelExtra} maxLength={MAX_PASS_LEN} name={name} onChange={onChange} diff --git a/packages/react-signer/src/Modal.tsx b/packages/react-signer/src/Modal.tsx index feba7d099370..cf41c949028e 100644 --- a/packages/react-signer/src/Modal.tsx +++ b/packages/react-signer/src/Modal.tsx @@ -25,7 +25,6 @@ import { assert, isFunction } from '@polkadot/util'; import { format } from '@polkadot/util/logger'; import ledgerSigner from './LedgerSigner'; -import PasswordCheck from './PasswordCheck'; import Transaction from './Transaction'; import Qr from './Qr'; import Unlock from './Unlock'; @@ -320,19 +319,15 @@ class Signer extends React.PureComponent { } return ( - <> - - - + ); } diff --git a/packages/react-signer/src/PasswordCheck.tsx b/packages/react-signer/src/PasswordCheck.tsx deleted file mode 100644 index 9297235d5565..000000000000 --- a/packages/react-signer/src/PasswordCheck.tsx +++ /dev/null @@ -1,26 +0,0 @@ -// Copyright 2017-2020 @polkadot/react-signer authors & contributors -// This software may be modified and distributed under the terms -// of the Apache-2.0 license. See the LICENSE file for details. - -import React from 'react'; -import styled from 'styled-components'; - -import { useTranslation } from './translate'; - -interface Props { - className?: string; - unlockError?: string | null; -} - -function PasswordCheck ({ className, unlockError }: Props): React.ReactElement | null { - const { t } = useTranslation(); - - return unlockError - ?
{t('wrong password')}
- : null; -} - -export default styled(PasswordCheck)` - margin-left: 15em; - color: #9f3a38; -`; diff --git a/packages/react-signer/src/Unlock.tsx b/packages/react-signer/src/Unlock.tsx index d9479d046f43..61372e008900 100644 --- a/packages/react-signer/src/Unlock.tsx +++ b/packages/react-signer/src/Unlock.tsx @@ -5,6 +5,7 @@ import { KeyringPair } from '@polkadot/keyring/types'; import React, { useState } from 'react'; +import styled from 'styled-components'; import { Password } from '@polkadot/react-components'; import keyring from '@polkadot/ui-keyring'; @@ -12,6 +13,7 @@ import { useTranslation } from './translate'; interface Props { autoFocus?: boolean; + className?: string; error?: string; onChange: (password: string) => void; onEnter?: () => void; @@ -28,7 +30,7 @@ function getPair (address?: string | null): KeyringPair | null { } } -export default function Unlock ({ autoFocus, error, onChange, onEnter, password, tabIndex, value }: Props): React.ReactElement | null { +function Unlock ({ autoFocus, className, error, onChange, onEnter, password, tabIndex, value }: Props): React.ReactElement | null { const { t } = useTranslation(); const [pair] = useState(getPair(value)); @@ -37,11 +39,13 @@ export default function Unlock ({ autoFocus, error, onChange, onEnter, password, } return ( -
+
{t('wrong password supplied')}
} onChange={onChange} onEnter={onEnter} tabIndex={tabIndex} @@ -50,3 +54,10 @@ export default function Unlock ({ autoFocus, error, onChange, onEnter, password,
); } + +export default styled(Unlock)` + .errorLabel { + margin-right: 2rem; + color: #9f3a38 !important; + } +`;