Hero falls back to the next image when the lead's won't load
Some sources hotlink-protect their images (e.g. Guardian's i.guim.co.uk → 401), so a perfectly-enriched lead could still render an imageless hero. The browser is the only true judge of loadability, so on a hero image error, promote the next brief item that has an image into the hero slot; the failed lead becomes a text tile. Resets to the lead on each fresh brief. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<script>
|
||||
let { article, onaction, onreplace, ontag, hero = false } = $props();
|
||||
let { article, onaction, onreplace, ontag, onimageerror, hero = false } = $props();
|
||||
|
||||
const humanize = (s) => (s || '').replace(/-/g, ' ');
|
||||
// Grouping tags are the doorways; cap at 3 so cards stay calm. Fall back to
|
||||
@@ -49,7 +49,7 @@
|
||||
{#if showImage}
|
||||
<a class="media" href={safeHref} target="_blank" rel="noopener">
|
||||
<img src={article.image_url} alt="" loading="lazy" referrerpolicy="no-referrer"
|
||||
onerror={() => (failed = true)} />
|
||||
onerror={() => { failed = true; onimageerror?.(); }} />
|
||||
</a>
|
||||
{/if}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user