diff --git a/src/components/messageStream/overlays/ImageLightbox.tsx b/src/components/messageStream/overlays/ImageLightbox.tsx
index 639f786..c41657d 100644
--- a/src/components/messageStream/overlays/ImageLightbox.tsx
+++ b/src/components/messageStream/overlays/ImageLightbox.tsx
@@ -147,34 +147,36 @@ function Filmstrip({
className="shrink-0 bg-gradient-to-t from-black/90 to-transparent pb-[max(env(safe-area-inset-bottom),0.75rem)] pt-3"
onClick={(e) => e.stopPropagation()}
>
-
- {images.map((image, i) => {
- const active = i === index;
- return (
-
- );
- })}
+
+
+ {images.map((image, i) => {
+ const active = i === index;
+ return (
+
+ );
+ })}
+
);
@@ -213,13 +215,21 @@ function LightboxView({
if (e.key === "ArrowRight") goNext();
};
window.addEventListener("keydown", onKey);
+ return () => window.removeEventListener("keydown", onKey);
+ }, [goPrev, goNext, onClose]);
+
+ // Lock background scroll while the lightbox is open, then restore the exact
+ // scroll position on close — otherwise dismissing the overlay leaves the page
+ // scrolled back to the top instead of where the user was reading.
+ useEffect(() => {
+ const scrollY = window.scrollY;
const prevOverflow = document.body.style.overflow;
document.body.style.overflow = "hidden";
return () => {
- window.removeEventListener("keydown", onKey);
document.body.style.overflow = prevOverflow;
+ window.scrollTo(0, scrollY);
};
- }, [goPrev, goNext, onClose]);
+ }, []);
useEffect(() => {
setIsCaptionVisible(true);