Add variable storage locations & batch adding

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

src/screens/editors/editMeme.tsx

@@ -9,6 +9,8 @@ import { BSON } from 'realm';
 import { RootStackParamList, ROUTE } from '../../types';
 import { pickSingle } from 'react-native-document-picker';
 import { AndroidScoped, FileSystem } from 'react-native-file-access';
+import { extension } from 'react-native-mime-types';
+import { useSelector } from 'react-redux';
 import { Tag, Meme } from '../../database';
 import {
   StringValidationResult,
@@ -21,8 +23,6 @@ import {
 } from '../../utilities';
 import { MemeEditor } from '../../components';
 import editorStyles from './editorStyles';
-import { extension } from 'react-native-mime-types';
-import { useSelector } from 'react-redux';
 import { RootState } from '../../state';
 
 const EditMeme = ({
@@ -42,10 +42,11 @@ const EditMeme = ({
     Meme.schema.name,
     BSON.UUID.createFromHexString(route.params.id),
   )!;
+  const uri = AndroidScoped.appendPath(storageUri, meme.filename);
 
   const [hasChanges, setHasChanges] = useState(false);
 
-  const [memeUriError, setMemeUriError] = useState<Error>();
+  const [memeError, setMemeError] = useState<Error>();
   const [memeTitle, setMemeTitle] = useState(validateMemeTitle(meme.title));
   const [memeTags, setMemeTags] = useState(
     new Map<string, Tag>(meme.tags.map(tag => [tag.id.toHexString(), tag])),
@@ -64,6 +65,8 @@ const EditMeme = ({
   const [isSaving, setIsSaving] = useState(false);
 
   const handleSave = useCallback(() => {
+    setIsSaving(true);
+
     realm.write(() => {
       meme.tags.forEach(tag => {
         if (!memeTags.has(tag.id.toHexString())) {
@@ -87,7 +90,17 @@ const EditMeme = ({
       meme.tagsLength = memeTags.size;
       meme.dateModified = new Date();
     });
-  }, [meme, memeTags, memeTitle.parsed, realm]);
+
+    setIsSaving(false);
+    goBack();
+  }, [goBack, meme, memeTags, memeTitle.parsed, realm]);
+
+  const handleDelete = useCallback(async () => {
+    setIsSaving(true);
+    await deleteMeme(realm, storageUri, meme);
+    setIsSaving(false);
+    goBack();
+  }, [goBack, meme, realm, storageUri]);
 
   const handleFixUri = useCallback(async () => {
     const file = await pickSingle({ type: allowedMimeTypes }).catch(noOp);
@@ -101,16 +114,16 @@ const EditMeme = ({
     const fileExtension = extension(mimeType) as string;
     if (!fileExtension) return;
 
-    const uri = AndroidScoped.appendPath(
-      storageUri,
-      `${meme.id.toHexString()}-${Date.now() / 1000}.${fileExtension}`,
-    );
+    const filename = `${meme.id.toHexString()}-${
+      Date.now() / 1000
+    }.${fileExtension}`;
+    const newUri = AndroidScoped.appendPath(storageUri, filename);
 
-    await FileSystem.cp(file.uri, uri);
-    const { size } = await FileSystem.stat(uri);
+    await FileSystem.cp(file.uri, newUri);
+    const { size } = await FileSystem.stat(newUri);
 
     realm.write(() => {
-      meme.uri = uri;
+      meme.filename = filename;
       meme.type = memeType;
       meme.mimeType = mimeType;
       meme.size = size;
@@ -126,18 +139,10 @@ const EditMeme = ({
           icon={meme.isFavorite ? 'heart' : 'heart-outline'}
           onPress={() => favoriteMeme(realm, meme)}
         />
-        <Appbar.Action
-          icon="delete"
-          onPress={async () => {
-            setIsSaving(true);
-            await deleteMeme(realm, meme);
-            setIsSaving(false);
-            goBack();
-          }}
-        />
+        <Appbar.Action icon="delete" onPress={handleDelete} />
       </Appbar.Header>
       <Banner
-        visible={!!memeUriError}
+        visible={!!memeError}
         actions={[
           {
             label: 'Fix URI',
@@ -145,12 +150,7 @@ const EditMeme = ({
           },
           {
             label: 'Delete Meme',
-            onPress: async () => {
-              setIsSaving(true);
-              await deleteMeme(realm, meme);
-              setIsSaving(false);
-              goBack();
-            },
+            onPress: handleDelete,
           },
         ]}>
         The URI for this meme appears to be broken. This may have been caused by
@@ -166,9 +166,10 @@ const EditMeme = ({
         ]}>
         <View style={editorStyles.editorView}>
           <MemeEditor
-            memeUri={meme.uri}
-            memeUriError={memeUriError}
-            setMemeUriError={setMemeUriError}
+            memeUri={uri}
+            memeFilename={meme.filename}
+            memeError={memeError}
+            setMemeError={setMemeError}
             memeTitle={memeTitle}
             setMemeTitle={handleMemeTitleChange}
             memeTags={memeTags}
@@ -179,14 +180,9 @@ const EditMeme = ({
           <Button
             mode="contained"
             icon="floppy"
-            onPress={() => {
-              setIsSaving(true);
-              handleSave();
-              setIsSaving(false);
-              goBack();
-            }}
+            onPress={handleSave}
             disabled={
-              !memeTitle.valid || !hasChanges || isSaving || !!memeUriError
+              !memeTitle.valid || !hasChanges || isSaving || !!memeError
             }
             loading={isSaving}
             style={editorStyles.soloSaveButton}>