diff --git a/apps/desktop/src/screens/tabs/LiveArt.tsx b/apps/desktop/src/screens/tabs/LiveArt.tsx index f86dbea..a6669e7 100644 --- a/apps/desktop/src/screens/tabs/LiveArt.tsx +++ b/apps/desktop/src/screens/tabs/LiveArt.tsx @@ -44,16 +44,11 @@ function LiveThumb({ target, tile, name }: { target: string; tile: LiveArtTile; const [src, setSrc] = useState(tile.thumb ? cache.get(`${target}|${tile.thumb}`) : null); useEffect(() => { if (!tile.thumb || src !== undefined) return; - const el = ref.current; - if (!el) return; + // loaded right away, not on scroll: an IntersectionObserver may never fire in a hidden (tray) window, and a store + // has at most a few dozen live images let alive = true; - const io = new IntersectionObserver(es => { - if (!es.some(x => x.isIntersecting)) return; - io.disconnect(); - loadThumb(target, tile.thumb).then(u => { if (alive) setSrc(u); }); - }, { rootMargin: '300px' }); - io.observe(el); - return () => { alive = false; io.disconnect(); }; + loadThumb(target, tile.thumb).then(u => { if (alive) setSrc(u); }); + return () => { alive = false; }; }, [target, tile.thumb, src]); const w = tile.w ?? 9, h = tile.h ?? 16; const state = tile.state === 'n/a' ? null : tile.state;