feat(ux): Move check for updates into settings screen (#329)

gitpoint · Sep 14, 2017 · 2f4e534 · 2f4e534
1 parent 3b95dda
commit 2f4e534
Show file tree

Hide file tree

Showing 2 changed files with 73 additions and 63 deletions.
diff --git a/src/auth/screens/auth-profile.screen.js b/src/auth/screens/auth-profile.screen.js
@@ -3,14 +3,12 @@ import { connect } from 'react-redux';
 import {
   StyleSheet,
   Text,
-  TouchableOpacity,
   RefreshControl,
   View,
   ActivityIndicator,
   Dimensions,
 } from 'react-native';
 import { ListItem } from 'react-native-elements';
-import codePush from 'react-native-code-push';
 
 import {
   ViewContainer,
@@ -23,7 +21,6 @@ import {
 import { colors, fonts, normalize } from 'config';
 import { getUser, getOrgs, signOut, getStarCount } from 'auth';
 import { emojifyText, openURLInView, translate } from 'utils';
-import { version } from 'package.json';
 
 const mapStateToProps = state => ({
   user: state.auth.user,
@@ -75,14 +72,6 @@ const styles = StyleSheet.create({
   },
 });
 
-const updateText = lang => ({
-  check: translate('auth.profile.codePushCheck', lang),
-  checking: translate('auth.profile.codePushChecking', lang),
-  updated: translate('auth.profile.codePushUpdated', lang),
-  available: translate('auth.profile.codePushAvailable', lang),
-  notApplicable: translate('auth.profile.codePushNotApplicable', lang),
-});
-
 class AuthProfile extends Component {
   props: {
     getUserByDispatch: Function,
@@ -98,48 +87,10 @@ class AuthProfile extends Component {
     navigation: Object,
   };
 
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      updateText: updateText(props.language).check,
-    };
-  }
-
   componentDidMount() {
     this.refreshProfile();
   }
 
-  componentWillReceiveProps(nextProps) {
-    if (nextProps.language !== this.props.language) {
-      this.setState({
-        updateText: updateText(nextProps.language).check,
-      });
-    }
-  }
-
-  checkForUpdate = () => {
-    if (__DEV__) {
-      this.setState({
-        updateText: updateText(this.props.language).notApplicable,
-      });
-    } else {
-      this.setState({ updateText: updateText(this.props.language).checking });
-      codePush
-        .sync({
-          updateDialog: true,
-          installMode: codePush.InstallMode.IMMEDIATE,
-        })
-        .then(update => {
-          this.setState({
-            updateText: update
-              ? updateText(this.props.language).available
-              : updateText(this.props.language).updated,
-          });
-        });
-    }
-  };
-
   refreshProfile = () => {
     this.props.getUserByDispatch();
     this.props.getOrgsByDispatch();
@@ -236,18 +187,6 @@ class AuthProfile extends Component {
                   </Text>
                 </Text>
               </SectionList>
-
-              <TouchableOpacity
-                style={styles.update}
-                onPress={this.checkForUpdate}
-              >
-                <Text style={styles.updateText}>
-                  GitPoint v{version}
-                </Text>
-                <Text style={[styles.updateText, styles.updateTextSub]}>
-                  {this.state.updateText}
-                </Text>
-              </TouchableOpacity>
             </View>}
         </ParallaxScroll>
       </ViewContainer>

diff --git a/src/auth/screens/user-options.screen.js b/src/auth/screens/user-options.screen.js
@@ -1,11 +1,19 @@
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
-import { ScrollView, StyleSheet, FlatList } from 'react-native';
+import {
+  ScrollView,
+  StyleSheet,
+  FlatList,
+  Text,
+  TouchableOpacity,
+} from 'react-native';
 import { ListItem } from 'react-native-elements';
 import { NavigationActions } from 'react-navigation';
+import { version } from 'package.json';
+import codePush from 'react-native-code-push';
 
 import { ViewContainer, SectionList } from 'components';
-import { colors, fonts } from 'config';
+import { colors, fonts, normalize } from 'config';
 import { openURLInView, resetNavigationTo, translate } from 'utils';
 import { signOut, changeLanguage } from 'auth';
 import languages from './language-settings';
@@ -32,6 +40,26 @@ const styles = StyleSheet.create({
     color: colors.red,
     ...fonts.fontPrimary,
   },
+  update: {
+    flex: 1,
+    alignItems: 'center',
+    marginVertical: 40,
+  },
+  updateText: {
+    color: colors.greyDark,
+    ...fonts.fontPrimary,
+  },
+  updateTextSub: {
+    fontSize: normalize(11),
+  },
+});
+
+const updateText = lang => ({
+  check: translate('auth.profile.codePushCheck', lang),
+  checking: translate('auth.profile.codePushChecking', lang),
+  updated: translate('auth.profile.codePushUpdated', lang),
+  available: translate('auth.profile.codePushAvailable', lang),
+  notApplicable: translate('auth.profile.codePushNotApplicable', lang),
 });
 
 class UserOptions extends Component {
@@ -42,8 +70,20 @@ class UserOptions extends Component {
     navigation: Object,
   };
 
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      updateText: updateText(props.language).check,
+    };
+  }
+
   componentWillReceiveProps(nextState) {
     if (nextState.language !== this.props.language) {
+      this.setState({
+        updateText: updateText(nextState.language).check,
+      });
+
       const navigationParams = NavigationActions.setParams({
         params: {
           title: translate('auth.userOptions.title', nextState.language),
@@ -55,6 +95,28 @@ class UserOptions extends Component {
     }
   }
 
+  checkForUpdate = () => {
+    if (__DEV__) {
+      this.setState({
+        updateText: updateText(this.props.language).notApplicable,
+      });
+    } else {
+      this.setState({ updateText: updateText(this.props.language).checking });
+      codePush
+        .sync({
+          updateDialog: true,
+          installMode: codePush.InstallMode.IMMEDIATE,
+        })
+        .then(update => {
+          this.setState({
+            updateText: update
+              ? updateText(this.props.language).available
+              : updateText(this.props.language).updated,
+          });
+        });
+    }
+  };
+
   signOutUser() {
     const { signOutByDispatch, navigation } = this.props;
 
@@ -109,6 +171,15 @@ class UserOptions extends Component {
               underlayColor={colors.greyLight}
             />
           </SectionList>
+
+          <TouchableOpacity style={styles.update} onPress={this.checkForUpdate}>
+            <Text style={styles.updateText}>
+              GitPoint v{version}
+            </Text>
+            <Text style={[styles.updateText, styles.updateTextSub]}>
+              {this.state.updateText}
+            </Text>
+          </TouchableOpacity>
         </ScrollView>
       </ViewContainer>
     );