Clean up drop uploading

src/lib/components/UploadModal.svelte

@@ -3,7 +3,8 @@
 	import FileUpload from './FileUpload.svelte';
 	import { processFiles } from '$lib/upload';
 	import { onMount } from 'svelte';
-	import { formatBytes, scanFiles } from '$lib/util/upload';
+	import { scanFiles } from '$lib/upload';
+	import { formatBytes } from '$lib/util/upload';
 
 	export let open = false;
 
@@ -49,15 +50,15 @@
 		if (event?.dataTransfer?.items) {
 			for (const item of [...event.dataTransfer.items]) {
 				const entry = item.webkitGetAsEntry();
-				if (entry && entry.isDirectory) {
-					await scanFiles(entry, filePromises);
-				}
-
-				if (item.kind === 'file') {
-					const file = item.getAsFile();
-					if (file) {
-						draggedFiles.push(file);
-						draggedFiles = draggedFiles;
+				if (item.kind === 'file' && entry) {
+					if (entry.isDirectory) {
+						await scanFiles(entry, filePromises);
+					} else {
+						const file = item.getAsFile();
+						if (file) {
+							draggedFiles.push(file);
+							draggedFiles = draggedFiles;
+						}
 					}
 				}
 			}

src/lib/upload/index.ts

@@ -35,16 +35,47 @@ function getDetails(file: File) {
   }
 }
 
+async function getFile(fileEntry: FileSystemFileEntry) {
+  try {
+    return new Promise<File>((resolve, reject) => fileEntry.file(resolve, reject));
+  } catch (err) {
+    console.log(err);
+  }
+}
+
+export async function scanFiles(item: FileSystemEntry, files: Promise<File | undefined>[]) {
+  if (item.isDirectory) {
+    const directoryReader = (item as FileSystemDirectoryEntry).createReader();
+    await new Promise<void>((resolve) => {
+      directoryReader.readEntries(async (entries) => {
+        for (const entry of entries) {
+          if (entry.isFile) {
+            files.push(getFile(entry as FileSystemFileEntry))
+          } else {
+            await scanFiles(entry, files);
+          }
+        }
+        resolve()
+      });
+    });
+  }
+}
+
 export async function processFiles(files: File[]) {
   const zipTypes = ['zip', 'cbz']
   const volumes: Record<string, Volume> = {};
+  const mangas: string[] = [];
 
   for (const file of files) {
     const { ext, filename } = getDetails(file)
     const { type, webkitRelativePath } = file
 
     if (ext === 'mokuro') {
-      const mokuroData = JSON.parse(await file.text())
+      const mokuroData: Volume['mokuroData'] = JSON.parse(await file.text())
+
+      if (!mangas.includes(mokuroData.title_uuid)) {
+        mangas.push(mokuroData.title_uuid)
+      }
 
       volumes[filename] = {
         ...volumes[filename],
@@ -108,18 +139,20 @@ export async function processFiles(files: File[]) {
     if (!valid.includes(false)) {
       await requestPersistentStorage();
 
-      const key = vols[0].mokuroData.title_uuid;
-      const existingCatalog = await db.catalog.get(key);
+      for (const key of mangas) {
+        const existingCatalog = await db.catalog.get(key);
 
-      if (existingCatalog) {
         const filtered = vols.filter((vol) => {
-          return !existingCatalog.manga.some(manga => {
+          return !existingCatalog?.manga.some(manga => {
             return manga.mokuroData.volume_uuid === vol.mokuroData.volume_uuid
-          })
+          }) && key === vol.mokuroData.title_uuid
         })
-        await db.catalog.update(key, { manga: [...existingCatalog.manga, ...filtered] })
-      } else {
-        await db.catalog.put({ id: key, manga: vols })
+
+        if (existingCatalog) {
+          await db.catalog.update(key, { manga: [...existingCatalog.manga, ...filtered] })
+        } else {
+          await db.catalog.put({ id: key, manga: filtered })
+        }
       }
 
       showSnackbar('Catalog updated successfully')

src/lib/util/upload.ts

@@ -1,7 +1,6 @@
 export async function requestPersistentStorage() {
   if (navigator.storage && navigator.storage.persist) {
-    const isPersisted = await navigator.storage.persist();
-    console.log(`Persisted storage granted: ${isPersisted}`);
+    await navigator.storage.persist();
   }
 }
 
@@ -16,29 +15,3 @@ export function formatBytes(bytes: number, decimals = 2) {
 
   return `${parseFloat((bytes / k ** i).toFixed(dm))} ${sizes[i]}`;
 }
-
-async function getFile(fileEntry: FileSystemFileEntry) {
-  try {
-    return new Promise<File>((resolve, reject) => fileEntry.file(resolve, reject));
-  } catch (err) {
-    console.log(err);
-  }
-}
-
-export async function scanFiles(item: FileSystemEntry, files: Promise<File | undefined>[]) {
-  if (item.isDirectory) {
-    const directoryReader = (item as FileSystemDirectoryEntry).createReader();
-    await new Promise<void>((resolve) => {
-      directoryReader.readEntries((entries) => {
-        entries.forEach((entry) => {
-          if (entry.isFile) {
-            files.push(getFile(entry as FileSystemFileEntry))
-            resolve()
-          }
-          scanFiles(entry, files);
-        });
-      });
-    });
-  }
-
-}