fix(web): asset grid with invalid asset id (at) (immich-app#12772)

fix(web): asset grid
loveyu · Sep 18, 2024 · caa9b1a · caa9b1a
1 parent 65dcf9b
commit caa9b1a
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 20 deletions.
diff --git a/web/src/lib/stores/assets.store.ts b/web/src/lib/stores/assets.store.ts
@@ -638,9 +638,7 @@ export class AssetStore {
         this.options.userId ||
         this.options.personId ||
         this.options.albumId ||
-        isMismatched(this.options.isArchived, asset.isArchived) ||
-        isMismatched(this.options.isFavorite, asset.isFavorite) ||
-        isMismatched(this.options.isTrashed, asset.isTrashed)
+        this.isExcluded(asset)
       ) {
         // If asset is already in the bucket we don't need to recalculate
         // asset store containers
@@ -699,26 +697,22 @@ export class AssetStore {
 
   async findAndLoadBucketAsPending(id: string) {
     const bucketInfo = this.assetToBucket[id];
-    if (bucketInfo) {
-      const bucket = bucketInfo.bucket;
+    let bucket: AssetBucket | null = bucketInfo?.bucket ?? null;
+    if (!bucket) {
+      const asset = await getAssetInfo({ id });
+      if (!asset || this.isExcluded(asset)) {
+        return;
+      }
+
+      bucket = await this.loadBucketAtTime(asset.localDateTime, { preventCancel: true, pending: true });
+    }
+
+    if (bucket && bucket.assets.some((a) => a.id === id)) {
       this.pendingScrollBucket = bucket;
       this.pendingScrollAssetId = id;
       this.emit(false);
       return bucket;
     }
-    const asset = await getAssetInfo({ id });
-    if (asset) {
-      if (this.options.isArchived !== asset.isArchived) {
-        return;
-      }
-      const bucket = await this.loadBucketAtTime(asset.localDateTime, { preventCancel: true, pending: true });
-      if (bucket) {
-        this.pendingScrollBucket = bucket;
-        this.pendingScrollAssetId = asset.id;
-        this.emit(false);
-      }
-      return bucket;
-    }
   }
 
   /* Must be paired with matching clearPendingScroll() call */
@@ -905,6 +899,14 @@ export class AssetStore {
     }
     this.store$.set(this);
   }
+
+  private isExcluded(asset: AssetResponseDto) {
+    return (
+      isMismatched(this.options.isArchived ?? false, asset.isArchived) ||
+      isMismatched(this.options.isFavorite, asset.isFavorite) ||
+      isMismatched(this.options.isTrashed ?? false, asset.isTrashed)
+    );
+  }
 }
 
 export const isSelectingAllAssets = writable(false);
diff --git a/web/src/test-data/factories/asset-factory.ts b/web/src/test-data/factories/asset-factory.ts
@@ -18,8 +18,8 @@ export const assetFactory = Sync.makeFactory<AssetResponseDto>({
   localDateTime: Sync.each(() => faker.date.past().toISOString()),
   updatedAt: Sync.each(() => faker.date.past().toISOString()),
   isFavorite: Sync.each(() => faker.datatype.boolean()),
-  isArchived: Sync.each(() => faker.datatype.boolean()),
-  isTrashed: Sync.each(() => faker.datatype.boolean()),
+  isArchived: false,
+  isTrashed: false,
   duration: '0:00:00.00000',
   checksum: Sync.each(() => faker.string.alphanumeric(28)),
   isOffline: Sync.each(() => faker.datatype.boolean()),