@helpscout/hsds-react/components/Table/Table.utils.js

React component library for Help Scout's Design System

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.generateCellKey = generateCellKey;
exports.generateCellClassNames = generateCellClassNames;
exports.getDisplayTableData = getDisplayTableData;
exports.createColumnChooserListItems = createColumnChooserListItems;
exports.isTableSortable = isTableSortable;
exports.generateCustomHeaderCell = generateCustomHeaderCell;
exports.dataShape = exports.columnShape = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _id = require("../../utilities/id");

var _lodash = _interopRequireDefault(require("lodash.isfunction"));

var _lodash2 = _interopRequireDefault(require("lodash.isnil"));

var _lodash3 = _interopRequireDefault(require("lodash.isplainobject"));

var _Table = require("./Table");

var _Icon = _interopRequireDefault(require("../Icon"));

var _jsxRuntime = require("react/jsx-runtime");

var uniqueCellKeyFactory = (0, _id.createUniqueIDFactory)('Cell');
var renderHeaderCellObjectShape = {
  iconName: _propTypes.default.string
};
var columnShape = {
  title: _propTypes.default.string,
  columnKey: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
  width: _propTypes.default.string,
  align: _propTypes.default.string,
  renderCell: _propTypes.default.func,
  renderHeaderCell: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape(renderHeaderCellObjectShape)]),
  sortKey: _propTypes.default.string,
  sorter: _propTypes.default.func,
  show: _propTypes.default.bool,
  default: _propTypes.default.bool
};
exports.columnShape = columnShape;
var dataShape = {
  id: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  key: _propTypes.default.any
};
exports.dataShape = dataShape;

function generateCellKey(element, column) {
  return Array.isArray(column.columnKey) ? uniqueCellKeyFactory(element) + "_" + column.sortKey + "_" + column.columnKey.join('_') : uniqueCellKeyFactory(element) + "_" + column.columnKey;
}

function generateCellClassNames(column, cellType) {
  if (cellType === void 0) {
    cellType = 'Cell';
  }

  return (0, _classnames.default)(_Table.TABLE_CLASSNAME + "__" + cellType, "Column_" + (column.title ? column.title.replace(/[ .]/g, '') : Array.isArray(column.columnKey) ? column.columnKey.join('_').replace(/\./g, '_') : column.columnKey.replace(/\./g, '_')), column.clearCellPadding && 'without-padding', column.className || '');
}

function getDisplayTableData(_ref) {
  var data = _ref.data,
      rowsToDisplay = _ref.rowsToDisplay;

  if (!(0, _lodash2.default)(rowsToDisplay) && rowsToDisplay < data.length) {
    return data.slice(0, rowsToDisplay);
  }

  return data;
}

function createColumnChooserListItems(columns, columnChooserResetLabel) {
  var items = columns.reduce(function (acc, currentCol) {
    var group = currentCol.group || 'Other';
    currentCol.label = currentCol.title;

    if (currentCol.disabledForChoosing) {
      currentCol.isDisabled = true;
    }

    if (!acc.length) {
      acc.push({
        items: [currentCol],
        label: group,
        type: 'group'
      });
    } else {
      var idx = acc.findIndex(function (val) {
        return val.label === group;
      });

      if (idx !== -1) {
        acc[idx].items.push(currentCol);
      } else {
        acc.push({
          type: 'divider'
        });
        acc.push({
          items: [currentCol],
          label: group,
          type: 'group'
        });
      }
    }

    return acc;
  }, []);
  return items.concat([{
    type: 'divider'
  }, {
    label: columnChooserResetLabel || 'Reset to defaults',
    type: 'action',
    action: 'RESET'
  }]);
}

function isTableSortable(columns) {
  return Array.isArray(columns) && columns.find(function (column) {
    return Boolean(column.sorter);
  });
}

function generateCustomHeaderCell(column, sortedInfo) {
  if ((0, _lodash.default)(column.renderHeaderCell)) {
    return column.renderHeaderCell(column, sortedInfo);
  }

  if ((0, _lodash3.default)(column.renderHeaderCell)) {
    var iconName = column.renderHeaderCell.iconName;
    return iconName ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
      className: "column-title-as-icon",
      name: iconName,
      size: 24,
      title: column.title,
      ignoreClick: false
    }) : 'Please pass iconName';
  }

  return null;
}