Imperative repeated animation after "main" animation completes

[brownieboy]

I have a heart icon from react-native-vector-icons. When tapped on, I want it to:

1. Animate the fontSize from 35 to 50
2. When the fontSize animation finishes animating, I want the heart to "pump" a few times. I'm using the built-in pulse animation for this.

I have it working, but it's a bit clunky. I'm using a fontSize transition to scale the icon up in size. Then I call the pulse 4 times in a row via Promise chain. Here's the code:

import * as Animatable from "react-native-animatable";
const AnimatableIcon = Animatable.createAnimatableComponent(Icon);  // Icon from Nativebase

// Inside the component
  handleFaveViewRef = ref => (this.faveView = ref);
  pulse = () =>
    this.faveView.()
      .then(() => this.faveView.())
      .then(() => this.faveView.())
      .then(() => this.faveView.())
      .catch(e => console.log(`error: ${e}`));

// Inside component's render():
  <AnimatableIcon
    ref={this.handleFaveViewRef}
    ios={favourite ? "ios-heart" : "ios-heart-outline"}
    android={favourite ? "md-heart" : "md-heart-outline"}
    transition="fontSize"
    onAnimationEnd={() => console.log("animation end")}
    style={{
      fontSize: favourite ? 50 : 35,
      color: favourite ? "red" : "grey"
    }}
    onPress={() => {
      if (!favourite) {
        setTimeout(() => {
          this.pulse();
        }, 700);
      }
      toggleFavouriteStatus();  // Sets favourite to true or false
    }}
  />

Two questions:

1. Is there better way of calling the imperative pulse animation after the fontSize transition has completed, rather than relying on a setTimeout() (basically, a guess)?
2. Is there a proper way of iterating the imperative pulse animation, rather than calling it with the long Promise chain?