1
0
mirror of https://github.com/trezor/trezor-wallet synced 2025-02-06 21:22:45 +00:00

add hide balance toggler to device menu

This commit is contained in:
slowbackspace 2019-03-14 23:33:00 +01:00
parent 55fa711e47
commit 846b531f64
3 changed files with 26 additions and 1 deletions

View File

@ -1,5 +1,5 @@
/* @flow */
import { toggleDeviceDropdown, toggleSidebar } from 'actions/WalletActions';
import { toggleDeviceDropdown, toggleSidebar, setHideBalance } from 'actions/WalletActions';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import { withRouter } from 'react-router-dom';
@ -43,6 +43,7 @@ const mapDispatchToProps: MapDispatchToProps<Dispatch, OwnProps, DispatchProps>
onSelectDevice: bindActionCreators(RouterActions.selectDevice, dispatch),
gotoExternalWallet: bindActionCreators(ModalActions.gotoExternalWallet, dispatch),
toggleSidebar: bindActionCreators(toggleSidebar, dispatch),
setHideBalance: bindActionCreators(setHideBalance, dispatch),
});
export default withRouter(

View File

@ -3,6 +3,7 @@ import styled from 'styled-components';
import PropTypes from 'prop-types';
import Icon from 'components/Icon';
import Link from 'components/Link';
import { Switch } from 'trezor-ui-components';
import DeviceIcon from 'components/images/DeviceIcon';
import { FormattedMessage } from 'react-intl';
import { getPattern } from 'support/routes';
@ -21,6 +22,7 @@ const Wrapper = styled.div`
const Item = styled.div`
padding: 6px 24px;
display: flex;
height: 38px;
align-items: center;
font-size: ${FONT_SIZE.BASE};
cursor: pointer;
@ -39,6 +41,7 @@ const Divider = styled.div`
const Label = styled.div`
padding-left: 15px;
flex: 1;
`;
class MenuItems extends PureComponent {
@ -108,6 +111,24 @@ class MenuItems extends PureComponent {
</Label>
</Item>
<Divider />
<Item>
<Icon icon={icons.EYE_CROSSED} size={25} color={colors.TEXT_SECONDARY} />
<Label>
<FormattedMessage {...l10nCommonMessages.TR_HIDE_BALANCE} />
</Label>
<Switch
width={36}
height={18}
handleDiameter={14}
checkedIcon={false}
uncheckedIcon={false}
onChange={checked => {
this.props.setHideBalance(checked);
}}
checked={this.props.wallet.hideBalance}
/>
</Item>
<Divider />
<Link to={getPattern('wallet-settings')}>
<Item>
<Icon icon={icons.COG} size={25} color={colors.TEXT_SECONDARY} />
@ -123,9 +144,11 @@ class MenuItems extends PureComponent {
MenuItems.propTypes = {
device: PropTypes.object.isRequired,
wallet: PropTypes.object.isRequired,
acquireDevice: PropTypes.func.isRequired,
forgetDevice: PropTypes.func.isRequired,
duplicateDevice: PropTypes.func.isRequired,
setHideBalance: PropTypes.func.isRequired,
// toggleDeviceDropdown: PropTypes.func.isRequired,
// gotoDeviceSettings: PropTypes.func.isRequired,
};

View File

@ -401,6 +401,7 @@ LeftNavigation.propTypes = {
duplicateDevice: PropTypes.func,
gotoDeviceSettings: PropTypes.func,
onSelectDevice: PropTypes.func,
setHideBalance: PropTypes.func,
};
export default LeftNavigation;