From e4561f26e8cc13de7978ff0f68eebbb2e27476be Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Fri, 9 Feb 2024 08:16:59 -0800
Subject: [PATCH] chore: cleanup layout setup (#6995)

---
 web/src/routes/(user)/+layout.svelte | 29 ++++++++++++++++++++++++++++
 web/src/routes/+layout.svelte        | 24 -----------------------
 2 files changed, 29 insertions(+), 24 deletions(-)
 create mode 100644 web/src/routes/(user)/+layout.svelte

diff --git a/web/src/routes/(user)/+layout.svelte b/web/src/routes/(user)/+layout.svelte
new file mode 100644
index 0000000000..c0e957d3bf
--- /dev/null
+++ b/web/src/routes/(user)/+layout.svelte
@@ -0,0 +1,29 @@
+<script lang="ts">
+  import { page } from '$app/stores';
+  import UploadCover from '$lib/components/shared-components/drag-and-drop-upload-overlay.svelte';
+  import { dragAndDropFilesStore } from '$lib/stores/drag-and-drop-files.store';
+  import { fileUploadHandler } from '$lib/utils/file-uploader';
+
+  let albumId: string | undefined;
+
+  const dropHandler = async ({ dataTransfer }: DragEvent) => {
+    const files = dataTransfer?.files;
+    if (!files) {
+      return;
+    }
+
+    const filesArray: File[] = Array.from<File>(files);
+    albumId = ($page.route.id === '/(user)/albums/[albumId]' || undefined) && $page.params.albumId;
+
+    const isShare = $page.route.id === '/(user)/share/[key]' || undefined;
+    if (isShare) {
+      dragAndDropFilesStore.set({ isDragging: true, files: filesArray });
+    } else {
+      await fileUploadHandler(filesArray, albumId);
+    }
+  };
+</script>
+
+<slot {albumId} />
+
+<UploadCover {dropHandler} />
diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index b7a3d5a167..2b203d477f 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -7,14 +7,11 @@
   import UploadPanel from '$lib/components/shared-components/upload-panel.svelte';
   import NotificationList from '$lib/components/shared-components/notification/notification-list.svelte';
   import VersionAnnouncementBox from '$lib/components/shared-components/version-announcement-box.svelte';
-  import { fileUploadHandler } from '$lib/utils/file-uploader';
-  import UploadCover from '$lib/components/shared-components/drag-and-drop-upload-overlay.svelte';
   import FullscreenContainer from '$lib/components/shared-components/fullscreen-container.svelte';
   import AppleHeader from '$lib/components/shared-components/apple-header.svelte';
   import { onDestroy, onMount } from 'svelte';
   import { loadConfig } from '$lib/stores/server-config.store';
   import { handleError } from '$lib/utils/handle-error';
-  import { dragAndDropFilesStore } from '$lib/stores/drag-and-drop-files.store';
   import { api } from '@api';
   import { closeWebsocketConnection, openWebsocketConnection } from '$lib/stores/websocket';
   import { user } from '$lib/stores/user.store';
@@ -91,23 +88,6 @@
       handleError(error, 'Unable to connect to server');
     }
   });
-
-  const dropHandler = async ({ dataTransfer }: DragEvent) => {
-    const files = dataTransfer?.files;
-    if (!files) {
-      return;
-    }
-
-    const filesArray: File[] = Array.from<File>(files);
-    albumId = ($page.route.id === '/(user)/albums/[albumId]' || undefined) && $page.params.albumId;
-
-    const isShare = $page.route.id === '/(user)/share/[key]' || undefined;
-    if (isShare) {
-      dragAndDropFilesStore.set({ isDragging: true, files: filesArray });
-    } else {
-      await fileUploadHandler(filesArray, albumId);
-    }
-  };
 </script>
 
 <svelte:head>
@@ -154,7 +134,3 @@
 {#if $user?.isAdmin}
   <VersionAnnouncementBox />
 {/if}
-
-{#if $page.route.id?.includes('(user)')}
-  <UploadCover {dropHandler} />
-{/if}