@talend/react-components/lib/ResourceList/Resource/Resource.component.js

Set of react components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _reactI18next = require("react-i18next");
var _classnames = _interopRequireDefault(require("classnames"));
var _formatDistanceToNow = require("date-fns/formatDistanceToNow");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _constants = _interopRequireDefault(require("../../constants"));
var _locale = _interopRequireDefault(require("../../i18n/DateFnsLocale/locale"));
var _Icon = _interopRequireDefault(require("../../Icon"));
var _translate = _interopRequireDefault(require("../../translate"));
var _gridrow = require("../../VirtualizedList/utils/gridrow");
var _ResourceModule = _interopRequireDefault(require("./Resource.module.scss"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const FLAGS = {
  CERTIFIED: 'talend-badge',
  FAVORITE: 'talend-star'
};
function getDateLabel(t, date) {
  return (0, _formatDistanceToNow.formatDistanceToNow)(new Date(date), {
    addSuffix: true,
    locale: (0, _locale.default)(t)
  });
}
function getAuthorLabel(t, author, date) {
  return t('RESOURCE_OWNED_BY', {
    defaultValue: 'owned by {{ author }}, {{date}}',
    author,
    date: getDateLabel(t, date)
  });
}
function Resource({
  parent,
  index,
  style,
  className,
  as,
  t,
  ...rest
}) {
  const rowData = (0, _gridrow.getRowData)(parent, index);
  if (!rowData) {
    return null;
  }
  let onRowClick;
  const {
    icon,
    name,
    author,
    modified,
    flags = [],
    subtitle
  } = rowData;
  if (parent.props.onRowClick) {
    onRowClick = event => parent.props.onRowClick({
      event,
      rowData
    });
  }
  function hasPropRender() {
    return typeof as === 'function';
  }
  return (
    /*#__PURE__*/
    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
    (0, _jsxRuntime.jsx)("div", {
      className: (0, _classnames.default)('resource-item', _ResourceModule.default['resource-item'], {
        [_ResourceModule.default.center]: !hasPropRender()
      }, className),
      style: style,
      role: "listitem",
      tabIndex: "0",
      "aria-posinset": index + 1,
      "aria-setsize": parent.props.rowCount,
      "aria-label": name,
      onClick: onRowClick,
      ...rest,
      children: hasPropRender() ? as(rowData) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
        children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
          className: _ResourceModule.default.icon,
          name: icon
        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
          className: (0, _classnames.default)('data-container', _ResourceModule.default['data-container']),
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            className: (0, _classnames.default)('title', _ResourceModule.default.title),
            children: name
          }), author && subtitle === undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)("small", {
            className: (0, _classnames.default)('author', _ResourceModule.default.author),
            children: getAuthorLabel(t, author, modified)
          }), subtitle !== undefined && !author && /*#__PURE__*/(0, _jsxRuntime.jsx)("small", {
            className: (0, _classnames.default)('subtitle', _ResourceModule.default.subtitle),
            title: subtitle,
            children: subtitle
          })]
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: (0, _classnames.default)('flags-container', _ResourceModule.default['flags-container']),
          children: Object.keys(FLAGS).map((flag, flagIndex) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
            className: (0, _classnames.default)(_ResourceModule.default.flag, {
              [_ResourceModule.default.visible]: flags.includes(flag)
            }),
            name: FLAGS[flag]
          }, flagIndex))
        })]
      })
    })
  );
}
Resource.defaultProps = {
  t: (0, _translate.default)()
};
Resource.propTypes = {
  index: _propTypes.default.number,
  style: _propTypes.default.object,
  t: _propTypes.default.func,
  className: _propTypes.default.string,
  parent: _propTypes.default.shape({
    props: _propTypes.default.shape({
      onRowClick: _propTypes.default.func,
      collection: _propTypes.default.arrayOf(_propTypes.default.shape({
        icon: _propTypes.default.string,
        name: _propTypes.default.string,
        author: _propTypes.default.string,
        subtitle: _propTypes.default.string,
        modified: _propTypes.default.string,
        flags: _propTypes.default.arrayOf(_propTypes.default.string)
      }))
    })
  }),
  as: _propTypes.default.func
};
var _default = exports.default = (0, _reactI18next.withTranslation)(_constants.default)(Resource);
//# sourceMappingURL=Resource.component.js.map