mirror of
https://github.com/trezor/trezor-wallet
synced 2024-12-29 02:18:06 +00:00
add button to scan qr code next to the address input
This commit is contained in:
parent
549ae16b0e
commit
01b789a78e
@ -4,6 +4,7 @@ import { bindActionCreators } from 'redux';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import SendFormActions from 'actions/ethereum/SendFormActions';
|
||||
import { openQrModal } from 'actions/ModalActions';
|
||||
import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
|
||||
import type { State, Dispatch } from 'flowtype';
|
||||
import AccountSend from './index';
|
||||
@ -20,6 +21,7 @@ export type StateProps = {
|
||||
|
||||
export type DispatchProps = {
|
||||
sendFormActions: typeof SendFormActions,
|
||||
openQrModal: typeof openQrModal,
|
||||
}
|
||||
|
||||
export type Props = StateProps & DispatchProps;
|
||||
@ -34,6 +36,8 @@ const mapStateToProps: MapStateToProps<State, OwnProps, StateProps> = (state: St
|
||||
|
||||
const mapDispatchToProps: MapDispatchToProps<Dispatch, OwnProps, DispatchProps> = (dispatch: Dispatch): DispatchProps => ({
|
||||
sendFormActions: bindActionCreators(SendFormActions, dispatch),
|
||||
openQrModal: bindActionCreators(openQrModal, dispatch),
|
||||
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(AccountSend);
|
@ -159,6 +159,14 @@ const AdvancedSettingsIcon = styled(Icon)`
|
||||
margin-left: 10px;
|
||||
`;
|
||||
|
||||
const QrButton = styled(Button)`
|
||||
border-top-left-radius: 0px;
|
||||
border-bottom-left-radius: 0px;
|
||||
border-left: 0px;
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
`;
|
||||
|
||||
// render helpers
|
||||
const getAddressInputState = (address: string, addressErrors: string, addressWarnings: string): string => {
|
||||
let state = '';
|
||||
@ -281,6 +289,19 @@ const AccountSend = (props: Props) => {
|
||||
bottomText={errors.address || warnings.address || infos.address}
|
||||
value={address}
|
||||
onChange={event => onAddressChange(event.target.value)}
|
||||
sideAddons={[(
|
||||
<QrButton
|
||||
key="qrButton"
|
||||
isWhite
|
||||
onClick={props.openQrModal}
|
||||
>
|
||||
<Icon
|
||||
size={25}
|
||||
color={colors.TEXT_SECONDARY}
|
||||
icon={ICONS.QRCODE}
|
||||
/>
|
||||
</QrButton>
|
||||
)]}
|
||||
/>
|
||||
</InputRow>
|
||||
<InputRow>
|
||||
|
@ -4,6 +4,7 @@ import { bindActionCreators } from 'redux';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import SendFormActions from 'actions/ripple/SendFormActions';
|
||||
import { openQrModal } from 'actions/ModalActions';
|
||||
import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
|
||||
import type { State, Dispatch } from 'flowtype';
|
||||
import AccountSend from './index';
|
||||
@ -20,6 +21,7 @@ export type StateProps = {
|
||||
|
||||
export type DispatchProps = {
|
||||
sendFormActions: typeof SendFormActions,
|
||||
openQrModal: typeof openQrModal,
|
||||
}
|
||||
|
||||
export type Props = StateProps & DispatchProps;
|
||||
@ -34,6 +36,7 @@ const mapStateToProps: MapStateToProps<State, OwnProps, StateProps> = (state: St
|
||||
|
||||
const mapDispatchToProps: MapDispatchToProps<Dispatch, OwnProps, DispatchProps> = (dispatch: Dispatch): DispatchProps => ({
|
||||
sendFormActions: bindActionCreators(SendFormActions, dispatch),
|
||||
openQrModal: bindActionCreators(openQrModal, dispatch),
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(AccountSend);
|
@ -156,6 +156,15 @@ const AdvancedSettingsIcon = styled(Icon)`
|
||||
margin-left: 10px;
|
||||
`;
|
||||
|
||||
const QrButton = styled(Button)`
|
||||
border-top-left-radius: 0px;
|
||||
border-bottom-left-radius: 0px;
|
||||
border-left: 0px;
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
`;
|
||||
|
||||
|
||||
// render helpers
|
||||
const getAddressInputState = (address: string, addressErrors: string, addressWarnings: string): string => {
|
||||
let state = '';
|
||||
@ -254,6 +263,19 @@ const AccountSend = (props: Props) => {
|
||||
bottomText={errors.address || warnings.address || infos.address}
|
||||
value={address}
|
||||
onChange={event => onAddressChange(event.target.value)}
|
||||
sideAddons={[(
|
||||
<QrButton
|
||||
key="qrButton"
|
||||
isWhite
|
||||
onClick={props.openQrModal}
|
||||
>
|
||||
<Icon
|
||||
size={25}
|
||||
color={colors.TEXT_SECONDARY}
|
||||
icon={ICONS.QRCODE}
|
||||
/>
|
||||
</QrButton>
|
||||
)]}
|
||||
/>
|
||||
</InputRow>
|
||||
<InputRow>
|
||||
|
Loading…
Reference in New Issue
Block a user