Fix resize handler: use ref to avoid stale closure and listener churn

Register resize listener once with empty deps; track left via ref so
the debounced callback always reads the current offset without
re-registering on every click.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Philip Peterson 2026-06-03 01:40:15 -07:00
parent b0eaca462f
commit b41113f318

View file

@ -1,5 +1,5 @@
import { h, render } from "https://esm.sh/preact@10";
import { useState, useRef } from "https://esm.sh/preact@10/hooks";
import { useState, useEffect, useRef } from "https://esm.sh/preact@10/hooks";
import { html } from "https://esm.sh/htm@3/preact";
const TESTIMONIALS = [
@ -54,6 +54,27 @@ function Testimonials() {
setLeft(function (l) { return Math.max(-maxL, l - STEP); });
};
var leftRef = useRef(left);
leftRef.current = left;
useEffect(function () {
var timer;
function onResize() {
clearTimeout(timer);
timer = setTimeout(function () {
var max = measureMax();
if (-leftRef.current > max) {
setLeft(-max);
}
}, 150);
}
window.addEventListener("resize", onResize);
return function () {
clearTimeout(timer);
window.removeEventListener("resize", onResize);
};
}, []);
var atStart = left >= 0;
return html`