fix(web): empty album is not auto deleted (#2283)

* fix(web): empty album is not auto deleted

* regenerate api

* fix test

web/src/routes/(user)/albums/+page.svelte

@@ -10,6 +10,8 @@
 	import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte';
 	import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
 	import LinkButton from '$lib/components/elements/buttons/link-button.svelte';
+	import { onMount } from 'svelte';
+	import { flip } from 'svelte/animate';
 
 	export let data: PageData;
 
@@ -18,6 +20,7 @@
 		isShowContextMenu,
 		contextMenuPosition,
 		createAlbum,
+		deleteAlbum,
 		deleteSelectedContextAlbum,
 		showAlbumContextMenu,
 		closeAlbumContextMenu
@@ -29,6 +32,23 @@
 			goto('/albums/' + newAlbum.id);
 		}
 	};
+
+	onMount(() => {
+		removeAlbumsIfEmpty();
+	});
+
+	const removeAlbumsIfEmpty = async () => {
+		try {
+			for (const album of $albums) {
+				if (album.assetCount == 0 && album.albumName == 'Untitled') {
+					await deleteAlbum(album);
+					$albums = $albums.filter((a) => a.id !== album.id);
+				}
+			}
+		} catch (error) {
+			console.log(error);
+		}
+	};
 </script>
 
 <UserPageLayout user={data.user} title={data.meta.title}>
@@ -43,15 +63,14 @@
 
 	<!-- Album Card -->
 	<div class="grid grid-cols-[repeat(auto-fill,minmax(15rem,1fr))] gap-8">
-		{#each $albums as album}
-			{#key album.id}
-				<a data-sveltekit-preload-data="hover" href={`albums/${album.id}`}>
-					<AlbumCard
-						{album}
-						on:showalbumcontextmenu={(e) => showAlbumContextMenu(e.detail, album)}
-					/>
-				</a>
-			{/key}
+		{#each $albums as album (album.id)}
+			<a
+				data-sveltekit-preload-data="hover"
+				href={`albums/${album.id}`}
+				animate:flip={{ duration: 200 }}
+			>
+				<AlbumCard {album} on:showalbumcontextmenu={(e) => showAlbumContextMenu(e.detail, album)} />
+			</a>
 		{/each}
 	</div>
 

web/src/routes/(user)/albums/albums.bloc.ts

@@ -53,11 +53,7 @@ export const useAlbums = (props: AlbumsProps) => {
 	}
 
 	async function deleteAlbum(album: AlbumResponseDto): Promise<void> {
-		try {
-			await api.albumApi.deleteAlbum(album.id);
-		} catch {
-			// Do nothing?
-		}
+		await api.albumApi.deleteAlbum(album.id);
 	}
 
 	async function showAlbumContextMenu(
@@ -107,6 +103,7 @@ export const useAlbums = (props: AlbumsProps) => {
 		contextMenuPosition,
 		loadAlbums,
 		createAlbum,
+		deleteAlbum,
 		showAlbumContextMenu,
 		closeAlbumContextMenu,
 		deleteSelectedContextAlbum