Fix settings snackbar positioning

Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>

src/navigation.tsx

@@ -15,6 +15,7 @@ import { FloatingActionButton } from './components';
 const TabNavigator = () => {
   const dimensions = useDimensions();
 
+  const [showFab, setShowFab] = React.useState(true);
   const TabNavigatorBase = createBottomTabNavigator();
 
   return (
@@ -41,6 +42,7 @@ const TabNavigator = () => {
                   target: state.key,
                 });
               }
+              setShowFab(route.name !== 'Settings');
             }}
             renderIcon={({ route, focused, color }) => {
               const { options } = descriptors[route.key];
@@ -86,7 +88,7 @@ const TabNavigator = () => {
           }}
         />
       </TabNavigatorBase.Navigator>
-      <FloatingActionButton />
+      <FloatingActionButton visible={showFab} />
     </>
   );
 };

src/screens/settings.tsx

@@ -1,13 +1,22 @@
 import React, { useState } from 'react';
 import { View } from 'react-native';
-import { Button, List, Snackbar, Switch, Text } from 'react-native-paper';
-import { useRealm } from '@realm/react';
+import {
+  Button,
+  List,
+  Portal,
+  Snackbar,
+  Switch,
+  Text,
+} from 'react-native-paper';
 import { openDocumentTree } from 'react-native-scoped-storage';
 import { useDispatch, useSelector } from 'react-redux';
 import { RootScrollView } from '../components';
 import styles from '../styles';
-import { Meme } from '../database';
-import { RootState, updateNoMedia, updateStorageUri } from '../state';
+import {
+  RootState,
+  updateNoMedia,
+  updateStorageUri,
+} from '../state';
 import type {} from 'redux-thunk/extend-redux';
 import { useDimensions } from '../contexts';
 
@@ -20,27 +29,11 @@ const SettingsScreen = () => {
   const [snackbarVisible, setSnackbarVisible] = useState(false);
   const [snackbarMessage, setSnackbarMessage] = useState('');
 
-  const realm = useRealm();
-
   const optimizeDatabase = () => {
     setOptimizingDatabase(true);
-
-    const memes = realm.objects<Meme>('Meme');
-    realm.write(() => {
-      for (let index = memes.length - 1; index >= 0; index--) {
-        // TODO: stat the uri to see if it exists and remove entry if it doesn't
-      }
-    });
-
-    const success = realm.compact();
-
-    if (success) {
-      setSnackbarMessage('Database optimized!');
-      setSnackbarVisible(true);
-    } else {
-      setSnackbarMessage('Database optimization failed!');
-      setSnackbarVisible(true);
-    }
+    // TODO: clean up missing / extra files
+    setSnackbarMessage('Database optimized!');
+    setSnackbarVisible(true);
     setOptimizingDatabase(false);
   };
 
@@ -92,15 +85,18 @@ const SettingsScreen = () => {
           </List.Section>
         </View>
       </RootScrollView>
-      <Snackbar
-        visible={snackbarVisible}
-        onDismiss={() => setSnackbarVisible(false)}
-        action={{
-          label: 'Dismiss',
-          onPress: () => setSnackbarVisible(false),
-        }}>
-        {snackbarMessage}
-      </Snackbar>
+      <Portal>
+        <Snackbar
+          visible={snackbarVisible}
+          onDismiss={() => setSnackbarVisible(false)}
+          style={{ marginBottom: dimensions.static.verticalScale(75) }}
+          action={{
+            label: 'Dismiss',
+            onPress: () => setSnackbarVisible(false),
+          }}>
+          {snackbarMessage}
+        </Snackbar>
+      </Portal>
     </>
   );
 };