React native animated button

import React from 'react';
import {Button} from '@ui-kitten/components';
import {useAnimatedStyle, useSharedValue, withRepeat, withSpring} from 'react-native-reanimated';
import {ButtonProps} from '@ui-kitten/components/ui/button/button.component';
import Animated from 'react-native-reanimated';

export const BreatheButton: React.FC<ButtonProps> = (props: any) => {
  const scale = useSharedValue(1);

  React.useEffect(() => {
    scale.value = withRepeat(
      withSpring(1.2, {damping: 1, stiffness: 80}),
      -1, // repeat indefinitely
      true, // reverse animation on each iteration
    );
  }, []);

  const animatedStyle = useAnimatedStyle(() => {
    return {
      transform: [{scale: scale.value}],
    };
  });

  return (
    <Animated.View style={[animatedStyle]}>
      <Button {...props}>
        {props.children}
      </Button>
    </Animated.View>
  );
};