Merge branch 'develop' into i3725-refactor-send-component-

4 files changed, 63 insertions, 69 deletions

diff --git a/mascara/src/app/first-time/import-account-screen.js b/mascara/src/app/first-time/import-account-screen.js
index ab0aca0f0..555a26386 100644
--- a/mascara/src/app/first-time/import-account-screen.js
+++ b/mascara/src/app/first-time/import-account-screen.js
@@ -70,10 +70,14 @@ class ImportAccountScreen extends Component {
     switch (this.state.selectedOption) {
       case OPTIONS.JSON_FILE:
         return importNewAccount('JSON File', [ jsonFile, password ])
+          // JS runtime requires caught rejections but failures are handled by Redux
+          .catch()
           .then(next)
       case OPTIONS.PRIVATE_KEY:
       default:
         return importNewAccount('Private Key', [ privateKey ])
+          // JS runtime requires caught rejections but failures are handled by Redux
+          .catch()
           .then(next)
     }
   }
diff --git a/mascara/src/app/first-time/index.css b/mascara/src/app/first-time/index.css
index 5f8bbd4be..dffc21017 100644
--- a/mascara/src/app/first-time/index.css
+++ b/mascara/src/app/first-time/index.css
@@ -21,6 +21,7 @@
   display: flex;
   justify-content: center;
   background: #f7861c;
+  flex: 0 0 auto;
 }
 
 .alpha-warning,
diff --git a/mascara/src/app/first-time/index.js b/mascara/src/app/first-time/index.js
index 01e5d67a6..dc254bb19 100644
--- a/mascara/src/app/first-time/index.js
+++ b/mascara/src/app/first-time/index.js
@@ -3,6 +3,8 @@ import PropTypes from 'prop-types'
 import {connect} from 'react-redux'
 import { withRouter, Switch, Route } from 'react-router-dom'
 import { compose } from 'recompose'
+import classnames from 'classnames'
+
 import CreatePasswordScreen from './create-password-screen'
 import UniqueImageScreen from './unique-image-screen'
 import NoticeScreen from './notice-screen'
