fix(web) Disable draggable on common usage element to avoid trigger drag-n-drop layer (#1330)

web/src/lib/components/shared-components/circle-avatar.svelte

@@ -45,6 +45,7 @@
 			style:height={`${size}px`}
 			class={`inline rounded-full  object-cover border shadow-md`}
 			title={user.email}
+			draggable="false"
 		/>
 	</button>
 {:catch}

web/src/lib/components/shared-components/drag-and-drop-upload-overlay.svelte

@@ -20,6 +20,7 @@
 		height="200"
 		width="200"
 		class="animate-bounce pb-16"
+		draggable="false"
 	/>
 	<div class="text-2xl">Drop files anywhere to upload</div>
 </div>

web/src/lib/components/shared-components/immich-thumbnail.svelte

@@ -252,6 +252,7 @@
 				alt={asset.id}
 				class={`object-cover ${getSize()} transition-all z-0 ${getThumbnailBorderStyle()}`}
 				loading="lazy"
+				draggable="false"
 			/>
 		{/if}
 

web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte

@@ -38,6 +38,7 @@
 					src={`${$page.url.origin}/api/user/profile-image/${user.id}`}
 					alt="profile-img"
 					class="inline rounded-full h-20 w-20 object-cover shadow-md"
+					draggable="false"
 				/>
 			{:catch}
 				<div transition:fade={{ duration: 200 }} class="text-lg">

web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte

@@ -50,7 +50,7 @@
 			class="flex gap-2 place-items-center hover:cursor-pointer"
 			href="/photos"
 		>
-			<img src="/immich-logo.svg" alt="immich logo" height="35" width="35" />
+			<img src="/immich-logo.svg" alt="immich logo" height="35" width="35" draggable="false" />
 			<h1 class="font-immich-title text-2xl text-immich-primary dark:text-immich-dark-primary">
 				IMMICH
 			</h1>
@@ -102,6 +102,7 @@
 							src={`${$page.url.origin}/api/user/profile-image/${user.id}`}
 							alt="profile-img"
 							class="inline rounded-full h-12 w-12 object-cover shadow-md"
+							draggable="false"
 						/>
 					{:catch}
 						{getFirstLetter(user.firstName)}{getFirstLetter(user.lastName)}

web/src/lib/components/shared-components/side-bar/side-bar.svelte

@@ -40,6 +40,7 @@
 		data-sveltekit-noscroll
 		href={AppRoute.PHOTOS}
 		class="relative"
+		draggable="false"
 	>
 		<SideBarButton
 			title={`Photos`}
@@ -71,7 +72,7 @@
 		</div>
 	</a>
 
-	<a data-sveltekit-preload-data="hover" href={AppRoute.SHARING} class="relative">
+	<a data-sveltekit-preload-data="hover" href={AppRoute.SHARING} class="relative" draggable="false">
 		<SideBarButton
 			title="Sharing"
 			logo={AccountMultipleOutline}
@@ -103,7 +104,7 @@
 	<div class="text-xs ml-5 my-4 dark:text-immich-dark-fg">
 		<p>LIBRARY</p>
 	</div>
-	<a data-sveltekit-preload-data="hover" href={AppRoute.ALBUMS} class="relative">
+	<a data-sveltekit-preload-data="hover" href={AppRoute.ALBUMS} class="relative" draggable="false">
 		<SideBarButton
 			title="Albums"
 			logo={ImageAlbum}

web/src/lib/components/shared-components/upload-panel.svelte

@@ -100,6 +100,7 @@
 										src="/immich-logo.svg"
 										alt=""
 										class="h-[70px] w-[70px] object-cover rounded-tl-lg rounded-bl-lg "
+										draggable="false"
 									/>
 
 									<div class="bottom-0 left-0 absolute w-full h-[25px] bg-immich-primary/30">