react animation animated component undefined

I want to create a circular animation like a wave and i found that code on the internet. And i converted and changed it with react hooks but then this code does not work correctly. Where is my mistake?

const constructAnimations = [...Array(COUNT).keys()].map(() => initialPhase);

export default function SearchAnimation() {
  const [stateAnimations, setStateAnimations] = useState(constructAnimations);

  useEffect(() => {
    const actions = Array(COUNT).fill(
      keyframes({
        values: [initialPhase, { scale: 2, opacity: 0 }],
        duration: DURATION,
        loop: Infinity,
        yoyo: Infinity,
      })
    );

    stagger(actions, DURATION / COUNT).start((animations) => {
      setStateAnimations({ animations });
    });
  }, []);

  return (
    <View style={styles.container}>
      {[stateAnimations].map(({ opacity, scale }, index) => {
        return (
          <Animated.View
            key={index}
            style={[
              styles.circle,
              {
                transform: [{ scale }],
                opacity,
              },
            ]}
          />
        );
      })}
      <View style={styles.midCircle}>
        <FontAwesome name="phone" style={styles.icon} />
        <Text style={styles.text}>Searching</Text>
      </View>
    </View>
  );
}

Also the error message:

TypeError: undefined is not an object (evaluating 'value.getValue')
This error is located at:
    in RCTView (at View.js:34)
    in View (at createAnimatedComponent.js:165)
    in AnimatedComponent (at createAnimatedComponent.js:215)
    in ForwardRef(AnimatedComponentWrapper) (at SearchAnimation.js:33)
    in RCTView (at View.js:34)

from react animation animated component undefined