From 90fc4812bc75857581e56eb6d63484dbc5c48cb1 Mon Sep 17 00:00:00 2001 From: "Clark, Jason (Contractor)" Date: Thu, 23 Nov 2017 18:33:44 -0700 Subject: incremental commit --- .gitignore | 2 ++ app/scripts/controllers/preferences.js | 8 ++++++++ package.json | 10 ++++++---- ui/app/actions.js | 9 +++++++++ ui/app/components/identicon.js | 3 ++- ui/app/reducers/metamask.js | 6 ++++++ ui/app/settings.js | 25 +++++++++++++++++++++++++ 7 files changed, 58 insertions(+), 5 deletions(-) diff --git a/.gitignore b/.gitignore index 08a544449..92b3f2875 100644 --- a/.gitignore +++ b/.gitignore @@ -6,6 +6,8 @@ app/bower_components test/bower_components package +.idea + temp .tmp .sass-cache diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js index 10004caad..c0454f77b 100644 --- a/app/scripts/controllers/preferences.js +++ b/app/scripts/controllers/preferences.js @@ -14,6 +14,14 @@ class PreferencesController { } // PUBLIC METHODS + toggleUseBlockie () { + this.store.updateState({ useBlockie: !this.useBlockie() }) + } + + getUseBlockie () { + return this.store.getState().useBlockie + } + setSelectedAddress (_address) { return new Promise((resolve, reject) => { const address = normalizeAddress(_address) diff --git a/package.json b/package.json index 12c839739..c0e21ffa7 100644 --- a/package.json +++ b/package.json @@ -58,6 +58,7 @@ "babel-runtime": "^6.23.0", "bignumber.js": "^4.0.4", "bip39": "^2.2.0", + "blockies": "0.0.2", "bluebird": "^3.5.0", "bn.js": "^4.11.7", "boron": "^0.2.3", @@ -77,8 +78,8 @@ "eslint-plugin-react": "^7.4.0", "eth-bin-to-ops": "^1.0.1", "eth-block-tracker": "^2.2.0", - "eth-hd-keyring": "^1.2.1", "eth-contract-metadata": "^1.1.5", + "eth-hd-keyring": "^1.2.1", "eth-json-rpc-filters": "^1.2.4", "eth-keyring-controller": "^2.1.2", "eth-phishing-detect": "^1.1.4", @@ -101,7 +102,6 @@ "fast-json-patch": "^2.0.4", "fast-levenshtein": "^2.0.6", "fuse.js": "^3.1.0", - "gulp": "github:gulpjs/gulp#4.0", "gulp-autoprefixer": "^4.0.0", "gulp-eslint": "^4.0.0", "gulp-sass": "^3.1.0", @@ -144,12 +144,14 @@ "react-hyperscript": "^3.0.0", "react-markdown": "^2.3.0", "react-redux": "^5.0.5", - "react-select": "^1.0.0-rc.2", + "react-select": "^1.0.0", "react-simple-file-input": "^2.0.0", + "react-toggle": "^4.0.2", + "react-toggle-switch": "^3.0.3", "react-tooltip-component": "^0.3.0", "react-transition-group": "^2.2.0", - "reactify": "^1.1.1", "react-trigger-change": "^1.0.2", + "reactify": "^1.1.1", "readable-stream": "^2.3.3", "recompose": "^0.25.0", "redux": "^3.0.5", diff --git a/ui/app/actions.js b/ui/app/actions.js index 2ca62c41f..957e42223 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -234,6 +234,9 @@ var actions = { toggleAccountMenu, useEtherscanProvider, + + TOGGLE_USE_BLOCKIE: 'TOGGLE_USE_BLOCKIE', + toggleUseBlockie, } module.exports = actions @@ -1550,3 +1553,9 @@ function toggleAccountMenu () { type: actions.TOGGLE_ACCOUNT_MENU, } } + +function toggleUseBlockie () { + return { + type: actions.TOGGLE_USE_BLOCKIE, + } +} diff --git a/ui/app/components/identicon.js b/ui/app/components/identicon.js index d30b7cd56..63f3087a4 100644 --- a/ui/app/components/identicon.js +++ b/ui/app/components/identicon.js @@ -4,6 +4,7 @@ const inherits = require('util').inherits const isNode = require('detect-node') const findDOMNode = require('react-dom').findDOMNode const jazzicon = require('jazzicon') +const blockies = require('blockies') const iconFactoryGen = require('../../lib/icon-factory') const iconFactory = iconFactoryGen(jazzicon) @@ -18,7 +19,7 @@ function IdenticonComponent () { IdenticonComponent.prototype.render = function () { var props = this.props - const { className = '', address } = props + const { className = '', address, useBlockie } = props var diameter = props.diameter || this.defaultDiameter return address diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index 83161320e..ee496dc6f 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -36,6 +36,7 @@ function reduceMetamask (state, action) { editingTransactionId: null, }, coinOptions: {}, + useBlockie: false, }, state.metamask) switch (action.type) { @@ -314,6 +315,11 @@ function reduceMetamask (state, action) { coinOptions, }) + case actions.TOGGLE_USE_BLOCKIE: + return extend(metamaskState, { + useBlockie: !metamaskState.useBlockie, + }) + default: return metamaskState diff --git a/ui/app/settings.js b/ui/app/settings.js index 786a70e7e..793906bdb 100644 --- a/ui/app/settings.js +++ b/ui/app/settings.js @@ -8,6 +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 getInfuraCurrencyOptions = () => { const sortedCurrencies = infuraCurrencies.objects.sort((a, b) => { @@ -51,6 +52,26 @@ class Settings extends Component { ]) } + renderBlockieOptIn () { + const { metamask: { useBlockie }, toggleUseBlockie } = this.props + + return h('div.settings__content-row', [ + h('div.settings__content-item', [ + h('span', 'Use Blockie Identicon'), + ]), + h('div.settings__content-item', [ + h('div.settings__content-item-col', [ + + h(Switch, { + on: useBlockie, + onClick: event => toggleUseBlockie(), + }), + + ]), + ]), + ]) + } + renderCurrentConversion () { const { metamask: { currentCurrency, conversionDate }, setCurrentCurrency } = this.props @@ -214,6 +235,7 @@ class Settings extends Component { return ( h('div.settings__content', [ warning && h('div.settings__error', warning), + this.renderBlockieOptIn(), this.renderCurrentConversion(), // this.renderCurrentProvider(), this.renderNewRpcUrl(), @@ -335,6 +357,7 @@ class Settings extends Component { Settings.propTypes = { tab: PropTypes.string, metamask: PropTypes.object, + useBlockie: PropTypes.bool, setCurrentCurrency: PropTypes.func, setRpcTarget: PropTypes.func, displayWarning: PropTypes.func, @@ -347,6 +370,7 @@ const mapStateToProps = state => { return { metamask: state.metamask, warning: state.appState.warning, + useBlockie: state.useBlockie, } } @@ -357,6 +381,7 @@ const mapDispatchToProps = dispatch => { setRpcTarget: newRpc => dispatch(actions.setRpcTarget(newRpc)), displayWarning: warning => dispatch(actions.displayWarning(warning)), revealSeedConfirmation: () => dispatch(actions.revealSeedConfirmation()), + toggleUseBlockie: () => dispatch(actions.toggleUseBlockie()), } } -- cgit