From 6b7fb09097a5b11ad9f11c2e59abd57caced04f9 Mon Sep 17 00:00:00 2001
From: ralksta <ralksta@users.noreply.github.com>
Date: Sat, 30 May 2026 15:40:29 +0200
Subject: [PATCH] feat: use album hero image as grid thumbnail on subpage
 overview

---
 app/[...path]/page.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/app/[...path]/page.tsx b/app/[...path]/page.tsx
index 6fa8776..c422df1 100644
--- a/app/[...path]/page.tsx
+++ b/app/[...path]/page.tsx
@@ -253,9 +253,15 @@ export default async function PathPage({ params }: PathPageProps) {
 
     // ── Multiple albums → show album grid ─────────────────────
 
+    // Override albumThumbnailAssetId with the configured hero image (if any)
+    const albumsWithHero = albums.map((album) => {
+      const heroId = config.albumHeroImages[album.id];
+      return heroId ? { ...album, albumThumbnailAssetId: heroId } : album;
+    });
+
     // Batch-fetch ThumbHash for album cover placeholders
     const coverPlaceholders = await Promise.all(
-      albums.map(async (album) => {
+      albumsWithHero.map(async (album) => {
         if (!album.albumThumbnailAssetId) return null;
         const asset = await immich.getAssetInfo(album.albumThumbnailAssetId);
         return asset ? assetPlaceholder(asset) : null;
@@ -267,7 +273,7 @@ export default async function PathPage({ params }: PathPageProps) {
         slug={slug}
         title={result.subpage.title || result.subpage.name}
         subtitle={result.subpage.subtitle}
-        albums={albums}
+        albums={albumsWithHero}
         coverPlaceholders={coverPlaceholders}
         sections={result.subpage.sections}
       />