"use strict";

import { View, Text, StyleSheet, Modal, TouchableOpacity, SafeAreaView } from 'react-native';
import { MediaContainer, MediaImage } from './StyledInputComponents/StyledInputComponents';
import { FileIcon } from '../../assets/icons';
import { RemoveButton, RemoveButtonText } from './StyledComponents';
import { useState } from 'react';
import { useVideoPlayer, VideoView } from 'expo-video';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const VideoThumb = ({
  uri,
  onPress
}) => {
  const player = useVideoPlayer(uri, p => {
    p.muted = true;
  });
  return /*#__PURE__*/_jsxs(TouchableOpacity, {
    activeOpacity: 0.8,
    onPress: onPress,
    style: styles.videoThumb,
    children: [/*#__PURE__*/_jsx(VideoView, {
      player: player,
      style: StyleSheet.absoluteFill,
      contentFit: "cover",
      nativeControls: false,
      surfaceType: "textureView",
      pointerEvents: "none"
    }), /*#__PURE__*/_jsx(View, {
      style: styles.playOverlay,
      children: /*#__PURE__*/_jsx(Text, {
        style: styles.playIcon,
        children: "\u25B6"
      })
    })]
  });
};
const FullscreenPreviewVideo = ({
  uri
}) => {
  const player = useVideoPlayer(uri, p => {
    p.play();
  });
  return /*#__PURE__*/_jsx(VideoView, {
    player: player,
    style: styles.fullVideo,
    contentFit: "contain",
    nativeControls: true,
    surfaceType: "textureView"
  });
};
export const MediaFilePreview = ({
  filePreviews,
  handleRemoveImage
}) => {
  const [previewUri, setPreviewUri] = useState(null);
  return /*#__PURE__*/_jsxs(MediaContainer, {
    children: [filePreviews.map((file, index) => {
      const isImage = file.type?.startsWith('image');
      const isVideo = file.type?.startsWith('video');
      return /*#__PURE__*/_jsxs(View, {
        children: [isImage ? /*#__PURE__*/_jsx(MediaImage, {
          source: {
            uri: file.uri
          }
        }) : isVideo ? /*#__PURE__*/_jsx(VideoThumb, {
          uri: file.uri,
          onPress: () => setPreviewUri(file.uri)
        }) : /*#__PURE__*/_jsx(View, {
          style: {
            width: 70,
            height: 70,
            borderRadius: 8
          },
          children: /*#__PURE__*/_jsx(FileIcon, {
            width: 70,
            height: 70
          })
        }), /*#__PURE__*/_jsx(RemoveButton, {
          onPress: () => handleRemoveImage(index),
          children: /*#__PURE__*/_jsx(RemoveButtonText, {
            children: "\xD7"
          })
        })]
      }, `${file.name}_${index}`);
    }), /*#__PURE__*/_jsx(Modal, {
      visible: !!previewUri,
      animationType: "fade",
      transparent: true,
      children: /*#__PURE__*/_jsxs(SafeAreaView, {
        style: styles.modalContainer,
        children: [/*#__PURE__*/_jsx(TouchableOpacity, {
          style: styles.closeButton,
          onPress: () => setPreviewUri(null),
          children: /*#__PURE__*/_jsx(Text, {
            style: styles.closeText,
            children: "\u2715"
          })
        }), previewUri && /*#__PURE__*/_jsx(FullscreenPreviewVideo, {
          uri: previewUri
        })]
      })
    })]
  });
};
const styles = StyleSheet.create({
  videoThumb: {
    width: 70,
    height: 70,
    borderRadius: 8,
    overflow: 'hidden',
    backgroundColor: '#1a1a1a'
  },
  playOverlay: {
    ...StyleSheet.absoluteFillObject,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'rgba(0,0,0,0.3)'
  },
  playIcon: {
    fontSize: 24,
    color: '#fff'
  },
  modalContainer: {
    flex: 1,
    backgroundColor: '#000',
    justifyContent: 'center'
  },
  closeButton: {
    position: 'absolute',
    top: 60,
    right: 20,
    zIndex: 10,
    width: 36,
    height: 36,
    borderRadius: 18,
    backgroundColor: 'rgba(255,255,255,0.2)',
    justifyContent: 'center',
    alignItems: 'center'
  },
  closeText: {
    fontSize: 18,
    color: '#fff',
    fontWeight: '600'
  },
  fullVideo: {
    width: '100%',
    height: '70%'
  }
});
//# sourceMappingURL=MediaFilePreview.js.map