From fc46a16a329df296cb565e3a0b04f268d2aeceb5 Mon Sep 17 00:00:00 2001 From: Jason Clark Date: Fri, 24 Nov 2017 10:35:17 -0700 Subject: toggle wired up to preferences property store --- ui/app/actions.js | 23 +++++++++++++++++------ ui/app/reducers/metamask.js | 8 ++++---- ui/app/settings.js | 19 +++++++++---------- 3 files changed, 30 insertions(+), 20 deletions(-) (limited to 'ui') diff --git a/ui/app/actions.js b/ui/app/actions.js index 957e42223..2819742e5 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -235,8 +235,8 @@ var actions = { useEtherscanProvider, - TOGGLE_USE_BLOCKIE: 'TOGGLE_USE_BLOCKIE', - toggleUseBlockie, + SET_USE_BLOCKIE: 'SET_USE_BLOCKIE', + setUseBlockie, } module.exports = actions @@ -1554,8 +1554,19 @@ function toggleAccountMenu () { } } -function toggleUseBlockie () { - return { - type: actions.TOGGLE_USE_BLOCKIE, +function setUseBlockie (val) { + return (dispatch) => { + dispatch(actions.showLoadingIndication()) + log.debug(`background.setUseBlockie`) + background.setUseBlockie(val, (err) => { + dispatch(actions.hideLoadingIndication()) + if (err) { + return dispatch(actions.displayWarning(err.message)) + } + }) + dispatch({ + type: actions.SET_USE_BLOCKIE, + value: val + }) } -} +} \ No newline at end of file diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index ee496dc6f..1b747e188 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -315,10 +315,10 @@ function reduceMetamask (state, action) { coinOptions, }) - case actions.TOGGLE_USE_BLOCKIE: - return extend(metamaskState, { - useBlockie: !metamaskState.useBlockie, - }) + case actions.SET_USE_BLOCKIE: + return extend(metamaskState, { + useBlockie: action.value + }) default: return metamaskState diff --git a/ui/app/settings.js b/ui/app/settings.js index 793906bdb..949cbfb26 100644 --- a/ui/app/settings.js +++ b/ui/app/settings.js @@ -8,7 +8,7 @@ const validUrl = require('valid-url') const { exportAsFile } = require('./util') const TabBar = require('./components/tab-bar') const SimpleDropdown = require('./components/dropdowns/simple-dropdown') -import Switch from 'react-toggle-switch' +const ToggleButton = require('react-toggle-button') const getInfuraCurrencyOptions = () => { const sortedCurrencies = infuraCurrencies.objects.sort((a, b) => { @@ -53,7 +53,7 @@ class Settings extends Component { } renderBlockieOptIn () { - const { metamask: { useBlockie }, toggleUseBlockie } = this.props + const { metamask: { useBlockie }, setUseBlockie } = this.props return h('div.settings__content-row', [ h('div.settings__content-item', [ @@ -61,12 +61,12 @@ class Settings extends Component { ]), h('div.settings__content-item', [ h('div.settings__content-item-col', [ - - h(Switch, { - on: useBlockie, - onClick: event => toggleUseBlockie(), + h(ToggleButton, { + value: useBlockie, + onToggle: (value) => setUseBlockie(!value), + activeLabel: '', + inactiveLabel: '', }), - ]), ]), ]) @@ -357,7 +357,7 @@ class Settings extends Component { Settings.propTypes = { tab: PropTypes.string, metamask: PropTypes.object, - useBlockie: PropTypes.bool, + setUseBlockie: PropTypes.func, setCurrentCurrency: PropTypes.func, setRpcTarget: PropTypes.func, displayWarning: PropTypes.func, @@ -370,7 +370,6 @@ const mapStateToProps = state => { return { metamask: state.metamask, warning: state.appState.warning, - useBlockie: state.useBlockie, } } @@ -381,7 +380,7 @@ const mapDispatchToProps = dispatch => { setRpcTarget: newRpc => dispatch(actions.setRpcTarget(newRpc)), displayWarning: warning => dispatch(actions.displayWarning(warning)), revealSeedConfirmation: () => dispatch(actions.revealSeedConfirmation()), - toggleUseBlockie: () => dispatch(actions.toggleUseBlockie()), + setUseBlockie: value => dispatch(actions.setUseBlockie(value)), } } -- cgit