import {Dimensions, View} from 'react-native';
import {DocumentPickerResponse} from 'react-native-document-picker';
import Video from 'react-native-video';
import {backgroundColor} from './constants';

export default function Item({
  slide,
  value,
  index,
}: {
  slide: number;
  value: DocumentPickerResponse;
  index: number;
}) {
  const height = Dimensions.get('screen').height;

  return (
    <View
      style={{
        height: '100%',
        width: '100%',
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor,
      }}>
      <Video
        key={value.name}
        paused={slide !== index}
        style={{width: 200, height: height / 2}}
        source={{uri: value.uri}}
      />
    </View>
  );
}