InteractionManager.runAfterInteractions not running after using RangeSlider component

[gobzila]

trafficstars

Description

InteractionManager.runAfterInteractions's callback is not called after RangeSlider component is rendered at least once.

Version

2.2.2

Steps to reproduce

1. Render RangeSlider component.
2. Use InteractionManager.runAfterInteractions(callback). It doesn't matter if RangeSlider is unmounted or not.
3. InteractionManager.runAfterInteractions's callback is not called.

Cause

The package uses PanResponder which holds an InteractionManager handle to block long-running JS events from interrupting active gestures. Basically blocks all InteractionManager.runAfterInteractions's callbacks until the interaction handle is cleared.

In this package PanResponder's instance is created using useMemo and is re-created during each ongoing gesture (because its dependencies change) which causes the interaction handle's reference to be orphaned without being cleared.

Solution

Switch from useMemo to useRef as shown in React Native docs (https://reactnative.dev/docs/panresponder#usage-pattern).

[rick-nice]

(https://github.com/githuboftigran/rn-range-slider/pull/150) Fixed this problem here