ringcentral-widget/components/RecentActivityMessages/index.js

RingCentral Integration Widget Library

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = RecentActivityMessages;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _bind = require('classnames/bind');

var _bind2 = _interopRequireDefault(_bind);

var _Spinner = require('../Spinner');

var _Spinner2 = _interopRequireDefault(_Spinner);

var _styles = require('./styles.scss');

var _styles2 = _interopRequireDefault(_styles);

var _i18n = require('./i18n');

var _i18n2 = _interopRequireDefault(_i18n);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var cx = _bind2.default.bind(_styles2.default);
function MessageItem(_ref) {
  var message = _ref.message,
      navigateTo = _ref.navigateTo,
      dateTimeFormatter = _ref.dateTimeFormatter;
  var subject = message.subject,
      creationTime = message.creationTime,
      readStatus = message.readStatus,
      conversationId = message.conversationId;

  var isUnread = readStatus !== 'Read';
  var time = dateTimeFormatter({ utcTimestamp: creationTime });
  return _react2.default.createElement(
    'div',
    {
      className: cx('messageItem', { localMessageItem: !message.fromRemote }),
      onClick: function onClick() {
        return !message.fromRemote && navigateTo('/conversations/' + conversationId);
      }
    },
    _react2.default.createElement(
      'dl',
      { className: _styles2.default.dl },
      _react2.default.createElement(
        'dt',
        { className: cx('messageSubject', { unread: isUnread }), title: subject },
        subject
      ),
      _react2.default.createElement(
        'dd',
        { className: cx('messageTime', { unread: isUnread }), title: time },
        time
      )
    )
  );
}

MessageItem.propTypes = {
  message: _propTypes2.default.object.isRequired,
  navigateTo: _propTypes2.default.func.isRequired,
  dateTimeFormatter: _propTypes2.default.func.isRequired
};

function RecentActivityMessages(_ref2) {
  var currentLocale = _ref2.currentLocale,
      messages = _ref2.messages,
      isMessagesLoaded = _ref2.isMessagesLoaded,
      navigateTo = _ref2.navigateTo,
      dateTimeFormatter = _ref2.dateTimeFormatter;

  var messageListView = null;
  if (!isMessagesLoaded) {
    messageListView = _react2.default.createElement(_Spinner2.default, { className: _styles2.default.spinner, ringWidth: 4 });
  } else if (messages.length > 0) {
    messageListView = messages.map(function (message) {
      return _react2.default.createElement(MessageItem, {
        key: message.id,
        message: message,
        navigateTo: navigateTo,
        dateTimeFormatter: dateTimeFormatter
      });
    });
  } else {
    messageListView = _react2.default.createElement(
      'p',
      { className: _styles2.default.noRecords },
      _i18n2.default.getString('noRecords', currentLocale)
    );
  }
  return _react2.default.createElement(
    'div',
    { className: _styles2.default.messages },
    messageListView
  );
}

RecentActivityMessages.propTypes = {
  currentLocale: _propTypes2.default.string.isRequired,
  messages: _propTypes2.default.array.isRequired,
  isMessagesLoaded: _propTypes2.default.bool.isRequired,
  navigateTo: _propTypes2.default.func.isRequired,
  dateTimeFormatter: _propTypes2.default.func.isRequired
};
//# sourceMappingURL=index.js.map