Changeset View
Changeset View
Standalone View
Standalone View
cashtab/src/components/Common/HideBalanceSwitch.js
// Copyright (c) 2024 The Bitcoin developers | // Copyright (c) 2024 The Bitcoin developers | ||||
// Distributed under the MIT software license, see the accompanying | // Distributed under the MIT software license, see the accompanying | ||||
// file COPYING or http://www.opensource.org/licenses/mit-license.php. | // file COPYING or http://www.opensource.org/licenses/mit-license.php. | ||||
import React from 'react'; | import React from 'react'; | ||||
import { Switch, Tooltip } from 'antd'; | import Eye from 'assets/eye.png'; | ||||
import { ThemedEyeSVG, ThemedInvisibleEyeSVG } from './CustomIcons'; | import EyeInvisible from 'assets/eye-invisible.png'; | ||||
import PropTypes from 'prop-types'; | import PropTypes from 'prop-types'; | ||||
import CashtabSwitch from 'components/Common/Switch'; | |||||
const HideBalanceSwitch = ({ settings, updateCashtabState }) => { | const HideBalanceSwitch = ({ settings, updateCashtabState }) => { | ||||
const handleShowHideBalance = checkedState => { | const handleShowHideBalance = e => { | ||||
// Update settings in state and localforage | // Update settings in state and localforage | ||||
updateCashtabState('settings', { | updateCashtabState('settings', { | ||||
...settings, | ...settings, | ||||
balanceVisible: checkedState, | balanceVisible: e.target.checked, | ||||
}); | }); | ||||
}; | }; | ||||
return ( | return ( | ||||
<Tooltip title={'Toggle hide balance'}> | <CashtabSwitch | ||||
<Switch | name="show-hide-balance" | ||||
size="small" | bgImageOn={Eye} | ||||
checkedChildren={<ThemedEyeSVG />} | bgImageOff={EyeInvisible} | ||||
unCheckedChildren={<ThemedInvisibleEyeSVG />} | width={50} | ||||
checked={settings ? settings.balanceVisible : false} | small | ||||
onChange={handleShowHideBalance} | right={30} | ||||
checked={settings.balanceVisible} | |||||
handleToggle={handleShowHideBalance} | |||||
/> | /> | ||||
</Tooltip> | |||||
); | ); | ||||
}; | }; | ||||
HideBalanceSwitch.propTypes = { | HideBalanceSwitch.propTypes = { | ||||
settings: PropTypes.oneOfType([ | settings: PropTypes.oneOfType([ | ||||
PropTypes.shape({ | PropTypes.shape({ | ||||
fiatCurrency: PropTypes.string, | fiatCurrency: PropTypes.string, | ||||
sendModal: PropTypes.bool, | sendModal: PropTypes.bool, | ||||
Show All 10 Lines |