mirror of
https://github.com/trezor/trezor-wallet
synced 2024-12-31 19:30:53 +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 { connect } from 'react-redux';
|
||||||
|
|
||||||
import SendFormActions from 'actions/ethereum/SendFormActions';
|
import SendFormActions from 'actions/ethereum/SendFormActions';
|
||||||
|
import { openQrModal } from 'actions/ModalActions';
|
||||||
import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
|
import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
|
||||||
import type { State, Dispatch } from 'flowtype';
|
import type { State, Dispatch } from 'flowtype';
|
||||||
import AccountSend from './index';
|
import AccountSend from './index';
|
||||||
@ -20,6 +21,7 @@ export type StateProps = {
|
|||||||
|
|
||||||
export type DispatchProps = {
|
export type DispatchProps = {
|
||||||
sendFormActions: typeof SendFormActions,
|
sendFormActions: typeof SendFormActions,
|
||||||
|
openQrModal: typeof openQrModal,
|
||||||
}
|
}
|
||||||
|
|
||||||
export type Props = StateProps & DispatchProps;
|
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 => ({
|
const mapDispatchToProps: MapDispatchToProps<Dispatch, OwnProps, DispatchProps> = (dispatch: Dispatch): DispatchProps => ({
|
||||||
sendFormActions: bindActionCreators(SendFormActions, dispatch),
|
sendFormActions: bindActionCreators(SendFormActions, dispatch),
|
||||||
|
openQrModal: bindActionCreators(openQrModal, dispatch),
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(AccountSend);
|
export default connect(mapStateToProps, mapDispatchToProps)(AccountSend);
|
@ -159,6 +159,14 @@ const AdvancedSettingsIcon = styled(Icon)`
|
|||||||
margin-left: 10px;
|
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
|
// render helpers
|
||||||
const getAddressInputState = (address: string, addressErrors: string, addressWarnings: string): string => {
|
const getAddressInputState = (address: string, addressErrors: string, addressWarnings: string): string => {
|
||||||
let state = '';
|
let state = '';
|
||||||
@ -281,6 +289,19 @@ const AccountSend = (props: Props) => {
|
|||||||
bottomText={errors.address || warnings.address || infos.address}
|
bottomText={errors.address || warnings.address || infos.address}
|
||||||
value={address}
|
value={address}
|
||||||
onChange={event => onAddressChange(event.target.value)}
|
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>
|
||||||
<InputRow>
|
<InputRow>
|
||||||
|
@ -4,6 +4,7 @@ import { bindActionCreators } from 'redux';
|
|||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
|
|
||||||
import SendFormActions from 'actions/ripple/SendFormActions';
|
import SendFormActions from 'actions/ripple/SendFormActions';
|
||||||
|
import { openQrModal } from 'actions/ModalActions';
|
||||||
import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
|
import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
|
||||||
import type { State, Dispatch } from 'flowtype';
|
import type { State, Dispatch } from 'flowtype';
|
||||||
import AccountSend from './index';
|
import AccountSend from './index';
|
||||||
@ -20,6 +21,7 @@ export type StateProps = {
|
|||||||
|
|
||||||
export type DispatchProps = {
|
export type DispatchProps = {
|
||||||
sendFormActions: typeof SendFormActions,
|
sendFormActions: typeof SendFormActions,
|
||||||
|
openQrModal: typeof openQrModal,
|
||||||
}
|
}
|
||||||
|
|
||||||
export type Props = StateProps & DispatchProps;
|
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 => ({
|
const mapDispatchToProps: MapDispatchToProps<Dispatch, OwnProps, DispatchProps> = (dispatch: Dispatch): DispatchProps => ({
|
||||||
sendFormActions: bindActionCreators(SendFormActions, dispatch),
|
sendFormActions: bindActionCreators(SendFormActions, dispatch),
|
||||||
|
openQrModal: bindActionCreators(openQrModal, dispatch),
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(AccountSend);
|
export default connect(mapStateToProps, mapDispatchToProps)(AccountSend);
|
@ -156,6 +156,15 @@ const AdvancedSettingsIcon = styled(Icon)`
|
|||||||
margin-left: 10px;
|
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
|
// render helpers
|
||||||
const getAddressInputState = (address: string, addressErrors: string, addressWarnings: string): string => {
|
const getAddressInputState = (address: string, addressErrors: string, addressWarnings: string): string => {
|
||||||
let state = '';
|
let state = '';
|
||||||
@ -254,6 +263,19 @@ const AccountSend = (props: Props) => {
|
|||||||
bottomText={errors.address || warnings.address || infos.address}
|
bottomText={errors.address || warnings.address || infos.address}
|
||||||
value={address}
|
value={address}
|
||||||
onChange={event => onAddressChange(event.target.value)}
|
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>
|
||||||
<InputRow>
|
<InputRow>
|
||||||
|
Loading…
Reference in New Issue
Block a user