feat(web): show asset count in sharing tab and album viewer (#2311)

* show asset count in sharing tab

* add asset count to album-viewer

* remove duplicate font size

* fix test

---------

Co-authored-by: faupau03 <paul.paffe@gmx.net>
Co-authored-by: Alex Tran <alex.tran1502@gmail.com>

web/src/lib/components/album-page/album-viewer.svelte

@@ -503,7 +503,11 @@
 		/>
 
 		{#if album.assetCount > 0}
-			<p class="my-4 text-sm text-gray-500 font-medium">{getDateRange()}</p>
+			<span class="flex gap-2 my-4 text-sm text-gray-500 font-medium" data-testid="album-details">
+				<p class="">{getDateRange()}</p>
+				<p>·</p>
+				<p>{album.assetCount} items</p>
+			</span>
 		{/if}
 		{#if album.shared}
 			<div class="my-6 flex">

web/src/lib/components/sharing-page/shared-album-list-tile.svelte

@@ -56,16 +56,19 @@
 		<p class="font-medium text-gray-800 dark:text-immich-dark-primary">
 			{album.albumName}
 		</p>
-
-		{#await getAlbumOwnerInfo() then albumOwner}
-			{#if user.email == albumOwner.email}
-				<p class="text-xs text-gray-600 dark:text-immich-dark-fg">Owned</p>
-			{:else}
-				<p class="text-xs text-gray-600 dark:text-immich-dark-fg">
-					Shared by {albumOwner.firstName}
-					{albumOwner.lastName}
-				</p>
-			{/if}
-		{/await}
+		<span class="text-xs flex gap-2 dark:text-immich-dark-fg" data-testid="album-details"
+			><p>{album.assetCount} items</p>
+			<p>·</p>
+			{#await getAlbumOwnerInfo() then albumOwner}
+				{#if user.email == albumOwner.email}
+					<p class="text-xs text-gray-600 dark:text-immich-dark-fg">Owned</p>
+				{:else}
+					<p class="text-xs text-gray-600 dark:text-immich-dark-fg">
+						Shared by {albumOwner.firstName}
+						{albumOwner.lastName}
+					</p>
+				{/if}
+			{/await}
+		</span>
 	</div>
 </div>