text: import React, { useContext, useState } from 'react';
  import PropTypes from 'prop-types';
  import { TouchableOpacity } from 'react-native';
  import FastImage from 'react-native-fast-image';
  
  import styles from '../styles';
  import { CustomIcon } from '../../../lib/Icons';
  import { themes } from '../../../constants/colors';
  import MessageboxContext from '../Context';
  import ActivityIndicator from '../../ActivityIndicator';
  
  const Item = ({ item, theme }) => {
  	const context = useContext(MessageboxContext);
  	const { onPressCommandPreview } = context;
  	const [loading, setLoading] = useState(true);
  
  	return (
  		<TouchableOpacity
  			style={styles.commandPreview}
  			onPress={() => onPressCommandPreview(item)}
  			testID={`command-preview-item${ item.id }`}
  		>
  			{item.type === 'image'
  				? (
  					<FastImage
  						style={styles.commandPreviewImage}
  						source={{ uri: item.value }}
  						resizeMode={FastImage.resizeMode.cover}
  						onLoadStart={() => setLoading(true)}
  						onLoad={() => setLoading(false)}
  					>
  						{ loading ? <ActivityIndicator theme={theme} /> : null }
  					</FastImage>
  				)
  <<<<<<< HEAD
  				: <CustomIcon name='file-generic' size={36} color={themes[theme].actionTintColor} />
  =======
  				: <CustomIcon name='clip' size={36} color={themes[theme].actionTintColor} />
  >>>>>>> olive-develop
  			}
  		</TouchableOpacity>
  	);
  };
  
  Item.propTypes = {
  	item: PropTypes.object,
  	theme: PropTypes.string
  };
  
  export default Item;
  