@paro.io/expert-shared-components 1.14.1 → 1.14.2

package/lib/components/DocumentCenter/DocumentTable.js

@@ -1,350 +1,350 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DocumentTable = void 0;
-const react_1 = __importStar(require("react"));
-const core_1 = require("@material-ui/core");
-const Pagination_1 = __importDefault(require("../Reviews/Pagination"));
-const DocumentUploadRow_1 = require("./DocumentUploadRow");
-const base_icons_1 = require("@paro.io/base-icons");
-const base_ui_1 = require("@paro.io/base-ui");
-const useStyles = (0, core_1.makeStyles)({
-    tableCell: {
-        whiteSpace: 'normal',
-        border: '1px solid #E2E8F0',
-        padding: '10px'
-    },
-    tableRow: {
-        height: 40
-    },
-    container: {
-        overflow: 'auto',
-        padding: 10,
-        width: '100%',
-        borderRadius: '12px',
-        margin: '12px'
-    },
-    tableCellBorder: {
-        whiteSpace: 'nowrap',
-        border: '1px solid #E2E8F0'
-    },
-    shade: {
-        backgroundColor: '#D9EFEF'
-    }
-});
-const headCells = [
-    {
-        id: 'fileName',
-        label: 'File Name',
-    },
-    {
-        id: 'docType',
-        label: 'Document Type',
-    },
-    {
-        id: 'docSize',
-        label: 'Document Size',
-    },
-    {
-        id: 'clientName',
-        label: 'Client Name',
-    },
-    {
-        id: 'projectName',
-        label: 'Project Name',
-    },
-    {
-        id: 'projectStatus',
-        label: 'Project Status',
-    },
-    {
-        id: 'uploadedDate',
-        label: 'Uploaded Date',
-    },
-    {
-        id: 'uploadedBy',
-        label: 'Uploaded By',
-    },
-    {
-        id: 'lastViewed',
-        label: 'Last Viewed',
-    },
-];
-function descendingComparator(a, b, orderBy) {
-    var _a, _b, _c, _d, _e, _f;
-    // Check for orderBy being 'projectDuration', we will compare docSize if 'docSize' is passed
-    if (orderBy === 'docSize') {
-        //@ts-ignore
-        const sizeA = (_a = a === null || a === void 0 ? void 0 : a.docSize) !== null && _a !== void 0 ? _a : 0;
-        //@ts-ignore
-        const sizeB = (_b = b === null || b === void 0 ? void 0 : b.docSize) !== null && _b !== void 0 ? _b : 0;
-        if (sizeB < sizeA) {
-            return -1;
-        }
-        if (sizeB > sizeA) {
-            return 1;
-        }
-        return 0;
-    }
-    else if (orderBy === 'uploadedDate' || orderBy === 'lastViewed') {
-        // For 'uploadedDate' and 'lastViewed', we assume they're strings or date strings
-        //@ts-ignore
-        const dateA = a === null || a === void 0 ? void 0 : a[orderBy];
-        //@ts-ignore
-        const dateB = b === null || b === void 0 ? void 0 : b[orderBy];
-        //@ts-ignore
-        if (dateB < dateA) {
-            return -1;
-        }
-        //@ts-ignore
-        if (dateB > dateA) {
-            return 1;
-        }
-        return 0;
-    }
-    else if (orderBy === 'clientName') {
-        // For clientName, do normal string comparison
-        //@ts-ignore
-        const clientA = (_c = a === null || a === void 0 ? void 0 : a.clientName) !== null && _c !== void 0 ? _c : "";
-        //@ts-ignore
-        const clientB = (_d = b === null || b === void 0 ? void 0 : b.clientName) !== null && _d !== void 0 ? _d : "";
-        if (clientB < clientA) {
-            return -1;
-        }
-        if (clientB > clientA) {
-            return 1;
-        }
-        return 0;
-    }
-    else if (orderBy === 'fileName' || orderBy === 'docType' || orderBy === 'projectName' || orderBy === 'uploadedBy') {
-        // For string-based comparisons (e.g., fileName, docType, projectName, uploadedBy)
-        //@ts-ignore
-        const valueA = (_e = a === null || a === void 0 ? void 0 : a[orderBy]) !== null && _e !== void 0 ? _e : "";
-        //@ts-ignore
-        const valueB = (_f = b === null || b === void 0 ? void 0 : b[orderBy]) !== null && _f !== void 0 ? _f : "";
-        if (valueB < valueA) {
-            return -1;
-        }
-        if (valueB > valueA) {
-            return 1;
-        }
-        return 0;
-    }
-    else {
-        // General case for other properties
-        //@ts-ignore
-        const selectedColumnA = a === null || a === void 0 ? void 0 : a[orderBy];
-        //@ts-ignore
-        const selectedColumnB = b === null || b === void 0 ? void 0 : b[orderBy];
-        if (selectedColumnA === 'N/A' && selectedColumnB !== 'N/A') {
-            return 1;
-        }
-        if (selectedColumnA !== 'N/A' && selectedColumnB === 'N/A') {
-            return -1;
-        }
-        if (selectedColumnB === undefined) {
-            return -1;
-        }
-        if (selectedColumnA === undefined) {
-            return 1;
-        }
-        //@ts-ignore
-        if (selectedColumnB < selectedColumnA) {
-            return -1;
-        }
-        //@ts-ignore
-        if (selectedColumnB > selectedColumnA) {
-            return 1;
-        }
-        return 0;
-    }
-}
-function getComparator(order, orderBy) {
-    return order === 'desc'
-        ? (a, b) => descendingComparator(a, b, orderBy)
-        : (a, b) => -descendingComparator(a, b, orderBy);
-}
-function stableSort(array, comparator) {
-    const stabilizedThis = array.map((el, index) => [el, index]);
-    stabilizedThis.sort((a, b) => {
-        const order = comparator(a[0], b[0]);
-        if (order !== 0) {
-            return order;
-        }
-        return a[1] - b[1];
-    });
-    return stabilizedThis.map((el) => el[0]);
-}
-const DocumentTable = ({ legacyFreelancerId, paroProjectsData, expiryDate, expertFiles, uploadExpertClientFiles, uploadFileData, deleteFileMutation, updateFreelancerExpiryMutation, GetFilesDocument, foldername, paroDocuments }) => {
-    const classes = useStyles();
-    const [order, setOrder] = react_1.default.useState('asc');
-    const [orderBy, setOrderBy] = react_1.default.useState('lastViewed');
-    const [currentPage, setCurrentPage] = (0, react_1.useState)(1);
-    const [perPageItems, setPerPageItems] = (0, react_1.useState)(10);
-    const [files, setFiles] = (0, react_1.useState)(paroProjectsData);
-    const [documentName, setDocumentName] = (0, react_1.useState)('');
-    const [clientAndProject, setClientAndProject] = (0, react_1.useState)('');
-    const [docType, setDocType] = (0, react_1.useState)('');
-    const [searchText, setSearchText] = (0, react_1.useState)('');
-    const [downloadFilename, setDownloadFilename] = (0, react_1.useState)('');
-    const [apiFoldername, setApiFoldername] = (0, react_1.useState)('');
-    const [isDeleteModalOpen, setDeleteModalOpen] = (0, react_1.useState)(false);
-    const [deleteFileName, setDeleteFileName] = (0, react_1.useState)('');
-    const [insuranceExpiryDate, setInsuranceExpiryDate] = (0, react_1.useState)(expiryDate);
-    const firstItem = (currentPage - 1) * perPageItems;
-    const lastItem = (currentPage - 1) * perPageItems + perPageItems;
-    const tableData = files === null || files === void 0 ? void 0 : files.map((file) => {
-        return {
-            fileName: (file === null || file === void 0 ? void 0 : file.fileName) || "-", // Assuming there's a `fileName` property in `project`
-            docType: (file === null || file === void 0 ? void 0 : file.docType) || "-", // Assuming there's a `docType` property in `project`
-            docSize: (file === null || file === void 0 ? void 0 : file.docSize) || 0, // Assuming there's a `docSize` property in `project`
-            clientName: file.clientName || "-", // Mapping from project.client.name
-            projectName: file.projectName, // Mapping from project.name
-            projectStatus: file.projectStatus,
-            uploadedDate: file.uploadedDate, // Assuming there's an `uploadedDate` property
-            uploadedBy: file.uploadedBy || "-", // Assuming there's an `uploadedBy` property
-            lastViewed: file.lastViewed, // Assuming there's a `lastViewed` property
-        };
-    });
-    (0, react_1.useEffect)(() => {
-        const sortByTextProjects = searchText === ''
-            ? paroProjectsData
-            : paroProjectsData.filter((p) => {
-                var _a, _b, _c;
-                return ((_a = p === null || p === void 0 ? void 0 : p.clientName) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(searchText.toLowerCase())) ||
-                    (((_b = p === null || p === void 0 ? void 0 : p.projectName) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(searchText.toLowerCase())) ||
-                        ((_c = p === null || p === void 0 ? void 0 : p.fileName) === null || _c === void 0 ? void 0 : _c.toLowerCase().includes(searchText.toLowerCase())));
-            });
-        setFiles(sortByTextProjects);
-    }, [searchText]);
-    const handleRequestSort = (event, property) => {
-        const isDesc = orderBy === property && order === 'desc';
-        setOrder(isDesc ? 'asc' : 'desc');
-        setOrderBy(property);
-    };
-    const createSortHandler = (property) => (event) => {
-        handleRequestSort(event, property);
-    };
-    const handleDelete = () => {
-        if (apiFoldername.split('/')[1] === 'EO Insurance') {
-            updateFreelancerExpiryMutation({
-                variables: {
-                    id: legacyFreelancerId,
-                },
-            })
-                .catch((err) => { console.log(`Error deleting insurance from freelancer table ${err}`); });
-            setInsuranceExpiryDate('');
-        }
-        deleteFileMutation({
-            variables: {
-                input: {
-                    foldername: apiFoldername,
-                    filename: deleteFileName,
-                },
-            },
-            refetchQueries: [{ query: GetFilesDocument, variables: { input: { foldername } } }],
-        })
-            .then(() => {
-            toggleDeleteModal(deleteFileName);
-        })
-            .catch((err) => {
-            toggleDeleteModal(deleteFileName);
-            console.log(`Error deleting file ${err}`);
-        });
-    };
-    const handleDownloadFile = (name) => __awaiter(void 0, void 0, void 0, function* () {
-        if (name && name.filename && name.filename.trim().length > 0) {
-            setDownloadFilename(name.filename.split('/').pop());
-            const segments = name.filename.split('/');
-            setApiFoldername(segments.slice(0, segments.length - 1).join('/'));
-        }
-    });
-    const toggleDeleteModal = (name) => {
-        setDeleteModalOpen(!isDeleteModalOpen);
-        if (name && name.filename && name.filename.trim().length > 0) {
-            setDeleteFileName(name.filename.split('/').pop());
-            const segments = name.filename.split('/');
-            setApiFoldername(segments.slice(0, segments.length - 1).join('/'));
-        }
-    };
-    return (react_1.default.createElement(core_1.Paper, { className: classes.container },
-        react_1.default.createElement(DocumentUploadRow_1.DocumentUploadRow, { documentName: documentName, setDocumentName: setDocumentName, clientAndProject: clientAndProject, setClientAndProject: setClientAndProject, docType: docType, setDocType: setDocType, searchText: searchText, setSearchText: setSearchText }),
-        react_1.default.createElement(core_1.Box, { mt: 2 },
-            react_1.default.createElement(core_1.Table, { style: { overflow: 'auto' } },
-                react_1.default.createElement(core_1.TableHead, null,
-                    react_1.default.createElement(core_1.TableRow, { className: [classes.tableCellBorder, classes.shade].join(" ") },
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }),
-                        headCells.map((headCell) => (react_1.default.createElement(core_1.TableCell, { key: headCell.id, sortDirection: orderBy === headCell.id ? order : false, align: "center", className: classes.tableCell },
-                            react_1.default.createElement(core_1.TableSortLabel, { active: orderBy === headCell.id, direction: orderBy === headCell.id ? order : 'asc', onClick: createSortHandler(headCell.id) },
-                                react_1.default.createElement("div", { className: "flex flex-row items-center gap-x-1" },
-                                    react_1.default.createElement("div", { className: "flex flex-col justify-center items-center" },
-                                        react_1.default.createElement("b", null, headCell.label)),
-                                    orderBy === headCell.id && null))))),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }))),
-                react_1.default.createElement(core_1.TableBody, null, stableSort(tableData, getComparator(order, orderBy)).slice(firstItem, lastItem).map((row, index) => {
-                    const { fileName, docType, docSize, clientName, projectName, projectStatus, uploadedDate, uploadedBy, lastViewed } = row;
-                    return (react_1.default.createElement(core_1.TableRow, { key: index },
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, index + 1),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, fileName),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, docType),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, docSize),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, clientName),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, projectName),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, projectStatus),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, uploadedDate),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, uploadedBy),
-                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, lastViewed),
-                        react_1.default.createElement(core_1.TableCell, { className: "flex items-center gap-x-4" },
-                            react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justify: "space-between", alignItems: "center" },
-                                react_1.default.createElement(core_1.IconButton, { onClick: () => __awaiter(void 0, void 0, void 0, function* () { return handleDownloadFile(name); }) },
-                                    react_1.default.createElement(base_icons_1.IconDocumentDownload, { size: "sm" })),
-                                react_1.default.createElement(core_1.IconButton, { onClick: () => toggleDeleteModal(name) },
-                                    react_1.default.createElement(base_icons_1.IconTrash, { size: "sm" }))))));
-                })))),
-        react_1.default.createElement(core_1.Box, { m: 2 },
-            react_1.default.createElement(Pagination_1.default, { total: paroProjectsData === null || paroProjectsData === void 0 ? void 0 : paroProjectsData.length, currentPage: currentPage, setCurrentPage: setCurrentPage, perPageItems: perPageItems, setPerPageItems: setPerPageItems, displayText: "projects" })),
-        react_1.default.createElement(base_ui_1.Modal, { variant: base_ui_1.ModalVariant.transactional, label: "Delete Document?", color: "danger", open: isDeleteModalOpen, onClose: () => { setDeleteModalOpen(!isDeleteModalOpen); }, icon: "danger", iconCustom: react_1.default.createElement(base_icons_1.IconExclamation, null), size: "md", onPrimaryButtonClickHandler: handleDelete }, apiFoldername.split('/')[1] !== "EO Insurance" ? (react_1.default.createElement(react_1.default.Fragment, null,
-            "Are you sure you want to delete document ",
-            react_1.default.createElement("strong", null, deleteFileName),
-            "? If you continue, this document will no longer be available.")) : (react_1.default.createElement(react_1.default.Fragment, null,
-            "Are you sure you want to delete Insurance document ",
-            react_1.default.createElement("strong", null, deleteFileName),
-            "?  ",
-            react_1.default.createElement("strong", null, "Note:"),
-            " You hold only one insurance document. Deleting it might effect your 'Matching'.")))));
-};
-exports.DocumentTable = DocumentTable;
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DocumentTable = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("@material-ui/core");
+const Pagination_1 = __importDefault(require("../Reviews/Pagination"));
+const DocumentUploadRow_1 = require("./DocumentUploadRow");
+const base_icons_1 = require("@paro.io/base-icons");
+const base_ui_1 = require("@paro.io/base-ui");
+const useStyles = (0, core_1.makeStyles)({
+    tableCell: {
+        whiteSpace: 'normal',
+        border: '1px solid #E2E8F0',
+        padding: '10px'
+    },
+    tableRow: {
+        height: 40
+    },
+    container: {
+        overflow: 'auto',
+        padding: 10,
+        width: '100%',
+        borderRadius: '12px',
+        margin: '12px'
+    },
+    tableCellBorder: {
+        whiteSpace: 'nowrap',
+        border: '1px solid #E2E8F0'
+    },
+    shade: {
+        backgroundColor: '#D9EFEF'
+    }
+});
+const headCells = [
+    {
+        id: 'fileName',
+        label: 'File Name',
+    },
+    {
+        id: 'docType',
+        label: 'Document Type',
+    },
+    {
+        id: 'docSize',
+        label: 'Document Size',
+    },
+    {
+        id: 'clientName',
+        label: 'Client Name',
+    },
+    {
+        id: 'projectName',
+        label: 'Project Name',
+    },
+    {
+        id: 'projectStatus',
+        label: 'Project Status',
+    },
+    {
+        id: 'uploadedDate',
+        label: 'Uploaded Date',
+    },
+    {
+        id: 'uploadedBy',
+        label: 'Uploaded By',
+    },
+    {
+        id: 'lastViewed',
+        label: 'Last Viewed',
+    },
+];
+function descendingComparator(a, b, orderBy) {
+    var _a, _b, _c, _d, _e, _f;
+    // Check for orderBy being 'projectDuration', we will compare docSize if 'docSize' is passed
+    if (orderBy === 'docSize') {
+        //@ts-ignore
+        const sizeA = (_a = a === null || a === void 0 ? void 0 : a.docSize) !== null && _a !== void 0 ? _a : 0;
+        //@ts-ignore
+        const sizeB = (_b = b === null || b === void 0 ? void 0 : b.docSize) !== null && _b !== void 0 ? _b : 0;
+        if (sizeB < sizeA) {
+            return -1;
+        }
+        if (sizeB > sizeA) {
+            return 1;
+        }
+        return 0;
+    }
+    else if (orderBy === 'uploadedDate' || orderBy === 'lastViewed') {
+        // For 'uploadedDate' and 'lastViewed', we assume they're strings or date strings
+        //@ts-ignore
+        const dateA = a === null || a === void 0 ? void 0 : a[orderBy];
+        //@ts-ignore
+        const dateB = b === null || b === void 0 ? void 0 : b[orderBy];
+        //@ts-ignore
+        if (dateB < dateA) {
+            return -1;
+        }
+        //@ts-ignore
+        if (dateB > dateA) {
+            return 1;
+        }
+        return 0;
+    }
+    else if (orderBy === 'clientName') {
+        // For clientName, do normal string comparison
+        //@ts-ignore
+        const clientA = (_c = a === null || a === void 0 ? void 0 : a.clientName) !== null && _c !== void 0 ? _c : "";
+        //@ts-ignore
+        const clientB = (_d = b === null || b === void 0 ? void 0 : b.clientName) !== null && _d !== void 0 ? _d : "";
+        if (clientB < clientA) {
+            return -1;
+        }
+        if (clientB > clientA) {
+            return 1;
+        }
+        return 0;
+    }
+    else if (orderBy === 'fileName' || orderBy === 'docType' || orderBy === 'projectName' || orderBy === 'uploadedBy') {
+        // For string-based comparisons (e.g., fileName, docType, projectName, uploadedBy)
+        //@ts-ignore
+        const valueA = (_e = a === null || a === void 0 ? void 0 : a[orderBy]) !== null && _e !== void 0 ? _e : "";
+        //@ts-ignore
+        const valueB = (_f = b === null || b === void 0 ? void 0 : b[orderBy]) !== null && _f !== void 0 ? _f : "";
+        if (valueB < valueA) {
+            return -1;
+        }
+        if (valueB > valueA) {
+            return 1;
+        }
+        return 0;
+    }
+    else {
+        // General case for other properties
+        //@ts-ignore
+        const selectedColumnA = a === null || a === void 0 ? void 0 : a[orderBy];
+        //@ts-ignore
+        const selectedColumnB = b === null || b === void 0 ? void 0 : b[orderBy];
+        if (selectedColumnA === 'N/A' && selectedColumnB !== 'N/A') {
+            return 1;
+        }
+        if (selectedColumnA !== 'N/A' && selectedColumnB === 'N/A') {
+            return -1;
+        }
+        if (selectedColumnB === undefined) {
+            return -1;
+        }
+        if (selectedColumnA === undefined) {
+            return 1;
+        }
+        //@ts-ignore
+        if (selectedColumnB < selectedColumnA) {
+            return -1;
+        }
+        //@ts-ignore
+        if (selectedColumnB > selectedColumnA) {
+            return 1;
+        }
+        return 0;
+    }
+}
+function getComparator(order, orderBy) {
+    return order === 'desc'
+        ? (a, b) => descendingComparator(a, b, orderBy)
+        : (a, b) => -descendingComparator(a, b, orderBy);
+}
+function stableSort(array, comparator) {
+    const stabilizedThis = array.map((el, index) => [el, index]);
+    stabilizedThis.sort((a, b) => {
+        const order = comparator(a[0], b[0]);
+        if (order !== 0) {
+            return order;
+        }
+        return a[1] - b[1];
+    });
+    return stabilizedThis.map((el) => el[0]);
+}
+const DocumentTable = ({ legacyFreelancerId, paroProjectsData, expiryDate, expertFiles, uploadExpertClientFiles, uploadFileData, deleteFileMutation, updateFreelancerExpiryMutation, GetFilesDocument, foldername, paroDocuments }) => {
+    const classes = useStyles();
+    const [order, setOrder] = react_1.default.useState('asc');
+    const [orderBy, setOrderBy] = react_1.default.useState('lastViewed');
+    const [currentPage, setCurrentPage] = (0, react_1.useState)(1);
+    const [perPageItems, setPerPageItems] = (0, react_1.useState)(10);
+    const [files, setFiles] = (0, react_1.useState)(paroProjectsData);
+    const [documentName, setDocumentName] = (0, react_1.useState)('');
+    const [clientAndProject, setClientAndProject] = (0, react_1.useState)('');
+    const [docType, setDocType] = (0, react_1.useState)('');
+    const [searchText, setSearchText] = (0, react_1.useState)('');
+    const [downloadFilename, setDownloadFilename] = (0, react_1.useState)('');
+    const [apiFoldername, setApiFoldername] = (0, react_1.useState)('');
+    const [isDeleteModalOpen, setDeleteModalOpen] = (0, react_1.useState)(false);
+    const [deleteFileName, setDeleteFileName] = (0, react_1.useState)('');
+    const [insuranceExpiryDate, setInsuranceExpiryDate] = (0, react_1.useState)(expiryDate);
+    const firstItem = (currentPage - 1) * perPageItems;
+    const lastItem = (currentPage - 1) * perPageItems + perPageItems;
+    const tableData = files === null || files === void 0 ? void 0 : files.map((file) => {
+        return {
+            fileName: (file === null || file === void 0 ? void 0 : file.fileName) || "-", // Assuming there's a `fileName` property in `project`
+            docType: (file === null || file === void 0 ? void 0 : file.docType) || "-", // Assuming there's a `docType` property in `project`
+            docSize: (file === null || file === void 0 ? void 0 : file.docSize) || 0, // Assuming there's a `docSize` property in `project`
+            clientName: file.clientName || "-", // Mapping from project.client.name
+            projectName: file.projectName, // Mapping from project.name
+            projectStatus: file.projectStatus,
+            uploadedDate: file.uploadedDate, // Assuming there's an `uploadedDate` property
+            uploadedBy: file.uploadedBy || "-", // Assuming there's an `uploadedBy` property
+            lastViewed: file.lastViewed, // Assuming there's a `lastViewed` property
+        };
+    });
+    (0, react_1.useEffect)(() => {
+        const sortByTextProjects = searchText === ''
+            ? paroProjectsData
+            : paroProjectsData.filter((p) => {
+                var _a, _b, _c;
+                return ((_a = p === null || p === void 0 ? void 0 : p.clientName) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(searchText.toLowerCase())) ||
+                    (((_b = p === null || p === void 0 ? void 0 : p.projectName) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(searchText.toLowerCase())) ||
+                        ((_c = p === null || p === void 0 ? void 0 : p.fileName) === null || _c === void 0 ? void 0 : _c.toLowerCase().includes(searchText.toLowerCase())));
+            });
+        setFiles(sortByTextProjects);
+    }, [searchText]);
+    const handleRequestSort = (event, property) => {
+        const isDesc = orderBy === property && order === 'desc';
+        setOrder(isDesc ? 'asc' : 'desc');
+        setOrderBy(property);
+    };
+    const createSortHandler = (property) => (event) => {
+        handleRequestSort(event, property);
+    };
+    const handleDelete = () => {
+        if (apiFoldername.split('/')[1] === 'EO Insurance') {
+            updateFreelancerExpiryMutation({
+                variables: {
+                    id: legacyFreelancerId,
+                },
+            })
+                .catch((err) => { console.log(`Error deleting insurance from freelancer table ${err}`); });
+            setInsuranceExpiryDate('');
+        }
+        deleteFileMutation({
+            variables: {
+                input: {
+                    foldername: apiFoldername,
+                    filename: deleteFileName,
+                },
+            },
+            refetchQueries: [{ query: GetFilesDocument, variables: { input: { foldername } } }],
+        })
+            .then(() => {
+            toggleDeleteModal(deleteFileName);
+        })
+            .catch((err) => {
+            toggleDeleteModal(deleteFileName);
+            console.log(`Error deleting file ${err}`);
+        });
+    };
+    const handleDownloadFile = (name) => __awaiter(void 0, void 0, void 0, function* () {
+        if (name && name.filename && name.filename.trim().length > 0) {
+            setDownloadFilename(name.filename.split('/').pop());
+            const segments = name.filename.split('/');
+            setApiFoldername(segments.slice(0, segments.length - 1).join('/'));
+        }
+    });
+    const toggleDeleteModal = (name) => {
+        setDeleteModalOpen(!isDeleteModalOpen);
+        if (name && name.filename && name.filename.trim().length > 0) {
+            setDeleteFileName(name.filename.split('/').pop());
+            const segments = name.filename.split('/');
+            setApiFoldername(segments.slice(0, segments.length - 1).join('/'));
+        }
+    };
+    return (react_1.default.createElement(core_1.Paper, { className: classes.container },
+        react_1.default.createElement(DocumentUploadRow_1.DocumentUploadRow, { documentName: documentName, setDocumentName: setDocumentName, clientAndProject: clientAndProject, setClientAndProject: setClientAndProject, docType: docType, setDocType: setDocType, searchText: searchText, setSearchText: setSearchText }),
+        react_1.default.createElement(core_1.Box, { mt: 2 },
+            react_1.default.createElement(core_1.Table, { style: { overflow: 'auto' } },
+                react_1.default.createElement(core_1.TableHead, null,
+                    react_1.default.createElement(core_1.TableRow, { className: [classes.tableCellBorder, classes.shade].join(" ") },
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }),
+                        headCells.map((headCell) => (react_1.default.createElement(core_1.TableCell, { key: headCell.id, sortDirection: orderBy === headCell.id ? order : false, align: "center", className: classes.tableCell },
+                            react_1.default.createElement(core_1.TableSortLabel, { active: orderBy === headCell.id, direction: orderBy === headCell.id ? order : 'asc', onClick: createSortHandler(headCell.id) },
+                                react_1.default.createElement("div", { className: "flex flex-row items-center gap-x-1" },
+                                    react_1.default.createElement("div", { className: "flex flex-col justify-center items-center" },
+                                        react_1.default.createElement("b", null, headCell.label)),
+                                    orderBy === headCell.id && null))))),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }))),
+                react_1.default.createElement(core_1.TableBody, null, stableSort(tableData, getComparator(order, orderBy)).slice(firstItem, lastItem).map((row, index) => {
+                    const { fileName, docType, docSize, clientName, projectName, projectStatus, uploadedDate, uploadedBy, lastViewed } = row;
+                    return (react_1.default.createElement(core_1.TableRow, { key: index },
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, index + 1),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, fileName),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, docType),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, docSize),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, clientName),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, projectName),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, projectStatus),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, uploadedDate),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, uploadedBy),
+                        react_1.default.createElement(core_1.TableCell, { className: classes.tableCell, align: "center" }, lastViewed),
+                        react_1.default.createElement(core_1.TableCell, { className: "flex items-center gap-x-4" },
+                            react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justify: "space-between", alignItems: "center" },
+                                react_1.default.createElement(core_1.IconButton, { onClick: () => __awaiter(void 0, void 0, void 0, function* () { return handleDownloadFile(name); }) },
+                                    react_1.default.createElement(base_icons_1.IconDocumentDownload, { size: "sm" })),
+                                react_1.default.createElement(core_1.IconButton, { onClick: () => toggleDeleteModal(name) },
+                                    react_1.default.createElement(base_icons_1.IconTrash, { size: "sm" }))))));
+                })))),
+        react_1.default.createElement(core_1.Box, { m: 2 },
+            react_1.default.createElement(Pagination_1.default, { total: paroProjectsData === null || paroProjectsData === void 0 ? void 0 : paroProjectsData.length, currentPage: currentPage, setCurrentPage: setCurrentPage, perPageItems: perPageItems, setPerPageItems: setPerPageItems, displayText: "projects" })),
+        react_1.default.createElement(base_ui_1.Modal, { variant: base_ui_1.ModalVariant.transactional, label: "Delete Document?", color: "danger", open: isDeleteModalOpen, onClose: () => { setDeleteModalOpen(!isDeleteModalOpen); }, icon: "danger", iconCustom: react_1.default.createElement(base_icons_1.IconExclamation, null), size: "md", onPrimaryButtonClickHandler: handleDelete }, apiFoldername.split('/')[1] !== "EO Insurance" ? (react_1.default.createElement(react_1.default.Fragment, null,
+            "Are you sure you want to delete document ",
+            react_1.default.createElement("strong", null, deleteFileName),
+            "? If you continue, this document will no longer be available.")) : (react_1.default.createElement(react_1.default.Fragment, null,
+            "Are you sure you want to delete Insurance document ",
+            react_1.default.createElement("strong", null, deleteFileName),
+            "?  ",
+            react_1.default.createElement("strong", null, "Note:"),
+            " You hold only one insurance document. Deleting it might effect your 'Matching'.")))));
+};
+exports.DocumentTable = DocumentTable;