From 3b11be2859dbf35ae9735579a4da4cd5305c65e6 Mon Sep 17 00:00:00 2001
From: Alex <alex.tran1502@gmail.com>
Date: Tue, 22 Aug 2023 08:05:48 +0200
Subject: [PATCH] fix(web): cannot view publlic shared album (#3829)

---
 web/src/lib/components/photos-page/asset-date-group.svelte | 3 +--
 web/src/lib/components/photos-page/asset-grid.svelte       | 6 +++---
 web/src/lib/stores/asset-viewing.store.ts                  | 4 ++--
 3 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/web/src/lib/components/photos-page/asset-date-group.svelte b/web/src/lib/components/photos-page/asset-date-group.svelte
index 267f212b9c..37cd7f44b0 100644
--- a/web/src/lib/components/photos-page/asset-date-group.svelte
+++ b/web/src/lib/components/photos-page/asset-date-group.svelte
@@ -27,7 +27,6 @@
   export let assetInteractionStore: AssetInteractionStore;
 
   const { selectedGroup, selectedAssets, assetSelectionCandidates, isMultiSelectState } = assetInteractionStore;
-
   const dispatch = createEventDispatcher<{
     select: { title: string; assets: AssetResponseDto[] };
     selectAssets: AssetResponseDto;
@@ -97,7 +96,7 @@
       return;
     }
 
-    assetViewingStore.setAssetId(asset.id);
+    assetViewingStore.setAssetId(asset.id, publicSharedKey);
   };
 
   const handleSelectGroup = (title: string, assets: AssetResponseDto[]) => dispatch('select', { title, assets });
diff --git a/web/src/lib/components/photos-page/asset-grid.svelte b/web/src/lib/components/photos-page/asset-grid.svelte
index 730c072c13..a048431db2 100644
--- a/web/src/lib/components/photos-page/asset-grid.svelte
+++ b/web/src/lib/components/photos-page/asset-grid.svelte
@@ -24,7 +24,6 @@
   export let assetInteractionStore: AssetInteractionStore;
   export let removeAction: AssetAction | null = null;
   export let publicSharedKey: string | undefined = undefined;
-
   const { assetSelectionCandidates, assetSelectionStart, selectedGroup, selectedAssets, isMultiSelectState } =
     assetInteractionStore;
   const viewport: Viewport = { width: 0, height: 0 };
@@ -98,7 +97,7 @@
   const handlePrevious = async () => {
     const previousAsset = await assetStore.getPreviousAssetId($viewingAsset.id);
     if (previousAsset) {
-      assetViewingStore.setAssetId(previousAsset);
+      assetViewingStore.setAssetId(previousAsset, publicSharedKey);
     }
 
     return !!previousAsset;
@@ -107,7 +106,7 @@
   const handleNext = async () => {
     const nextAsset = await assetStore.getNextAssetId($viewingAsset.id);
     if (nextAsset) {
-      assetViewingStore.setAssetId(nextAsset);
+      assetViewingStore.setAssetId(nextAsset, publicSharedKey);
     }
 
     return !!nextAsset;
@@ -372,6 +371,7 @@
       on:unarchived={({ detail: asset }) => handleAction(asset, AssetAction.UNARCHIVE)}
       on:favorite={({ detail: asset }) => handleAction(asset, AssetAction.FAVORITE)}
       on:unfavorite={({ detail: asset }) => handleAction(asset, AssetAction.UNFAVORITE)}
+      {publicSharedKey}
     />
   {/if}
 </Portal>
diff --git a/web/src/lib/stores/asset-viewing.store.ts b/web/src/lib/stores/asset-viewing.store.ts
index 96fc9dc5bb..fafcb9ec22 100644
--- a/web/src/lib/stores/asset-viewing.store.ts
+++ b/web/src/lib/stores/asset-viewing.store.ts
@@ -5,8 +5,8 @@ function createAssetViewingStore() {
   const viewingAssetStoreState = writable<AssetResponseDto>();
   const viewState = writable<boolean>(false);
 
-  const setAssetId = async (id: string) => {
-    const { data } = await api.assetApi.getAssetById({ id });
+  const setAssetId = async (id: string, key?: string) => {
+    const { data } = await api.assetApi.getAssetById({ id, key });
     viewingAssetStoreState.set(data);
     viewState.set(true);
   };