@@ -33,6 +35,7 @@ class FirstTimeFlow extends Component {
     isUnlocked: PropTypes.bool,
     history: PropTypes.object,
     welcomeScreenSeen: PropTypes.bool,
+    isPopup: PropTypes.bool,
   };
 
   static defaultProps = {
@@ -41,23 +44,44 @@ class FirstTimeFlow extends Component {
     noActiveNotices: false,
   };
 
+  renderAppBar () {
+    const { welcomeScreenSeen } = this.props
+
+    return (
+      <div className="alpha-warning__container">
+        <h2 className={classnames({
+            'alpha-warning': welcomeScreenSeen,
+            'alpha-warning-welcome-screen': !welcomeScreenSeen,
+          })}
+        >
+          Please be aware that this version is still under development
+        </h2>
+      </div>
+    )
+  }
+
   render () {
+    const { isPopup } = this.props
+
     return (
-      <div className="first-time-flow">
-        <Switch>
-          <Route exact path={INITIALIZE_IMPORT_ACCOUNT_ROUTE} component={ImportAccountScreen} />
-          <Route
-            exact
-            path={INITIALIZE_IMPORT_WITH_SEED_PHRASE_ROUTE}
-            component={ImportSeedPhraseScreen}
-          />
-          <Route exact path={INITIALIZE_UNIQUE_IMAGE_ROUTE} component={UniqueImageScreen} />
-          <Route exact path={INITIALIZE_NOTICE_ROUTE} component={NoticeScreen} />
-          <Route exact path={INITIALIZE_BACKUP_PHRASE_ROUTE} component={BackupPhraseScreen} />
-          <Route exact path={INITIALIZE_CONFIRM_SEED_ROUTE} component={ConfirmSeed} />
-          <Route exact path={INITIALIZE_CREATE_PASSWORD_ROUTE} component={CreatePasswordScreen} />
-          <Route exact path={INITIALIZE_ROUTE} component={WelcomeScreen} />
-        </Switch>
+      <div className="flex-column flex-grow">
+        { !isPopup && this.renderAppBar() }
+        <div className="first-time-flow">
+          <Switch>
+            <Route exact path={INITIALIZE_IMPORT_ACCOUNT_ROUTE} component={ImportAccountScreen} />
+            <Route
+              exact
+              path={INITIALIZE_IMPORT_WITH_SEED_PHRASE_ROUTE}
+              component={ImportSeedPhraseScreen}
+            />
+            <Route exact path={INITIALIZE_UNIQUE_IMAGE_ROUTE} component={UniqueImageScreen} />
+            <Route exact path={INITIALIZE_NOTICE_ROUTE} component={NoticeScreen} />
+            <Route exact path={INITIALIZE_BACKUP_PHRASE_ROUTE} component={BackupPhraseScreen} />
+            <Route exact path={INITIALIZE_CONFIRM_SEED_ROUTE} component={ConfirmSeed} />
+            <Route exact path={INITIALIZE_CREATE_PASSWORD_ROUTE} component={CreatePasswordScreen} />
+            <Route exact path={INITIALIZE_ROUTE} component={WelcomeScreen} />
+          </Switch>
+        </div>
       </div>
     )
   }
@@ -73,6 +97,7 @@ const mapStateToProps = ({ metamask }) => {
     isMascara,
     isUnlocked,
     welcomeScreenSeen,
+    isPopup,
   } = metamask
 
   return {
@@ -84,6 +109,7 @@ const mapStateToProps = ({ metamask }) => {
     forgottenPassword,
     isUnlocked,
     welcomeScreenSeen,
+    isPopup,
   }
 }
 
diff --git a/mascara/src/app/first-time/seed-screen.js b/mascara/src/app/first-time/seed-screen.js
index 9af9ca3be..d004be77b 100644
--- a/mascara/src/app/first-time/seed-screen.js
+++ b/mascara/src/app/first-time/seed-screen.js
@@ -8,7 +8,6 @@ import Identicon from '../../../../ui/app/components/identicon'
 import Breadcrumbs from './breadcrumbs'
 import LoadingScreen from './loading-screen'
 import { DEFAULT_ROUTE, INITIALIZE_CONFIRM_SEED_ROUTE } from '../../../../ui/app/routes'
-import { confirmSeedWords } from '../../../../ui/app/actions'
 
 const LockIcon = props => (
   <svg
@@ -45,8 +44,6 @@ class BackupPhraseScreen extends Component {
     address: PropTypes.string.isRequired,
     seedWords: PropTypes.string,
     history: PropTypes.object,
-    isRevealingSeedWords: PropTypes.bool,
-    clearSeedWords: PropTypes.func,
   };
 
   static defaultProps = {
@@ -61,14 +58,6 @@ class BackupPhraseScreen extends Component {
   }
 
   componentWillMount () {
-    this.checkSeedWords()
-  }
-
-  componentDidUpdate () {
-    this.checkSeedWords()
-  }
-
-  checkSeedWords () {
     const { seedWords, history } = this.props
 
     if (!seedWords) {
@@ -103,29 +92,9 @@ class BackupPhraseScreen extends Component {
     )
   }
 
-  renderSubmitButton () {
-    const { isRevealingSeedWords, clearSeedWords, history } = this.props
-    const { isShowingSecret } = this.state
-
-    return isRevealingSeedWords
-      ? <button
-        className="first-time-flow__button"
-        onClick={() => clearSeedWords().then(() => history.push(DEFAULT_ROUTE))}
-        disabled={!isShowingSecret}
-      >
-        Done
-      </button>
-      : <button
-        className="first-time-flow__button"
-        onClick={() => isShowingSecret && history.push(INITIALIZE_CONFIRM_SEED_ROUTE)}
-        disabled={!isShowingSecret}
-      >
-        Next
-      </button>
-  }
-
   renderSecretScreen () {
-    const { isRevealingSeedWords } = this.props
+    const { isShowingSecret } = this.state
+    const { history } = this.props
 
     return (
       <div className="backup-phrase__content-wrapper">
@@ -152,8 +121,14 @@ class BackupPhraseScreen extends Component {
           </div>
         </div>
         <div className="backup-phrase__next-button">
-          { this.renderSubmitButton() }
-          { !isRevealingSeedWords && <Breadcrumbs total={3} currentIndex={1} />}
+          <button
+            className="first-time-flow__button"
+            onClick={() => isShowingSecret && history.push(INITIALIZE_CONFIRM_SEED_ROUTE)}
+            disabled={!isShowingSecret}
+          >
+            Next
+          </button>
+          <Breadcrumbs total={3} currentIndex={1} />
         </div>
       </div>
     )
@@ -175,25 +150,13 @@ class BackupPhraseScreen extends Component {
   }
 }
 
-const mapStateToProps = ({ metamask, appState }) => {
-  const { selectedAddress, seedWords, isRevealingSeedWords } = metamask
-  const { isLoading } = appState
-
-  return {
-    seedWords,
-    isRevealingSeedWords,
-    isLoading,
-    address: selectedAddress,
-  }
-}
-
-const mapDispatchToProps = dispatch => {
-  return {
-    clearSeedWords: () => dispatch(confirmSeedWords()),
-  }
-}
-
 export default compose(
   withRouter,
-  connect(mapStateToProps, mapDispatchToProps),
+  connect(
+    ({ metamask: { selectedAddress, seedWords }, appState: { isLoading } }) => ({
+      seedWords,
+      isLoading,
+      address: selectedAddress,
+    })
+  )
 )(BackupPhraseScreen)