import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React, { useEffect, useState } from "react";
import GalleryArea from "../GalleryArea";

var VisualSection = function VisualSection(props) {
  var assets = props.assets,
      suggestedAssets = props.suggestedAssets,
      translations = props.translations,
      isLoadingAssets = props.isLoadingAssets,
      generatingFromAI = props.generatingFromAI,
      setIsLoadingAssets = props.setIsLoadingAssets;
  var onRemoveAsset = props.onRemoveAsset;

  var _useState = useState(assets.slice().reverse()),
      _useState2 = _slicedToArray(_useState, 2),
      images = _useState2[0],
      setImages = _useState2[1];

  useEffect(function () {
    setImages(assets.slice().reverse());
  }, [assets]);
  useEffect(function () {
    if (!generatingFromAI && suggestedAssets.length > 0) {
      setIsLoadingAssets(false);
      setImages([].concat(_toConsumableArray(assets), _toConsumableArray(suggestedAssets)).slice().reverse());
    }
  }, [generatingFromAI]);
  return /*#__PURE__*/React.createElement(GalleryArea, {
    images: images,
    onRemoveAsset: onRemoveAsset,
    translations: translations,
    isLoadingAssets: isLoadingAssets
  });
};

export default VisualSection;