@wulperstudio/cms/node/organisms/TableAlter/TableAlter.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.TableAlter = void 0;
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _react = _interopRequireDefault(require("react"));
var _reactTable = require("react-table");
var _material = require("@mui/material");
var _TableBody = require("./components/TableBody");
var _TableCheckBox = require("./components/TableCheckBox");
var _TableHead = require("./components/TableHead");
var _styled = require("./styled");
var _jsxRuntime = require("react/jsx-runtime");
// eslint-disable-next-line max-len
var HeaderComponent = function HeaderComponent(_ref) {
  var getToggleAllRowsSelectedProps = _ref.getToggleAllRowsSelectedProps;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
    container: true,
    justifyContent: "center",
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TableCheckBox.TableCheckBox, Object.assign({}, getToggleAllRowsSelectedProps()))
  });
};
var CellComponent = function CellComponent(_ref2) {
  var row = _ref2.row;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
    container: true,
    justifyContent: "center",
    onClick: function onClick(e) {
      return e.stopPropagation();
    },
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TableCheckBox.TableCheckBox, Object.assign({}, row == null ? void 0 : row.getToggleRowSelectedProps()))
  });
};
var TableAlter = exports.TableAlter = function TableAlter(_ref3) {
  var columns = _ref3.columns,
    data = _ref3.data,
    _ref3$onScroll = _ref3.onScroll,
    onScroll = _ref3$onScroll === void 0 ? function () {} : _ref3$onScroll,
    _ref3$showCheckbox = _ref3.showCheckbox,
    showCheckbox = _ref3$showCheckbox === void 0 ? false : _ref3$showCheckbox,
    _ref3$onClickRow = _ref3.onClickRow,
    onClickRow = _ref3$onClickRow === void 0 ? function () {} : _ref3$onClickRow,
    _ref3$selectedRows = _ref3.selectedRows,
    selectedRows = _ref3$selectedRows === void 0 ? function () {} : _ref3$selectedRows,
    _ref3$loading = _ref3.loading,
    loading = _ref3$loading === void 0 ? false : _ref3$loading;
  var _useTable = (0, _reactTable.useTable)({
      columns: columns,
      data: data
    }, _reactTable.useRowSelect, function (hooks) {
      hooks.visibleColumns.push(function (chkColumns) {
        return !showCheckbox ? (0, _toConsumableArray2["default"])(chkColumns) : [{
          id: 'selection',
          Header: HeaderComponent,
          Cell: CellComponent
        }].concat((0, _toConsumableArray2["default"])(chkColumns));
      });
    }),
    getTableProps = _useTable.getTableProps,
    getTableBodyProps = _useTable.getTableBodyProps,
    headerGroups = _useTable.headerGroups,
    prepareRow = _useTable.prepareRow,
    rows = _useTable.rows,
    selectedFlatRows = _useTable.selectedFlatRows,
    selectedRowIds = _useTable.state.selectedRowIds;
  var TableRef = _react["default"].useRef(null);
  var handleScroll = function handleScroll() {
    var TableEl = TableRef == null ? void 0 : TableRef.current;
    if (!(TableEl != null && TableEl.scrollHeight) || !(TableEl != null && TableEl.offsetHeight)) return;
    if ((TableEl == null ? void 0 : TableEl.scrollTop) === TableEl.scrollHeight - TableEl.offsetHeight) {
      onScroll();
    }
  };
  _react["default"].useEffect(function () {
    selectedRows(selectedFlatRows, selectedRowIds);
  }, [selectedFlatRows, selectedRowIds]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.WrapperTable, {
    ref: TableRef,
    onScroll: handleScroll,
    isLoading: loading,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styled.Table, Object.assign({
      stickyHeader: true
    }, getTableProps(), {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TableHead.TableHead, {
        headerGroups: headerGroups
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TableBody.TableBody, {
        rows: rows,
        getTableBodyProps: getTableBodyProps,
        prepareRow: prepareRow,
        onClickRow: onClickRow
      })]
    }))
  });
};