fix: remove magnifierSpring.zoom from effect dependencies
**Root Cause:** The animation effect wasn't running when targetZoom changed because magnifierSpring.zoom (a React Spring value) was in the dependency array. Spring values don't trigger React effects correctly. **Evidence from logs:** - setTargetZoom(15.8) was being called repeatedly ✅ - currentZoom stayed stuck at 205.9× ❌ - No [useMagnifierZoom] Animation effect logs appeared ❌ This meant the effect never ran, so magnifierApi.start() was never called, and the spring animation never updated to the new target zoom. **Fix:** Remove magnifierSpring.zoom from the dependency array. The effect should run based on targetZoom changes (which is a regular state value), not spring value changes. We still read magnifierSpring.zoom.get() inside the effect to check currentZoom, but we don't depend on it to trigger the effect. **Impact:** - Effect now runs every time targetZoom changes - Spring animation will start/update correctly - Zoom will no longer freeze after exiting pointer lock 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
7683948a48
commit
5eb2eeda32
|
|
@ -223,14 +223,16 @@ export function useMagnifierZoom(options: UseMagnifierZoomOptions): UseMagnifier
|
||||||
magnifierApi.start({ zoom: targetZoom })
|
magnifierApi.start({ zoom: targetZoom })
|
||||||
}
|
}
|
||||||
}, [
|
}, [
|
||||||
targetZoom,
|
targetZoom, // Effect runs when target zoom changes
|
||||||
pointerLocked,
|
pointerLocked, // Effect runs when pointer lock state changes
|
||||||
viewBox,
|
viewBox,
|
||||||
threshold,
|
threshold,
|
||||||
containerRef,
|
containerRef,
|
||||||
svgRef,
|
svgRef,
|
||||||
magnifierApi,
|
magnifierApi,
|
||||||
magnifierSpring.zoom,
|
// NOTE: Do NOT include magnifierSpring.zoom here!
|
||||||
|
// Spring values don't trigger React effects correctly.
|
||||||
|
// We read spring.zoom.get() inside the effect, but don't depend on it.
|
||||||
])
|
])
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue