"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _ImageViewer = _interopRequireDefault(require("../ImageViewer/ImageViewer"));
var _ImageFeedSkeleton = _interopRequireDefault(require("../../components/ImageFeedSkeleton/ImageFeedSkeleton"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const ImageGallery = ({
  posts,
  accessibilityId,
  isLoading,
  themeStyles,
  onNextPage
}) => {
  const {
    width
  } = _reactNative.Dimensions.get('window');
  const [openImageViewer, setOpenImageViewer] = (0, _react.useState)(false);
  const [currentImageIndex, setCurrentImageIndex] = (0, _react.useState)(0);
  const imageWidth = (width - 32 - 8) / 2;
  const styles = _reactNative.StyleSheet.create({
    container: {
      flex: 1,
      padding: 16
    },
    contentContainer: {
      gap: 8
    },
    columnWrapper: {
      justifyContent: 'space-between'
    },
    image: {
      width: imageWidth,
      height: imageWidth,
      borderRadius: 8
    }
  });
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_reactNative.FlatList, {
    accessibilityLabel: accessibilityId,
    testID: accessibilityId,
    data: posts,
    scrollEnabled: false,
    keyExtractor: item => item.data.fileId,
    renderItem: ({
      item,
      index
    }) => {
      const uri = item.getImageInfo().fileUrl + '?size=medium';
      return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
        onPress: () => {
          setCurrentImageIndex(index);
          setOpenImageViewer(true);
        }
      }, /*#__PURE__*/React.createElement(_reactNative.Image, {
        source: {
          uri
        },
        style: styles.image,
        resizeMode: "cover"
      }));
    },
    numColumns: 2,
    onEndReachedThreshold: 0.5,
    columnWrapperStyle: styles.columnWrapper,
    contentContainerStyle: styles.contentContainer,
    onEndReached: () => {
      onNextPage === null || onNextPage === void 0 || onNextPage();
    },
    ListEmptyComponent: isLoading ? /*#__PURE__*/React.createElement(_ImageFeedSkeleton.default, {
      themeStyles: themeStyles
    }) : null,
    style: styles.container
  }), openImageViewer && /*#__PURE__*/React.createElement(_reactNative.Modal, {
    visible: openImageViewer,
    transparent: true,
    animationType: "fade",
    onRequestClose: () => setOpenImageViewer(false)
  }, /*#__PURE__*/React.createElement(_ImageViewer.default, {
    images: (posts === null || posts === void 0 ? void 0 : posts.map(item => item.getImageInfo().fileUrl + '?size=medium')) || [],
    currentImageIndex: currentImageIndex,
    themeStyles: themeStyles,
    onNextImage: () => {
      if (currentImageIndex < ((posts === null || posts === void 0 ? void 0 : posts.length) || 0) - 1) {
        setCurrentImageIndex(currentImageIndex + 1);
      }
    },
    onPreviousImage: () => {
      if (currentImageIndex > 0) {
        setCurrentImageIndex(currentImageIndex - 1);
      }
    },
    onClose: () => {
      setOpenImageViewer(false);
    }
  })));
};
var _default = exports.default = ImageGallery;
//# sourceMappingURL=ImageGallery.js.map