First time flow updates (#6192)

* Action select step of onboarding flow added.

* Update navigation on create and import password screens.

* Adds terms of service checkbox to create and import account screens.

* Add security warning to jazzicon intro step

* Update and streamline unique image to confirm seed steps of first time flow.

* UI touch ups to welcome screen.

* UI touch up on select action page

* Fix first time import flow.

* Add end of flow screen to first time flow

* Replace unique image screen with updated fishing warning screen.

* Update e2e tests for onboarding flow changes.

* Add required translations to onboarding flow.

* Update design of select action screen to emphasize create new wallet option.

* Clean up onboarding flow code.

* Remove notice related code from first-time-flow directory.

* Use updater function argument in new-account.component

1 files changed, 6 insertions, 23 deletions

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
index bc0f73a27..b5c4bf463 100644
--- 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
@@ -2,10 +2,8 @@ import React, { PureComponent } from 'react'
 import PropTypes from 'prop-types'
 import classnames from 'classnames'
 import shuffle from 'lodash.shuffle'
-import Identicon from '../../../../identicon'
 import Button from '../../../../button'
-import Breadcrumbs from '../../../../breadcrumbs'
-import { DEFAULT_ROUTE, INITIALIZE_SEED_PHRASE_ROUTE } from '../../../../../routes'
+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'
 
@@ -19,11 +17,8 @@ export default class ConfirmSeedPhrase extends PureComponent {
   }
 
   static propTypes = {
-    address: PropTypes.string,
-    completeOnboarding: PropTypes.func,
     history: PropTypes.object,
     onSubmit: PropTypes.func,
-    openBuyEtherModal: PropTypes.func,
     seedPhrase: PropTypes.string,
   }
 
@@ -45,16 +40,14 @@ export default class ConfirmSeedPhrase extends PureComponent {
   }
 
   handleSubmit = async () => {
-    const { completeOnboarding, history, openBuyEtherModal } = this.props
+    const { history } = this.props
 
     if (!this.isValid()) {
       return
     }
 
     try {
-      await completeOnboarding()
-      history.push(DEFAULT_ROUTE)
-      openBuyEtherModal()
+      history.push(INITIALIZE_END_OF_FLOW_ROUTE)
     } catch (error) {
       console.error(error.message)
     }
@@ -76,11 +69,11 @@ export default class ConfirmSeedPhrase extends PureComponent {
 
   render () {
     const { t } = this.context
-    const { address, history } = this.props
+    const { history } = this.props
     const { selectedSeedWords, shuffledSeedWords, selectedSeedWordsHash } = this.state
 
     return (
-      <div>
+      <div className="confirm-seed-phrase">
         <div className="confirm-seed-phrase__back-button">
           <a
             onClick={e => {
@@ -92,11 +85,6 @@ export default class ConfirmSeedPhrase extends PureComponent {
             {`< Back`}
           </a>
         </div>
-        <Identicon
-          className="first-time-flow__unique-image"
-          address={address}
-          diameter={70}
-        />
         <div className="first-time-flow__header">
           { t('confirmSecretBackupPhrase') }
         </div>
@@ -143,18 +131,13 @@ export default class ConfirmSeedPhrase extends PureComponent {
           }
         </div>
         <Button
-          type="first-time"
+          type="confirm"
           className="first-time-flow__button"
           onClick={this.handleSubmit}
           disabled={!this.isValid()}
         >
           { t('confirm') }
         </Button>
-        <Breadcrumbs
-          className="first-time-flow__breadcrumbs"
-          total={3}
-          currentIndex={2}
-        />
       </div>
     )
   }