From 3e71f8dd0fbff5ed9c2af528ad71683ef854fd01 Mon Sep 17 00:00:00 2001
From: Jess Sullivan <jess@sulliwood.org>
Date: Sat, 30 May 2026 09:05:37 -0400
Subject: [PATCH] fix(blog): preserve local feature_image when hydrating to
 broker stream
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The blog index swaps `displayPosts` from the SSR snapshot (`data.posts`,
~135/137 imaged via the spoke's body-image + slug-hash backfill) to the hub
broker stream on mount. The hub derives `feature_image` from raw frontmatter
only (no body scan, no backfill), so the live stream has just 7/137 imaged —
hydration was *dropping* card images that the local snapshot had (the visible
"all posts imaged, then revert to a few" regression).

Merge instead of replace: when a broker post lacks `feature_image`, fall back
to the local post's image by slug. Same post set, no image downgrade. The
durable fix (hub broker derives images at parity) is tracked in TIN-1723.
---
 src/routes/blog/+page.svelte | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte
index 4e0424d..e8e97a8 100644
--- a/src/routes/blog/+page.svelte
+++ b/src/routes/blog/+page.svelte
@@ -25,8 +25,23 @@
 		endpoint: brokerEndpoint,
 	});
 
+	// Local (SSR) posts indexed by slug. The hub broker stream derives
+	// feature_image from raw frontmatter only, so it omits images for posts
+	// whose card image came from the spoke's richer derivation (body-image
+	// scan + slug-hash backfill). Merge rather than replace so hydrating to
+	// the broker stream never drops a feature_image the local snapshot had.
+	let localPostsBySlug = $derived(
+		new Map(data.posts.map((post) => [post.slug, post]))
+	);
+
 	let displayPosts = $derived(
-		brokerState.status === 'ready' ? brokerState.posts : data.posts
+		brokerState.status === 'ready'
+			? brokerState.posts.map((post) =>
+					post.feature_image
+						? post
+						: { ...post, feature_image: localPostsBySlug.get(post.slug)?.feature_image }
+				)
+			: data.posts
 	);
 
 	let totalPages = $derived(Math.ceil(displayPosts.length / POSTS_PER_PAGE));