cspace-ui/lib/components/search/SortBy.js

CollectionSpace user interface for browsers

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _cspaceInput = require("cspace-input");
var _reactIntl = require("react-intl");
var _lodash = require("lodash");
var _classnames = _interopRequireDefault(require("classnames"));
var _SortBy = _interopRequireDefault(require("../../../styles/cspace-ui/SortBy.css"));
var _ConfigProvider = require("../config/ConfigProvider");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const {
  DropdownMenuInput,
  Button
} = _cspaceInput.baseComponents;
const messages = (0, _reactIntl.defineMessages)({
  sortBy: {
    "id": "search.sortBy",
    "defaultMessage": "Sort By"
  },
  ascendingLabel: {
    "id": "search.sortDir.ascending.label",
    "defaultMessage": "Current sort: ascending"
  },
  descendingLabel: {
    "id": "search.sortDir.descending.label",
    "defaultMessage": "Current sort: descending"
  }
});
function SortBy({
  intl,
  onSortChange,
  onSortDirChange,
  recordType,
  sort
}) {
  var _get, _sort$split;
  const config = (0, _ConfigProvider.useConfig)();
  const sortConfig = (_get = (0, _lodash.get)(config, ['recordTypes', recordType, 'sort'])) !== null && _get !== void 0 ? _get : (0, _lodash.get)(config, ['recordTypes', recordType, 'columns', 'default']);
  if (!sortConfig) {
    return null;
  }
  const {
    defaultSortBy = 'updatedAt',
    defaultSortDirection = 'desc'
  } = sortConfig;
  const options = Object.keys(sortConfig).filter(key => sortConfig[key].sortBy !== undefined).map(key => {
    var _intl$formatMessage;
    const option = sortConfig[key];
    const label = (_intl$formatMessage = intl.formatMessage(option.messages.label)) !== null && _intl$formatMessage !== void 0 ? _intl$formatMessage : key;
    return {
      value: key,
      label
    };
  });
  const [sortBy, sortDir] = (_sort$split = sort === null || sort === void 0 ? void 0 : sort.split(' ')) !== null && _sort$split !== void 0 ? _sort$split : [defaultSortBy, defaultSortDirection];
  const inputId = 'sortBy';
  const input = /*#__PURE__*/_react.default.createElement(DropdownMenuInput, {
    id: inputId,
    options: options,
    value: sortBy,
    onCommit: (path, value) => onSortChange(value)
  });
  const sortDirLabel = sortDir === 'desc' ? intl.formatMessage(messages.descendingLabel) : intl.formatMessage(messages.ascendingLabel);
  const sortDirButton = /*#__PURE__*/_react.default.createElement(Button, {
    title: sortDirLabel,
    className: "material-icons",
    onClick: () => onSortDirChange()
  }, "sort_by_alpha");
  const prefixMessage = intl.formatMessage(messages.sortBy);
  const prefix = /*#__PURE__*/_react.default.createElement("label", {
    htmlFor: inputId,
    className: (0, _classnames.default)(_SortBy.default.mt2, _SortBy.default.mr5)
  }, prefixMessage);
  return /*#__PURE__*/_react.default.createElement("div", {
    className: _SortBy.default.flex
  }, prefix, input, sortDirButton);
}
SortBy.propTypes = {
  intl: _reactIntl.intlShape,
  onSortChange: _propTypes.default.func,
  onSortDirChange: _propTypes.default.func,
  recordType: _propTypes.default.string,
  sort: _propTypes.default.string
};
var _default = exports.default = (0, _reactIntl.injectIntl)(SortBy);