Не верное значение переменной в функции

Есть Switch и анимированный элемент квадрат, когда значение Switch (beginAnimation) true, должен анимироваться (крутится) квадрат, и когда анимация заканчивается, если beginAnimation ещё true, то он должен крутиться еще раз, и так пока beginAnimation не станет false.

Но проблема в том, что если я включаю переключатель, анимацию уже не остановить, я дебажил и увидел, что в .start() beginAnimation всегда true, даже если в самом компоненте оно false, и квадрат крутится бесконечно.

Из за чего в .start() значение beginAnimation всегда true?

import React, { useState, useRef, useEffect } from 'react';
import { StyleSheet, Switch, View, Animated } from 'react-native';

export default function App() {

  const [beginAnimation, setBeginAnimation] = useState(false);
  const rotateValue = useRef(new Animated.Value(0)).current;
  const toggleValue = () => setBeginAnimation( !beginAnimation );

  const rotate = () => {
    console.log('rotate | ', beginAnimation);
    rotateValue.setValue(0);
    Animated.timing(
      rotateValue,
      {
        toValue: 1,
        duration: 1500
      }
    ).start( () => {
      console.log('.start | ', beginAnimation);
      if (beginAnimation) {
        rotate();
      }
    });
  }

  useEffect( () => {
    // Здесь проверка для того, что бы при монтировании анимация не срабатывала
    if (beginAnimation) {
      rotate();
    }
    console.log('useEffect | ', beginAnimation);
  });

  return (
    <View style={styles.container}>

      <Animated.View 
        style={[
          styles.square, 
          {
            transform: [
              {rotate: rotateValue.interpolate({
                inputRange: [0, 1],
                outputRange: ['0deg', '360deg']
              })}
            ]
          }
        ]}
      >
      </Animated.View>

      <Switch 
        onValueChange={toggleValue}
        value={beginAnimation}
      />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  },
  square: {
    width: 100,
    height: 100,
    backgroundColor: '#DC3C85'
  }
});

Пример вывода в консоль ниже: