- move asset stack functions from actions into timeline-manager

Author: xCJPECKOVERx

web/src/lib/components/photos-page/asset-grid.svelte

@@ -421,7 +421,7 @@
   const onStackAssets = async () => {
     const result = await stackAssets(assetInteraction.selectedAssets);
 
-    updateStackedAssetInTimeline(timelineManager, result);
+    timelineManager.stackAssets(result);//updateStackedAssetInTimeline(timelineManager, result);
 
     onEscape();
   };
@@ -525,18 +525,18 @@
       }
 
       case AssetAction.UNSTACK: {
-        updateUnstackedAssetInTimeline(timelineManager, action.assets);
+        timelineManager.unstackAssets(action.assets);//updateUnstackedAssetInTimeline(timelineManager, action.assets);
         break;
       }
       case AssetAction.REMOVE_ASSET_FROM_STACK: {
         timelineManager.addAssets([toTimelineAsset(action.asset)]);
         if (action.stack) {
-          refreshStackedAssetInTimeline(timelineManager, action.stack);
+          timelineManager.refreshStack(action.stack)//refreshStackedAssetInTimeline(timelineManager, action.stack);
         }
         break;
       }
       case AssetAction.SET_STACK_PRIMARY_ASSET: {
-        refreshStackedAssetInTimeline(timelineManager, action.stack, true);
+        timelineManager.refreshStack(action.stack, true);//refreshStackedAssetInTimeline(timelineManager, action.stack, true);
         break;
       }
     }

web/src/lib/managers/timeline-manager/timeline-manager.svelte.ts

@@ -1,4 +1,4 @@
-import { AssetOrder, getAssetInfo, getTimeBuckets } from '@immich/sdk';
+import { AssetOrder, getAssetInfo, getTimeBuckets, type StackResponseDto } from '@immich/sdk';
 
 import { authManager } from '$lib/managers/auth-manager.svelte';
 
@@ -23,6 +23,7 @@ import {
   retrieveRange as retrieveRangeUtil,
 } from '$lib/managers/timeline-manager/internal/search-support.svelte';
 import { WebsocketSupport } from '$lib/managers/timeline-manager/internal/websocket-support.svelte';
+import type { StackResponse } from '$lib/utils/asset-utils';
 import { DayGroup } from './day-group.svelte';
 import { isMismatched, updateObject } from './internal/utils.svelte';
 import { MonthGroup } from './month-group.svelte';
@@ -544,4 +545,43 @@ export class TimelineManager {
   getAssetOrder() {
     return this.#options.order ?? AssetOrder.Desc;
   }
+
+  stackAssets({ stack, toDeleteIds }: StackResponse) {
+    if (stack) {
+      this.updateAssetOperation([stack.primaryAssetId], (asset) => {
+        asset.stack = {
+          id: stack.id,
+          primaryAssetId: stack.primaryAssetId,
+          assetCount: stack.assets.length,
+        };
+        return { remove: false };
+      });
+      this.removeAssets(toDeleteIds);
+    }
+  }
+
+  unstackAssets(assets: TimelineAsset[]) {
+    this.updateAssetOperation(
+      assets.map(({ id }) => id),
+      (asset) => {
+        asset.stack = null;
+        return { remove: false };
+      },
+    );
+    this.addAssets(assets);
+  }
+
+  refreshStack(stack: StackResponseDto, addPrimaryAsset: boolean = false) {
+    if (stack) {
+      if (addPrimaryAsset) {
+        this.addAssets(
+          stack.assets.filter((asset) => asset.id === stack.primaryAssetId).map((asset) => toTimelineAsset(asset)),
+        );
+      }
+      this.stackAssets({
+        stack,
+        toDeleteIds: stack.assets.filter((asset) => asset.id !== stack.primaryAssetId).map(({ id }) => id),
+      });
+    }
+  }
 }

web/src/routes/(user)/photos/[[assetId=id]]/+page.svelte

@@ -27,12 +27,7 @@
   import { assetViewingStore } from '$lib/stores/asset-viewing.store';
   import { isFaceEditMode } from '$lib/stores/face-edit.svelte';
   import { preferences, user } from '$lib/stores/user.store';
-  import {
-    updateStackedAssetInTimeline,
-    updateUnstackedAssetInTimeline,
-    type OnLink,
-    type OnUnlink,
-  } from '$lib/utils/actions';
+  import { type OnLink, type OnUnlink } from '$lib/utils/actions';
   import { openFileUploadDialog } from '$lib/utils/file-uploader';
   import { AssetVisibility } from '@immich/sdk';
 
@@ -131,8 +126,8 @@
       {#if assetInteraction.selectedAssets.length > 1 || isAssetStackSelected}
         <StackAction
           unstack={isAssetStackSelected}
-          onStack={(result) => updateStackedAssetInTimeline(timelineManager, result)}
-          onUnstack={(assets) => updateUnstackedAssetInTimeline(timelineManager, assets)}
+          onStack={(result) => timelineManager.stackAssets(result)}
+          onUnstack={(assets) => timelineManager.unstackAssets(assets)}
         />
       {/if}
       {#if isLinkActionAvailable}