react-native-reanimated-progress-bar/src/animations/useAnimatedProgress/useAnimatedProgress.native.ts

React Native animated progress bar, using react-native-reanimated

import { useEffect, useState } from "react";
import Animated, { EasingNode } from "react-native-reanimated";

const { Value, timing } = Animated;

export default function useAnimatedProgress(width: number, percent: number): Animated.Node<number> {
  const [translateX] = useState(new Value(0));

  useEffect(() => {
    timing(translateX, {
      toValue: width * percent,
      duration: 200,
      easing: EasingNode.inOut(EasingNode.ease)
    }).start();
  }, [percent, width]);

  return translateX;
}