From f97dd1fe96a2a30610975d0e3bbfd4bc33bf1c15 Mon Sep 17 00:00:00 2001
From: ALEEF02 <thesmarty2002@gmail.com>
Date: Mon, 3 Feb 2020 19:42:43 -0800
Subject: [PATCH] Make status bar visible, begin looking into dark mode

---
 App.js                    |  5 ++++-
 package-lock.json         | 18 ++++++++++++++++++
 package.json              |  1 +
 screens/SettingsScreen.js | 37 +++++++++++++++++++------------------
 4 files changed, 42 insertions(+), 19 deletions(-)

diff --git a/App.js b/App.js
index 810a5ce..b93c419 100644
--- a/App.js
+++ b/App.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import { Platform, StatusBar, StyleSheet, View } from 'react-native';
+import { AppearanceProvider } from 'react-native-appearance';
 import { AppLoading } from 'expo';
 import * as Icon from '@expo/vector-icons';
 import * as Font from 'expo-font';
@@ -24,7 +25,9 @@ export default class App extends React.Component {
       return (
         <View style={styles.container}>
           {Platform.OS === 'ios' && <StatusBar barStyle="default" />}
-          <AppNavigator />
+		  <AppearanceProvider>
+			<AppNavigator />
+		  </AppearanceProvider>
         </View>
       );
     }
diff --git a/package-lock.json b/package-lock.json
index 12f0eee..9545d06 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9273,6 +9273,16 @@
         }
       }
     },
+    "react-native-appearance": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/react-native-appearance/-/react-native-appearance-0.3.2.tgz",
+      "integrity": "sha512-4laRJovChQe5ualJczWoPyThOlYc0m2jmipdnrx34kAFzzk/JqYZwbkRE3uuLRNnPhaWWZZ8YlFhq0RNFB/G+A==",
+      "requires": {
+        "fbemitter": "^2.1.1",
+        "invariant": "^2.2.4",
+        "use-subscription": "^1.0.0"
+      }
+    },
     "react-native-fetch-blob": {
       "version": "0.10.8",
       "resolved": "https://registry.npmjs.org/react-native-fetch-blob/-/react-native-fetch-blob-0.10.8.tgz",
@@ -10884,6 +10894,14 @@
       "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
       "integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ=="
     },
+    "use-subscription": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/use-subscription/-/use-subscription-1.3.0.tgz",
+      "integrity": "sha512-buZV7FUtnbOr+65dN7PHK7chHhQGfk/yjgqfpRLoWuHIAc4klAD/rdot2FsPNtFthN1ZydvA8tR/mWBMQ+/fDQ==",
+      "requires": {
+        "object-assign": "^4.1.1"
+      }
+    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
diff --git a/package.json b/package.json
index 18191b9..a897db2 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "react": "^16.9.0",
     "react-dom": "^16.5.1",
     "react-native": "^0.61.5",
+    "react-native-appearance": "^0.3.2",
     "react-native-fetch-blob": "^0.10.8",
     "react-native-gesture-handler": "^1.5.2",
     "react-native-pdf": "^5.1.4",
diff --git a/screens/SettingsScreen.js b/screens/SettingsScreen.js
index 39cca50..de9a1f0 100644
--- a/screens/SettingsScreen.js
+++ b/screens/SettingsScreen.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import * as FileSystem from 'expo-file-system';
-import { Alert, SectionList, Image, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { Alert, SectionList, Image,	SafeAreaView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
 import { NavigationEvents } from 'react-navigation';
 import Constants from 'expo-constants';
 
@@ -50,7 +50,6 @@ class StorageView extends React.Component {
 	var avalibleStorage = 0;
 	var totalStorage = 0;
 	var usedStorage = 0;
-
 	readDirectoryAsync(documentDirectory).then(subFiles => {
 		console.log("Subdirs documentDirectory/\n" + JSON.stringify(subFiles));
 		var totalDocsFound = 0;
@@ -235,10 +234,6 @@ export default class SettingsScreen extends React.Component {
 		this.child = React.createRef();
 	}
 	
-	componentDidMount() {
-		this.updateDisplay();
-	}
-	
 	updateDisplay = () => {
 		this.child._updateStorageDisplay();
 	};
@@ -286,18 +281,20 @@ export default class SettingsScreen extends React.Component {
 
   render() {
     return (
-		<View style={styles.container}>
-			<NavigationEvents
-				onDidFocus={payload => this.updateDisplay()}
-			/>
-			<StorageView ref={instance => { this.child = instance; }}/>
-			<TouchableOpacity 
-				onPress={() => this._clearDownloads()} 
-				style={styles.button}
-			>
-				<Text style={styles.buttonText}>Clear Storage</Text>
-			</TouchableOpacity>
-		</View>
+		<SafeAreaView style={styles.safeArea}>
+			<View style={styles.container}>
+				<NavigationEvents
+					onDidFocus={payload => this.updateDisplay()}
+				/>
+				<StorageView ref={instance => { this.child = instance; }}/>
+				<TouchableOpacity 
+					onPress={() => this._clearDownloads()} 
+					style={styles.button}
+				>
+					<Text style={styles.buttonText}>Clear Storage</Text>
+				</TouchableOpacity>
+			</View>
+		</SafeAreaView>
 	);
   }
 }
@@ -307,6 +304,10 @@ const styles = StyleSheet.create({
     flex: 1,
     backgroundColor: '#fff',
   },
+  safeArea: {
+	flex: 1,
+	backgroundColor: '#000'
+  },
   titleContainer: {
     paddingHorizontal: 15,
     paddingTop: 15,