From cb76c2f6df5956fcf043ea9ecce82b43f462eeee Mon Sep 17 00:00:00 2001
From: ammarahm-ed <ammarahmed6506@gmail.com>
Date: Sun, 23 Feb 2020 10:22:55 +0500
Subject: [PATCH] fix settings

---
 apps/mobile/src/views/Notes/index.js    |  30 ++--
 apps/mobile/src/views/Settings/index.js | 191 ++++++++++++------------
 2 files changed, 113 insertions(+), 108 deletions(-)

diff --git a/apps/mobile/src/views/Notes/index.js b/apps/mobile/src/views/Notes/index.js
index f025ae5b1..c00787de7 100644
--- a/apps/mobile/src/views/Notes/index.js
+++ b/apps/mobile/src/views/Notes/index.js
@@ -152,6 +152,21 @@ export const Notes = ({navigation}) => {
     </View>
   );
 
+  const _onRefresh = async () => {
+    setRefreshing(true);
+    try {
+      await db.sync();
+
+      init();
+      dispatch({type: ACTIONS.USER});
+      setRefreshing(false);
+      ToastEvent.show('Sync Complete', 'success');
+    } catch (e) {
+      setRefreshing(false);
+      ToastEvent.show('Sync failed, network error', 'error');
+    }
+  };
+
   const _listKeyExtractor = (item, index) => item.dateCreated.toString();
 
   return (
@@ -177,20 +192,7 @@ export const Notes = ({navigation}) => {
             tintColor={colors.accent}
             colors={[colors.accent]}
             progressViewOffset={165}
-            onRefresh={async () => {
-              setRefreshing(true);
-              try {
-                await db.sync();
-
-                init();
-                dispatch({type: ACTIONS.USER});
-                setRefreshing(false);
-                ToastEvent.show('Sync Complete', 'success');
-              } catch (e) {
-                setRefreshing(false);
-                ToastEvent.show('Sync failed, network error', 'error');
-              }
-            }}
+            onRefresh={_onRefresh}
             refreshing={refreshing}
           />
         }
diff --git a/apps/mobile/src/views/Settings/index.js b/apps/mobile/src/views/Settings/index.js
index ac0741861..0a7f82567 100644
--- a/apps/mobile/src/views/Settings/index.js
+++ b/apps/mobile/src/views/Settings/index.js
@@ -96,6 +96,7 @@ export const Settings = ({navigation}) => {
             borderRadius: 5,
             padding: 5,
             marginTop: 10,
+            marginBottom: pv + 5,
             width: '100%',
             alignSelf: 'center',
             flexDirection: 'row',
@@ -228,7 +229,7 @@ export const Settings = ({navigation}) => {
             alignItems: 'center',
             justifyContent: 'space-between',
 
-            paddingBottom: pv + 5,
+            paddingVertical: pv + 5,
           }}>
           <Text
             style={{
@@ -260,108 +261,110 @@ export const Settings = ({navigation}) => {
           Account Settings
         </Text>
 
-        <Text
-          style={{
-            fontSize: SIZE.sm,
-            fontFamily: WEIGHT.regular,
-            textAlignVertical: 'center',
-            color: colors.pri,
-            marginTop: pv + 5,
-          }}>
-          Logged in as:
-        </Text>
-
         {user ? (
-          <View
-            style={{
-              justifyContent: 'space-between',
-              alignItems: 'center',
-              alignSelf: 'center',
-              flexDirection: 'row',
-              width: '100%',
-              paddingVertical: pv,
-              marginBottom: pv + 5,
-              marginTop: pv,
-              backgroundColor: colors.accent,
-              borderRadius: 5,
-              padding: 5,
-            }}>
-            <View
-              style={{
-                flexDirection: 'row',
-                justifyContent: 'center',
-                alignItems: 'center',
-              }}>
-              <Icon size={SIZE.lg} color="white" name="account-outline" />
-              <Text
-                style={{
-                  color: 'white',
-                  marginLeft: 5,
-                  fontFamily: WEIGHT.regular,
-                  fontSize: SIZE.sm,
-                }}>
-                {user.username}
-              </Text>
-            </View>{' '}
-            <View
-              style={{
-                borderRadius: 5,
-                padding: 5,
-                paddingVertical: 2.5,
-                backgroundColor: 'white',
-              }}>
-              <Text
-                style={{
-                  color: colors.accent,
-                  fontFamily: WEIGHT.regular,
-                  fontSize: SIZE.xs,
-                }}>
-                Pro
-              </Text>
-            </View>
-          </View>
-        ) : null}
-
-        {[
-          {
-            name: 'Backup my notes',
-          },
-
-          {
-            name: 'My vault',
-          },
-          {
-            name: 'Subscription status',
-          },
-          {
-            name: 'Change password',
-          },
-          {
-            name: 'Logout',
-          },
-        ].map(item => (
-          <TouchableOpacity
-            key={item.name}
-            activeOpacity={opacity}
-            style={{
-              width: '100%',
-
-              paddingBottom: pv + 5,
-              flexDirection: 'row',
-              justifyContent: 'space-between',
-              alignItems: 'center',
-            }}>
+          <>
             <Text
               style={{
                 fontSize: SIZE.sm,
                 fontFamily: WEIGHT.regular,
                 textAlignVertical: 'center',
                 color: colors.pri,
+                marginTop: pv + 5,
               }}>
-              {item.name}
+              Logged in as:
             </Text>
-          </TouchableOpacity>
-        ))}
+
+            <View
+              style={{
+                justifyContent: 'space-between',
+                alignItems: 'center',
+                alignSelf: 'center',
+                flexDirection: 'row',
+                width: '100%',
+                paddingVertical: pv,
+                marginBottom: pv + 5,
+                marginTop: pv,
+                backgroundColor: colors.accent,
+                borderRadius: 5,
+                padding: 5,
+              }}>
+              <View
+                style={{
+                  flexDirection: 'row',
+                  justifyContent: 'center',
+                  alignItems: 'center',
+                }}>
+                <Icon size={SIZE.lg} color="white" name="account-outline" />
+                <Text
+                  style={{
+                    color: 'white',
+                    marginLeft: 5,
+                    fontFamily: WEIGHT.regular,
+                    fontSize: SIZE.sm,
+                  }}>
+                  {user.username}
+                </Text>
+              </View>
+              <View
+                style={{
+                  borderRadius: 5,
+                  padding: 5,
+                  paddingVertical: 2.5,
+                  backgroundColor: 'white',
+                }}>
+                <Text
+                  style={{
+                    color: colors.accent,
+                    fontFamily: WEIGHT.regular,
+                    fontSize: SIZE.xs,
+                  }}>
+                  Pro
+                </Text>
+              </View>
+            </View>
+
+            {[
+              {
+                name: 'Backup my notes',
+              },
+
+              {
+                name: 'My vault',
+              },
+              {
+                name: 'Subscription status',
+              },
+              {
+                name: 'Change password',
+              },
+              {
+                name: 'Logout',
+              },
+            ].map(item => (
+              <TouchableOpacity
+                key={item.name}
+                activeOpacity={opacity}
+                style={{
+                  width: '100%',
+
+                  paddingVertical: pv + 5,
+                  flexDirection: 'row',
+                  justifyContent: 'space-between',
+                  alignItems: 'center',
+                }}>
+                <Text
+                  style={{
+                    fontSize: SIZE.sm,
+                    fontFamily: WEIGHT.regular,
+                    textAlignVertical: 'center',
+                    color: colors.pri,
+                  }}>
+                  {item.name}
+                </Text>
+              </TouchableOpacity>
+            ))}
+          </>
+        ) : null}
 
         <Text
           style={{