import { __awaiter, __generator, __read } from "tslib";
// @ts-nocheck
import './FileCard.css';
import React, { useState } from 'react';
import parse from 'html-react-parser';
import { IconTrash } from '../../icons/IconTrash/IconTrash';
import { cnMixFocus } from '../../mixs/MixFocus/MixFocus';
import { cn } from '../../utils/bem';
import { File } from '../File/File';
import { Modal } from '../Modal/Modal';
import { Typography } from '../Typography/Typography';
import { FileCardForm } from './FileCardForm';
var cnFileCard = cn('FileCard');
export var FileCard = function (_a, ref) {
    var _b;
    var title = _a.title, extension = _a.extension, size = _a.size, date = _a.date, url = _a.url, onSubmit = _a.onSubmit, popup = _a.popup, view = _a.view, removeHandler = _a.removeHandler, recaptchaKey = _a.recaptchaKey;
    var _c = __read(useState(false), 2), isModalOpen = _c[0], setIsModalOpen = _c[1];
    var _d = __read(useState(false), 2), successForm = _d[0], setSuccessForm = _d[1];
    var bytesToSize = function (bytes) {
        var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
        if (!bytes)
            return '0 Byte';
        var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
        return Math.round(bytes / Math.pow(1024, i), 2) + sizes[i];
    };
    var handlerClick = function () {
        if (popup) {
            document.body.style.overflow = 'unset';
            setIsModalOpen(true);
        }
        else if (url)
            window.open(url, '_blank');
    };
    var onSubmitHandler = function (values) { return __awaiter(void 0, void 0, void 0, function () {
        return __generator(this, function (_a) {
            switch (_a.label) {
                case 0: return [4 /*yield*/, onSubmit(values).then(function () {
                        setSuccessForm(true);
                        window.open(url, '_blank');
                    })];
                case 1:
                    _a.sent();
                    return [2 /*return*/];
            }
        });
    }); };
    return (React.createElement(React.Fragment, null,
        React.createElement("button", { type: "button", className: cnFileCard({ clicked: !!url, view: view }, [cnMixFocus()]), onClick: handlerClick },
            React.createElement("div", { className: cnFileCard('Icon') },
                React.createElement(File, { extension: extension })),
            React.createElement("div", { className: cnFileCard('Inner') },
                React.createElement(Typography.Text, { weight: "bold", className: cnFileCard('Title') }, title),
                React.createElement(Typography.Text, { size: "s", className: cnFileCard('Text') }, (_b = bytesToSize(size)) !== null && _b !== void 0 ? _b : '',
                    "\u00A0\u00A0",
                    date ? React.createElement(React.Fragment, null,
                        "Last updated ",
                        date) : null)),
            removeHandler && (React.createElement("div", { className: cnFileCard('ActionBtn'), onClick: removeHandler },
                React.createElement("span", null,
                    React.createElement(IconTrash, { size: "s" }))))),
        popup && (React.createElement(Modal, { hasOverlay: true, view: "form", inverted: successForm, onOpen: function () {
                document.body.style.overflow = 'hidden';
            }, onClose: function () {
                document.body.style.overflow = 'unset';
            }, isOpen: isModalOpen, onOverlayClick: function () {
                document.body.style.overflow = 'unset';
                setIsModalOpen(false);
                setSuccessForm(false);
            }, onEsc: function () {
                setIsModalOpen(false);
                setSuccessForm(false);
                document.body.style.overflow = 'unset';
            }, showCloseButton: true },
            React.createElement(Typography.Title, { size: "md", className: cnFileCard('Modal-Title') }, popup.title),
            React.createElement(Typography.Text, null, parse(popup.text)),
            React.createElement(FileCardForm, { url: url, onSubmit: onSubmitHandler, type: popup.formType, dictionaries: popup.dictionary, recaptchaKey: recaptchaKey }),
            successForm && (React.createElement("div", { className: cnFileCard('ModalSuccess') },
                React.createElement(Typography.Title, { size: "lg", className: cnFileCard('Title') }, popup.dictionary.companySiteFormDownloadFile
                    .companySiteFormDownloadFileSuccessTitle),
                React.createElement(Typography.Text, { className: cnFileCard('SubTitle') }, popup.dictionary.companySiteFormDownloadFile
                    .companySiteFormDownloadFileSuccessText)))))));
};
