Notifications view improvement and some cleaning

App.js

@@ -52,7 +52,7 @@ async function registerForPushNotificationsAsync() {
             lightColor: '#FF231F7C',
         });
     }
-    
+
     let token;
     if (Device.isDevice) {
         const { status: existingStatus } = await Notifications.getPermissionsAsync();
@@ -112,7 +112,7 @@ const MainNavigation = () => {
             activeColor="#0d6efd"
             inactiveColor="#FFFFFF"
             barStyle={{ backgroundColor: '#000000' }}
-            sceneContainerStyle={{paddingBottom: 0, paddingTop: 15}}
+            sceneContainerStyle={{ paddingBottom: 0, paddingTop: 15 }}
         >
             <Tab.Screen
                 name="Feed"
@@ -122,14 +122,14 @@ const MainNavigation = () => {
                     tabBarIcon: ({ color }) => (
                         <MaterialIcons name="home" color={color} size={26} />
                     ),
-                    header: ()=>{<></>},
+                    header: () => { <></> },
                 }}
                 listeners={({ navigation, route }) => ({
                     tabPress: e => {
                         navigation.navigate('Feed')
                     },
                 })}
-                
+
             />
             <Tab.Screen
                 name="Notifications"
@@ -139,7 +139,7 @@ const MainNavigation = () => {
                     tabBarIcon: ({ color }) => (
                         <MaterialIcons name="notifications" color={color} size={26} />
                     ),
-                    header: ()=>{<></>},
+                    header: () => { <></> },
                 }}
             />
             <Tab.Screen
@@ -150,7 +150,7 @@ const MainNavigation = () => {
                     tabBarIcon: ({ color }) => (
                         <MaterialIcons name="search" color={color} size={26} />
                     ),
-                    header: ()=>{<></>},
+                    header: () => { <></> },
                 }}
             />
             <Tab.Screen
@@ -161,7 +161,7 @@ const MainNavigation = () => {
                     tabBarIcon: ({ color }) => (
                         <MaterialIcons name="groups" color={color} size={26} />
                     ),
-                    header: ()=>{<></>},
+                    header: () => { <></> },
                 }}
             />
             <Tab.Screen
@@ -172,19 +172,19 @@ const MainNavigation = () => {
                     tabBarIcon: ({ color }) => (
                         <MaterialIcons name="subscriptions" color={color} size={26} />
                     ),
-                    header: ()=>{<></>},
+                    header: () => { <></> },
                 }}
             />
 
-            <Tab.Screen 
-                name="Logout" 
-                component={Login} 
+            <Tab.Screen
+                name="Logout"
+                component={Login}
                 options={{
                     tabBarLabel: 'Logout',
                     tabBarIcon: ({ color }) => (
                         <MaterialIcons name="logout" color={color} size={26} />
                     ),
-                    header: ()=>{<></>},
+                    header: () => { <></> },
                 }}
             />
         </Tab.Navigator>
@@ -197,14 +197,15 @@ export default function App() {
             icon: props => <MaterialIcons {...props} />,
         }} theme={theme}>
             <NavigationContainer>
+                <StatusBar style="dark" translucent={false} />
                 <Stack.Navigator>
                     <Stack.Screen
                         name="MainNavigation"
                         component={MainNavigation}
-                        options={{ 
+                        options={{
                             headerShown: true,
                             tabBarLabel: 'EMI Social',
-                            header: ()=>{<></>},
+                            header: () => { <></> },
                         }}
                     />
                     <Stack.Screen