How to disable animations when the user scrolls (react-native-reanimated 2)

Question

Here's a weekly mini calendar, that turns into a monthly mini calendar component.

When it turns from weekly to monthly we have some entering/exiting animations So far so good.

Problem:

The problem is, that those animations (being entering/exiting animations) also take place while the user is scrolling.

As you can see in the gif, animations play when I scroll horizontally, which isn't what I want, I only want animations when the component changes from weekly to monthly (expands/collapses)

Code:

  import Animated, {
    FadeInDown,
    FadeInUp,
    SlideOutUp,
    SlideOutDown,
  } from 'react-native-reanimated';

  const MiniCalendarItem = () => {
    let animationEnter;
    let animationExit;
    if (this.props.itemRepresents === ITEM_REPRESENTS.MONTH) {
      if (this.dayIsPartOfCurrentWeek(day)) {
        animationEnter = FadeInUp;
      } else {
        animationEnter = FadeInUp.delay((weekIndex * 150)).duration(350)
      }
      animationExit = SlideOutDown.duration(400);
    } else {
      animationEnter = FadeInDown.duration(500);
      animationExit = SlideOutUp.duration(400);
    }

    return (
      <Animated.View
        entering={animationEnter}
        exiting={animationExit}
        key={`dayData_${dayProps.id}`}
      >
        {...}
      </Animated.View>
    );
  };

and here's the parent:

  renderItem = () => {
    return (
      <MiniCalendarItem
        animationsEnabled
        key={itemKey}
        mode={mode}
        itemRepresents={visible ? ITEM_REPRESENTS.MONTH : ITEM_REPRESENTS.WEEK}
      />
    )
  }
}

Essentially the parent is a ScrollView (not a FlatList)

Question: How can I stop react-native-reanimated@2 from playing any animations and when is it a good time to do that.

I added a animationsEnabled prop, but ideally I'd love to feed it with an Animated.Value(true) object. I'm just not sure how to conditionally disable animations based on that prop, from within the MiniCalendarItem.