An old animated sync icon, for an old version of React Native (0.40.0)

animated-sync-icon.jsx

import React, {
  PropTypes, Component
} from 'react';
import {
  Animated, Easing
} from 'react-native';

// BYO sync icon
const SYNC = require('../images/sync.png')

class AnimatedSync extends Component {
  state={spinValue:new Animated.Value(0)}
  constructor(props){
    super(props);
    console.log('AnimatedSync :::', props, this.state)
    this.animate()
  }

  animate=()=>(
    this.state.spinValue.setValue(0),
    Animated.timing(
      this.state.spinValue,
      {
        toValue: 5,
        duration: 3000,
        easing: Easing.linear,
        useNativeDriver: true,
      }
    ).start(this.animate)
  )

  render(){
    const spin = this.state.spinValue.interpolate({
      //inputRange: [0, 0.05, 0.1, 0.2, 1, 10],
      inputRange: [0, 0.1, 0.2, 0.4, 1, 5],
      outputRange: ['0deg', '-20deg', '-30deg', '0deg', '360deg', '360deg']
    })

    return (
      <Animated.Image source={SYNC} style={[
        (this.props.statusButtonIconStyle || styles.defaultImageStyle),
        { width: 23, height: 29, resizeMode: 'contain', transform: [{rotate: spin}] }]} >
      </Animated.Image>
    );
  }
}

export default AnimatedSync

This was originally used in a button that showed a static image using a clockwise arrow (something like ⟳), and when pressed would animate to indicate that the syncing was in progress.