Add variable storage locations & batch adding

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

src/components/memes/memeViewItem.tsx

@@ -3,9 +3,12 @@ import { ImageZoom } from '@likashefqet/react-native-image-zoom';
 import { StyleSheet, View } from 'react-native';
 import { useSafeAreaFrame } from 'react-native-safe-area-context';
 import { useImageDimensions } from '@react-native-community/hooks';
+import { AndroidScoped } from 'react-native-file-access';
 import LoadingView from '../loadingView';
 import { Meme } from '../../database';
 import MemeFail from './memeFail';
+import { useSelector } from 'react-redux';
+import { RootState } from '../../state';
 
 const memeViewItemStyles = StyleSheet.create({
   view: {
@@ -16,8 +19,14 @@ const memeViewItemStyles = StyleSheet.create({
 
 const MemeViewItem = ({ meme }: { meme: Meme }) => {
   const { height, width } = useSafeAreaFrame();
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const storageUri = useSelector(
+    (state: RootState) => state.settings.storageUri,
+  )!;
 
-  const { dimensions, loading, error } = useImageDimensions({ uri: meme.uri });
+  const uri = AndroidScoped.appendPath(storageUri, meme.filename);
+
+  const { dimensions, loading, error } = useImageDimensions({ uri });
 
   if (!error && (loading || !dimensions)) {
     return (
@@ -39,7 +48,7 @@ const MemeViewItem = ({ meme }: { meme: Meme }) => {
         />
       ) : (
         <ImageZoom
-          source={{ uri: meme.uri }}
+          source={{ uri }}
           style={
             dimensions.aspectRatio > width / (height - 128)
               ? {