From 6b735e29c69124e240fb7b586407f65aaeae0dd8 Mon Sep 17 00:00:00 2001
From: Alex Tran <alex.tran1502@gmail.com>
Date: Tue, 3 Sep 2024 11:15:46 -0500
Subject: [PATCH] fix(web): show stack in album

---
 .../[[assetId=id]]/+page.svelte                  | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte b/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte
index 2c3f058e14..f34e8d97ae 100644
--- a/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte
+++ b/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte
@@ -124,11 +124,11 @@
   let assetGridWidth: number;
   let albumOrder: AssetOrder | undefined = data.album.order;
 
-  $: assetStore = new AssetStore({ albumId, order: albumOrder });
+  $: assetStore = new AssetStore({ albumId, order: albumOrder, withStacked: true });
   const assetInteractionStore = createAssetInteractionStore();
   const { isMultiSelectState, selectedAssets } = assetInteractionStore;
 
-  $: timelineStore = new AssetStore({ isArchived: false }, albumId);
+  $: timelineStore = new AssetStore({ isArchived: false, withStacked: true }, albumId);
   const timelineInteractionStore = createAssetInteractionStore();
   const { selectedAssets: timelineSelected } = timelineInteractionStore;
 
@@ -298,11 +298,7 @@
       await refreshAlbum();
 
       timelineInteractionStore.clearMultiselect();
-      viewMode = ViewMode.VIEW;
-      await navigate(
-        { targetRoute: 'current', assetId: null, assetGridRouteSearchParams: $gridScrollTarget },
-        { replaceState: true, forceNavigate: true },
-      );
+      await setModeToView();
     } catch (error) {
       handleError(error, $t('errors.error_adding_assets_to_album'));
     }
@@ -311,9 +307,9 @@
   const setModeToView = async () => {
     viewMode = ViewMode.VIEW;
     assetStore.destroy();
-    assetStore = new AssetStore({ albumId, order: albumOrder });
+    assetStore = new AssetStore({ albumId, order: albumOrder, withStacked: true });
     timelineStore.destroy();
-    timelineStore = new AssetStore({ isArchived: false }, albumId);
+    timelineStore = new AssetStore({ isArchived: false, withStacked: true }, albumId);
     await navigate(
       { targetRoute: 'current', assetId: null, assetGridRouteSearchParams: { at: oldAt?.at } },
       { replaceState: true, forceNavigate: true },
@@ -576,6 +572,7 @@
             assetStore={timelineStore}
             assetInteractionStore={timelineInteractionStore}
             isSelectionMode={true}
+            withStacked
           />
         {:else}
           <AssetGrid
@@ -589,6 +586,7 @@
             showArchiveIcon
             on:select={({ detail: asset }) => handleUpdateThumbnail(asset.id)}
             on:escape={handleEscape}
+            withStacked
           >
             {#if viewMode !== ViewMode.SELECT_THUMBNAIL}
               <!-- ALBUM TITLE -->