React Native: How to use the Animated API for a shake animation?

1import { Animated } from "react-native";
2
3function useShakeAnimation() {
4  const shakeAnim = useRef(new Animated.Value(0)).current;
5
6  const shake = () => {
7    Animated.sequence([
8      Animated.timing(shakeAnim, {
9        toValue: 10,
10        duration: 50,
11        useNativeDriver: true,
12      }),
13      Animated.timing(shakeAnim, {
14        toValue: -10,
15        duration: 50,
16        useNativeDriver: true,
17      }),
18      Animated.timing(shakeAnim, {
19        toValue: 10,
20        duration: 50,
21        useNativeDriver: true,
22      }),
23      Animated.timing(shakeAnim, {
24        toValue: 0,
25        duration: 50,
26        useNativeDriver: true,
27      }),
28    ]).start();
29  };
30
31  return { shake, shakeAnim };
32}
33
34// Usage
35function LoginForm() {
36  const { shake, shakeAnim } = useShakeAnimation();
37
38  return (
39    <Animated.View style={{ transform: [{ translateX: shakeAnim }] }}>
40      <TextInput placeholder="Password" />
41      <Button onPress={shake} title="Shake" />
42    </Animated.View>
43  );
44}