@talend/react-components/lib/List/Toolbar/SelectSortBy/SelectSortBy.component.js

Set of react components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _classnames = _interopRequireDefault(require("classnames"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactBootstrap = require("@talend/react-bootstrap");
var _utils = require("@talend/utils");
var _Icon = _interopRequireDefault(require("../../../Icon"));
var _translate = _interopRequireDefault(require("../../../translate"));
var _SelectSortByModule = _interopRequireDefault(require("./SelectSortBy.module.scss"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function SortByItem({
  option,
  id,
  t,
  onSelect
}) {
  const optionLabel = option.name || option.id;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.MenuItem, {
    id: id && `${id}-by-item-${option.id}`,
    eventKey: option,
    "aria-label": t('LIST_SELECT_SORT_BY', {
      defaultValue: 'Select {{sortBy}} as current sort criteria.',
      sortBy: optionLabel
    }),
    onSelect: onSelect,
    children: optionLabel
  });
}
SortByItem.propTypes = {
  onSelect: _propTypes.default.func,
  option: _propTypes.default.shape({
    id: _propTypes.default.string,
    name: _propTypes.default.string
  }),
  id: _propTypes.default.string,
  t: _propTypes.default.func
};
function SelectSortBy({
  field,
  id,
  isDescending,
  onChange,
  options,
  t
}) {
  const order = isDescending || false;
  const selected = field && options.find(item => item.id === field);
  function onChangeField(newField, event) {
    return onChange(event, {
      field: newField.id,
      isDescending: order
    });
  }
  function onChangeOrder(event) {
    return onChange(event, {
      field: selected.id,
      isDescending: !order
    });
  }
  const currentSortByLabel = selected ? selected.name || selected.id : 'N.C';
  const currentSortOrderLabel = order ? t('LIST_SELECT_SORT_BY_ORDER_DESC', {
    defaultValue: 'Descending'
  }) : t('LIST_SELECT_SORT_BY_ORDER_ASC', {
    defaultValue: 'Ascending'
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Nav, {
    className: _SelectSortByModule.default['tc-list-toolbar-sort-by'],
    children: [options.length === 1 ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
      className: "navbar-text",
      children: options[0].name
    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.NavDropdown, {
      id: id ? `${id}-by` : (0, _utils.randomUUID)(),
      title: currentSortByLabel,
      onSelect: onChangeField,
      className: _SelectSortByModule.default['sort-by-items'],
      "aria-label": t('LIST_CHANGE_SORT_BY', {
        defaultValue: 'Change sort criteria. Current sort criteria: {{sortBy}}.',
        sortBy: currentSortByLabel
      }),
      children: options.map(option => /*#__PURE__*/(0, _jsxRuntime.jsx)(SortByItem, {
        option: option,
        id: id,
        t: t
      }, id))
    }), selected && /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Button, {
        id: id && `${id}-order-chooser`,
        "aria-label": t('LIST_CHANGE_SORT_BY_ORDER', {
          defaultValue: 'Change sort order. Current order: {{sortOrder}}.',
          sortOrder: currentSortOrderLabel
        }),
        onClick: onChangeOrder,
        bsStyle: "link",
        className: (0, _classnames.default)(_SelectSortByModule.default['tc-list-toolbar-order-chooser'], 'tc-list-toolbar-order-chooser'),
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
          name: isDescending ? 'talend-sort-desc' : 'talend-sort-asc'
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
          name: "talend-caret-down",
          transform: !isDescending && 'rotate-180',
          className: (0, _classnames.default)('tc-list-toolbar-order-indicator', _SelectSortByModule.default['tc-list-toolbar-order-indicator'])
        })]
      })
    })]
  });
}
SelectSortBy.propTypes = {
  field: _propTypes.default.string,
  id: _propTypes.default.string,
  isDescending: _propTypes.default.bool,
  onChange: _propTypes.default.func.isRequired,
  options: _propTypes.default.arrayOf(_propTypes.default.shape({
    id: _propTypes.default.string.isRequired,
    name: _propTypes.default.string
  })).isRequired,
  t: _propTypes.default.func
};
SelectSortBy.defaultProps = {
  t: (0, _translate.default)()
};
var _default = exports.default = SelectSortBy;
//# sourceMappingURL=SelectSortBy.component.js.map