[2.1.1] Thumb not moving after updating from 2.0.8 to 2.1.1

[alantoa]

[2.1.1] Thumb not moving after updating from 2.0.8 to 2.1.1

[alantoa]

just fixed thumbIndex.value === 0; to thumbIndex.value = 0;, and released to v2.1.2, thanks found it.
also disableTrackFollow still needs to check.

[alantoa]

https://github.com/alantoa/react-native-awesome-slider/pull/27/files
just created a PR, I think should fix both issues.
and released v2.1.3.

[efstathiosntonas]

Just tested it, it works as it should. Thanks @alantoa, good work!

[efstathiosntonas]

disableTrackFollow prop is the culprit. Trying to figure what is causing it.

[alantoa]

hey, @efstathiosntonas, its a bit repetitive during the swipe, so I remove thumb logic.
this is before video, maybe need to do adjust for this.

Simulator.Screen.Recording.-.iPhone.13.-.2022-09-23.at.16.53.29.mp4

[efstathiosntonas]

After going through the entire diff between 2.0.8 and 2.1.1 I realised that you're using ref only on the bubble so discard the intro on the initial comment. Something is causing the thumb to not move if disableTrackFollow is enabled. Looking into it now.

[alantoa]

just check it, make sense!
maybe we just make the disableTrackFollow change to Animated.SharedValue, and turn it when isScrubbing=true.

[alantoa]

we don't need it when isScrubbing = false.

[alantoa]

also, add you to manage of this lib, feel free to change it.

[efstathiosntonas]

Thanks for adding me as a collaborator. This useAnimatedReaction is causing the issue, at 2.0.8 the calculations where different.

edit: link:

react-native-awesome-slider/src/slide.tsx

Line 656 in 5a1fc1c

useAnimatedReaction(

[efstathiosntonas]

This entire function is missing from 2.1.1

  // setting thumbValue
  useAnimatedReaction(
    () => {
      if (isScrubbing && isScrubbing.value) {
        return undefined;
      }
      if (step) {
        return undefined;
      }
      const currentValue =
        (progress.value / (minimumValue.value + maximumValue.value)) *
        (width.value - (disableTrackFollow ? thumbWidth : 0));
      return clamp(currentValue, 0, width.value - thumbWidth);
    },
    data => {
      if (data !== undefined) {
        thumbValue.value = data;
      }
    },
    [thumbWidth, maximumValue, minimumValue, step, progress, width],
  );

when i added it back it worked as it should 🤔

[alantoa]

yeah, I didn't know you needed this before.
now I know you add isScrubbing prop to work this, but I'm not sure other people will add isScrubbing prop, I hope this component is simple to use.
so I think need an isScrubbingInner value to use the inner component, that's prefect!

[efstathiosntonas]

It won't work if I remove the isScrubbing prop and enable the disableTrackFollow prop. Am I missing something on the "config"?

Just to be sure we're on the same page, this is how I'm using it:

Screen.Recording.2022-09-23.at.12.29.29.mov