var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
/* eslint-disable react/jsx-no-useless-fragment */
import React, { useMemo } from 'react';
import { PDFViewer } from './pdfViewer/PDFViewer';
import { ImageSlider } from './imageSlider/ImageSlider';
import { validateFilesImageType } from './utils/fileUtils';
import { useTranslation } from 'react-i18next';
import { AmbientAlert } from '../feedback/AmbientAlert';
const defaultFieldMapping = {
    filePath: 'filePath',
    blobFile: 'blobFile',
    fileName: 'fileName',
    fileExtension: 'fileExtension',
    primaryText: 'primaryText',
    secondaryText: 'secondaryText',
};
export const FileViewer = props => {
    const { data, fieldMapping = defaultFieldMapping, acceptedFileExtensions } = props, otherProps = __rest(props, ["data", "fieldMapping", "acceptedFileExtensions"]);
    const { t } = useTranslation();
    //filter data
    const filteredData = useMemo(() => {
        if (!acceptedFileExtensions || (acceptedFileExtensions === null || acceptedFileExtensions === void 0 ? void 0 : acceptedFileExtensions.length) === 0)
            return data;
        if (data instanceof Array && (data === null || data === void 0 ? void 0 : data.length) > 0) {
            return data === null || data === void 0 ? void 0 : data.filter(item => acceptedFileExtensions === null || acceptedFileExtensions === void 0 ? void 0 : acceptedFileExtensions.includes(item === null || item === void 0 ? void 0 : item[fieldMapping === null || fieldMapping === void 0 ? void 0 : fieldMapping.fileExtension]));
        }
        else {
            return (acceptedFileExtensions === null || acceptedFileExtensions === void 0 ? void 0 : acceptedFileExtensions.includes(data === null || data === void 0 ? void 0 : data[fieldMapping === null || fieldMapping === void 0 ? void 0 : fieldMapping.fileExtension]))
                ? data
                : null;
        }
    }, [acceptedFileExtensions, data, fieldMapping]);
    // check if the data is an array. If yes, currently only image viewer accept this list,
    // we need to validate if all the file in the list is image
    const fileType = useMemo(() => {
        if (filteredData instanceof Array) {
            const type = validateFilesImageType(filteredData, fieldMapping === null || fieldMapping === void 0 ? void 0 : fieldMapping.fileExtension);
            return type;
        }
        return filteredData === null || filteredData === void 0 ? void 0 : filteredData[fieldMapping === null || fieldMapping === void 0 ? void 0 : fieldMapping.fileExtension];
    }, [fieldMapping, filteredData]);
    const viewer = useMemo(() => {
        switch (fileType) {
            case 'pdf':
                return (React.createElement(PDFViewer, Object.assign({ fileUrl: filteredData === null || filteredData === void 0 ? void 0 : filteredData[fieldMapping === null || fieldMapping === void 0 ? void 0 : fieldMapping.filePath], blobPDF: filteredData === null || filteredData === void 0 ? void 0 : filteredData[fieldMapping === null || fieldMapping === void 0 ? void 0 : fieldMapping.blobFile] }, otherProps)));
            case 'image':
                return (React.createElement(ImageSlider, Object.assign({ images: filteredData, fieldMapping: fieldMapping }, otherProps)));
            default:
                return (React.createElement(AmbientAlert, { alertMessage: t('Unable to view file'), showAlert: true, alertSeverity: "error" }));
        }
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, [fileType, data, fieldMapping, otherProps]);
    return React.createElement(React.Fragment, null, viewer);
};
//# sourceMappingURL=FileViewer.js.map