From 5b1ea449f3beb1d71040a6d76cd9122c4fd1211f Mon Sep 17 00:00:00 2001 From: pbca26 Date: Sun, 4 Mar 2018 16:39:59 +0300 Subject: [PATCH] switch force seed trim with a warning icon --- react/src/assets/images/cryptologo/coqui.png | Bin 5725 -> 5363 bytes .../importKeyModal/importKeyModal.js | 23 +++++++--- .../importKeyModal/importKeyModal.render.js | 10 +++++ .../importKeyModal/importKeyModal.scss | 6 +++ .../dashboard/navbar/navbar.render.js | 3 +- .../settings/settings.bip39KeysPanel.js | 40 ++++++++++++------ .../settings/settings.exportKeysPanel.js | 34 ++++++++++++--- .../dashboard/settings/settings.scss | 6 +++ react/src/components/login/login.js | 21 ++++++--- react/src/components/login/login.render.js | 10 +++++ react/src/components/login/login.scss | 7 +++ 11 files changed, 124 insertions(+), 36 deletions(-) diff --git a/react/src/assets/images/cryptologo/coqui.png b/react/src/assets/images/cryptologo/coqui.png index 59f61a8bd62dd537a792fc5f9962a2d6331f131e..5c83bab7c657c953a6e1d4c769c1225e225c5e57 100644 GIT binary patch delta 2659 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 REJpwU002ovPDHLkV1i;25QzW) delta 3024 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 SK{(q00000 { + const _trimPassphraseTimer = setTimeout(() => { + if (newValue[0] === ' ' || + newValue[newValue.length - 1] === ' ') { this.setState({ - wifkeysPassphrase: newValue ? newValue.trim() : '', // hardcoded field name + seedExtraSpaces: true, }); - }, 2000); + } else { + this.setState({ + seedExtraSpaces: false, + }); + } + }, SEED_TRIM_TIMEOUT); + if (e.target.name === 'wifkeysPassphrase') { this.resizeLoginTextarea(); this.setState({ diff --git a/react/src/components/dashboard/importKeyModal/importKeyModal.render.js b/react/src/components/dashboard/importKeyModal/importKeyModal.render.js index 3f244fa..22c7dbd 100644 --- a/react/src/components/dashboard/importKeyModal/importKeyModal.render.js +++ b/react/src/components/dashboard/importKeyModal/importKeyModal.render.js @@ -64,6 +64,16 @@ export const ImportKeyModalRender = function() { + { this.state.seedExtraSpaces && + + + + + }

diff --git a/react/src/components/dashboard/settings/settings.exportKeysPanel.js b/react/src/components/dashboard/settings/settings.exportKeysPanel.js index 35de2fb..823bd89 100644 --- a/react/src/components/dashboard/settings/settings.exportKeysPanel.js +++ b/react/src/components/dashboard/settings/settings.exportKeysPanel.js @@ -7,6 +7,9 @@ import { triggerToaster, } from '../../../actions/actionCreators'; import Store from '../../../store'; +import ReactTooltip from 'react-tooltip'; + +const SEED_TRIM_TIMEOUT = 5000; class ExportKeysPanel extends React.Component { constructor() { @@ -16,6 +19,7 @@ class ExportKeysPanel extends React.Component { trimPassphraseTimer: null, wifkeysPassphrase: '', keys: null, + seedExtraSpaces: false, }; this.exportWifKeys = this.exportWifKeys.bind(this); this.toggleSeedInputVisibility = this.toggleSeedInputVisibility.bind(this); @@ -109,18 +113,24 @@ class ExportKeysPanel extends React.Component { } updateInput(e) { - if (e.target.name === 'wifkeysPassphrase') { - // remove any empty chars from the start/end of the string - const newValue = e.target.value; + const newValue = e.target.value; - clearTimeout(this.state.trimPassphraseTimer); + clearTimeout(this.state.trimPassphraseTimer); - const _trimPassphraseTimer = setTimeout(() => { + const _trimPassphraseTimer = setTimeout(() => { + if (newValue[0] === ' ' || + newValue[newValue.length - 1] === ' ') { this.setState({ - wifkeysPassphrase: newValue ? newValue.trim() : '', // hardcoded field name + seedExtraSpaces: true, }); - }, 2000); + } else { + this.setState({ + seedExtraSpaces: false, + }); + } + }, SEED_TRIM_TIMEOUT); + if (e.target.name === 'wifkeysPassphrase') { this.resizeLoginTextarea(); this.setState({ @@ -198,6 +208,16 @@ class ExportKeysPanel extends React.Component { + { this.state.seedExtraSpaces && + + + + + }
} + { this.state.seedExtraSpaces && + + + + + } { this.state.loginPassphrase && this.state.enableEncryptSeed &&
diff --git a/react/src/components/login/login.scss b/react/src/components/login/login.scss index 81fa5da..4bb1098 100644 --- a/react/src/components/login/login.scss +++ b/react/src/components/login/login.scss @@ -187,6 +187,13 @@ option.login-option { } .page-login { + .seed-extra-spaces-warning { + position: absolute; + right: -30px; + margin-top: 54px; + font-size: 20px; + color: rgb(255, 75, 0); + } .addcoin-shortcut { display: inline-block; width: 46%;