@stakefish/ui/components/TableContainerSort.js

<div align="center"> <a href="https://www.npmjs.com/package/@stakefish/ui"><img src="https://gateway.pinata.cloud/ipfs/QmbZL1ceA8Yiz2pKALTg919jYx141DPUGegC9L4XpyayW5" width="300" /></a> </div>

import { _ as __assign } from '../tslib.es6-35932c2c.js';
import { jsx, jsxs } from 'react/jsx-runtime';
import { useState } from 'react';
import MuiTable from '@mui/material/Table';
import MuiTableRow from '@mui/material/TableRow';
import MuiTableBody from '@mui/material/TableBody';
import MuiTableCell from '@mui/material/TableCell';
import MuiTableContainer from '@mui/material/TableContainer';
import TableHeadSort from './TableHeadSort.js';
import { formatCellDataRowsIntoArray } from './TableContainer.js';
import '@mui/material/TableHead';
import './TableSortLabel.js';
import '@mui/material/styles';
import '@mui/material/TableSortLabel';
import './TableSortLabelIcon.js';
import '@mui/material/Box';
import './Icon.js';
import '../icons/ArrowLeft.js';
import '../icons/ArrowRight.js';
import '../icons/CloseCircle.js';
import '../icons/InfoCircle.js';
import '../icons/ErrorCircle.js';
import '../icons/Attention.js';
import '../icons/HelpCircle.js';
import '../icons/Document.js';
import '../icons/DocumentText.js';
import '../icons/Lock.js';
import '../icons/Delete.js';
import '../icons/Users.js';
import '../icons/Stakefish.js';
import '../icons/Sound.js';
import '../icons/Beacon.js';
import '../icons/TriangleRight.js';
import '../icons/TriangleLeft.js';
import '../icons/TriangleUp.js';
import '../icons/TriangleDown.js';
import '../icons/Sent.js';
import '../icons/Download.js';
import '../icons/Faster.js';
import '../icons/Slower.js';
import '../icons/Usb.js';
import '../icons/Key.js';
import '../icons/Edit.js';
import '../icons/Expand.js';
import '../icons/Collapse.js';
import '../icons/Success.js';
import '../icons/SuccessCircle.js';
import '../icons/Fail.js';
import '../icons/Desktop.js';
import '../icons/Mobile.js';
import '../icons/Loading.js';
import '../icons/Upload.js';
import '../icons/Check.js';
import '../icons/ChevronLeft.js';
import '../icons/ChevronRight.js';
import '../icons/Plus.js';
import '../icons/Minus.js';
import '../icons/Globe.js';
import '../icons/Link.js';
import '../icons/Copy.js';
import '../icons/Medium.js';
import '../icons/Twitter.js';
import '../icons/Telegram.js';
import '../icons/Eth.js';
import '../icons/Sort.js';
import '../icons/Close.js';
import '../icons/DollarSign.js';
import '../icons/Search.js';
import '../icons/Range.js';
import '../icons/Instagram.js';
import '../icons/LinkedIn.js';
import '../icons/Reddit.js';
import '../icons/YouTube.js';
import '../icons/Chrome.js';
import '../icons/CloudConnect.js';
import '../icons/Update.js';
import '../icons/Menu.js';
import '../icons/Settings.js';

/**
 * Sorting Utilities
 */
function getCellDataKey(data) {
    return Object.keys(data)[0];
}
function getCellComparatorKey(data, orderBy) {
    var _a;
    return ((_a = data === null || data === void 0 ? void 0 : data[orderBy]) === null || _a === void 0 ? void 0 : _a.key) ? data[orderBy].key : null;
}
function descendingComparator(a, b, orderBy) {
    var aComparatorKey = getCellComparatorKey(a, orderBy);
    var bComparatorKey = getCellComparatorKey(b, orderBy);
    if (!aComparatorKey || !bComparatorKey || aComparatorKey === bComparatorKey)
        return 0;
    return bComparatorKey < aComparatorKey ? -1 : 1;
}
function getComparator(order, orderBy) {
    return order === "desc"
        ? function (a, b) { return descendingComparator(a, b, orderBy); }
        : function (a, b) { return -descendingComparator(a, b, orderBy); };
}
function stableSort(array, comparator) {
    var stabilizedThis = array.map(function (el, index) { return [el, index]; });
    stabilizedThis.sort(function (a, b) {
        var order = comparator(a[0], b[0]);
        return order !== 0 ? order : a[1] - b[1];
    });
    return stabilizedThis.map(function (el) { return el[0]; });
}
/**
 * Utilities
 */
function createCellSortData(dataSets, cellDataKeys) {
    var cellData = {};
    cellDataKeys.forEach(function (key, index) { return (cellData[key] = dataSets[index]); });
    return cellData;
}
var TableContainerSort = function (_a) {
    var headCells = _a.headCells, bodyCellsRows = _a.bodyCellsRows;
    var _b = useState("asc"), order = _b[0], setOrder = _b[1];
    // set initial orderBy as the key of first cell in first row
    var _c = useState(getCellDataKey(bodyCellsRows[0])), orderBy = _c[0], setOrderBy = _c[1];
    var handleRequestSort = function (event, property) {
        var isAsc = orderBy === property && order === "asc";
        setOrder(isAsc ? "desc" : "asc");
        setOrderBy(property);
    };
    return (jsx(MuiTableContainer, { children: jsxs(MuiTable, __assign({ "aria-labelledby": "tableTitle", "aria-label": "enhanced table" }, { children: [jsx(TableHeadSort, { headCells: headCells, order: order, orderBy: orderBy.toString(), onRequestSort: handleRequestSort }, void 0), jsx(MuiTableBody, { children: stableSort(bodyCellsRows, getComparator(order, orderBy)).map(function (rowCells, index) { return (jsx(MuiTableRow, __assign({ tabIndex: -1 }, { children: formatCellDataRowsIntoArray(rowCells).map(function (cell, cellIndex) { return (jsx(MuiTableCell, __assign({}, cell.props, { children: cell.content }), cellIndex)); }) }), index)); }) }, void 0)] }), void 0) }, void 0));
};

export { createCellSortData, TableContainerSort as default };