Ionosphere.tv
fix: use native OS scroll physics — just remap deltaY to scrollLeft
No custom momentum, no rAF loop. macOS trackpad already provides
inertial scroll events. Just forward deltaY to scrollLeft directly.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
+6
-17
+6
-17
apps/ionosphere/src/app/discussion/DiscussionContent.tsx
+6
-17
apps/ionosphere/src/app/discussion/DiscussionContent.tsx
···
369
369
}, [numCols, scrollColWidth, allCols]);
370
370
371
371
// Wheel → horizontal scroll
372
-
// Wheel → horizontal scroll with momentum/inertia
372
+
// Wheel → horizontal native scroll (just remap Y to X, let OS handle physics)
373
373
useEffect(() => {
374
374
if (numCols <= 1) return;
375
375
const el = scrollContainerRef.current;
376
376
if (!el) return;
377
377
378
-
let velocity = 0;
379
-
let raf = 0;
380
-
const FRICTION = 0.95; // slower decay = longer coast, more macOS-like
381
-
const MIN_VELOCITY = 0.3;
382
-
383
-
const coast = () => {
384
-
velocity *= FRICTION;
385
-
if (Math.abs(velocity) < MIN_VELOCITY) { velocity = 0; raf = 0; return; }
386
-
el.scrollLeft += velocity;
387
-
raf = requestAnimationFrame(coast);
388
-
};
389
-
390
378
const onWheel = (e: WheelEvent) => {
379
+
// Only remap if scrolling vertically (not already horizontal trackpad gesture)
391
380
if (Math.abs(e.deltaY) > Math.abs(e.deltaX)) {
392
381
e.preventDefault();
393
-
velocity += e.deltaY * 0.25; // gentler input scaling
394
-
velocity = Math.max(-40, Math.min(40, velocity)); // lower clamp
395
-
if (!raf) raf = requestAnimationFrame(coast);
382
+
// Use scrollBy without smooth — the OS wheel event stream already
383
+
// provides momentum/inertia on macOS trackpads
384
+
el.scrollLeft += e.deltaY;
396
385
}
397
386
};
398
387
399
388
el.addEventListener("wheel", onWheel, { passive: false });
400
-
return () => { el.removeEventListener("wheel", onWheel); if (raf) cancelAnimationFrame(raf); };
389
+
return () => el.removeEventListener("wheel", onWheel);
401
390
}, [numCols]);
402
391
403
392
const handleSelect = useCallback(