From 38443a6068f4b8830ab1e44a2088798bca5fcd06 Mon Sep 17 00:00:00 2001
From: Sergey Kondrikov <sergey.kondrikov@gmail.com>
Date: Fri, 3 Nov 2023 17:01:48 +0300
Subject: [PATCH] fix(web): unstacking issues (#4792)

* Fix typo

* Restore asset store consistency after unstacking

* Fix aspect ratio after unstacking
---
 server/src/immich/api-v1/asset/asset-repository.ts            | 4 +++-
 .../lib/components/asset-viewer/asset-viewer-nav-bar.svelte   | 4 ++--
 web/src/lib/components/asset-viewer/asset-viewer.svelte       | 4 ++--
 web/src/lib/stores/assets.store.ts                            | 4 ++--
 4 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/server/src/immich/api-v1/asset/asset-repository.ts b/server/src/immich/api-v1/asset/asset-repository.ts
index e0e239f6dd..9dac7e604e 100644
--- a/server/src/immich/api-v1/asset/asset-repository.ts
+++ b/server/src/immich/api-v1/asset/asset-repository.ts
@@ -109,7 +109,9 @@ export class AssetRepository implements IAssetRepository {
         faces: {
           person: true,
         },
-        stack: true,
+        stack: {
+          exifInfo: true,
+        },
       },
       // We are specifically asking for this asset. Return it even if it is soft deleted
       withDeleted: true,
diff --git a/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte b/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
index ebffe28d2b..20d4820a7b 100644
--- a/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
+++ b/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
@@ -32,7 +32,7 @@
   export let showDownloadButton: boolean;
   export let showDetailButton: boolean;
   export let showSlideshow = false;
-  export let hasStackChildern = false;
+  export let hasStackChildren = false;
 
   $: isOwner = asset.ownerId === $page.data.user?.id;
 
@@ -176,7 +176,7 @@
               />
               <MenuOption on:click={() => onMenuClick('asProfileImage')} text="As profile picture" />
 
-              {#if hasStackChildern}
+              {#if hasStackChildren}
                 <MenuOption on:click={() => onMenuClick('unstack')} text="Un-Stack" />
               {/if}
 
diff --git a/web/src/lib/components/asset-viewer/asset-viewer.svelte b/web/src/lib/components/asset-viewer/asset-viewer.svelte
index c519346e8b..83da35e70a 100644
--- a/web/src/lib/components/asset-viewer/asset-viewer.svelte
+++ b/web/src/lib/components/asset-viewer/asset-viewer.svelte
@@ -549,7 +549,7 @@
       }
       asset.stackCount = 0;
       asset.stack = [];
-      assetStore?.updateAsset(asset);
+      assetStore?.updateAsset(asset, true);
 
       dispatch('unstack');
       notificationController.show({ type: NotificationType.Info, message: 'Un-stacked', timeout: 1500 });
@@ -575,7 +575,7 @@
         showDownloadButton={shouldShowDownloadButton}
         showDetailButton={shouldShowDetailButton}
         showSlideshow={!!assetStore}
-        hasStackChildern={$stackAssetsStore.length > 0}
+        hasStackChildren={$stackAssetsStore.length > 0}
         on:goBack={closeViewer}
         on:showDetail={showDetailInfoHandler}
         on:download={() => downloadFile(asset)}
diff --git a/web/src/lib/stores/assets.store.ts b/web/src/lib/stores/assets.store.ts
index fa5c1ccdf7..7488ddf6a6 100644
--- a/web/src/lib/stores/assets.store.ts
+++ b/web/src/lib/stores/assets.store.ts
@@ -317,7 +317,7 @@ export class AssetStore {
     return bucket.assets[Math.floor(Math.random() * bucket.assets.length)] || null;
   }
 
-  updateAsset(_asset: AssetResponseDto) {
+  updateAsset(_asset: AssetResponseDto, recalculate = false) {
     const asset = this.assets.find((asset) => asset.id === _asset.id);
     if (!asset) {
       return;
@@ -325,7 +325,7 @@ export class AssetStore {
 
     Object.assign(asset, _asset);
 
-    this.emit(false);
+    this.emit(recalculate);
   }
 
   removeAssets(ids: string[]) {