refactor(server): stacks (#11453)

* refactor: stacks

* mobile: get it built

* chore: feedback

* fix: sync and duplicates

* mobile: remove old stack reference

* chore: add primary asset id

* revert change to asset entity

* mobile: refactor mobile api

* mobile: sync stack info after creating stack

* mobile: update timeline after deleting stack

* server: update asset updatedAt when stack is deleted

* mobile: simplify action

* mobile: rename to match dto property

* fix: web test

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>

e2e/src/api/specs/asset.e2e-spec.ts

@@ -7,7 +7,6 @@ import {
   SharedLinkType,
   getAssetInfo,
   getMyUser,
-  updateAssets,
 } from '@immich/sdk';
 import { exiftool } from 'exiftool-vendored';
 import { DateTime } from 'luxon';
@@ -67,11 +66,9 @@ describe('/asset', () => {
   let timeBucketUser: LoginResponseDto;
   let quotaUser: LoginResponseDto;
   let statsUser: LoginResponseDto;
-  let stackUser: LoginResponseDto;
 
   let user1Assets: AssetMediaResponseDto[];
   let user2Assets: AssetMediaResponseDto[];
-  let stackAssets: AssetMediaResponseDto[];
   let locationAsset: AssetMediaResponseDto;
   let ratingAsset: AssetMediaResponseDto;
 
@@ -79,14 +76,13 @@ describe('/asset', () => {
     await utils.resetDatabase();
     admin = await utils.adminSetup({ onboarding: false });
 
-    [websocket, user1, user2, statsUser, quotaUser, timeBucketUser, stackUser] = await Promise.all([
+    [websocket, user1, user2, statsUser, quotaUser, timeBucketUser] = await Promise.all([
       utils.connectWebsocket(admin.accessToken),
       utils.userSetup(admin.accessToken, createUserDto.create('1')),
       utils.userSetup(admin.accessToken, createUserDto.create('2')),
       utils.userSetup(admin.accessToken, createUserDto.create('stats')),
       utils.userSetup(admin.accessToken, createUserDto.userQuota),
       utils.userSetup(admin.accessToken, createUserDto.create('time-bucket')),
-      utils.userSetup(admin.accessToken, createUserDto.create('stack')),
     ]);
 
     await utils.createPartner(user1.accessToken, user2.userId);
@@ -149,20 +145,6 @@ describe('/asset', () => {
       }),
     ]);
 
-    // stacks
-    stackAssets = await Promise.all([
-      utils.createAsset(stackUser.accessToken),
-      utils.createAsset(stackUser.accessToken),
-      utils.createAsset(stackUser.accessToken),
-      utils.createAsset(stackUser.accessToken),
-      utils.createAsset(stackUser.accessToken),
-    ]);
-
-    await updateAssets(
-      { assetBulkUpdateDto: { stackParentId: stackAssets[0].id, ids: [stackAssets[1].id, stackAssets[2].id] } },
-      { headers: asBearerAuth(stackUser.accessToken) },
-    );
-
     const person1 = await utils.createPerson(user1.accessToken, {
       name: 'Test Person',
     });
@@ -826,145 +808,8 @@ describe('/asset', () => {
       expect(status).toBe(401);
       expect(body).toEqual(errorDto.unauthorized);
     });
-
-    it('should require a valid parent id', async () => {
-      const { status, body } = await request(app)
-        .put('/assets')
-        .set('Authorization', `Bearer ${user1.accessToken}`)
-        .send({ stackParentId: uuidDto.invalid, ids: [stackAssets[0].id] });
-
-      expect(status).toBe(400);
-      expect(body).toEqual(errorDto.badRequest(['stackParentId must be a UUID']));
-    });
-
-    it('should require access to the parent', async () => {
-      const { status, body } = await request(app)
-        .put('/assets')
-        .set('Authorization', `Bearer ${user1.accessToken}`)
-        .send({ stackParentId: stackAssets[3].id, ids: [user1Assets[0].id] });
-
-      expect(status).toBe(400);
-      expect(body).toEqual(errorDto.noPermission);
-    });
-
-    it('should add stack children', async () => {
-      const { status } = await request(app)
-        .put('/assets')
-        .set('Authorization', `Bearer ${stackUser.accessToken}`)
-        .send({ stackParentId: stackAssets[0].id, ids: [stackAssets[3].id] });
-
-      expect(status).toBe(204);
-
-      const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
-      expect(asset.stack).not.toBeUndefined();
-      expect(asset.stack).toEqual(expect.arrayContaining([expect.objectContaining({ id: stackAssets[3].id })]));
-    });
-
-    it('should remove stack children', async () => {
-      const { status } = await request(app)
-        .put('/assets')
-        .set('Authorization', `Bearer ${stackUser.accessToken}`)
-        .send({ removeParent: true, ids: [stackAssets[1].id] });
-
-      expect(status).toBe(204);
-
-      const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
-      expect(asset.stack).not.toBeUndefined();
-      expect(asset.stack).toEqual(
-        expect.arrayContaining([
-          expect.objectContaining({ id: stackAssets[2].id }),
-          expect.objectContaining({ id: stackAssets[3].id }),
-        ]),
-      );
-    });
-
-    it('should remove all stack children', async () => {
-      const { status } = await request(app)
-        .put('/assets')
-        .set('Authorization', `Bearer ${stackUser.accessToken}`)
-        .send({ removeParent: true, ids: [stackAssets[2].id, stackAssets[3].id] });
-
-      expect(status).toBe(204);
-
-      const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
-      expect(asset.stack).toBeUndefined();
-    });
-
-    it('should merge stack children', async () => {
-      // create stack after previous test removed stack children
-      await updateAssets(
-        { assetBulkUpdateDto: { stackParentId: stackAssets[0].id, ids: [stackAssets[1].id, stackAssets[2].id] } },
-        { headers: asBearerAuth(stackUser.accessToken) },
-      );
-
-      const { status } = await request(app)
-        .put('/assets')
-        .set('Authorization', `Bearer ${stackUser.accessToken}`)
-        .send({ stackParentId: stackAssets[3].id, ids: [stackAssets[0].id] });
-
-      expect(status).toBe(204);
-
-      const asset = await getAssetInfo({ id: stackAssets[3].id }, { headers: asBearerAuth(stackUser.accessToken) });
-      expect(asset.stack).not.toBeUndefined();
-      expect(asset.stack).toEqual(
-        expect.arrayContaining([
-          expect.objectContaining({ id: stackAssets[0].id }),
-          expect.objectContaining({ id: stackAssets[1].id }),
-          expect.objectContaining({ id: stackAssets[2].id }),
-        ]),
-      );
-    });
   });
 
-  describe('PUT /assets/stack/parent', () => {
-    it('should require authentication', async () => {
-      const { status, body } = await request(app).put('/assets/stack/parent');
-
-      expect(status).toBe(401);
-      expect(body).toEqual(errorDto.unauthorized);
-    });
-
-    it('should require a valid id', async () => {
-      const { status, body } = await request(app)
-        .put('/assets/stack/parent')
-        .set('Authorization', `Bearer ${user1.accessToken}`)
-        .send({ oldParentId: uuidDto.invalid, newParentId: uuidDto.invalid });
-
-      expect(status).toBe(400);
-      expect(body).toEqual(errorDto.badRequest());
-    });
-
-    it('should require access', async () => {
-      const { status, body } = await request(app)
-        .put('/assets/stack/parent')
-        .set('Authorization', `Bearer ${user1.accessToken}`)
-        .send({ oldParentId: stackAssets[3].id, newParentId: stackAssets[0].id });
-
-      expect(status).toBe(400);
-      expect(body).toEqual(errorDto.noPermission);
-    });
-
-    it('should make old parent child of new parent', async () => {
-      const { status } = await request(app)
-        .put('/assets/stack/parent')
-        .set('Authorization', `Bearer ${stackUser.accessToken}`)
-        .send({ oldParentId: stackAssets[3].id, newParentId: stackAssets[0].id });
-
-      expect(status).toBe(200);
-
-      const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
-
-      // new parent
-      expect(asset.stack).not.toBeUndefined();
-      expect(asset.stack).toEqual(
-        expect.arrayContaining([
-          expect.objectContaining({ id: stackAssets[1].id }),
-          expect.objectContaining({ id: stackAssets[2].id }),
-          expect.objectContaining({ id: stackAssets[3].id }),
-        ]),
-      );
-    });
-  });
   describe('POST /assets', () => {
     beforeAll(setupTests, 30_000);
 

e2e/src/api/specs/stack.e2e-spec.ts

@@ -0,0 +1,211 @@
+import { AssetMediaResponseDto, LoginResponseDto, searchStacks } from '@immich/sdk';
+import { createUserDto, uuidDto } from 'src/fixtures';
+import { errorDto } from 'src/responses';
+import { app, asBearerAuth, utils } from 'src/utils';
+import request from 'supertest';
+import { beforeAll, describe, expect, it } from 'vitest';
+
+describe('/stacks', () => {
+  let admin: LoginResponseDto;
+  let user1: LoginResponseDto;
+  let user2: LoginResponseDto;
+  let asset: AssetMediaResponseDto;
+
+  beforeAll(async () => {
+    await utils.resetDatabase();
+
+    admin = await utils.adminSetup();
+
+    [user1, user2] = await Promise.all([
+      utils.userSetup(admin.accessToken, createUserDto.user1),
+      utils.userSetup(admin.accessToken, createUserDto.user2),
+    ]);
+
+    asset = await utils.createAsset(user1.accessToken);
+  });
+
+  describe('POST /stacks', () => {
+    it('should require authentication', async () => {
+      const { status, body } = await request(app)
+        .post('/stacks')
+        .send({ assetIds: [asset.id] });
+
+      expect(status).toBe(401);
+      expect(body).toEqual(errorDto.unauthorized);
+    });
+
+    it('should require at least two assets', async () => {
+      const { status, body } = await request(app)
+        .post('/stacks')
+        .set('Authorization', `Bearer ${user1.accessToken}`)
+        .send({ assetIds: [asset.id] });
+
+      expect(status).toBe(400);
+      expect(body).toEqual(errorDto.badRequest());
+    });
+
+    it('should require a valid id', async () => {
+      const { status, body } = await request(app)
+        .post('/stacks')
+        .set('Authorization', `Bearer ${user1.accessToken}`)
+        .send({ assetIds: [uuidDto.invalid, uuidDto.invalid] });
+
+      expect(status).toBe(400);
+      expect(body).toEqual(errorDto.badRequest());
+    });
+
+    it('should require access', async () => {
+      const user2Asset = await utils.createAsset(user2.accessToken);
+      const { status, body } = await request(app)
+        .post('/stacks')
+        .set('Authorization', `Bearer ${user1.accessToken}`)
+        .send({ assetIds: [asset.id, user2Asset.id] });
+
+      expect(status).toBe(400);
+      expect(body).toEqual(errorDto.noPermission);
+    });
+
+    it('should create a stack', async () => {
+      const [asset1, asset2] = await Promise.all([
+        utils.createAsset(user1.accessToken),
+        utils.createAsset(user1.accessToken),
+      ]);
+
+      const { status, body } = await request(app)
+        .post('/stacks')
+        .set('Authorization', `Bearer ${user1.accessToken}`)
+        .send({ assetIds: [asset1.id, asset2.id] });
+
+      expect(status).toBe(201);
+      expect(body).toEqual({
+        id: expect.any(String),
+        primaryAssetId: asset1.id,
+        assets: [expect.objectContaining({ id: asset1.id }), expect.objectContaining({ id: asset2.id })],
+      });
+    });
+
+    it('should merge an existing stack', async () => {
+      const [asset1, asset2, asset3] = await Promise.all([
+        utils.createAsset(user1.accessToken),
+        utils.createAsset(user1.accessToken),
+        utils.createAsset(user1.accessToken),
+      ]);
+
+      const response1 = await request(app)
+        .post('/stacks')
+        .set('Authorization', `Bearer ${user1.accessToken}`)
+        .send({ assetIds: [asset1.id, asset2.id] });
+
+      expect(response1.status).toBe(201);
+
+      const stacksBefore = await searchStacks({}, { headers: asBearerAuth(user1.accessToken) });
+
+      const { status, body } = await request(app)
+        .post('/stacks')
+        .set('Authorization', `Bearer ${user1.accessToken}`)
+        .send({ assetIds: [asset1.id, asset3.id] });
+
+      expect(status).toBe(201);
+      expect(body).toEqual({
+        id: expect.any(String),
+        primaryAssetId: asset1.id,
+        assets: expect.arrayContaining([
+          expect.objectContaining({ id: asset1.id }),
+          expect.objectContaining({ id: asset2.id }),
+          expect.objectContaining({ id: asset3.id }),
+        ]),
+      });
+
+      const stacksAfter = await searchStacks({}, { headers: asBearerAuth(user1.accessToken) });
+      expect(stacksAfter.length).toBe(stacksBefore.length);
+    });
+
+    // it('should require a valid parent id', async () => {
+    //   const { status, body } = await request(app)
+    //     .put('/assets')
+    //     .set('Authorization', `Bearer ${user1.accessToken}`)
+    //     .send({ stackParentId: uuidDto.invalid, ids: [stackAssets[0].id] });
+
+    //   expect(status).toBe(400);
+    //   expect(body).toEqual(errorDto.badRequest(['stackParentId must be a UUID']));
+    // });
+  });
+
+  // it('should require access to the parent', async () => {
+  //   const { status, body } = await request(app)
+  //     .put('/assets')
+  //     .set('Authorization', `Bearer ${user1.accessToken}`)
+  //     .send({ stackParentId: stackAssets[3].id, ids: [user1Assets[0].id] });
+
+  //   expect(status).toBe(400);
+  //   expect(body).toEqual(errorDto.noPermission);
+  // });
+
+  // it('should add stack children', async () => {
+  //   const { status } = await request(app)
+  //     .put('/assets')
+  //     .set('Authorization', `Bearer ${stackUser.accessToken}`)
+  //     .send({ stackParentId: stackAssets[0].id, ids: [stackAssets[3].id] });
+
+  //   expect(status).toBe(204);
+
+  //   const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
+  //   expect(asset.stack).not.toBeUndefined();
+  //   expect(asset.stack).toEqual(expect.arrayContaining([expect.objectContaining({ id: stackAssets[3].id })]));
+  // });
+
+  // it('should remove stack children', async () => {
+  //   const { status } = await request(app)
+  //     .put('/assets')
+  //     .set('Authorization', `Bearer ${stackUser.accessToken}`)
+  //     .send({ removeParent: true, ids: [stackAssets[1].id] });
+
+  //   expect(status).toBe(204);
+
+  //   const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
+  //   expect(asset.stack).not.toBeUndefined();
+  //   expect(asset.stack).toEqual(
+  //     expect.arrayContaining([
+  //       expect.objectContaining({ id: stackAssets[2].id }),
+  //       expect.objectContaining({ id: stackAssets[3].id }),
+  //     ]),
+  //   );
+  // });
+
+  // it('should remove all stack children', async () => {
+  //   const { status } = await request(app)
+  //     .put('/assets')
+  //     .set('Authorization', `Bearer ${stackUser.accessToken}`)
+  //     .send({ removeParent: true, ids: [stackAssets[2].id, stackAssets[3].id] });
+
+  //   expect(status).toBe(204);
+
+  //   const asset = await getAssetInfo({ id: stackAssets[0].id }, { headers: asBearerAuth(stackUser.accessToken) });
+  //   expect(asset.stack).toBeUndefined();
+  // });
+
+  // it('should merge stack children', async () => {
+  //   // create stack after previous test removed stack children
+  //   await updateAssets(
+  //     { assetBulkUpdateDto: { stackParentId: stackAssets[0].id, ids: [stackAssets[1].id, stackAssets[2].id] } },
+  //     { headers: asBearerAuth(stackUser.accessToken) },
+  //   );
+
+  //   const { status } = await request(app)
+  //     .put('/assets')
+  //     .set('Authorization', `Bearer ${stackUser.accessToken}`)
+  //     .send({ stackParentId: stackAssets[3].id, ids: [stackAssets[0].id] });
+
+  //   expect(status).toBe(204);
+
+  //   const asset = await getAssetInfo({ id: stackAssets[3].id }, { headers: asBearerAuth(stackUser.accessToken) });
+  //   expect(asset.stack).not.toBeUndefined();
+  //   expect(asset.stack).toEqual(
+  //     expect.arrayContaining([
+  //       expect.objectContaining({ id: stackAssets[0].id }),
+  //       expect.objectContaining({ id: stackAssets[1].id }),
+  //       expect.objectContaining({ id: stackAssets[2].id }),
+  //     ]),
+  //   );
+  // });
+});

e2e/src/api/specs/user-admin.e2e-spec.ts

@@ -1,11 +1,11 @@
 import {
   LoginResponseDto,
+  createStack,
   deleteUserAdmin,
   getMyUser,
   getUserAdmin,
   getUserPreferencesAdmin,
   login,
-  updateAssets,
 } from '@immich/sdk';
 import { Socket } from 'socket.io-client';
 import { createUserDto, uuidDto } from 'src/fixtures';
@@ -321,8 +321,8 @@ describe('/admin/users', () => {
         utils.createAsset(user.accessToken),
       ]);
 
-      await updateAssets(
+      await createStack(
-        { assetBulkUpdateDto: { stackParentId: asset1.id, ids: [asset2.id] } },
+        { stackCreateDto: { assetIds: [asset1.id, asset2.id] } },
         { headers: asBearerAuth(user.accessToken) },
       );
 

mobile/assets/i18n/en-US.json

@@ -573,7 +573,5 @@
   "version_announcement_overlay_text_2": "please take your time to visit the ",
   "version_announcement_overlay_text_3": " and ensure your docker-compose and .env setup is up-to-date to prevent any misconfigurations, especially if you use WatchTower or any mechanism that handles updating your server application automatically.",
   "version_announcement_overlay_title": "New Server Version Available \uD83C\uDF89",
-  "viewer_remove_from_stack": "Remove from Stack",
-  "viewer_stack_use_as_main_asset": "Use as Main Asset",
   "viewer_unstack": "Un-Stack"
-}
+}

mobile/lib/entities/asset.entity.dart

@@ -33,11 +33,13 @@ class Asset {
         isArchived = remote.isArchived,
         isTrashed = remote.isTrashed,
         isOffline = remote.isOffline,
-        // workaround to nullify stackParentId for the parent asset until we refactor the mobile app
+        // workaround to nullify stackPrimaryAssetId for the parent asset until we refactor the mobile app
         // stack handling to properly handle it
-        stackParentId =
+        stackPrimaryAssetId = remote.stack?.primaryAssetId == remote.id
-            remote.stackParentId == remote.id ? null : remote.stackParentId,
+            ? null
-        stackCount = remote.stackCount,
+            : remote.stack?.primaryAssetId,
+        stackCount = remote.stack?.assetCount ?? 0,
+        stackId = remote.stack?.id,
         thumbhash = remote.thumbhash;
 
   Asset.local(AssetEntity local, List<int> hash)
@@ -86,7 +88,8 @@ class Asset {
     this.isFavorite = false,
     this.isArchived = false,
     this.isTrashed = false,
-    this.stackParentId,
+    this.stackId,
+    this.stackPrimaryAssetId,
     this.stackCount = 0,
     this.isOffline = false,
     this.thumbhash,
@@ -163,12 +166,11 @@ class Asset {
   @ignore
   ExifInfo? exifInfo;
 
-  String? stackParentId;
+  String? stackId;
 
-  @ignore
+  String? stackPrimaryAssetId;
-  int get stackChildrenCount => stackCount ?? 0;
 
-  int? stackCount;
+  int stackCount;
 
   /// Aspect ratio of the asset
   @ignore
@@ -231,7 +233,8 @@ class Asset {
         isArchived == other.isArchived &&
         isTrashed == other.isTrashed &&
         stackCount == other.stackCount &&
-        stackParentId == other.stackParentId;
+        stackPrimaryAssetId == other.stackPrimaryAssetId &&
+        stackId == other.stackId;
   }
 
   @override
@@ -256,7 +259,8 @@ class Asset {
       isArchived.hashCode ^
       isTrashed.hashCode ^
       stackCount.hashCode ^
-      stackParentId.hashCode;
+      stackPrimaryAssetId.hashCode ^
+      stackId.hashCode;
 
   /// Returns `true` if this [Asset] can updated with values from parameter [a]
   bool canUpdate(Asset a) {
@@ -269,7 +273,6 @@ class Asset {
         width == null && a.width != null ||
         height == null && a.height != null ||
         livePhotoVideoId == null && a.livePhotoVideoId != null ||
-        stackParentId == null && a.stackParentId != null ||
         isFavorite != a.isFavorite ||
         isArchived != a.isArchived ||
         isTrashed != a.isTrashed ||
@@ -278,10 +281,9 @@ class Asset {
         a.exifInfo?.longitude != exifInfo?.longitude ||
         // no local stack count or different count from remote
         a.thumbhash != thumbhash ||
-        ((stackCount == null && a.stackCount != null) ||
+        stackId != a.stackId ||
-            (stackCount != null &&
+        stackCount != a.stackCount ||
-                a.stackCount != null &&
+        stackPrimaryAssetId == null && a.stackPrimaryAssetId != null;
-                stackCount != a.stackCount));
   }
 
   /// Returns a new [Asset] with values from this and merged & updated with [a]
@@ -311,9 +313,11 @@ class Asset {
           id: id,
           remoteId: remoteId,
           livePhotoVideoId: livePhotoVideoId,
-          // workaround to nullify stackParentId for the parent asset until we refactor the mobile app
+          // workaround to nullify stackPrimaryAssetId for the parent asset until we refactor the mobile app
           // stack handling to properly handle it
-          stackParentId: stackParentId == remoteId ? null : stackParentId,
+          stackId: stackId,
+          stackPrimaryAssetId:
+              stackPrimaryAssetId == remoteId ? null : stackPrimaryAssetId,
           stackCount: stackCount,
           isFavorite: isFavorite,
           isArchived: isArchived,
@@ -330,9 +334,12 @@ class Asset {
           width: a.width,
           height: a.height,
           livePhotoVideoId: a.livePhotoVideoId,
-          // workaround to nullify stackParentId for the parent asset until we refactor the mobile app
+          // workaround to nullify stackPrimaryAssetId for the parent asset until we refactor the mobile app
           // stack handling to properly handle it
-          stackParentId: a.stackParentId == a.remoteId ? null : a.stackParentId,
+          stackId: a.stackId,
+          stackPrimaryAssetId: a.stackPrimaryAssetId == a.remoteId
+              ? null
+              : a.stackPrimaryAssetId,
           stackCount: a.stackCount,
           // isFavorite + isArchived are not set by device-only assets
           isFavorite: a.isFavorite,
@@ -374,7 +381,8 @@ class Asset {
     bool? isTrashed,
     bool? isOffline,
     ExifInfo? exifInfo,
-    String? stackParentId,
+    String? stackId,
+    String? stackPrimaryAssetId,
     int? stackCount,
     String? thumbhash,
   }) =>
@@ -398,7 +406,8 @@ class Asset {
         isTrashed: isTrashed ?? this.isTrashed,
         isOffline: isOffline ?? this.isOffline,
         exifInfo: exifInfo ?? this.exifInfo,
-        stackParentId: stackParentId ?? this.stackParentId,
+        stackId: stackId ?? this.stackId,
+        stackPrimaryAssetId: stackPrimaryAssetId ?? this.stackPrimaryAssetId,
         stackCount: stackCount ?? this.stackCount,
         thumbhash: thumbhash ?? this.thumbhash,
       );
@@ -445,8 +454,9 @@ class Asset {
   "checksum": "$checksum",
   "ownerId": $ownerId,
   "livePhotoVideoId": "${livePhotoVideoId ?? "N/A"}",
+  "stackId": "${stackId ?? "N/A"}",
+  "stackPrimaryAssetId": "${stackPrimaryAssetId ?? "N/A"}",
   "stackCount": "$stackCount",
-  "stackParentId": "${stackParentId ?? "N/A"}",
   "fileCreatedAt": "$fileCreatedAt",
   "fileModifiedAt": "$fileModifiedAt",
   "updatedAt": "$updatedAt",

mobile/lib/pages/common/gallery_viewer.page.dart

@@ -68,7 +68,7 @@ class GalleryViewerPage extends HookConsumerWidget {
     });
 
     final stackIndex = useState(-1);
-    final stack = showStack && currentAsset.stackChildrenCount > 0
+    final stack = showStack && currentAsset.stackCount > 0
         ? ref.watch(assetStackStateProvider(currentAsset))
         : <Asset>[];
     final stackElements = showStack ? [currentAsset, ...stack] : <Asset>[];

mobile/lib/providers/asset.provider.dart

@@ -360,7 +360,7 @@ QueryBuilder<Asset, Asset, QAfterSortBy>? getRemoteAssetQuery(WidgetRef ref) {
       .filter()
       .ownerIdEqualTo(userId)
       .isTrashedEqualTo(false)
-      .stackParentIdIsNull()
+      .stackPrimaryAssetIdIsNull()
       .sortByFileCreatedAtDesc();
 }
 
@@ -374,6 +374,6 @@ QueryBuilder<Asset, Asset, QAfterSortBy> _commonFilterAndSort(
       .filter()
       .isArchivedEqualTo(false)
       .isTrashedEqualTo(false)
-      .stackParentIdIsNull()
+      .stackPrimaryAssetIdIsNull()
       .sortByFileCreatedAtDesc();
 }

mobile/lib/providers/asset_viewer/asset_stack.provider.dart

@@ -48,7 +48,7 @@ final assetStackProvider =
       .filter()
       .isArchivedEqualTo(false)
       .isTrashedEqualTo(false)
-      .stackParentIdEqualTo(asset.remoteId)
+      .stackPrimaryAssetIdEqualTo(asset.remoteId)
       .sortByFileCreatedAtDesc()
       .findAll();
 });

mobile/lib/services/api.service.dart

@@ -29,6 +29,7 @@ class ApiService implements Authentication {
   late ActivitiesApi activitiesApi;
   late DownloadApi downloadApi;
   late TrashApi trashApi;
+  late StacksApi stacksApi;
 
   ApiService() {
     final endpoint = Store.tryGet(StoreKey.serverEndpoint);
@@ -61,6 +62,7 @@ class ApiService implements Authentication {
     activitiesApi = ActivitiesApi(_apiClient);
     downloadApi = DownloadApi(_apiClient);
     trashApi = TrashApi(_apiClient);
+    stacksApi = StacksApi(_apiClient);
   }
 
   Future<String> resolveAndSetEndpoint(String serverUrl) async {

mobile/lib/services/asset_stack.service.dart

@@ -1,72 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:immich_mobile/entities/asset.entity.dart';
-import 'package:immich_mobile/providers/api.provider.dart';
-import 'package:immich_mobile/services/api.service.dart';
-import 'package:openapi/api.dart';
-
-class AssetStackService {
-  AssetStackService(this._api);
-
-  final ApiService _api;
-
-  Future<void> updateStack(
-    Asset parentAsset, {
-    List<Asset>? childrenToAdd,
-    List<Asset>? childrenToRemove,
-  }) async {
-    // Guard [local asset]
-    if (parentAsset.remoteId == null) {
-      return;
-    }
-
-    try {
-      if (childrenToAdd != null) {
-        final toAdd = childrenToAdd
-            .where((e) => e.isRemote)
-            .map((e) => e.remoteId!)
-            .toList();
-
-        await _api.assetsApi.updateAssets(
-          AssetBulkUpdateDto(ids: toAdd, stackParentId: parentAsset.remoteId),
-        );
-      }
-
-      if (childrenToRemove != null) {
-        final toRemove = childrenToRemove
-            .where((e) => e.isRemote)
-            .map((e) => e.remoteId!)
-            .toList();
-        await _api.assetsApi.updateAssets(
-          AssetBulkUpdateDto(ids: toRemove, removeParent: true),
-        );
-      }
-    } catch (error) {
-      debugPrint("Error while updating stack children: ${error.toString()}");
-    }
-  }
-
-  Future<void> updateStackParent(Asset oldParent, Asset newParent) async {
-    // Guard [local asset]
-    if (oldParent.remoteId == null || newParent.remoteId == null) {
-      return;
-    }
-
-    try {
-      await _api.assetsApi.updateStackParent(
-        UpdateStackParentDto(
-          oldParentId: oldParent.remoteId!,
-          newParentId: newParent.remoteId!,
-        ),
-      );
-    } catch (error) {
-      debugPrint("Error while updating stack parent: ${error.toString()}");
-    }
-  }
-}
-
-final assetStackServiceProvider = Provider(
-  (ref) => AssetStackService(
-    ref.watch(apiServiceProvider),
-  ),
-);

mobile/lib/services/stack.service.dart

@@ -0,0 +1,79 @@
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/entities/asset.entity.dart';
+import 'package:immich_mobile/providers/api.provider.dart';
+import 'package:immich_mobile/providers/db.provider.dart';
+import 'package:immich_mobile/services/api.service.dart';
+import 'package:isar/isar.dart';
+import 'package:openapi/api.dart';
+
+class StackService {
+  StackService(this._api, this._db);
+
+  final ApiService _api;
+  final Isar _db;
+
+  Future<StackResponseDto?> getStack(String stackId) async {
+    try {
+      return _api.stacksApi.getStack(stackId);
+    } catch (error) {
+      debugPrint("Error while fetching stack: $error");
+    }
+    return null;
+  }
+
+  Future<StackResponseDto?> createStack(List<String> assetIds) async {
+    try {
+      return _api.stacksApi.createStack(
+        StackCreateDto(assetIds: assetIds),
+      );
+    } catch (error) {
+      debugPrint("Error while creating stack: $error");
+    }
+    return null;
+  }
+
+  Future<StackResponseDto?> updateStack(
+    String stackId,
+    String primaryAssetId,
+  ) async {
+    try {
+      return await _api.stacksApi.updateStack(
+        stackId,
+        StackUpdateDto(primaryAssetId: primaryAssetId),
+      );
+    } catch (error) {
+      debugPrint("Error while updating stack children: $error");
+    }
+    return null;
+  }
+
+  Future<void> deleteStack(String stackId, List<Asset> assets) async {
+    try {
+      await _api.stacksApi.deleteStack(stackId);
+
+      // Update local database to trigger rerendering
+      final List<Asset> removeAssets = [];
+      for (final asset in assets) {
+        asset.stackId = null;
+        asset.stackPrimaryAssetId = null;
+        asset.stackCount = 0;
+
+        removeAssets.add(asset);
+      }
+
+      _db.writeTxn(() async {
+        await _db.assets.putAll(removeAssets);
+      });
+    } catch (error) {
+      debugPrint("Error while deleting stack: $error");
+    }
+  }
+}
+
+final stackServiceProvider = Provider(
+  (ref) => StackService(
+    ref.watch(apiServiceProvider),
+    ref.watch(dbProvider),
+  ),
+);

mobile/lib/widgets/asset_grid/multiselect_grid.dart

@@ -11,7 +11,7 @@ import 'package:immich_mobile/extensions/collection_extensions.dart';
 import 'package:immich_mobile/providers/album/album.provider.dart';
 import 'package:immich_mobile/providers/album/shared_album.provider.dart';
 import 'package:immich_mobile/services/album.service.dart';
-import 'package:immich_mobile/services/asset_stack.service.dart';
+import 'package:immich_mobile/services/stack.service.dart';
 import 'package:immich_mobile/providers/backup/manual_upload.provider.dart';
 import 'package:immich_mobile/models/asset_selection_state.dart';
 import 'package:immich_mobile/providers/multiselect.provider.dart';
@@ -344,11 +344,9 @@ class MultiselectGrid extends HookConsumerWidget {
         if (!selectionEnabledHook.value || selection.value.length < 2) {
           return;
         }
-        final parent = selection.value.elementAt(0);
+
-        selection.value.remove(parent);
+        await ref.read(stackServiceProvider).createStack(
-        await ref.read(assetStackServiceProvider).updateStack(
+              selection.value.map((e) => e.remoteId!).toList(),
-              parent,
-              childrenToAdd: selection.value.toList(),
             );
       } finally {
         processing.value = false;

mobile/lib/widgets/asset_grid/thumbnail_image.dart

@@ -107,16 +107,16 @@ class ThumbnailImage extends ConsumerWidget {
         right: 8,
         child: Row(
           children: [
-            if (asset.stackChildrenCount > 1)
+            if (asset.stackCount > 1)
               Text(
-                "${asset.stackChildrenCount}",
+                "${asset.stackCount}",
                 style: const TextStyle(
                   color: Colors.white,
                   fontSize: 10,
                   fontWeight: FontWeight.bold,
                 ),
               ),
-            if (asset.stackChildrenCount > 1)
+            if (asset.stackCount > 1)
               const SizedBox(
                 width: 3,
               ),
@@ -208,7 +208,7 @@ class ThumbnailImage extends ConsumerWidget {
             ),
           ),
         if (!asset.isImage) buildVideoIcon(),
-        if (asset.stackChildrenCount > 0) buildStackIcon(),
+        if (asset.stackCount > 0) buildStackIcon(),
       ],
     );
   }

mobile/lib/widgets/asset_viewer/bottom_gallery_bar.dart

@@ -11,7 +11,7 @@ import 'package:immich_mobile/providers/album/shared_album.provider.dart';
 import 'package:immich_mobile/providers/asset_viewer/asset_stack.provider.dart';
 import 'package:immich_mobile/providers/asset_viewer/image_viewer_page_state.provider.dart';
 import 'package:immich_mobile/providers/asset_viewer/show_controls.provider.dart';
-import 'package:immich_mobile/services/asset_stack.service.dart';
+import 'package:immich_mobile/services/stack.service.dart';
 import 'package:immich_mobile/widgets/asset_grid/asset_grid_data_structure.dart';
 import 'package:immich_mobile/widgets/asset_viewer/video_controls.dart';
 import 'package:immich_mobile/widgets/asset_grid/delete_dialog.dart';
@@ -49,11 +49,10 @@ class BottomGalleryBar extends ConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     final isOwner = asset.ownerId == ref.watch(currentUserProvider)?.isarId;
 
-    final stack = showStack && asset.stackChildrenCount > 0
+    final stackItems = showStack && asset.stackCount > 0
         ? ref.watch(assetStackStateProvider(asset))
         : <Asset>[];
-    final stackElements = showStack ? [asset, ...stack] : <Asset>[];
+    bool isStackPrimaryAsset = asset.stackPrimaryAssetId == null;
-    bool isParent = stackIndex == -1 || stackIndex == 0;
     final navStack = AutoRouter.of(context).stackData;
     final isTrashEnabled =
         ref.watch(serverInfoProvider.select((v) => v.serverFeatures.trash));
@@ -76,7 +75,7 @@ class BottomGalleryBar extends ConsumerWidget {
           {asset},
           force: force,
         );
-        if (isDeleted && isParent) {
+        if (isDeleted && isStackPrimaryAsset) {
           // Workaround for asset remaining in the gallery
           renderList.deleteAsset(asset);
 
@@ -98,7 +97,7 @@ class BottomGalleryBar extends ConsumerWidget {
         final isDeleted = await onDelete(false);
         if (isDeleted) {
           // Can only trash assets stored in server. Local assets are always permanently removed for now
-          if (context.mounted && asset.isRemote && isParent) {
+          if (context.mounted && asset.isRemote && isStackPrimaryAsset) {
             ImmichToast.show(
               durationInSecond: 1,
               context: context,
@@ -127,6 +126,16 @@ class BottomGalleryBar extends ConsumerWidget {
       );
     }
 
+    unStack() async {
+      if (asset.stackId == null) {
+        return;
+      }
+
+      await ref
+          .read(stackServiceProvider)
+          .deleteStack(asset.stackId!, [asset, ...stackItems]);
+    }
+
     void showStackActionItems() {
       showModalBottomSheet<void>(
         context: context,
@@ -138,74 +147,13 @@ class BottomGalleryBar extends ConsumerWidget {
               child: Column(
                 mainAxisSize: MainAxisSize.min,
                 children: [
-                  if (!isParent)
-                    ListTile(
-                      leading: const Icon(
-                        Icons.bookmark_border_outlined,
-                        size: 24,
-                      ),
-                      onTap: () async {
-                        await ref
-                            .read(assetStackServiceProvider)
-                            .updateStackParent(
-                              asset,
-                              stackElements.elementAt(stackIndex),
-                            );
-                        ctx.pop();
-                        context.maybePop();
-                      },
-                      title: const Text(
-                        "viewer_stack_use_as_main_asset",
-                        style: TextStyle(fontWeight: FontWeight.bold),
-                      ).tr(),
-                    ),
-                  ListTile(
-                    leading: const Icon(
-                      Icons.copy_all_outlined,
-                      size: 24,
-                    ),
-                    onTap: () async {
-                      if (isParent) {
-                        await ref
-                            .read(assetStackServiceProvider)
-                            .updateStackParent(
-                              asset,
-                              stackElements
-                                  .elementAt(1), // Next asset as parent
-                            );
-                        // Remove itself from stack
-                        await ref.read(assetStackServiceProvider).updateStack(
-                          stackElements.elementAt(1),
-                          childrenToRemove: [asset],
-                        );
-                        ctx.pop();
-                        context.maybePop();
-                      } else {
-                        await ref.read(assetStackServiceProvider).updateStack(
-                          asset,
-                          childrenToRemove: [
-                            stackElements.elementAt(stackIndex),
-                          ],
-                        );
-                        removeAssetFromStack();
-                        ctx.pop();
-                      }
-                    },
-                    title: const Text(
-                      "viewer_remove_from_stack",
-                      style: TextStyle(fontWeight: FontWeight.bold),
-                    ).tr(),
-                  ),
                   ListTile(
                     leading: const Icon(
                       Icons.filter_none_outlined,
                       size: 18,
                     ),
                     onTap: () async {
-                      await ref.read(assetStackServiceProvider).updateStack(
+                      await unStack();
-                            asset,
-                            childrenToRemove: stack,
-                          );
                       ctx.pop();
                       context.maybePop();
                     },
@@ -255,7 +203,7 @@ class BottomGalleryBar extends ConsumerWidget {
 
     handleArchive() {
       ref.read(assetProvider.notifier).toggleArchive([asset]);
-      if (isParent) {
+      if (isStackPrimaryAsset) {
         context.maybePop();
         return;
       }
@@ -346,7 +294,7 @@ class BottomGalleryBar extends ConsumerWidget {
                   tooltip: 'control_bottom_app_bar_archive'.tr(),
                 ): (_) => handleArchive(),
         },
-      if (isOwner && stack.isNotEmpty)
+      if (isOwner && asset.stackCount > 0)
         {
           BottomNavigationBarItem(
             icon: const Icon(Icons.burst_mode_outlined),

mobile/test/fixtures/asset.stub.dart

@@ -17,7 +17,6 @@ final class AssetStub {
     isFavorite: true,
     isArchived: false,
     isTrashed: false,
-    stackCount: 0,
   );
 
   static final image2 = Asset(
@@ -34,6 +33,5 @@ final class AssetStub {
     isFavorite: false,
     isArchived: false,
     isTrashed: false,
-    stackCount: 0,
   );
 }

mobile/test/modules/extensions/asset_extensions_test.dart

@@ -34,7 +34,6 @@ Asset makeAsset({
     isFavorite: false,
     isArchived: false,
     isTrashed: false,
-    stackCount: 0,
     exifInfo: exifInfo,
   );
 }

mobile/test/modules/home/asset_grid_data_structure_test.dart

@@ -25,7 +25,6 @@ void main() {
         isFavorite: false,
         isArchived: false,
         isTrashed: false,
-        stackCount: 0,
       ),
     );
   }

mobile/test/modules/shared/sync_service_test.dart

@@ -32,7 +32,6 @@ void main() {
       isFavorite: false,
       isArchived: false,
       isTrashed: false,
-      stackCount: 0,
     );
   }
 

open-api/immich-openapi-specs.json

@@ -1689,41 +1689,6 @@
         ]
       }
     },
-    "/assets/stack/parent": {
-      "put": {
-        "operationId": "updateStackParent",
-        "parameters": [],
-        "requestBody": {
-          "content": {
-            "application/json": {
-              "schema": {
-                "$ref": "#/components/schemas/UpdateStackParentDto"
-              }
-            }
-          },
-          "required": true
-        },
-        "responses": {
-          "200": {
-            "description": ""
-          }
-        },
-        "security": [
-          {
-            "bearer": []
-          },
-          {
-            "cookie": []
-          },
-          {
-            "api_key": []
-          }
-        ],
-        "tags": [
-          "Assets"
-        ]
-      }
-    },
     "/assets/statistics": {
       "get": {
         "operationId": "getAssetStatistics",
@@ -5655,6 +5620,248 @@
         ]
       }
     },
+    "/stacks": {
+      "delete": {
+        "operationId": "deleteStacks",
+        "parameters": [],
+        "requestBody": {
+          "content": {
+            "application/json": {
+              "schema": {
+                "$ref": "#/components/schemas/BulkIdsDto"
+              }
+            }
+          },
+          "required": true
+        },
+        "responses": {
+          "204": {
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Stacks"
+        ]
+      },
+      "get": {
+        "operationId": "searchStacks",
+        "parameters": [
+          {
+            "name": "primaryAssetId",
+            "required": false,
+            "in": "query",
+            "schema": {
+              "type": "string"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "items": {
+                    "$ref": "#/components/schemas/StackResponseDto"
+                  },
+                  "type": "array"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Stacks"
+        ]
+      },
+      "post": {
+        "operationId": "createStack",
+        "parameters": [],
+        "requestBody": {
+          "content": {
+            "application/json": {
+              "schema": {
+                "$ref": "#/components/schemas/StackCreateDto"
+              }
+            }
+          },
+          "required": true
+        },
+        "responses": {
+          "201": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/StackResponseDto"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Stacks"
+        ]
+      }
+    },
+    "/stacks/{id}": {
+      "delete": {
+        "operationId": "deleteStack",
+        "parameters": [
+          {
+            "name": "id",
+            "required": true,
+            "in": "path",
+            "schema": {
+              "format": "uuid",
+              "type": "string"
+            }
+          }
+        ],
+        "responses": {
+          "204": {
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Stacks"
+        ]
+      },
+      "get": {
+        "operationId": "getStack",
+        "parameters": [
+          {
+            "name": "id",
+            "required": true,
+            "in": "path",
+            "schema": {
+              "format": "uuid",
+              "type": "string"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/StackResponseDto"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Stacks"
+        ]
+      },
+      "put": {
+        "operationId": "updateStack",
+        "parameters": [
+          {
+            "name": "id",
+            "required": true,
+            "in": "path",
+            "schema": {
+              "format": "uuid",
+              "type": "string"
+            }
+          }
+        ],
+        "requestBody": {
+          "content": {
+            "application/json": {
+              "schema": {
+                "$ref": "#/components/schemas/StackUpdateDto"
+              }
+            }
+          },
+          "required": true
+        },
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/StackResponseDto"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Stacks"
+        ]
+      }
+    },
     "/sync/delta-sync": {
       "post": {
         "operationId": "getDeltaSync",
@@ -7570,13 +7777,6 @@
             "maximum": 5,
             "minimum": 0,
             "type": "number"
-          },
-          "removeParent": {
-            "type": "boolean"
-          },
-          "stackParentId": {
-            "format": "uuid",
-            "type": "string"
           }
         },
         "required": [
@@ -8117,18 +8317,12 @@
             "$ref": "#/components/schemas/SmartInfoResponseDto"
           },
           "stack": {
-            "items": {
+            "allOf": [
-              "$ref": "#/components/schemas/AssetResponseDto"
+              {
-            },
+                "$ref": "#/components/schemas/AssetStackResponseDto"
-            "type": "array"
+              }
-          },
+            ],
-          "stackCount": {
+            "nullable": true
-            "nullable": true,
-            "type": "integer"
-          },
-          "stackParentId": {
-            "nullable": true,
-            "type": "string"
           },
           "tags": {
             "items": {
@@ -8172,13 +8366,31 @@
           "originalPath",
           "ownerId",
           "resized",
-          "stackCount",
           "thumbhash",
           "type",
           "updatedAt"
         ],
         "type": "object"
       },
+      "AssetStackResponseDto": {
+        "properties": {
+          "assetCount": {
+            "type": "integer"
+          },
+          "id": {
+            "type": "string"
+          },
+          "primaryAssetId": {
+            "type": "string"
+          }
+        },
+        "required": [
+          "assetCount",
+          "id",
+          "primaryAssetId"
+        ],
+        "type": "object"
+      },
       "AssetStatsResponseDto": {
         "properties": {
           "images": {
@@ -9806,6 +10018,10 @@
           "sharedLink.read",
           "sharedLink.update",
           "sharedLink.delete",
+          "stack.create",
+          "stack.read",
+          "stack.update",
+          "stack.delete",
           "systemConfig.read",
           "systemConfig.update",
           "systemMetadata.read",
@@ -10882,6 +11098,53 @@
         ],
         "type": "object"
       },
+      "StackCreateDto": {
+        "properties": {
+          "assetIds": {
+            "description": "first asset becomes the primary",
+            "items": {
+              "format": "uuid",
+              "type": "string"
+            },
+            "type": "array"
+          }
+        },
+        "required": [
+          "assetIds"
+        ],
+        "type": "object"
+      },
+      "StackResponseDto": {
+        "properties": {
+          "assets": {
+            "items": {
+              "$ref": "#/components/schemas/AssetResponseDto"
+            },
+            "type": "array"
+          },
+          "id": {
+            "type": "string"
+          },
+          "primaryAssetId": {
+            "type": "string"
+          }
+        },
+        "required": [
+          "assets",
+          "id",
+          "primaryAssetId"
+        ],
+        "type": "object"
+      },
+      "StackUpdateDto": {
+        "properties": {
+          "primaryAssetId": {
+            "format": "uuid",
+            "type": "string"
+          }
+        },
+        "type": "object"
+      },
       "SystemConfigDto": {
         "properties": {
           "ffmpeg": {
@@ -11735,23 +11998,6 @@
         ],
         "type": "object"
       },
-      "UpdateStackParentDto": {
-        "properties": {
-          "newParentId": {
-            "format": "uuid",
-            "type": "string"
-          },
-          "oldParentId": {
-            "format": "uuid",
-            "type": "string"
-          }
-        },
-        "required": [
-          "newParentId",
-          "oldParentId"
-        ],
-        "type": "object"
-      },
       "UpdateTagDto": {
         "properties": {
           "name": {

open-api/typescript-sdk/src/fetch-client.ts

@@ -192,6 +192,11 @@ export type SmartInfoResponseDto = {
     objects?: string[] | null;
     tags?: string[] | null;
 };
+export type AssetStackResponseDto = {
+    assetCount: number;
+    id: string;
+    primaryAssetId: string;
+};
 export type TagResponseDto = {
     id: string;
     name: string;
@@ -226,9 +231,7 @@ export type AssetResponseDto = {
     people?: PersonWithFacesResponseDto[];
     resized: boolean;
     smartInfo?: SmartInfoResponseDto;
-    stack?: AssetResponseDto[];
+    stack?: (AssetStackResponseDto) | null;
-    stackCount: number | null;
-    stackParentId?: string | null;
     tags?: TagResponseDto[];
     thumbhash: string | null;
     "type": AssetTypeEnum;
@@ -344,8 +347,6 @@ export type AssetBulkUpdateDto = {
     latitude?: number;
     longitude?: number;
     rating?: number;
-    removeParent?: boolean;
-    stackParentId?: string;
 };
 export type AssetBulkUploadCheckItem = {
     /** base64 or hex encoded sha1 hash */
@@ -379,10 +380,6 @@ export type MemoryLaneResponseDto = {
     assets: AssetResponseDto[];
     yearsAgo: number;
 };
-export type UpdateStackParentDto = {
-    newParentId: string;
-    oldParentId: string;
-};
 export type AssetStatsResponseDto = {
     images: number;
     total: number;
@@ -973,6 +970,18 @@ export type AssetIdsResponseDto = {
     error?: Error2;
     success: boolean;
 };
+export type StackResponseDto = {
+    assets: AssetResponseDto[];
+    id: string;
+    primaryAssetId: string;
+};
+export type StackCreateDto = {
+    /** first asset becomes the primary */
+    assetIds: string[];
+};
+export type StackUpdateDto = {
+    primaryAssetId?: string;
+};
 export type AssetDeltaSyncDto = {
     updatedAfter: string;
     userIds: string[];
@@ -1632,15 +1641,6 @@ export function getRandom({ count }: {
         ...opts
     }));
 }
-export function updateStackParent({ updateStackParentDto }: {
-    updateStackParentDto: UpdateStackParentDto;
-}, opts?: Oazapfts.RequestOpts) {
-    return oazapfts.ok(oazapfts.fetchText("/assets/stack/parent", oazapfts.json({
-        ...opts,
-        method: "PUT",
-        body: updateStackParentDto
-    })));
-}
 export function getAssetStatistics({ isArchived, isFavorite, isTrashed }: {
     isArchived?: boolean;
     isFavorite?: boolean;
@@ -2706,6 +2706,70 @@ export function addSharedLinkAssets({ id, key, assetIdsDto }: {
         body: assetIdsDto
     })));
 }
+export function deleteStacks({ bulkIdsDto }: {
+    bulkIdsDto: BulkIdsDto;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchText("/stacks", oazapfts.json({
+        ...opts,
+        method: "DELETE",
+        body: bulkIdsDto
+    })));
+}
+export function searchStacks({ primaryAssetId }: {
+    primaryAssetId?: string;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchJson<{
+        status: 200;
+        data: StackResponseDto[];
+    }>(`/stacks${QS.query(QS.explode({
+        primaryAssetId
+    }))}`, {
+        ...opts
+    }));
+}
+export function createStack({ stackCreateDto }: {
+    stackCreateDto: StackCreateDto;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchJson<{
+        status: 201;
+        data: StackResponseDto;
+    }>("/stacks", oazapfts.json({
+        ...opts,
+        method: "POST",
+        body: stackCreateDto
+    })));
+}
+export function deleteStack({ id }: {
+    id: string;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchText(`/stacks/${encodeURIComponent(id)}`, {
+        ...opts,
+        method: "DELETE"
+    }));
+}
+export function getStack({ id }: {
+    id: string;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchJson<{
+        status: 200;
+        data: StackResponseDto;
+    }>(`/stacks/${encodeURIComponent(id)}`, {
+        ...opts
+    }));
+}
+export function updateStack({ id, stackUpdateDto }: {
+    id: string;
+    stackUpdateDto: StackUpdateDto;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchJson<{
+        status: 200;
+        data: StackResponseDto;
+    }>(`/stacks/${encodeURIComponent(id)}`, oazapfts.json({
+        ...opts,
+        method: "PUT",
+        body: stackUpdateDto
+    })));
+}
 export function getDeltaSync({ assetDeltaSyncDto }: {
     assetDeltaSyncDto: AssetDeltaSyncDto;
 }, opts?: Oazapfts.RequestOpts) {
@@ -3187,6 +3251,10 @@ export enum Permission {
     SharedLinkRead = "sharedLink.read",
     SharedLinkUpdate = "sharedLink.update",
     SharedLinkDelete = "sharedLink.delete",
+    StackCreate = "stack.create",
+    StackRead = "stack.read",
+    StackUpdate = "stack.update",
+    StackDelete = "stack.delete",
     SystemConfigRead = "systemConfig.read",
     SystemConfigUpdate = "systemConfig.update",
     SystemMetadataRead = "systemMetadata.read",

server/src/controllers/asset.controller.ts

@@ -13,7 +13,6 @@ import {
 } from 'src/dtos/asset.dto';
 import { AuthDto } from 'src/dtos/auth.dto';
 import { MemoryLaneDto } from 'src/dtos/search.dto';
-import { UpdateStackParentDto } from 'src/dtos/stack.dto';
 import { Auth, Authenticated } from 'src/middleware/auth.guard';
 import { Route } from 'src/middleware/file-upload.interceptor';
 import { AssetService } from 'src/services/asset.service';
@@ -72,13 +71,6 @@ export class AssetController {
     return this.service.deleteAll(auth, dto);
   }
 
-  @Put('stack/parent')
-  @HttpCode(HttpStatus.OK)
-  @Authenticated()
-  updateStackParent(@Auth() auth: AuthDto, @Body() dto: UpdateStackParentDto): Promise<void> {
-    return this.service.updateStackParent(auth, dto);
-  }
-
   @Get(':id')
   @Authenticated({ sharedLink: true })
   getAssetInfo(@Auth() auth: AuthDto, @Param() { id }: UUIDParamDto): Promise<AssetResponseDto> {

server/src/controllers/index.ts

@@ -23,6 +23,7 @@ import { ServerInfoController } from 'src/controllers/server-info.controller';
 import { ServerController } from 'src/controllers/server.controller';
 import { SessionController } from 'src/controllers/session.controller';
 import { SharedLinkController } from 'src/controllers/shared-link.controller';
+import { StackController } from 'src/controllers/stack.controller';
 import { SyncController } from 'src/controllers/sync.controller';
 import { SystemConfigController } from 'src/controllers/system-config.controller';
 import { SystemMetadataController } from 'src/controllers/system-metadata.controller';
@@ -58,6 +59,7 @@ export const controllers = [
   ServerInfoController,
   SessionController,
   SharedLinkController,
+  StackController,
   SyncController,
   SystemConfigController,
   SystemMetadataController,

server/src/controllers/stack.controller.ts

@@ -0,0 +1,57 @@
+import { Body, Controller, Delete, Get, HttpCode, HttpStatus, Param, Post, Put, Query } from '@nestjs/common';
+import { ApiTags } from '@nestjs/swagger';
+import { BulkIdsDto } from 'src/dtos/asset-ids.response.dto';
+import { AuthDto } from 'src/dtos/auth.dto';
+import { StackCreateDto, StackResponseDto, StackSearchDto, StackUpdateDto } from 'src/dtos/stack.dto';
+import { Permission } from 'src/enum';
+import { Auth, Authenticated } from 'src/middleware/auth.guard';
+import { StackService } from 'src/services/stack.service';
+import { UUIDParamDto } from 'src/validation';
+
+@ApiTags('Stacks')
+@Controller('stacks')
+export class StackController {
+  constructor(private service: StackService) {}
+
+  @Get()
+  @Authenticated({ permission: Permission.STACK_READ })
+  searchStacks(@Auth() auth: AuthDto, @Query() query: StackSearchDto): Promise<StackResponseDto[]> {
+    return this.service.search(auth, query);
+  }
+
+  @Post()
+  @Authenticated({ permission: Permission.STACK_CREATE })
+  createStack(@Auth() auth: AuthDto, @Body() dto: StackCreateDto): Promise<StackResponseDto> {
+    return this.service.create(auth, dto);
+  }
+
+  @Delete()
+  @HttpCode(HttpStatus.NO_CONTENT)
+  @Authenticated({ permission: Permission.STACK_DELETE })
+  deleteStacks(@Auth() auth: AuthDto, @Body() dto: BulkIdsDto): Promise<void> {
+    return this.service.deleteAll(auth, dto);
+  }
+
+  @Get(':id')
+  @Authenticated({ permission: Permission.STACK_READ })
+  getStack(@Auth() auth: AuthDto, @Param() { id }: UUIDParamDto): Promise<StackResponseDto> {
+    return this.service.get(auth, id);
+  }
+
+  @Put(':id')
+  @Authenticated({ permission: Permission.STACK_UPDATE })
+  updateStack(
+    @Auth() auth: AuthDto,
+    @Param() { id }: UUIDParamDto,
+    @Body() dto: StackUpdateDto,
+  ): Promise<StackResponseDto> {
+    return this.service.update(auth, id, dto);
+  }
+
+  @Delete(':id')
+  @HttpCode(HttpStatus.NO_CONTENT)
+  @Authenticated({ permission: Permission.STACK_DELETE })
+  deleteStack(@Auth() auth: AuthDto, @Param() { id }: UUIDParamDto): Promise<void> {
+    return this.service.delete(auth, id);
+  }
+}

server/src/cores/access.core.ts

@@ -292,6 +292,18 @@ export class AccessCore {
         return await this.repository.partner.checkUpdateAccess(auth.user.id, ids);
       }
 
+      case Permission.STACK_READ: {
+        return this.repository.stack.checkOwnerAccess(auth.user.id, ids);
+      }
+
+      case Permission.STACK_UPDATE: {
+        return this.repository.stack.checkOwnerAccess(auth.user.id, ids);
+      }
+
+      case Permission.STACK_DELETE: {
+        return this.repository.stack.checkOwnerAccess(auth.user.id, ids);
+      }
+
       default: {
         return new Set();
       }

server/src/dtos/asset-response.dto.ts

@@ -52,13 +52,19 @@ export class AssetResponseDto extends SanitizedAssetResponseDto {
   unassignedFaces?: AssetFaceWithoutPersonResponseDto[];
   /**base64 encoded sha1 hash */
   checksum!: string;
-  stackParentId?: string | null;
+  stack?: AssetStackResponseDto | null;
-  stack?: AssetResponseDto[];
-  @ApiProperty({ type: 'integer' })
-  stackCount!: number | null;
   duplicateId?: string | null;
 }
 
+export class AssetStackResponseDto {
+  id!: string;
+
+  primaryAssetId!: string;
+
+  @ApiProperty({ type: 'integer' })
+  assetCount!: number;
+}
+
 export type AssetMapOptions = {
   stripMetadata?: boolean;
   withStack?: boolean;
@@ -83,6 +89,18 @@ const peopleWithFaces = (faces: AssetFaceEntity[]): PersonWithFacesResponseDto[]
   return result;
 };
 
+const mapStack = (entity: AssetEntity) => {
+  if (!entity.stack) {
+    return null;
+  }
+
+  return {
+    id: entity.stack.id,
+    primaryAssetId: entity.stack.primaryAssetId,
+    assetCount: entity.stack.assetCount ?? entity.stack.assets.length,
+  };
+};
+
 export function mapAsset(entity: AssetEntity, options: AssetMapOptions = {}): AssetResponseDto {
   const { stripMetadata = false, withStack = false } = options;
 
@@ -129,13 +147,7 @@ export function mapAsset(entity: AssetEntity, options: AssetMapOptions = {}): As
     people: peopleWithFaces(entity.faces),
     unassignedFaces: entity.faces?.filter((face) => !face.person).map((a) => mapFacesWithoutPerson(a)),
     checksum: entity.checksum.toString('base64'),
-    stackParentId: withStack ? entity.stack?.primaryAssetId : undefined,
+    stack: withStack ? mapStack(entity) : undefined,
-    stack: withStack
-      ? entity.stack?.assets
-          ?.filter((a) => a.id !== entity.stack?.primaryAssetId)
-          ?.map((a) => mapAsset(a, { stripMetadata, auth: options.auth }))
-      : undefined,
-    stackCount: entity.stack?.assetCount ?? entity.stack?.assets?.length ?? null,
     isOffline: entity.isOffline,
     hasMetadata: true,
     duplicateId: entity.duplicateId,

server/src/dtos/asset.dto.ts

@@ -60,12 +60,6 @@ export class AssetBulkUpdateDto extends UpdateAssetBase {
   @ValidateUUID({ each: true })
   ids!: string[];
 
-  @ValidateUUID({ optional: true })
-  stackParentId?: string;
-
-  @ValidateBoolean({ optional: true })
-  removeParent?: boolean;
-
   @Optional()
   duplicateId?: string | null;
 }

server/src/dtos/stack.dto.ts

@@ -1,9 +1,38 @@
+import { ArrayMinSize } from 'class-validator';
+import { AssetResponseDto, mapAsset } from 'src/dtos/asset-response.dto';
+import { AuthDto } from 'src/dtos/auth.dto';
+import { StackEntity } from 'src/entities/stack.entity';
 import { ValidateUUID } from 'src/validation';
 
-export class UpdateStackParentDto {
+export class StackCreateDto {
-  @ValidateUUID()
+  /** first asset becomes the primary */
-  oldParentId!: string;
+  @ValidateUUID({ each: true })
-
+  @ArrayMinSize(2)
-  @ValidateUUID()
+  assetIds!: string[];
-  newParentId!: string;
 }
+
+export class StackSearchDto {
+  primaryAssetId?: string;
+}
+
+export class StackUpdateDto {
+  @ValidateUUID({ optional: true })
+  primaryAssetId?: string;
+}
+
+export class StackResponseDto {
+  id!: string;
+  primaryAssetId!: string;
+  assets!: AssetResponseDto[];
+}
+
+export const mapStack = (stack: StackEntity, { auth }: { auth?: AuthDto }) => {
+  const primary = stack.assets.filter((asset) => asset.id === stack.primaryAssetId);
+  const others = stack.assets.filter((asset) => asset.id !== stack.primaryAssetId);
+
+  return {
+    id: stack.id,
+    primaryAssetId: stack.primaryAssetId,
+    assets: [...primary, ...others].map((asset) => mapAsset(asset, { auth })),
+  };
+};

server/src/enum.ts

@@ -107,6 +107,11 @@ export enum Permission {
   SHARED_LINK_UPDATE = 'sharedLink.update',
   SHARED_LINK_DELETE = 'sharedLink.delete',
 
+  STACK_CREATE = 'stack.create',
+  STACK_READ = 'stack.read',
+  STACK_UPDATE = 'stack.update',
+  STACK_DELETE = 'stack.delete',
+
   SYSTEM_CONFIG_READ = 'systemConfig.read',
   SYSTEM_CONFIG_UPDATE = 'systemConfig.update',
 

server/src/interfaces/access.interface.ts

@@ -42,4 +42,8 @@ export interface IAccessRepository {
   partner: {
     checkUpdateAccess(userId: string, partnerIds: Set<string>): Promise<Set<string>>;
   };
+
+  stack: {
+    checkOwnerAccess(userId: string, stackIds: Set<string>): Promise<Set<string>>;
+  };
 }

server/src/interfaces/stack.interface.ts

@@ -2,9 +2,16 @@ import { StackEntity } from 'src/entities/stack.entity';
 
 export const IStackRepository = 'IStackRepository';
 
+export interface StackSearch {
+  ownerId: string;
+  primaryAssetId?: string;
+}
+
 export interface IStackRepository {
-  create(stack: Partial<StackEntity> & { ownerId: string }): Promise<StackEntity>;
+  search(query: StackSearch): Promise<StackEntity[]>;
+  create(stack: { ownerId: string; assetIds: string[] }): Promise<StackEntity>;
   update(stack: Pick<StackEntity, 'id'> & Partial<StackEntity>): Promise<StackEntity>;
   delete(id: string): Promise<void>;
+  deleteAll(ids: string[]): Promise<void>;
   getById(id: string): Promise<StackEntity | null>;
 }

server/src/queries/access.repository.sql

@@ -248,6 +248,17 @@ WHERE
   "partner"."sharedById" IN ($1)
   AND "partner"."sharedWithId" = $2
 
+-- AccessRepository.stack.checkOwnerAccess
+SELECT
+  "StackEntity"."id" AS "StackEntity_id"
+FROM
+  "asset_stack" "StackEntity"
+WHERE
+  (
+    ("StackEntity"."id" IN ($1))
+    AND ("StackEntity"."ownerId" = $2)
+  )
+
 -- AccessRepository.timeline.checkPartnerAccess
 SELECT
   "partner"."sharedById" AS "partner_sharedById",

server/src/repositories/access.repository.ts

@@ -11,6 +11,7 @@ import { PartnerEntity } from 'src/entities/partner.entity';
 import { PersonEntity } from 'src/entities/person.entity';
 import { SessionEntity } from 'src/entities/session.entity';
 import { SharedLinkEntity } from 'src/entities/shared-link.entity';
+import { StackEntity } from 'src/entities/stack.entity';
 import { AlbumUserRole } from 'src/enum';
 import { IAccessRepository } from 'src/interfaces/access.interface';
 import { Instrumentation } from 'src/utils/instrumentation';
@@ -20,10 +21,11 @@ type IActivityAccess = IAccessRepository['activity'];
 type IAlbumAccess = IAccessRepository['album'];
 type IAssetAccess = IAccessRepository['asset'];
 type IAuthDeviceAccess = IAccessRepository['authDevice'];
-type ITimelineAccess = IAccessRepository['timeline'];
 type IMemoryAccess = IAccessRepository['memory'];
 type IPersonAccess = IAccessRepository['person'];
 type IPartnerAccess = IAccessRepository['partner'];
+type IStackAccess = IAccessRepository['stack'];
+type ITimelineAccess = IAccessRepository['timeline'];
 
 @Instrumentation()
 @Injectable()
@@ -313,6 +315,28 @@ class AuthDeviceAccess implements IAuthDeviceAccess {
   }
 }
 
+class StackAccess implements IStackAccess {
+  constructor(private stackRepository: Repository<StackEntity>) {}
+
+  @GenerateSql({ params: [DummyValue.UUID, DummyValue.UUID_SET] })
+  @ChunkedSet({ paramIndex: 1 })
+  async checkOwnerAccess(userId: string, stackIds: Set<string>): Promise<Set<string>> {
+    if (stackIds.size === 0) {
+      return new Set();
+    }
+
+    return this.stackRepository
+      .find({
+        select: { id: true },
+        where: {
+          id: In([...stackIds]),
+          ownerId: userId,
+        },
+      })
+      .then((stacks) => new Set(stacks.map((stack) => stack.id)));
+  }
+}
+
 class TimelineAccess implements ITimelineAccess {
   constructor(private partnerRepository: Repository<PartnerEntity>) {}
 
@@ -428,6 +452,7 @@ export class AccessRepository implements IAccessRepository {
   memory: IMemoryAccess;
   person: IPersonAccess;
   partner: IPartnerAccess;
+  stack: IStackAccess;
   timeline: ITimelineAccess;
 
   constructor(
@@ -441,6 +466,7 @@ export class AccessRepository implements IAccessRepository {
     @InjectRepository(AssetFaceEntity) assetFaceRepository: Repository<AssetFaceEntity>,
     @InjectRepository(SharedLinkEntity) sharedLinkRepository: Repository<SharedLinkEntity>,
     @InjectRepository(SessionEntity) sessionRepository: Repository<SessionEntity>,
+    @InjectRepository(StackEntity) stackRepository: Repository<StackEntity>,
   ) {
     this.activity = new ActivityAccess(activityRepository, albumRepository);
     this.album = new AlbumAccess(albumRepository, sharedLinkRepository);
@@ -449,6 +475,7 @@ export class AccessRepository implements IAccessRepository {
     this.memory = new MemoryAccess(memoryRepository);
     this.person = new PersonAccess(assetFaceRepository, personRepository);
     this.partner = new PartnerAccess(partnerRepository);
+    this.stack = new StackAccess(stackRepository);
     this.timeline = new TimelineAccess(partnerRepository);
   }
 }

server/src/repositories/stack.repository.ts

@@ -1,21 +1,120 @@
 import { Injectable } from '@nestjs/common';
-import { InjectRepository } from '@nestjs/typeorm';
+import { InjectDataSource, InjectRepository } from '@nestjs/typeorm';
+import { AssetEntity } from 'src/entities/asset.entity';
 import { StackEntity } from 'src/entities/stack.entity';
-import { IStackRepository } from 'src/interfaces/stack.interface';
+import { IStackRepository, StackSearch } from 'src/interfaces/stack.interface';
 import { Instrumentation } from 'src/utils/instrumentation';
-import { Repository } from 'typeorm';
+import { DataSource, In, Repository } from 'typeorm';
 
 @Instrumentation()
 @Injectable()
 export class StackRepository implements IStackRepository {
-  constructor(@InjectRepository(StackEntity) private repository: Repository<StackEntity>) {}
+  constructor(
+    @InjectDataSource() private dataSource: DataSource,
+    @InjectRepository(StackEntity) private repository: Repository<StackEntity>,
+  ) {}
 
-  create(entity: Partial<StackEntity>) {
+  search(query: StackSearch): Promise<StackEntity[]> {
-    return this.save(entity);
+    return this.repository.find({
+      where: {
+        ownerId: query.ownerId,
+        primaryAssetId: query.primaryAssetId,
+      },
+      relations: {
+        assets: {
+          exifInfo: true,
+        },
+      },
+    });
+  }
+
+  async create(entity: { ownerId: string; assetIds: string[] }): Promise<StackEntity> {
+    return this.dataSource.manager.transaction(async (manager) => {
+      const stackRepository = manager.getRepository(StackEntity);
+
+      const stacks = await stackRepository.find({
+        where: {
+          ownerId: entity.ownerId,
+          primaryAssetId: In(entity.assetIds),
+        },
+        select: {
+          id: true,
+          assets: {
+            id: true,
+          },
+        },
+        relations: {
+          assets: {
+            exifInfo: true,
+          },
+        },
+      });
+
+      const assetIds = new Set<string>(entity.assetIds);
+
+      // children
+      for (const stack of stacks) {
+        for (const asset of stack.assets) {
+          assetIds.add(asset.id);
+        }
+      }
+
+      if (stacks.length > 0) {
+        await stackRepository.delete({ id: In(stacks.map((stack) => stack.id)) });
+      }
+
+      const { id } = await stackRepository.save({
+        ownerId: entity.ownerId,
+        primaryAssetId: entity.assetIds[0],
+        assets: [...assetIds].map((id) => ({ id }) as AssetEntity),
+      });
+
+      return stackRepository.findOneOrFail({
+        where: {
+          id,
+        },
+        relations: {
+          assets: {
+            exifInfo: true,
+          },
+        },
+      });
+    });
   }
 
   async delete(id: string): Promise<void> {
+    const stack = await this.getById(id);
+    if (!stack) {
+      return;
+    }
+
+    const assetIds = stack.assets.map(({ id }) => id);
+
     await this.repository.delete(id);
+
+    // Update assets updatedAt
+    await this.dataSource.manager.update(AssetEntity, assetIds, {
+      updatedAt: new Date(),
+    });
+  }
+
+  async deleteAll(ids: string[]): Promise<void> {
+    const assetIds = [];
+    for (const id of ids) {
+      const stack = await this.getById(id);
+      if (!stack) {
+        continue;
+      }
+
+      assetIds.push(...stack.assets.map(({ id }) => id));
+    }
+
+    await this.repository.delete(ids);
+
+    // Update assets updatedAt
+    await this.dataSource.manager.update(AssetEntity, assetIds, {
+      updatedAt: new Date(),
+    });
   }
 
   update(entity: Partial<StackEntity>) {
@@ -28,8 +127,14 @@ export class StackRepository implements IStackRepository {
         id,
       },
       relations: {
-        primaryAsset: true,
+        assets: {
-        assets: true,
+          exifInfo: true,
+        },
+      },
+      order: {
+        assets: {
+          fileCreatedAt: 'ASC',
+        },
       },
     });
   }
@@ -41,8 +146,14 @@ export class StackRepository implements IStackRepository {
         id,
       },
       relations: {
-        primaryAsset: true,
+        assets: {
-        assets: true,
+          exifInfo: true,
+        },
+      },
+      order: {
+        assets: {
+          fileCreatedAt: 'ASC',
+        },
       },
     });
   }

server/src/services/asset.service.spec.ts

@@ -4,7 +4,7 @@ import { AssetJobName, AssetStatsResponseDto } from 'src/dtos/asset.dto';
 import { AssetEntity } from 'src/entities/asset.entity';
 import { AssetType } from 'src/enum';
 import { AssetStats, IAssetRepository } from 'src/interfaces/asset.interface';
-import { ClientEvent, IEventRepository } from 'src/interfaces/event.interface';
+import { IEventRepository } from 'src/interfaces/event.interface';
 import { IJobRepository, JobName } from 'src/interfaces/job.interface';
 import { ILoggerRepository } from 'src/interfaces/logger.interface';
 import { IPartnerRepository } from 'src/interfaces/partner.interface';
@@ -12,7 +12,7 @@ import { IStackRepository } from 'src/interfaces/stack.interface';
 import { ISystemMetadataRepository } from 'src/interfaces/system-metadata.interface';
 import { IUserRepository } from 'src/interfaces/user.interface';
 import { AssetService } from 'src/services/asset.service';
-import { assetStub, stackStub } from 'test/fixtures/asset.stub';
+import { assetStub } from 'test/fixtures/asset.stub';
 import { authStub } from 'test/fixtures/auth.stub';
 import { faceStub } from 'test/fixtures/face.stub';
 import { partnerStub } from 'test/fixtures/partner.stub';
@@ -253,134 +253,6 @@ describe(AssetService.name, () => {
       await sut.updateAll(authStub.admin, { ids: ['asset-1', 'asset-2'], isArchived: true });
       expect(assetMock.updateAll).toHaveBeenCalledWith(['asset-1', 'asset-2'], { isArchived: true });
     });
-
-    /// Stack related
-
-    it('should require asset update access for parent', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set(['asset-1']));
-      await expect(
-        sut.updateAll(authStub.user1, {
-          ids: ['asset-1'],
-          stackParentId: 'parent',
-        }),
-      ).rejects.toBeInstanceOf(BadRequestException);
-    });
-
-    it('should update parent asset updatedAt when children are added', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set(['parent']));
-      mockGetById([{ ...assetStub.image, id: 'parent' }]);
-      await sut.updateAll(authStub.user1, {
-        ids: [],
-        stackParentId: 'parent',
-      });
-      expect(assetMock.updateAll).toHaveBeenCalledWith(['parent'], { updatedAt: expect.any(Date) });
-    });
-
-    it('should update parent asset when children are removed', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set(['child-1']));
-      assetMock.getByIds.mockResolvedValue([
-        {
-          id: 'child-1',
-          stackId: 'stack-1',
-          stack: stackStub('stack-1', [{ id: 'parent' } as AssetEntity, { id: 'child-1' } as AssetEntity]),
-        } as AssetEntity,
-      ]);
-      stackMock.getById.mockResolvedValue(stackStub('stack-1', [{ id: 'parent' } as AssetEntity]));
-
-      await sut.updateAll(authStub.user1, {
-        ids: ['child-1'],
-        removeParent: true,
-      });
-      expect(assetMock.updateAll).toHaveBeenCalledWith(expect.arrayContaining(['child-1']), { stack: null });
-      expect(assetMock.updateAll).toHaveBeenCalledWith(expect.arrayContaining(['parent']), {
-        updatedAt: expect.any(Date),
-      });
-      expect(stackMock.delete).toHaveBeenCalledWith('stack-1');
-    });
-
-    it('update parentId for new children', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['child-1', 'child-2']));
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['parent']));
-      const stack = stackStub('stack-1', [
-        { id: 'parent' } as AssetEntity,
-        { id: 'child-1' } as AssetEntity,
-        { id: 'child-2' } as AssetEntity,
-      ]);
-      assetMock.getById.mockResolvedValue({
-        id: 'child-1',
-        stack,
-      } as AssetEntity);
-
-      await sut.updateAll(authStub.user1, {
-        stackParentId: 'parent',
-        ids: ['child-1', 'child-2'],
-      });
-
-      expect(stackMock.update).toHaveBeenCalledWith({
-        ...stackStub('stack-1', [
-          { id: 'child-1' } as AssetEntity,
-          { id: 'child-2' } as AssetEntity,
-          { id: 'parent' } as AssetEntity,
-        ]),
-        primaryAsset: undefined,
-      });
-      expect(assetMock.updateAll).toBeCalledWith(['child-1', 'child-2', 'parent'], { updatedAt: expect.any(Date) });
-    });
-
-    it('remove stack for removed children', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set(['child-1', 'child-2']));
-      await sut.updateAll(authStub.user1, {
-        removeParent: true,
-        ids: ['child-1', 'child-2'],
-      });
-
-      expect(assetMock.updateAll).toBeCalledWith(['child-1', 'child-2'], { stack: null });
-    });
-
-    it('merge stacks if new child has children', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['child-1']));
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['parent']));
-      assetMock.getById.mockResolvedValue({ ...assetStub.image, id: 'parent' });
-      assetMock.getByIds.mockResolvedValue([
-        {
-          id: 'child-1',
-          stackId: 'stack-1',
-          stack: stackStub('stack-1', [{ id: 'child-1' } as AssetEntity, { id: 'child-2' } as AssetEntity]),
-        } as AssetEntity,
-      ]);
-      stackMock.getById.mockResolvedValue(stackStub('stack-1', [{ id: 'parent' } as AssetEntity]));
-
-      await sut.updateAll(authStub.user1, {
-        ids: ['child-1'],
-        stackParentId: 'parent',
-      });
-
-      expect(stackMock.delete).toHaveBeenCalledWith('stack-1');
-      expect(stackMock.create).toHaveBeenCalledWith({
-        assets: [{ id: 'child-1' }, { id: 'parent' }, { id: 'child-1' }, { id: 'child-2' }],
-        ownerId: 'user-id',
-        primaryAssetId: 'parent',
-      });
-      expect(assetMock.updateAll).toBeCalledWith(['child-1', 'parent', 'child-1', 'child-2'], {
-        updatedAt: expect.any(Date),
-      });
-    });
-
-    it('should send ws asset update event', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['asset-1']));
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['parent']));
-      assetMock.getById.mockResolvedValue(assetStub.image);
-
-      await sut.updateAll(authStub.user1, {
-        ids: ['asset-1'],
-        stackParentId: 'parent',
-      });
-
-      expect(eventMock.clientSend).toHaveBeenCalledWith(ClientEvent.ASSET_STACK_UPDATE, authStub.user1.user.id, [
-        'asset-1',
-        'parent',
-      ]);
-    });
   });
 
   describe('deleteAll', () => {
@@ -530,53 +402,17 @@ describe(AssetService.name, () => {
     });
   });
 
-  describe('updateStackParent', () => {
+  describe('getUserAssetsByDeviceId', () => {
-    it('should require asset update access for new parent', async () => {
+    it('get assets by device id', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set(['old']));
+      const assets = [assetStub.image, assetStub.image1];
-      await expect(
+
-        sut.updateStackParent(authStub.user1, {
+      assetMock.getAllByDeviceId.mockResolvedValue(assets.map((asset) => asset.deviceAssetId));
-          oldParentId: 'old',
+
-          newParentId: 'new',
+      const deviceId = 'device-id';
-        }),
+      const result = await sut.getUserAssetsByDeviceId(authStub.user1, deviceId);
-      ).rejects.toBeInstanceOf(BadRequestException);
+
+      expect(result.length).toEqual(2);
+      expect(result).toEqual(assets.map((asset) => asset.deviceAssetId));
     });
-
-    it('should require asset read access for old parent', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set(['new']));
-      await expect(
-        sut.updateStackParent(authStub.user1, {
-          oldParentId: 'old',
-          newParentId: 'new',
-        }),
-      ).rejects.toBeInstanceOf(BadRequestException);
-    });
-
-    it('make old parent the child of new parent', async () => {
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set([assetStub.image.id]));
-      accessMock.asset.checkOwnerAccess.mockResolvedValueOnce(new Set(['new']));
-      assetMock.getById.mockResolvedValue({ ...assetStub.image, stackId: 'stack-1' });
-
-      await sut.updateStackParent(authStub.user1, {
-        oldParentId: assetStub.image.id,
-        newParentId: 'new',
-      });
-
-      expect(stackMock.update).toBeCalledWith({ id: 'stack-1', primaryAssetId: 'new' });
-      expect(assetMock.updateAll).toBeCalledWith([assetStub.image.id, 'new', assetStub.image.id], {
-        updatedAt: expect.any(Date),
-      });
-    });
-  });
-
-  it('get assets by device id', async () => {
-    const assets = [assetStub.image, assetStub.image1];
-
-    assetMock.getAllByDeviceId.mockResolvedValue(assets.map((asset) => asset.deviceAssetId));
-
-    const deviceId = 'device-id';
-    const result = await sut.getUserAssetsByDeviceId(authStub.user1, deviceId);
-
-    expect(result.length).toEqual(2);
-    expect(result).toEqual(assets.map((asset) => asset.deviceAssetId));
   });
 });

server/src/services/asset.service.ts

@@ -20,7 +20,6 @@ import {
 } from 'src/dtos/asset.dto';
 import { AuthDto } from 'src/dtos/auth.dto';
 import { MemoryLaneDto } from 'src/dtos/search.dto';
-import { UpdateStackParentDto } from 'src/dtos/stack.dto';
 import { AssetEntity } from 'src/entities/asset.entity';
 import { Permission } from 'src/enum';
 import { IAccessRepository } from 'src/interfaces/access.interface';
@@ -179,68 +178,14 @@ export class AssetService {
   }
 
   async updateAll(auth: AuthDto, dto: AssetBulkUpdateDto): Promise<void> {
-    const { ids, removeParent, dateTimeOriginal, latitude, longitude, ...options } = dto;
+    const { ids, dateTimeOriginal, latitude, longitude, ...options } = dto;
     await this.access.requirePermission(auth, Permission.ASSET_UPDATE, ids);
 
-    // TODO: refactor this logic into separate API calls POST /stack, PUT /stack, etc.
-    const stackIdsToCheckForDelete: string[] = [];
-    if (removeParent) {
-      (options as Partial<AssetEntity>).stack = null;
-      const assets = await this.assetRepository.getByIds(ids, { stack: true });
-      stackIdsToCheckForDelete.push(...new Set(assets.filter((a) => !!a.stackId).map((a) => a.stackId!)));
-      // This updates the updatedAt column of the parents to indicate that one of its children is removed
-      // All the unique parent's -> parent is set to null
-      await this.assetRepository.updateAll(
-        assets.filter((a) => !!a.stack?.primaryAssetId).map((a) => a.stack!.primaryAssetId!),
-        { updatedAt: new Date() },
-      );
-    } else if (options.stackParentId) {
-      //Creating new stack if parent doesn't have one already. If it does, then we add to the existing stack
-      await this.access.requirePermission(auth, Permission.ASSET_UPDATE, options.stackParentId);
-      const primaryAsset = await this.assetRepository.getById(options.stackParentId, { stack: { assets: true } });
-      if (!primaryAsset) {
-        throw new BadRequestException('Asset not found for given stackParentId');
-      }
-      let stack = primaryAsset.stack;
-
-      ids.push(options.stackParentId);
-      const assets = await this.assetRepository.getByIds(ids, { stack: { assets: true } });
-      stackIdsToCheckForDelete.push(
-        ...new Set(assets.filter((a) => !!a.stackId && stack?.id !== a.stackId).map((a) => a.stackId!)),
-      );
-      const assetsWithChildren = assets.filter((a) => a.stack && a.stack.assets.length > 0);
-      ids.push(...assetsWithChildren.flatMap((child) => child.stack!.assets.map((gChild) => gChild.id)));
-
-      if (stack) {
-        await this.stackRepository.update({
-          id: stack.id,
-          primaryAssetId: primaryAsset.id,
-          assets: ids.map((id) => ({ id }) as AssetEntity),
-        });
-      } else {
-        stack = await this.stackRepository.create({
-          primaryAssetId: primaryAsset.id,
-          ownerId: primaryAsset.ownerId,
-          assets: ids.map((id) => ({ id }) as AssetEntity),
-        });
-      }
-
-      // Merge stacks
-      options.stackParentId = undefined;
-      (options as Partial<AssetEntity>).updatedAt = new Date();
-    }
-
     for (const id of ids) {
       await this.updateMetadata({ id, dateTimeOriginal, latitude, longitude });
     }
 
     await this.assetRepository.updateAll(ids, options);
-    const stackIdsToDelete = await Promise.all(stackIdsToCheckForDelete.map((id) => this.stackRepository.getById(id)));
-    const stacksToDelete = stackIdsToDelete
-      .flatMap((stack) => (stack ? [stack] : []))
-      .filter((stack) => stack.assets.length < 2);
-    await Promise.all(stacksToDelete.map((as) => this.stackRepository.delete(as.id)));
-    this.eventRepository.clientSend(ClientEvent.ASSET_STACK_UPDATE, auth.user.id, ids);
   }
 
   async handleAssetDeletionCheck(): Promise<JobStatus> {
@@ -343,41 +288,6 @@ export class AssetService {
     }
   }
 
-  async updateStackParent(auth: AuthDto, dto: UpdateStackParentDto): Promise<void> {
-    const { oldParentId, newParentId } = dto;
-    await this.access.requirePermission(auth, Permission.ASSET_READ, oldParentId);
-    await this.access.requirePermission(auth, Permission.ASSET_UPDATE, newParentId);
-
-    const childIds: string[] = [];
-    const oldParent = await this.assetRepository.getById(oldParentId, {
-      faces: {
-        person: true,
-      },
-      library: true,
-      stack: {
-        assets: true,
-      },
-    });
-    if (!oldParent?.stackId) {
-      throw new Error('Asset not found or not in a stack');
-    }
-    if (oldParent != null) {
-      // Get all children of old parent
-      childIds.push(oldParent.id, ...(oldParent.stack?.assets.map((a) => a.id) ?? []));
-    }
-    await this.stackRepository.update({
-      id: oldParent.stackId,
-      primaryAssetId: newParentId,
-    });
-
-    this.eventRepository.clientSend(ClientEvent.ASSET_STACK_UPDATE, auth.user.id, [
-      ...childIds,
-      newParentId,
-      oldParentId,
-    ]);
-    await this.assetRepository.updateAll([oldParentId, newParentId, ...childIds], { updatedAt: new Date() });
-  }
-
   async run(auth: AuthDto, dto: AssetJobsDto) {
     await this.access.requirePermission(auth, Permission.ASSET_UPDATE, dto.assetIds);
 

server/src/services/duplicate.service.ts

@@ -39,7 +39,7 @@ export class DuplicateService {
   async getDuplicates(auth: AuthDto): Promise<DuplicateResponseDto[]> {
     const res = await this.assetRepository.getDuplicates({ userIds: [auth.user.id] });
 
-    return mapDuplicateResponse(res.map((a) => mapAsset(a, { auth })));
+    return mapDuplicateResponse(res.map((a) => mapAsset(a, { auth, withStack: true })));
   }
 
   async handleQueueSearchDuplicates({ force }: IBaseJob): Promise<JobStatus> {

server/src/services/index.ts

@@ -25,6 +25,7 @@ import { ServerService } from 'src/services/server.service';
 import { SessionService } from 'src/services/session.service';
 import { SharedLinkService } from 'src/services/shared-link.service';
 import { SmartInfoService } from 'src/services/smart-info.service';
+import { StackService } from 'src/services/stack.service';
 import { StorageTemplateService } from 'src/services/storage-template.service';
 import { StorageService } from 'src/services/storage.service';
 import { SyncService } from 'src/services/sync.service';
@@ -65,6 +66,7 @@ export const services = [
   SessionService,
   SharedLinkService,
   SmartInfoService,
+  StackService,
   StorageService,
   StorageTemplateService,
   SyncService,

server/src/services/stack.service.ts

@@ -0,0 +1,84 @@
+import { BadRequestException, Inject, Injectable } from '@nestjs/common';
+import { AccessCore } from 'src/cores/access.core';
+import { BulkIdsDto } from 'src/dtos/asset-ids.response.dto';
+import { AuthDto } from 'src/dtos/auth.dto';
+import { StackCreateDto, StackResponseDto, StackSearchDto, StackUpdateDto, mapStack } from 'src/dtos/stack.dto';
+import { Permission } from 'src/enum';
+import { IAccessRepository } from 'src/interfaces/access.interface';
+import { ClientEvent, IEventRepository } from 'src/interfaces/event.interface';
+import { IStackRepository } from 'src/interfaces/stack.interface';
+
+@Injectable()
+export class StackService {
+  private access: AccessCore;
+
+  constructor(
+    @Inject(IAccessRepository) accessRepository: IAccessRepository,
+    @Inject(IEventRepository) private eventRepository: IEventRepository,
+    @Inject(IStackRepository) private stackRepository: IStackRepository,
+  ) {
+    this.access = AccessCore.create(accessRepository);
+  }
+
+  async search(auth: AuthDto, dto: StackSearchDto): Promise<StackResponseDto[]> {
+    const stacks = await this.stackRepository.search({
+      ownerId: auth.user.id,
+      primaryAssetId: dto.primaryAssetId,
+    });
+
+    return stacks.map((stack) => mapStack(stack, { auth }));
+  }
+
+  async create(auth: AuthDto, dto: StackCreateDto): Promise<StackResponseDto> {
+    await this.access.requirePermission(auth, Permission.ASSET_UPDATE, dto.assetIds);
+
+    const stack = await this.stackRepository.create({ ownerId: auth.user.id, assetIds: dto.assetIds });
+
+    this.eventRepository.clientSend(ClientEvent.ASSET_STACK_UPDATE, auth.user.id, []);
+
+    return mapStack(stack, { auth });
+  }
+
+  async get(auth: AuthDto, id: string): Promise<StackResponseDto> {
+    await this.access.requirePermission(auth, Permission.STACK_READ, id);
+    const stack = await this.findOrFail(id);
+    return mapStack(stack, { auth });
+  }
+
+  async update(auth: AuthDto, id: string, dto: StackUpdateDto): Promise<StackResponseDto> {
+    await this.access.requirePermission(auth, Permission.STACK_UPDATE, id);
+    const stack = await this.findOrFail(id);
+    if (dto.primaryAssetId && !stack.assets.some(({ id }) => id === dto.primaryAssetId)) {
+      throw new BadRequestException('Primary asset must be in the stack');
+    }
+
+    const updatedStack = await this.stackRepository.update({ id, primaryAssetId: dto.primaryAssetId });
+
+    this.eventRepository.clientSend(ClientEvent.ASSET_STACK_UPDATE, auth.user.id, []);
+
+    return mapStack(updatedStack, { auth });
+  }
+
+  async delete(auth: AuthDto, id: string): Promise<void> {
+    await this.access.requirePermission(auth, Permission.STACK_DELETE, id);
+    await this.stackRepository.delete(id);
+
+    this.eventRepository.clientSend(ClientEvent.ASSET_STACK_UPDATE, auth.user.id, []);
+  }
+
+  async deleteAll(auth: AuthDto, dto: BulkIdsDto): Promise<void> {
+    await this.access.requirePermission(auth, Permission.STACK_DELETE, dto.ids);
+    await this.stackRepository.deleteAll(dto.ids);
+
+    this.eventRepository.clientSend(ClientEvent.ASSET_STACK_UPDATE, auth.user.id, []);
+  }
+
+  private async findOrFail(id: string) {
+    const stack = await this.stackRepository.getById(id);
+    if (!stack) {
+      throw new Error('Asset stack not found');
+    }
+
+    return stack;
+  }
+}

server/test/fixtures/shared-link.stub.ts

@@ -76,7 +76,6 @@ const assetResponse: AssetResponseDto = {
   isTrashed: false,
   libraryId: 'library-id',
   hasMetadata: true,
-  stackCount: 0,
 };
 
 const assetResponseWithoutMetadata = {

server/test/repositories/access.repository.mock.ts

@@ -7,10 +7,11 @@ export interface IAccessRepositoryMock {
   asset: Mocked<IAccessRepository['asset']>;
   album: Mocked<IAccessRepository['album']>;
   authDevice: Mocked<IAccessRepository['authDevice']>;
-  timeline: Mocked<IAccessRepository['timeline']>;
   memory: Mocked<IAccessRepository['memory']>;
   person: Mocked<IAccessRepository['person']>;
   partner: Mocked<IAccessRepository['partner']>;
+  stack: Mocked<IAccessRepository['stack']>;
+  timeline: Mocked<IAccessRepository['timeline']>;
 }
 
 export const newAccessRepositoryMock = (reset = true): IAccessRepositoryMock => {
@@ -42,10 +43,6 @@ export const newAccessRepositoryMock = (reset = true): IAccessRepositoryMock =>
       checkOwnerAccess: vitest.fn().mockResolvedValue(new Set()),
     },
 
-    timeline: {
-      checkPartnerAccess: vitest.fn().mockResolvedValue(new Set()),
-    },
-
     memory: {
       checkOwnerAccess: vitest.fn().mockResolvedValue(new Set()),
     },
@@ -58,5 +55,13 @@ export const newAccessRepositoryMock = (reset = true): IAccessRepositoryMock =>
     partner: {
       checkUpdateAccess: vitest.fn().mockResolvedValue(new Set()),
     },
+
+    stack: {
+      checkOwnerAccess: vitest.fn().mockResolvedValue(new Set()),
+    },
+
+    timeline: {
+      checkPartnerAccess: vitest.fn().mockResolvedValue(new Set()),
+    },
   };
 };

server/test/repositories/stack.repository.mock.ts

@@ -3,9 +3,11 @@ import { Mocked, vitest } from 'vitest';
 
 export const newStackRepositoryMock = (): Mocked<IStackRepository> => {
   return {
+    search: vitest.fn(),
     create: vitest.fn(),
     update: vitest.fn(),
     delete: vitest.fn(),
     getById: vitest.fn(),
+    deleteAll: vitest.fn(),
   };
 };

web/src/lib/components/asset-viewer/actions/unstack-action.svelte

@@ -1,17 +1,17 @@
 <script lang="ts">
   import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
   import { AssetAction } from '$lib/constants';
-  import { unstackAssets } from '$lib/utils/asset-utils';
+  import { deleteStack } from '$lib/utils/asset-utils';
-  import type { AssetResponseDto } from '@immich/sdk';
+  import type { StackResponseDto } from '@immich/sdk';
   import { mdiImageMinusOutline } from '@mdi/js';
   import { t } from 'svelte-i18n';
   import type { OnAction } from './action';
 
-  export let stackedAssets: AssetResponseDto[];
+  export let stack: StackResponseDto;
   export let onAction: OnAction;
 
   const handleUnstack = async () => {
-    const unstackedAssets = await unstackAssets(stackedAssets);
+    const unstackedAssets = await deleteStack([stack.id]);
     if (unstackedAssets) {
       onAction({ type: AssetAction.UNSTACK, assets: unstackedAssets });
     }

web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte

@@ -19,7 +19,13 @@
   import { photoZoomState } from '$lib/stores/zoom-image.store';
   import { getAssetJobName, getSharedLink } from '$lib/utils';
   import { openFileUploadDialog } from '$lib/utils/file-uploader';
-  import { AssetJobName, AssetTypeEnum, type AlbumResponseDto, type AssetResponseDto } from '@immich/sdk';
+  import {
+    AssetJobName,
+    AssetTypeEnum,
+    type AlbumResponseDto,
+    type AssetResponseDto,
+    type StackResponseDto,
+  } from '@immich/sdk';
   import {
     mdiAlertOutline,
     mdiCogRefreshOutline,
@@ -37,10 +43,9 @@
 
   export let asset: AssetResponseDto;
   export let album: AlbumResponseDto | null = null;
-  export let stackedAssets: AssetResponseDto[];
+  export let stack: StackResponseDto | null = null;
   export let showDetailButton: boolean;
   export let showSlideshow = false;
-  export let hasStackChildren = false;
   export let onZoomImage: () => void;
   export let onCopyImage: () => void;
   export let onAction: OnAction;
@@ -136,8 +141,8 @@
         {/if}
 
         {#if isOwner}
-          {#if hasStackChildren}
+          {#if stack}
-            <UnstackAction {stackedAssets} {onAction} />
+            <UnstackAction {stack} {onAction} />
           {/if}
           {#if album}
             <SetAlbumCoverAction {asset} {album} />

web/src/lib/components/asset-viewer/asset-viewer.svelte

@@ -30,6 +30,8 @@
     type ActivityResponseDto,
     type AlbumResponseDto,
     type AssetResponseDto,
+    getStack,
+    type StackResponseDto,
   } from '@immich/sdk';
   import { mdiImageBrokenVariant } from '@mdi/js';
   import { createEventDispatcher, onDestroy, onMount } from 'svelte';
@@ -74,7 +76,6 @@
   }>();
 
   let appearsInAlbums: AlbumResponseDto[] = [];
-  let stackedAssets: AssetResponseDto[] = [];
   let shouldPlayMotionPhoto = false;
   let sharedLink = getSharedLink();
   let enableDetailPanel = asset.hasMetadata;
@@ -92,22 +93,28 @@
 
   $: isFullScreen = fullscreenElement !== null;
 
-  $: {
+  let stack: StackResponseDto | null = null;
-    if (asset.stackCount && asset.stack) {
-      stackedAssets = asset.stack;
-      stackedAssets = [...stackedAssets, asset].sort(
-        (a, b) => new Date(b.fileCreatedAt).getTime() - new Date(a.fileCreatedAt).getTime(),
-      );
 
-      // if its a stack, add the next stack image in addition to the next asset
+  const refreshStack = async () => {
-      if (asset.stackCount > 1) {
+    if (isSharedLink()) {
-        preloadAssets.push(stackedAssets[1]);
+      return;
-      }
     }
 
-    if (!stackedAssets.map((a) => a.id).includes(asset.id)) {
+    if (asset.stack) {
-      stackedAssets = [];
+      stack = await getStack({ id: asset.stack.id });
     }
+
+    if (!stack?.assets.some(({ id }) => id === asset.id)) {
+      stack = null;
+    }
+
+    if (stack && stack?.assets.length > 1) {
+      preloadAssets.push(stack.assets[1]);
+    }
+  };
+
+  $: if (asset) {
+    handlePromiseError(refreshStack());
   }
 
   $: {
@@ -215,15 +222,6 @@
     if (!sharedLink) {
       await handleGetAllAlbums();
     }
-
-    if (asset.stackCount && asset.stack) {
-      stackedAssets = asset.stack;
-      stackedAssets = [...stackedAssets, asset].sort(
-        (a, b) => new Date(a.fileCreatedAt).getTime() - new Date(b.fileCreatedAt).getTime(),
-      );
-    } else {
-      stackedAssets = [];
-    }
   });
 
   onDestroy(() => {
@@ -392,8 +390,10 @@
         await handleGetAllAlbums();
         break;
       }
+
       case AssetAction.UNSTACK: {
         await closeViewer();
+        break;
       }
     }
 
@@ -420,10 +420,9 @@
       <AssetViewerNavBar
         {asset}
         {album}
-        {stackedAssets}
+        {stack}
         showDetailButton={enableDetailPanel}
         showSlideshow={!!assetStore}
-        hasStackChildren={stackedAssets.length > 0}
         onZoomImage={zoomToggle}
         onCopyImage={copyImage}
         onAction={handleAction}
@@ -568,7 +567,8 @@
     </div>
   {/if}
 
-  {#if stackedAssets.length > 0 && withStacked}
+  {#if stack && withStacked}
+    {@const stackedAssets = stack.assets}
     <div
       id="stack-slideshow"
       class="z-[1002] flex place-item-center place-content-center absolute bottom-0 w-full col-span-4 col-start-1 overflow-x-auto horizontal-scrollbar"

web/src/lib/components/assets/thumbnail/thumbnail.svelte

@@ -170,14 +170,14 @@
 
         <!-- Stacked asset -->
 
-        {#if asset.stackCount && showStackedIcon}
+        {#if asset.stack && showStackedIcon}
           <div
             class="absolute {asset.type == AssetTypeEnum.Image && asset.livePhotoVideoId == undefined
               ? 'top-0 right-0'
               : 'top-7 right-1'} z-20 flex place-items-center gap-1 text-xs font-medium text-white"
           >
             <span class="pr-2 pt-2 flex place-items-center gap-1">
-              <p>{asset.stackCount.toLocaleString($locale)}</p>
+              <p>{asset.stack.assetCount.toLocaleString($locale)}</p>
               <Icon path={mdiCameraBurst} size="24" />
             </span>
           </div>

web/src/lib/components/photos-page/actions/stack-action.svelte

@@ -2,7 +2,7 @@
   import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
   import { getAssetControlContext } from '$lib/components/photos-page/asset-select-control-bar.svelte';
   import { mdiImageMinusOutline, mdiImageMultipleOutline } from '@mdi/js';
-  import { stackAssets, unstackAssets } from '$lib/utils/asset-utils';
+  import { stackAssets, deleteStack } from '$lib/utils/asset-utils';
   import type { OnStack, OnUnstack } from '$lib/utils/actions';
   import { t } from 'svelte-i18n';
 
@@ -30,8 +30,7 @@
     if (!stack) {
       return;
     }
-    const assets = [selectedAssets[0], ...stack];
+    const unstackedAssets = await deleteStack([stack.id]);
-    const unstackedAssets = await unstackAssets(assets);
     if (unstackedAssets) {
       onUnstack?.(unstackedAssets);
     }

web/src/lib/components/utilities-page/duplicates/duplicate-asset.svelte

@@ -14,7 +14,6 @@
 
   $: isFromExternalLibrary = !!asset.libraryId;
   $: assetData = JSON.stringify(asset, null, 2);
-  $: stackCount = asset.stackCount;
 </script>
 
 <div
@@ -55,17 +54,17 @@
         {isSelected ? $t('keep') : $t('to_trash')}
       </div>
 
-      <!-- EXTERNAL LIBRARY / STACK COUNT CHIP-->
+      <!-- EXTERNAL LIBRARY / STACK COUNT CHIP -->
       <div class="absolute top-2 right-3">
         {#if isFromExternalLibrary}
           <div class="bg-immich-primary/90 px-2 py-1 rounded-xl text-xs text-white">
             {$t('external')}
           </div>
         {/if}
-        {#if stackCount != null && stackCount != 0}
+        {#if asset.stack?.assetCount}
           <div class="bg-immich-primary/90 px-2 py-1 my-0.5 rounded-xl text-xs text-white">
             <div class="flex items-center justify-center">
-              <div class="mr-1">{stackCount}</div>
+              <div class="mr-1">{asset.stack.assetCount}</div>
               <Icon path={mdiImageMultipleOutline} size="18" />
             </div>
           </div>

web/src/lib/utils/asset-utils.ts

@@ -12,9 +12,12 @@ import { createAlbum } from '$lib/utils/album-utils';
 import { getByteUnitString } from '$lib/utils/byte-units';
 import {
   addAssetsToAlbum as addAssets,
+  createStack,
+  deleteStacks,
   getAssetInfo,
   getBaseUrl,
   getDownloadInfo,
+  getStack,
   updateAsset,
   updateAssets,
   type AlbumResponseDto,
@@ -335,79 +338,60 @@ export const stackAssets = async (assets: AssetResponseDto[], showNotification =
     return false;
   }
 
-  const parent = assets[0];
-  const children = assets.slice(1);
-  const ids = children.map(({ id }) => id);
   const $t = get(t);
 
   try {
-    await updateAssets({
+    const stack = await createStack({ stackCreateDto: { assetIds: assets.map(({ id }) => id) } });
-      assetBulkUpdateDto: {
+    if (showNotification) {
-        ids,
+      notificationController.show({
-        stackParentId: parent.id,
+        message: $t('stacked_assets_count', { values: { count: stack.assets.length } }),
-      },
+        type: NotificationType.Info,
-    });
+        button: {
+          text: $t('view_stack'),
+          onClick: () => assetViewingStore.setAssetId(stack.primaryAssetId),
+        },
+      });
+    }
+
+    for (const [index, asset] of assets.entries()) {
+      asset.stack = index === 0 ? { id: stack.id, assetCount: stack.assets.length, primaryAssetId: asset.id } : null;
+    }
+
+    return assets.slice(1).map((asset) => asset.id);
   } catch (error) {
     handleError(error, $t('errors.failed_to_stack_assets'));
     return false;
   }
-
-  let grandChildren: AssetResponseDto[] = [];
-  for (const asset of children) {
-    asset.stackParentId = parent.id;
-    if (asset.stack) {
-      // Add grand-children to new parent
-      grandChildren = grandChildren.concat(asset.stack);
-      // Reset children stack info
-      asset.stackCount = null;
-      asset.stack = [];
-    }
-  }
-
-  parent.stack ??= [];
-  parent.stack = parent.stack.concat(children, grandChildren);
-  parent.stackCount = parent.stack.length + 1;
-
-  if (showNotification) {
-    notificationController.show({
-      message: $t('stacked_assets_count', { values: { count: parent.stackCount } }),
-      type: NotificationType.Info,
-      button: {
-        text: $t('view_stack'),
-        onClick() {
-          return assetViewingStore.setAssetId(parent.id);
-        },
-      },
-    });
-  }
-
-  return ids;
 };
 
-export const unstackAssets = async (assets: AssetResponseDto[]) => {
+export const deleteStack = async (stackIds: string[]) => {
-  const ids = assets.map(({ id }) => id);
+  const ids = [...new Set(stackIds)];
-  const $t = get(t);
+  if (ids.length === 0) {
-  try {
-    await updateAssets({
-      assetBulkUpdateDto: {
-        ids,
-        removeParent: true,
-      },
-    });
-  } catch (error) {
-    handleError(error, $t('errors.failed_to_unstack_assets'));
     return;
   }
-  for (const asset of assets) {
+
-    asset.stackParentId = null;
+  const $t = get(t);
-    asset.stackCount = null;
+
-    asset.stack = [];
+  try {
+    const stacks = await Promise.all(ids.map((id) => getStack({ id })));
+    const count = stacks.reduce((sum, stack) => sum + stack.assets.length, 0);
+
+    await deleteStacks({ bulkIdsDto: { ids: [...ids] } });
+
+    notificationController.show({
+      type: NotificationType.Info,
+      message: $t('unstacked_assets_count', { values: { count } }),
+    });
+
+    const assets = stacks.flatMap((stack) => stack.assets);
+    for (const asset of assets) {
+      asset.stack = null;
+    }
+
+    return assets;
+  } catch (error) {
+    handleError(error, $t('errors.failed_to_unstack_assets'));
   }
-  notificationController.show({
-    type: NotificationType.Info,
-    message: $t('unstacked_assets_count', { values: { count: assets.length } }),
-  });
-  return assets;
 };
 
 export const selectAllAssets = async (assetStore: AssetStore, assetInteractionStore: AssetInteractionStore) => {

web/src/test-data/factories/asset-factory.ts

@@ -25,5 +25,4 @@ export const assetFactory = Sync.makeFactory<AssetResponseDto>({
   checksum: Sync.each(() => faker.string.alphanumeric(28)),
   isOffline: Sync.each(() => faker.datatype.boolean()),
   hasMetadata: Sync.each(() => faker.datatype.boolean()),
-  stackCount: null,
 });