import React, { PropTypes } from 'react';
import {
  View,
  Modal,
  ActivityIndicator,
} from 'react-native';

import styles from './styles';

// The "Activity" component will only display
// if the "visible" property is try. The modal
// content is an "<ActivityIndicator>" component.
const Activity = props => (
  <Modal visible={props.visible} transparent>
    <View style={styles.modalContainer}>
      <ActivityIndicator size={props.size} />
    </View>
  </Modal>
);

Activity.propTypes = {
  visible: PropTypes.bool.isRequired,
  size: PropTypes.string.isRequired,
};

Activity.defaultProps = {
  visible: false,
  size: 'large',
};

export default Activity;
