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

10 files changed, 0 insertions, 635 deletions

diff --git a/ui/app/components/pages/first-time-flow/create-password/create-password.component.js b/ui/app/components/pages/first-time-flow/create-password/create-password.component.js
deleted file mode 100644
index 070361652..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/create-password.component.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import { Switch, Route } from 'react-router-dom'
-import NewAccount from './new-account'
-import ImportWithSeedPhrase from './import-with-seed-phrase'
-import {
-  INITIALIZE_CREATE_PASSWORD_ROUTE,
-  INITIALIZE_IMPORT_WITH_SEED_PHRASE_ROUTE,
-  INITIALIZE_SEED_PHRASE_ROUTE,
-} from '../../../../routes'
-
-export default class CreatePassword extends PureComponent {
-  static propTypes = {
-    history: PropTypes.object,
-    isInitialized: PropTypes.bool,
-    onCreateNewAccount: PropTypes.func,
-    onCreateNewAccountFromSeed: PropTypes.func,
-  }
-
-  componentDidMount () {
-    const { isInitialized, history } = this.props
-
-    if (isInitialized) {
-      history.push(INITIALIZE_SEED_PHRASE_ROUTE)
-    }
-  }
-
-  render () {
-    const { onCreateNewAccount, onCreateNewAccountFromSeed } = this.props
-
-    return (
-      <div className="first-time-flow__wrapper">
-        <div className="app-header__logo-container">
-          <img
-            className="app-header__metafox-logo app-header__metafox-logo--horizontal"
-            src="/images/logo/metamask-logo-horizontal.svg"
-            height={30}
-          />
-          <img
-            className="app-header__metafox-logo app-header__metafox-logo--icon"
-            src="/images/logo/metamask-fox.svg"
-            height={42}
-            width={42}
-          />
-        </div>
-        <Switch>
-          <Route
-            exact
-            path={INITIALIZE_IMPORT_WITH_SEED_PHRASE_ROUTE}
-            render={props => (
-              <ImportWithSeedPhrase
-                { ...props }
-                onSubmit={onCreateNewAccountFromSeed}
-              />
-            )}
-          />
-          <Route
-            exact
-            path={INITIALIZE_CREATE_PASSWORD_ROUTE}
-            render={props => (
-              <NewAccount
-                { ...props }
-                onSubmit={onCreateNewAccount}
-              />
-            )}
-          />
-        </Switch>
-      </div>
-    )
-  }
-}
diff --git a/ui/app/components/pages/first-time-flow/create-password/create-password.container.js b/ui/app/components/pages/first-time-flow/create-password/create-password.container.js
deleted file mode 100644
index 89106f016..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/create-password.container.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { connect } from 'react-redux'
-import CreatePassword from './create-password.component'
-
-const mapStateToProps = state => {
-  const { metamask: { isInitialized } } = state
-
-  return {
-    isInitialized,
-  }
-}
-
-export default connect(mapStateToProps)(CreatePassword)
diff --git a/ui/app/components/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js b/ui/app/components/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
deleted file mode 100644
index 4ecaa5895..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
+++ /dev/null
@@ -1,256 +0,0 @@
-import {validateMnemonic} from 'bip39'
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import TextField from '../../../../text-field'
-import Button from '../../../../button'
-import {
-  INITIALIZE_SELECT_ACTION_ROUTE,
-  INITIALIZE_END_OF_FLOW_ROUTE,
-} from '../../../../../routes'
-
-export default class ImportWithSeedPhrase extends PureComponent {
-  static contextTypes = {
-    t: PropTypes.func,
-    metricsEvent: PropTypes.func,
-  }
-
-  static propTypes = {
-    history: PropTypes.object,
-    onSubmit: PropTypes.func.isRequired,
-  }
-
-  state = {
-    seedPhrase: '',
-    password: '',
-    confirmPassword: '',
-    seedPhraseError: '',
-    passwordError: '',
-    confirmPasswordError: '',
-    termsChecked: false,
-  }
-
-  parseSeedPhrase = (seedPhrase) => {
-    return seedPhrase
-      .trim()
-      .match(/\w+/g)
-      .join(' ')
-  }
-
-  handleSeedPhraseChange (seedPhrase) {
-    let seedPhraseError = ''
-
-    if (seedPhrase) {
-      const parsedSeedPhrase = this.parseSeedPhrase(seedPhrase)
-      if (parsedSeedPhrase.split(' ').length !== 12) {
-        seedPhraseError = this.context.t('seedPhraseReq')
-      } else if (!validateMnemonic(parsedSeedPhrase)) {
-        seedPhraseError = this.context.t('invalidSeedPhrase')
-      }
-    }
-
-    this.setState({ seedPhrase, seedPhraseError })
-  }
-
-  handlePasswordChange (password) {
-    const { t } = this.context
-
-    this.setState(state => {
-      const { confirmPassword } = state
-      let confirmPasswordError = ''
-      let passwordError = ''
-
-      if (password && password.length < 8) {
-        passwordError = t('passwordNotLongEnough')
-      }
-
-      if (confirmPassword && password !== confirmPassword) {
-        confirmPasswordError = t('passwordsDontMatch')
-      }
-
-      return {
-        password,
-        passwordError,
-        confirmPasswordError,
-      }
-    })
-  }
-
-  handleConfirmPasswordChange (confirmPassword) {
-    const { t } = this.context
-
-    this.setState(state => {
-      const { password } = state
-      let confirmPasswordError = ''
-
-      if (password !== confirmPassword) {
-        confirmPasswordError = t('passwordsDontMatch')
-      }
-
-      return {
-        confirmPassword,
-        confirmPasswordError,
-      }
-    })
-  }
-
-  handleImport = async event => {
-    event.preventDefault()
-
-    if (!this.isValid()) {
-      return
-    }
-
-    const { password, seedPhrase } = this.state
-    const { history, onSubmit } = this.props
-
-    try {
-      await onSubmit(password, this.parseSeedPhrase(seedPhrase))
-      this.context.metricsEvent({
-        eventOpts: {
-          category: 'Onboarding',
-          action: 'Import Seed Phrase',
-          name: 'Import Complete',
-        },
-      })
-      history.push(INITIALIZE_END_OF_FLOW_ROUTE)
-    } catch (error) {
-      this.setState({ seedPhraseError: error.message })
-    }
-  }
-
-  isValid () {
-    const {
-      seedPhrase,
-      password,
-      confirmPassword,
-      passwordError,
-      confirmPasswordError,
-      seedPhraseError,
-    } = this.state
-
-    if (!password || !confirmPassword || !seedPhrase || password !== confirmPassword) {
-      return false
-    }
-
-    if (password.length < 8) {
-      return false
-    }
-
-    return !passwordError && !confirmPasswordError && !seedPhraseError
-  }
-
-  toggleTermsCheck = () => {
-    this.context.metricsEvent({
-      eventOpts: {
-        category: 'Onboarding',
-        action: 'Import Seed Phrase',
-        name: 'Check ToS',
-      },
-    })
-
-    this.setState((prevState) => ({
-        termsChecked: !prevState.termsChecked,
-    }))
-  }
-
-  render () {
-    const { t } = this.context
-    const { seedPhraseError, passwordError, confirmPasswordError, termsChecked } = this.state
-
-    return (
-      <form
-        className="first-time-flow__form"
-        onSubmit={this.handleImport}
-      >
-        <div className="first-time-flow__create-back">
-          <a
-            onClick={e => {
-              e.preventDefault()
-              this.context.metricsEvent({
-                eventOpts: {
-                  category: 'Onboarding',
-                  action: 'Import Seed Phrase',
-                  name: 'Go Back from Onboarding Import',
-                },
-              })
-              this.props.history.push(INITIALIZE_SELECT_ACTION_ROUTE)
-            }}
-            href="#"
-          >
-            {`< Back`}
-          </a>
-        </div>
-        <div className="first-time-flow__header">
-          { t('importAccountSeedPhrase') }
-        </div>
-        <div className="first-time-flow__text-block">
-          { t('secretPhrase') }
-        </div>
-        <div className="first-time-flow__textarea-wrapper">
-          <label>{ t('walletSeed') }</label>
-          <textarea
-            className="first-time-flow__textarea"
-            onChange={e => this.handleSeedPhraseChange(e.target.value)}
-            value={this.state.seedPhrase}
-            placeholder={t('seedPhrasePlaceholder')}
-          />
-        </div>
-        {
-          seedPhraseError && (
-            <span className="error">
-              { seedPhraseError }
-            </span>
-          )
-        }
-        <TextField
-          id="password"
-          label={t('newPassword')}
-          type="password"
-          className="first-time-flow__input"
-          value={this.state.password}
-          onChange={event => this.handlePasswordChange(event.target.value)}
-          error={passwordError}
-          autoComplete="new-password"
-          margin="normal"
-          largeLabel
-        />
-        <TextField
-          id="confirm-password"
-          label={t('confirmPassword')}
-          type="password"
-          className="first-time-flow__input"
-          value={this.state.confirmPassword}
-          onChange={event => this.handleConfirmPasswordChange(event.target.value)}
-          error={confirmPasswordError}
-          autoComplete="confirm-password"
-          margin="normal"
-          largeLabel
-        />
-        <div className="first-time-flow__checkbox-container" onClick={this.toggleTermsCheck}>
-          <div className="first-time-flow__checkbox">
-            {termsChecked ? <i className="fa fa-check fa-2x" /> : null}
-          </div>
-          <span className="first-time-flow__checkbox-label">
-            I have read and agree to the <a
-              href="https://metamask.io/terms.html"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              <span className="first-time-flow__link-text">
-                { 'Terms of Use' }
-              </span>
-            </a>
-          </span>
-        </div>
-        <Button
-          type="confirm"
-          className="first-time-flow__button"
-          disabled={!this.isValid() || !termsChecked}
-          onClick={this.handleImport}
-        >
-          { t('import') }
-        </Button>
-      </form>
-    )
-  }
-}
diff --git a/ui/app/components/pages/first-time-flow/create-password/import-with-seed-phrase/index.js b/ui/app/components/pages/first-time-flow/create-password/import-with-seed-phrase/index.js
deleted file mode 100644
index e5ff1fde5..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/import-with-seed-phrase/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './import-with-seed-phrase.component'
diff --git a/ui/app/components/pages/first-time-flow/create-password/index.js b/ui/app/components/pages/first-time-flow/create-password/index.js
deleted file mode 100644
index 42e7436f9..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './create-password.container'
diff --git a/ui/app/components/pages/first-time-flow/create-password/new-account/index.js b/ui/app/components/pages/first-time-flow/create-password/new-account/index.js
deleted file mode 100644
index 97db39cc3..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/new-account/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './new-account.component'
diff --git a/ui/app/components/pages/first-time-flow/create-password/new-account/new-account.component.js b/ui/app/components/pages/first-time-flow/create-password/new-account/new-account.component.js
deleted file mode 100644
index 11d10e2d9..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/new-account/new-account.component.js
+++ /dev/null
@@ -1,225 +0,0 @@
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import Button from '../../../../button'
-import {
-  INITIALIZE_SEED_PHRASE_ROUTE,
-  INITIALIZE_IMPORT_WITH_SEED_PHRASE_ROUTE,
-  INITIALIZE_SELECT_ACTION_ROUTE,
-} from '../../../../../routes'
-import TextField from '../../../../text-field'
-
-export default class NewAccount extends PureComponent {
-  static contextTypes = {
-    metricsEvent: PropTypes.func,
-    t: PropTypes.func,
-  }
-
-  static propTypes = {
-    onSubmit: PropTypes.func.isRequired,
-    history: PropTypes.object.isRequired,
-  }
-
-  state = {
-    password: '',
-    confirmPassword: '',
-    passwordError: '',
-    confirmPasswordError: '',
-    termsChecked: false,
-  }
-
-  isValid () {
-    const {
-      password,
-      confirmPassword,
-      passwordError,
-      confirmPasswordError,
-    } = this.state
-
-    if (!password || !confirmPassword || password !== confirmPassword) {
-      return false
-    }
-
-    if (password.length < 8) {
-      return false
-    }
-
-    return !passwordError && !confirmPasswordError
-  }
-
-  handlePasswordChange (password) {
-    const { t } = this.context
-
-    this.setState(state => {
-      const { confirmPassword } = state
-      let passwordError = ''
-      let confirmPasswordError = ''
-
-      if (password && password.length < 8) {
-        passwordError = t('passwordNotLongEnough')
-      }
-
-      if (confirmPassword && password !== confirmPassword) {
-        confirmPasswordError = t('passwordsDontMatch')
-      }
-
-      return {
-        password,
-        passwordError,
-        confirmPasswordError,
-      }
-    })
-  }
-
-  handleConfirmPasswordChange (confirmPassword) {
-    const { t } = this.context
-
-    this.setState(state => {
-      const { password } = state
-      let confirmPasswordError = ''
-
-      if (password !== confirmPassword) {
-        confirmPasswordError = t('passwordsDontMatch')
-      }
-
-      return {
-        confirmPassword,
-        confirmPasswordError,
-      }
-    })
-  }
-
-  handleCreate = async event => {
-    event.preventDefault()
-
-    if (!this.isValid()) {
-      return
-    }
-
-    const { password } = this.state
-    const { onSubmit, history } = this.props
-
-    try {
-      await onSubmit(password)
-
-      this.context.metricsEvent({
-        eventOpts: {
-          category: 'Onboarding',
-          action: 'Create Password',
-          name: 'Submit Password',
-        },
-      })
-
-      history.push(INITIALIZE_SEED_PHRASE_ROUTE)
-    } catch (error) {
-      this.setState({ passwordError: error.message })
-    }
-  }
-
-  handleImportWithSeedPhrase = event => {
-    const { history } = this.props
-
-    event.preventDefault()
-    history.push(INITIALIZE_IMPORT_WITH_SEED_PHRASE_ROUTE)
-  }
-
-  toggleTermsCheck = () => {
-    this.context.metricsEvent({
-      eventOpts: {
-        category: 'Onboarding',
-        action: 'Create Password',
-        name: 'Check ToS',
-      },
-    })
-
-    this.setState((prevState) => ({
-      termsChecked: !prevState.termsChecked,
-    }))
-  }
-
-  render () {
-    const { t } = this.context
-    const { password, confirmPassword, passwordError, confirmPasswordError, termsChecked } = this.state
-
-    return (
-      <div>
-        <div className="first-time-flow__create-back">
-          <a
-            onClick={e => {
-              e.preventDefault()
-              this.context.metricsEvent({
-                eventOpts: {
-                  category: 'Onboarding',
-                  action: 'Create Password',
-                  name: 'Go Back from Onboarding Create',
-                },
-              })
-              this.props.history.push(INITIALIZE_SELECT_ACTION_ROUTE)
-            }}
-            href="#"
-          >
-            {`< Back`}
-          </a>
-        </div>
-        <div className="first-time-flow__header">
-          { t('createPassword') }
-        </div>
-        <form
-          className="first-time-flow__form"
-          onSubmit={this.handleCreate}
-        >
-          <TextField
-            id="create-password"
-            label={t('newPassword')}
-            type="password"
-            className="first-time-flow__input"
-            value={password}
-            onChange={event => this.handlePasswordChange(event.target.value)}
-            error={passwordError}
-            autoFocus
-            autoComplete="new-password"
-            margin="normal"
-            fullWidth
-            largeLabel
-          />
-          <TextField
-            id="confirm-password"
-            label={t('confirmPassword')}
-            type="password"
-            className="first-time-flow__input"
-            value={confirmPassword}
-            onChange={event => this.handleConfirmPasswordChange(event.target.value)}
-            error={confirmPasswordError}
-            autoComplete="confirm-password"
-            margin="normal"
-            fullWidth
-            largeLabel
-          />
-          <div className="first-time-flow__checkbox-container" onClick={this.toggleTermsCheck}>
-            <div className="first-time-flow__checkbox">
-              {termsChecked ? <i className="fa fa-check fa-2x" /> : null}
-            </div>
-            <span className="first-time-flow__checkbox-label">
-              I have read and agree to the <a
-                href="https://metamask.io/terms.html"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <span className="first-time-flow__link-text">
-                  { 'Terms of Use' }
-                </span>
-              </a>
-            </span>
-          </div>
-          <Button
-            type="confirm"
-            className="first-time-flow__button"
-            disabled={!this.isValid() || !termsChecked}
-            onClick={this.handleCreate}
-          >
-            { t('create') }
-          </Button>
-        </form>
-      </div>
-    )
-  }
-}
diff --git a/ui/app/components/pages/first-time-flow/create-password/unique-image/index.js b/ui/app/components/pages/first-time-flow/create-password/unique-image/index.js
deleted file mode 100644
index 0e97bf755..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/unique-image/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './unique-image.container'
diff --git a/ui/app/components/pages/first-time-flow/create-password/unique-image/unique-image.component.js b/ui/app/components/pages/first-time-flow/create-password/unique-image/unique-image.component.js
deleted file mode 100644
index cbc85c0e4..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/unique-image/unique-image.component.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import Button from '../../../../button'
-import { INITIALIZE_END_OF_FLOW_ROUTE } from '../../../../../routes'
-
-export default class UniqueImageScreen extends PureComponent {
-  static contextTypes = {
-    t: PropTypes.func,
-    metricsEvent: PropTypes.func,
-  }
-
-  static propTypes = {
-    history: PropTypes.object,
-  }
-
-  render () {
-    const { t } = this.context
-    const { history } = this.props
-
-    return (
-      <div>
-        <img
-          src="/images/sleuth.svg"
-          height={42}
-          width={42}
-        />
-        <div className="first-time-flow__header">
-          { t('protectYourKeys') }
-        </div>
-        <div className="first-time-flow__text-block">
-          { t('protectYourKeysMessage1') }
-        </div>
-        <div className="first-time-flow__text-block">
-          { t('protectYourKeysMessage2') }
-        </div>
-        <Button
-          type="confirm"
-          className="first-time-flow__button"
-          onClick={() => {
-            this.context.metricsEvent({
-              eventOpts: {
-                category: 'Onboarding',
-                action: 'Agree to Phishing Warning',
-                name: 'Agree to Phishing Warning',
-              },
-            })
-            history.push(INITIALIZE_END_OF_FLOW_ROUTE)
-          }}
-        >
-          { t('next') }
-        </Button>
-      </div>
-    )
-  }
-}
diff --git a/ui/app/components/pages/first-time-flow/create-password/unique-image/unique-image.container.js b/ui/app/components/pages/first-time-flow/create-password/unique-image/unique-image.container.js
deleted file mode 100644
index 34874aaec..000000000
--- a/ui/app/components/pages/first-time-flow/create-password/unique-image/unique-image.container.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { connect } from 'react-redux'
-import UniqueImage from './unique-image.component'
-
-const mapStateToProps = ({ metamask }) => {
-  const { selectedAddress } = metamask
-
-  return {
-    address: selectedAddress,
-  }
-}
-
-export default connect(mapStateToProps)(UniqueImage)