var _this = this;

import React, { memo } from 'react';
import { Col } from 'react-grid-system';
import { MdCheckCircle, MdDeleteForever } from 'react-icons/md';
import "./style.css";

var Gallery = function Gallery(props) {
  var galleryImages = props.galleryImages,
      onSelectImage = props.onSelectImage,
      onDeleteImage = props.onDeleteImage;
  return galleryImages.map(function (gImage, index) {
    return /*#__PURE__*/React.createElement(Col, {
      key: index,
      className: "gallery-col",
      sm: 3
    }, /*#__PURE__*/React.createElement("div", {
      className: "img-container"
    }, /*#__PURE__*/React.createElement("button", {
      className: gImage.isSelected ? 'btn-select-img active' : 'btn-select-img',
      onClick: onSelectImage.bind(_this, index)
    }, /*#__PURE__*/React.createElement(MdCheckCircle, {
      size: "28px"
    })), /*#__PURE__*/React.createElement("a", {
      href: gImage.src
    }, /*#__PURE__*/React.createElement("img", {
      className: gImage.isSelected ? 'single-image-gallery active' : 'single-image-gallery',
      alt: gImage.date + ' - Result: ' + gImage.result + '°',
      src: gImage.src
    })), /*#__PURE__*/React.createElement("button", {
      className: "btn-delete",
      onClick: onDeleteImage.bind(_this, gImage._id)
    }, /*#__PURE__*/React.createElement(MdDeleteForever, {
      size: "25px"
    })), /*#__PURE__*/React.createElement("div", {
      className: "tags-date"
    }, gImage.date), /*#__PURE__*/React.createElement("div", {
      className: "tags-result"
    }, gImage.result)));
  });
};

export default memo(Gallery);