some changes to improve the email collection experience

app/package-lock.json

@@ -3969,8 +3969,17 @@
             "version": "github:lbryio/lbryinc#8e33473daa56ebe80b12509ac5374c5884efef90",
             "from": "github:lbryio/lbryinc#authentication-flow",
             "requires": {
-                "lbry-redux": "github:lbryio/lbry-redux#467e48c77b8004cef738e950bdcc67654748ae9f",
                 "reselect": "^3.0.0"
+            },
+            "dependencies": {
+                "lbry-redux": {
+                    "version": "github:lbryio/lbry-redux#467e48c77b8004cef738e950bdcc67654748ae9f",
+                    "from": "github:lbryio/lbry-redux#467e48c77b8004cef738e950bdcc67654748ae9f",
+                    "requires": {
+                        "proxy-polyfill": "0.1.6",
+                        "reselect": "^3.0.0"
+                    }
+                }
             }
         },
         "lcid": {

app/src/page/firstRun/index.js

@@ -7,8 +7,6 @@ import {
   selectEmailNewErrorMessage,
   selectEmailNewIsPending,
   selectEmailToVerify,
-  selectEmailVerifyErrorMessage,
-  selectEmailVerifyIsPending,
   selectIsAuthenticating
 } from 'lbryinc';
 import FirstRun from './view';
@@ -19,8 +17,6 @@ const select = (state) => ({
   emailToVerify: selectEmailToVerify(state),
   emailNewErrorMessage: selectEmailNewErrorMessage(state),
   emailNewPending: selectEmailNewIsPending(state),
-  emailVerifyErrorMessage: selectEmailVerifyErrorMessage(state),
-  emailVerifyPending: selectEmailVerifyIsPending(state)
 });
 
 const perform = dispatch => ({

app/src/page/firstRun/internal/email-collect-page.js

@@ -8,6 +8,7 @@ import {
   TextInput,
   View
 } from 'react-native';
+import Button from '../../../component/button';
 import Colors from '../../../styles/colors';
 import firstRunStyle from '../../../styles/firstRun';
 
@@ -15,17 +16,25 @@ class EmailCollectPage extends React.PureComponent {
   constructor() {
     super();
     this.state = {
-      email: null
+      email: null,
+      authenticationStarted: false,
+      authenticationFailed: false
     };
   }
 
+  componentWillReceiveProps(nextProps) {
+    const { authenticating, authToken } = this.props;
+
+    if (this.state.authenticationStarted && !authenticating && authToken === null) {
+      this.setState({ authenticationFailed: true, authenticationStarted: false });
+    }
+  }
+
   componentDidMount() {
     // call user/new
     const { generateAuthToken, authenticating, authToken } = this.props;
     if (!authToken && !authenticating) {
-      Lbry.status().then(info => {
-        generateAuthToken(info.installation_id)
-      });
+      this.startAuthenticating(true);
     }
 
     AsyncStorage.getItem('firstRunEmail').then(email => {
@@ -35,6 +44,18 @@ class EmailCollectPage extends React.PureComponent {
     });
   }
 
+  startAuthenticating = (useTimeout) => {
+    const { generateAuthToken } = this.props;
+    this.setState({ authenticationStarted: true, authenticationFailed: false });
+    setTimeout(() => {
+      Lbry.status().then(info => {
+        generateAuthToken(info.installation_id)
+      }).catch(error => {
+        this.setState({ authenticationFailed: true });
+      });
+    }, useTimeout ? 5000 : 0); // if useTimeout is set, wait 5s to give the daemon some time to start
+  }
+
   handleChangeText = (text) => {
     // save the value to the state email
     this.setState({ email: text });
@@ -42,19 +63,23 @@ class EmailCollectPage extends React.PureComponent {
   }
 
   render() {
-    let authenticationFailed = false;
     const { authenticating, authToken, onEmailViewLayout, emailToVerify } = this.props;
 
     let content;
-    if (!authToken || authenticating) {
+    if (this.state.authenticationFailed) {
+      // Ask the user to try again
+      content = (
+        <View>
+          <Text style={firstRunStyle.paragraph}>The LBRY servers were unreachable at this time. Please check your Internet connection and then restart the app to try again.</Text>
+        </View>
+      );
+    } else if (!authToken || authenticating) {
       content = (
         <View>
           <ActivityIndicator size="large" color={Colors.White} style={firstRunStyle.waiting} />
           <Text style={firstRunStyle.paragraph}>Please wait while we get some things ready...</Text>
         </View>
-      )
-    } else if (authenticationFailed) {
-      // Ask the user to try again
+      );
     } else {
       content = (
         <View onLayout={onEmailViewLayout}>
@@ -69,7 +94,7 @@ class EmailCollectPage extends React.PureComponent {
               />
           <Text style={firstRunStyle.infoParagraph}>This information is disclosed only to LBRY, Inc. and not to the LBRY network. It is only required to earn LBRY rewards and may be used to sync usage data across devices.</Text>
         </View>
-      )
+      );
     }
 
     return (

app/src/page/firstRun/view.js

@@ -14,7 +14,6 @@ import Colors from '../../styles/colors';
 import Constants from '../../constants';
 import WelcomePage from './internal/welcome-page';
 import EmailCollectPage from './internal/email-collect-page';
-//import EmailVerifyPage from '../internal/email-verify-page';
 import firstRunStyle from '../../styles/firstRun';
 
 class FirstRunScreen extends React.PureComponent {
@@ -27,8 +26,9 @@ class FirstRunScreen extends React.PureComponent {
     super();
     this.state = {
       currentPage: null,
-      launchUrl: null,
+      emailSubmitted: false,
       isFirstRun: false,
+      launchUrl: null,
       showBottomContainer: true
     };
   }
@@ -56,6 +56,21 @@ class FirstRunScreen extends React.PureComponent {
     }
   }
 
+  componentWillReceiveProps(nextProps) {
+    const { emailNewErrorMessage, emailNewPending } = nextProps;
+    const { notify } = this.props;
+
+    if (this.state.emailSubmitted && !emailNewPending) {
+      this.setState({ emailSubmitted: false });
+      if (emailNewErrorMessage) {
+        notify ({ message: String(emailNewErrorMessage), displayType: ['toast']});
+      } else {
+        // Request successful. Navigate to discover.
+        this.closeFinalPage();
+      }
+    }
+  }
+
   launchSplashScreen() {
     const { navigation } = this.props;
     const resetAction = NavigationActions.reset({
@@ -95,9 +110,7 @@ class FirstRunScreen extends React.PureComponent {
       }
 
       addUserEmail(email);
-
-      // treat as the final page
-      this.closeFinalPage();
+      this.setState({ emailSubmitted: true });
     });
   }
 

app/src/styles/firstRun.js

@@ -55,6 +55,14 @@ const firstRunStyle = StyleSheet.create({
   bottomContainer: {
     flex: 1
   },
+  actionButton: {
+    backgroundColor: Colors.White,
+    alignSelf: 'center',
+    fontFamily: 'Metropolis-Regular',
+    fontSize: 12,
+    paddingLeft: 16,
+    paddingRight: 16
+  },
   button: {
     alignSelf: 'flex-end',
     marginLeft: 32,