From 31175625b446cb5d18b17db23018bca8b14d280c Mon Sep 17 00:00:00 2001 From: Chi Kei Chan Date: Thu, 21 Mar 2019 16:03:30 -0700 Subject: Folder restructure (#6304) * Remove ui/app/keychains/ * Remove ui/app/img/ (unused images) * Move conversion-util to helpers/utils/ * Move token-util to helpers/utils/ * Move /helpers/*.js inside /helpers/utils/ * Move util tests inside /helpers/utils/ * Renameand move confirm-transaction/util.js to helpers/utils/ * Move higher-order-components to helpers/higher-order-components/ * Move infura-conversion.json to helpers/constants/ * Move all utility functions to helpers/utils/ * Move pages directory to top-level * Move all constants to helpers/constants/ * Move metametrics inside helpers/ * Move app and root inside pages/ * Move routes inside helpers/ * Re-organize ducks/ * Move reducers to ducks/ * Move selectors inside selectors/ * Move test out of test folder * Move action, reducer, store inside store/ * Move ui components inside ui/ * Move UI components inside ui/ * Move connected components inside components/app/ * Move i18n-helper inside helpers/ * Fix unit tests * Fix unit test * Move pages components * Rename routes component * Move reducers to ducks/index * Fix bad path in unit test --- .../confirm-seed-phrase.component.js | 155 --------------------- .../confirm-seed-phrase.state.js | 41 ------ .../seed-phrase/confirm-seed-phrase/index.js | 1 - .../seed-phrase/confirm-seed-phrase/index.scss | 48 ------- .../pages/first-time-flow/seed-phrase/index.js | 1 - .../pages/first-time-flow/seed-phrase/index.scss | 40 ------ .../seed-phrase/reveal-seed-phrase/index.js | 1 - .../seed-phrase/reveal-seed-phrase/index.scss | 57 -------- .../reveal-seed-phrase.component.js | 143 ------------------- .../seed-phrase/seed-phrase.component.js | 70 ---------- 10 files changed, 557 deletions(-) delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.state.js delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.js delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.scss delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/index.js delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/index.scss delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.js delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.scss delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js delete mode 100644 ui/app/components/pages/first-time-flow/seed-phrase/seed-phrase.component.js (limited to 'ui/app/components/pages/first-time-flow/seed-phrase') diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js b/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js deleted file mode 100644 index bd5ab8a84..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js +++ /dev/null @@ -1,155 +0,0 @@ -import React, { PureComponent } from 'react' -import PropTypes from 'prop-types' -import classnames from 'classnames' -import shuffle from 'lodash.shuffle' -import Button from '../../../../button' -import { - INITIALIZE_END_OF_FLOW_ROUTE, - INITIALIZE_SEED_PHRASE_ROUTE, -} from '../../../../../routes' -import { exportAsFile } from '../../../../../../app/util' -import { selectSeedWord, deselectSeedWord } from './confirm-seed-phrase.state' - -export default class ConfirmSeedPhrase extends PureComponent { - static contextTypes = { - metricsEvent: PropTypes.func, - t: PropTypes.func, - } - - static defaultProps = { - seedPhrase: '', - } - - static propTypes = { - history: PropTypes.object, - onSubmit: PropTypes.func, - seedPhrase: PropTypes.string, - } - - state = { - selectedSeedWords: [], - shuffledSeedWords: [], - // Hash of shuffledSeedWords index {Number} to selectedSeedWords index {Number} - selectedSeedWordsHash: {}, - } - - componentDidMount () { - const { seedPhrase = '' } = this.props - const shuffledSeedWords = shuffle(seedPhrase.split(' ')) || [] - this.setState({ shuffledSeedWords }) - } - - handleExport = () => { - exportAsFile('MetaMask Secret Backup Phrase', this.props.seedPhrase, 'text/plain') - } - - handleSubmit = async () => { - const { history } = this.props - - if (!this.isValid()) { - return - } - - try { - this.context.metricsEvent({ - eventOpts: { - category: 'Onboarding', - action: 'Seed Phrase Setup', - name: 'Verify Complete', - }, - }) - history.push(INITIALIZE_END_OF_FLOW_ROUTE) - } catch (error) { - console.error(error.message) - } - } - - handleSelectSeedWord = (word, shuffledIndex) => { - this.setState(selectSeedWord(word, shuffledIndex)) - } - - handleDeselectSeedWord = shuffledIndex => { - this.setState(deselectSeedWord(shuffledIndex)) - } - - isValid () { - const { seedPhrase } = this.props - const { selectedSeedWords } = this.state - return seedPhrase === selectedSeedWords.join(' ') - } - - render () { - const { t } = this.context - const { history } = this.props - const { selectedSeedWords, shuffledSeedWords, selectedSeedWordsHash } = this.state - - return ( -
-
- { - e.preventDefault() - history.push(INITIALIZE_SEED_PHRASE_ROUTE) - }} - href="#" - > - {`< Back`} - -
-
- { t('confirmSecretBackupPhrase') } -
-
- { t('selectEachPhrase') } -
-
- { - selectedSeedWords.map((word, index) => ( -
- { word } -
- )) - } -
-
- { - shuffledSeedWords.map((word, index) => { - const isSelected = index in selectedSeedWordsHash - - return ( -
{ - if (!isSelected) { - this.handleSelectSeedWord(word, index) - } else { - this.handleDeselectSeedWord(index) - } - }} - > - { word } -
- ) - }) - } -
- -
- ) - } -} diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.state.js b/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.state.js deleted file mode 100644 index f2476fc5c..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.state.js +++ /dev/null @@ -1,41 +0,0 @@ -export function selectSeedWord (word, shuffledIndex) { - return function update (state) { - const { selectedSeedWords, selectedSeedWordsHash } = state - const nextSelectedIndex = selectedSeedWords.length - - return { - selectedSeedWords: [ ...selectedSeedWords, word ], - selectedSeedWordsHash: { ...selectedSeedWordsHash, [shuffledIndex]: nextSelectedIndex }, - } - } -} - -export function deselectSeedWord (shuffledIndex) { - return function update (state) { - const { - selectedSeedWords: prevSelectedSeedWords, - selectedSeedWordsHash: prevSelectedSeedWordsHash, - } = state - - const selectedSeedWords = [...prevSelectedSeedWords] - const indexToRemove = prevSelectedSeedWordsHash[shuffledIndex] - selectedSeedWords.splice(indexToRemove, 1) - const selectedSeedWordsHash = Object.keys(prevSelectedSeedWordsHash).reduce((acc, index) => { - const output = { ...acc } - const selectedSeedWordIndex = prevSelectedSeedWordsHash[index] - - if (selectedSeedWordIndex < indexToRemove) { - output[index] = selectedSeedWordIndex - } else if (selectedSeedWordIndex > indexToRemove) { - output[index] = selectedSeedWordIndex - 1 - } - - return output - }, {}) - - return { - selectedSeedWords, - selectedSeedWordsHash, - } - } -} diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.js b/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.js deleted file mode 100644 index c7b511503..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './confirm-seed-phrase.component' diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.scss b/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.scss deleted file mode 100644 index 93137618c..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/confirm-seed-phrase/index.scss +++ /dev/null @@ -1,48 +0,0 @@ -.confirm-seed-phrase { - &__back-button { - margin-bottom: 12px; - } - - &__selected-seed-words { - min-height: 190px; - max-width: 496px; - border: 1px solid #CDCDCD; - border-radius: 6px; - background-color: $white; - margin: 24px 0 36px; - padding: 12px; - } - - &__shuffled-seed-words { - max-width: 496px; - } - - &__seed-word { - display: inline-block; - color: #5B5D67; - background-color: #E7E7E7; - padding: 8px 18px; - min-width: 64px; - margin: 4px; - text-align: center; - - &--selected { - background-color: #85D1CC; - color: $white; - } - - &--shuffled { - cursor: pointer; - margin: 6px; - } - - @media screen and (max-width: 575px) { - font-size: .875rem; - padding: 6px 18px; - } - } - - button { - margin-top: 0xp; - } -} diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/index.js b/ui/app/components/pages/first-time-flow/seed-phrase/index.js deleted file mode 100644 index 185b3f089..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './seed-phrase.component' diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/index.scss b/ui/app/components/pages/first-time-flow/seed-phrase/index.scss deleted file mode 100644 index e4fd7be4f..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/index.scss +++ /dev/null @@ -1,40 +0,0 @@ -@import './confirm-seed-phrase/index'; - -@import './reveal-seed-phrase/index'; - -.seed-phrase { - - &__sections { - display: flex; - - @media screen and (min-width: $break-large) { - flex-direction: row; - } - - @media screen and (max-width: $break-small) { - flex-direction: column; - } - } - - &__main { - flex: 3; - min-width: 0; - } - - &__side { - flex: 2; - min-width: 0; - - @media screen and (min-width: $break-large) { - margin-left: 81px; - } - - @media screen and (max-width: $break-small) { - margin-top: 24px; - } - - .first-time-flow__text-block { - color: #5A5A5A; - } - } -} diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.js b/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.js deleted file mode 100644 index 4a1b191b5..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './reveal-seed-phrase.component' diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.scss b/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.scss deleted file mode 100644 index 8a47447ed..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/index.scss +++ /dev/null @@ -1,57 +0,0 @@ -.reveal-seed-phrase { - &__secret { - position: relative; - display: flex; - justify-content: center; - border: 1px solid #CDCDCD; - border-radius: 6px; - background-color: $white; - padding: 18px; - margin-top: 36px; - max-width: 350px; - } - - &__secret-words { - width: 310px; - font-size: 1.25rem; - text-align: center; - - &--hidden { - filter: blur(5px); - } - } - - &__secret-blocker { - position: absolute; - top: 0; - bottom: 0; - height: 100%; - width: 100%; - background-color: rgba(0,0,0,0.6); - display: flex; - flex-flow: column nowrap; - align-items: center; - justify-content: center; - padding: 8px 0 18px; - cursor: pointer; - } - - &__reveal-button { - color: $white; - font-size: .75rem; - font-weight: 500; - text-transform: uppercase; - margin-top: 8px; - text-align: center; - } - - &__export-text { - color: $curious-blue; - cursor: pointer; - font-weight: 500; - } - - button { - margin-top: 0xp; - } -} diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js b/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js deleted file mode 100644 index cb8a01322..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js +++ /dev/null @@ -1,143 +0,0 @@ -import React, { PureComponent } from 'react' -import PropTypes from 'prop-types' -import classnames from 'classnames' -import LockIcon from '../../../../lock-icon' -import Button from '../../../../button' -import { INITIALIZE_CONFIRM_SEED_PHRASE_ROUTE } from '../../../../../routes' -import { exportAsFile } from '../../../../../../app/util' - -export default class RevealSeedPhrase extends PureComponent { - static contextTypes = { - t: PropTypes.func, - metricsEvent: PropTypes.func, - } - - static propTypes = { - history: PropTypes.object, - seedPhrase: PropTypes.string, - } - - state = { - isShowingSeedPhrase: false, - } - - handleExport = () => { - exportAsFile('MetaMask Secret Backup Phrase', this.props.seedPhrase, 'text/plain') - } - - handleNext = event => { - event.preventDefault() - const { isShowingSeedPhrase } = this.state - const { history } = this.props - - this.context.metricsEvent({ - eventOpts: { - category: 'Onboarding', - action: 'Seed Phrase Setup', - name: 'Advance to Verify', - }, - }) - - if (!isShowingSeedPhrase) { - return - } - - history.push(INITIALIZE_CONFIRM_SEED_PHRASE_ROUTE) - } - - renderSecretWordsContainer () { - const { t } = this.context - const { seedPhrase } = this.props - const { isShowingSeedPhrase } = this.state - - return ( -
-
- { seedPhrase } -
- { - !isShowingSeedPhrase && ( -
{ - this.context.metricsEvent({ - eventOpts: { - category: 'Onboarding', - action: 'Seed Phrase Setup', - name: 'Revealed Words', - }, - }) - this.setState({ isShowingSeedPhrase: true }) - }} - > - -
- { t('clickToRevealSeed') } -
-
- ) - } -
- ) - } - - render () { - const { t } = this.context - const { isShowingSeedPhrase } = this.state - - return ( -
-
-
-
- { t('secretBackupPhrase') } -
-
- { t('secretBackupPhraseDescription') } -
-
- { t('secretBackupPhraseWarning') } -
- { this.renderSecretWordsContainer() } -
-
-
- { `${t('tips')}:` } -
-
- { t('storePhrase') } -
-
- { t('writePhrase') } -
-
- { t('memorizePhrase') } -
-
- - { t('downloadSecretBackup') } - -
-
-
- -
- ) - } -} diff --git a/ui/app/components/pages/first-time-flow/seed-phrase/seed-phrase.component.js b/ui/app/components/pages/first-time-flow/seed-phrase/seed-phrase.component.js deleted file mode 100644 index 9eec89cdd..000000000 --- a/ui/app/components/pages/first-time-flow/seed-phrase/seed-phrase.component.js +++ /dev/null @@ -1,70 +0,0 @@ -import React, { PureComponent } from 'react' -import PropTypes from 'prop-types' -import { Switch, Route } from 'react-router-dom' -import RevealSeedPhrase from './reveal-seed-phrase' -import ConfirmSeedPhrase from './confirm-seed-phrase' -import { - INITIALIZE_SEED_PHRASE_ROUTE, - INITIALIZE_CONFIRM_SEED_PHRASE_ROUTE, - DEFAULT_ROUTE, -} from '../../../../routes' - -export default class SeedPhrase extends PureComponent { - static propTypes = { - address: PropTypes.string, - history: PropTypes.object, - seedPhrase: PropTypes.string, - } - - componentDidMount () { - const { seedPhrase, history } = this.props - - if (!seedPhrase) { - history.push(DEFAULT_ROUTE) - } - } - - render () { - const { seedPhrase } = this.props - - return ( -
-
- - -
- - ( - - )} - /> - ( - - )} - /> - -
- ) - } -} -- cgit