"use strict";

import React, { useState } from 'react';
import { Container } from './StyledInputComponents/MediaComponents';
import { useDispatch } from 'react-redux';
import { setActiveFile, setActiveModal } from '../../roomStore/chatSettingsSlice';
import { MODAL_TYPES } from '../../helpers/constants/MODAL_TYPES';
import { ActivityIndicator, Image, TouchableOpacity } from 'react-native';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const CustomMessageImage = ({
  fileURL,
  fileName,
  mimetype
}) => {
  const [error, setError] = useState(false);
  const [loading, setLoading] = useState(true);
  const dispatch = useDispatch();
  const handleOpen = () => {
    dispatch(setActiveFile({
      fileName,
      fileURL,
      mimetype
    }));
    dispatch(setActiveModal(MODAL_TYPES.FILE_PREVIEW));
  };
  return /*#__PURE__*/_jsx(Container, {
    children: /*#__PURE__*/_jsxs(TouchableOpacity, {
      onPress: handleOpen,
      children: [loading && /*#__PURE__*/_jsx(ActivityIndicator, {
        size: "small",
        color: "#0052CD"
      }), /*#__PURE__*/_jsx(Image, {
        src: fileURL || 'https://as2.ftcdn.net/v2/jpg/02/51/95/53/1000_F_251955356_FAQH0U1y1TZw3ZcdPGybwUkH90a3VAhb.jpg',
        style: {
          borderRadius: 16,
          width: 150,
          height: 200
        },
        onError: () => setError(true),
        onLoadEnd: () => setLoading(false),
        resizeMode: "cover"
      })]
    })
  });
};
export default CustomMessageImage;
//# sourceMappingURL=MessageImage.js.map