import { useMemo } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { ItemHoverTopOptions, InputAndLabel, PC } from '@filerobot/common';
import { Remove, Download, Rename, Link, EditImage } from '@scaleflex/icons';
import copyText from '@filerobot/utils/lib/copyText';
import getFileLink from '@filerobot/utils/lib/getFileLink';
import { useTheme } from '@scaleflex/ui/theme/hooks';
import { useModal } from '@filerobot/core/lib/hooks';
import { useExplorer } from '../../../../hooks';
import Styled from './Variants.styled';
import { downloadOneFile, emitExportEvent } from '../../../../slices/downloads.slice';
import { useDownloadConsentModal } from '../../../Modals';
import { selectIsShareboxView } from '../../../../slices/views.slice';
import prepareExportedFilesLinks from '../../../../utils/prepareExportedFilesLinks';
import { jsx as _jsx } from "react/jsx-runtime";
var VariantTopOptions = function VariantTopOptions(_ref) {
  var variant = _ref.variant,
    editName = _ref.editName,
    deleteVariant = _ref.deleteVariant,
    editVariantImage = _ref.editVariantImage,
    hideUpdateOperations = _ref.hideUpdateOperations;
  var dispatch = useDispatch();
  var toggleModal = useModal();
  var toggleDownloadConsentModal = useDownloadConsentModal();
  var theme = useTheme();
  var isShareboxView = useSelector(selectIsShareboxView);
  var _useExplorer = useExplorer(),
    i18n = _useExplorer.i18n,
    info = _useExplorer.info,
    _useExplorer$opts = _useExplorer.opts,
    noImgOperationsAndDownload = _useExplorer$opts.noImgOperationsAndDownload,
    preventDownloadDefaultBehavior = _useExplorer$opts.preventDownloadDefaultBehavior;
  var uuid = variant.uuid,
    name = variant.name;
  var copyLinkToClipboard = function copyLinkToClipboard() {
    copyText(getFileLink(variant), i18n, info);
  };
  var notifyAndDownload = function notifyAndDownload() {
    // TODO(Amr H): figure out way to show download bar in manage modal or close it
    // info(
    //   i18n('mutualizedDownloadStartedInfo')
    // )
    if (preventDownloadDefaultBehavior) {
      dispatch(emitExportEvent(prepareExportedFilesLinks([variant])));
      return;
    }
    toggleDownloadConsentModal(function () {
      return dispatch(downloadOneFile({
        file: variant
      }));
    });
  };
  var startEditName = function startEditName() {
    var newName = name;
    var updateName = function updateName(e) {
      newName = e.target.value;
    };
    var variantNameInputId = 'filerobotVariantNameModalInput';
    toggleModal({
      icon: /*#__PURE__*/_jsx(Rename, {
        size: 16,
        color: theme.palette[PC.AccentPrimary]
      }),
      showTitleLabel: true,
      title: i18n('mutualizedChangeVariantTitle'),
      secondaryTitle: i18n('mutualizedWriteNewVariantTitle'),
      content: /*#__PURE__*/_jsx(InputAndLabel, {
        defaultValue: name,
        onChange: updateName,
        id: variantNameInputId,
        i18n: i18n
      }),
      onButtonPrimaryClick: function onButtonPrimaryClick() {
        return editName({
          uuid: uuid,
          name: newName
        });
      },
      modalFooterStyle: {
        flexDirection: 'row',
        padding: 24
      },
      inputToFocus: variantNameInputId,
      enterKeySubmits: true,
      disableAutoClose: true
    });
  };
  var handleVariantDeletion = function handleVariantDeletion() {
    toggleModal({
      icon: /*#__PURE__*/_jsx(Remove, {
        size: 16,
        color: theme.palette[PC.Error]
      }),
      showTitleLabel: true,
      title: i18n('variantTabDeleteVariantTitle'),
      content: /*#__PURE__*/_jsx(Styled.VariantName, {
        children: i18n('mutualizedVariantWillBeDeletedInfo', {
          variant_name: name
        })
      }),
      buttonPrimaryLabel: i18n('mutualizedDeleteButtonLabel'),
      buttonPrimaryBg: theme.palette[PC.ERROR],
      onButtonPrimaryClick: function onButtonPrimaryClick() {
        return deleteVariant(uuid);
      },
      modalFooterStyle: {
        flexDirection: 'row',
        padding: 24
      },
      enterKeySubmits: true,
      disableAutoClose: true
    });
  };
  var options = useMemo(function () {
    return [{
      key: 'GridLi-CopyLink',
      Icon: Link,
      iconSize: 12,
      onClick: copyLinkToClipboard
    }, {
      key: 'GridLi-DownloadVariant',
      Icon: Download,
      iconSize: 12,
      onClick: notifyAndDownload,
      hidden: noImgOperationsAndDownload
    }, {
      key: 'GridLi-EditImage',
      Icon: EditImage,
      iconSize: 12,
      onClick: function onClick() {
        return editVariantImage(variant);
      },
      hidden: hideUpdateOperations
    }, {
      key: 'GridLi-EditName',
      Icon: Rename,
      iconSize: 12,
      onClick: startEditName,
      hidden: isShareboxView || hideUpdateOperations
    }, {
      key: 'GridLi-DeleteVariant',
      Icon: Remove,
      iconSize: 12,
      onClick: handleVariantDeletion,
      hidden: isShareboxView || hideUpdateOperations
    }];
  }, [variant]);
  return /*#__PURE__*/_jsx(ItemHoverTopOptions, {
    options: options
  });
};
export default VariantTopOptions;