cometchat-react-ui-kit2/dist/Messages/CometChatMessageHeader/index.js

CometChat UI Kit for React App

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CometChatMessageHeader = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _chat = require("@cometchat-pro/chat");
var _controller = require("./controller");
var _hooks = require("./hooks");
var _ = require("..");
var _Shared = require("../../Shared");
var _2 = require("../..");
var _style = require("./style");
var CometChatMessageHeader = function CometChatMessageHeader(props) {
  /**
   * Destructuring prop
   */
  var theme = props.theme,
    user = props.user,
    group = props.group,
    showBackButton = props.showBackButton;
  var loggedInUser = _react["default"].useRef(null);
  var messageHeaderManager = _react["default"].useRef(new _controller.MessageHeaderManager());
  var callbackData = _react["default"].useRef(null);
  var _React$useState = _react["default"].useState(null),
    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
    chatWith = _React$useState2[0],
    setChatWith = _React$useState2[1];
  var _React$useState3 = _react["default"].useState(null),
    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
    chatWithType = _React$useState4[0],
    setChatWithType = _React$useState4[1];
  var _React$useState5 = _react["default"].useState(""),
    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
    messageHeaderStatus = _React$useState6[0],
    setMessageHeaderStatus = _React$useState6[1];
  var _React$useState7 = _react["default"].useState("offline"),
    _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
    userPresence = _React$useState8[0],
    setUserPresence = _React$useState8[1];
  var _React$useState9 = _react["default"].useState(null),
    _React$useState10 = (0, _slicedToArray2["default"])(_React$useState9, 2),
    typingText = _React$useState10[0],
    setTypingText = _React$useState10[1];
  var _theme = new _Shared.CometChatTheme(theme !== null && theme !== void 0 ? theme : {});
  var messageHeaderCallback = function messageHeaderCallback(listenerName) {
    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
      args[_key - 1] = arguments[_key];
    }
    callbackData.current = {
      name: listenerName,
      args: [].concat(args)
    };
  };

  /**
   *
   * When a user goes online/ offline
   */
  var handleUsers = function handleUsers(user) {
    if (chatWithType === _.CometChatMessageReceiverType.user && (chatWith === null || chatWith === void 0 ? void 0 : chatWith.uid) === user.uid) {
      if (user.status === _2.UserStatusConstants.offline) {
        setMessageHeaderStatus((0, _2.localize)("OFFLINE"));
        setUserPresence(user.status);
      } else if (user.status === _2.UserStatusConstants.online) {
        setMessageHeaderStatus((0, _2.localize)("ONLINE"));
        setUserPresence(user.status);
      }
    }
  };
  var handleGroups = function handleGroups(group) {
    if (chatWithType === _.CometChatMessageReceiverType.group && (chatWith === null || chatWith === void 0 ? void 0 : chatWith.guid) === group.guid) {
      var membersCount = parseInt(group.membersCount);
      var status = "".concat(membersCount, " ").concat((0, _2.localize)("MEMBERS"));
      setMessageHeaderStatus(status);
    }
  };
  var getBackButtonElem = function getBackButtonElem() {
    if (showBackButton) {
      return /*#__PURE__*/_react["default"].createElement("div", {
        className: "chat__backbutton",
        style: (0, _style.backButtonStyle)(props)
      });
    }
    return null;
  };
  var handleStartTyping = function handleStartTyping(typingIndicator) {
    if (chatWithType === _.CometChatMessageReceiverType.group && chatWithType === typingIndicator.receiverType && (chatWith === null || chatWith === void 0 ? void 0 : chatWith.guid) === typingIndicator.receiverId) {
      var _typingText = "".concat(typingIndicator.sender.name, " ").concat((0, _2.localize)("IS_TYPING"));
      setTypingText(_typingText);
    } else if (chatWithType === _.CometChatMessageReceiverType.user && chatWithType === typingIndicator.receiverType && (chatWith === null || chatWith === void 0 ? void 0 : chatWith.uid) === typingIndicator.sender.uid) {
      var _typingText2 = (0, _2.localize)("TYPING");
      setTypingText(_typingText2);
    }
  };
  var handleEndTyping = function handleEndTyping(typingIndicator) {
    if (chatWithType === _.CometChatMessageReceiverType.group && chatWithType === typingIndicator.receiverType && (chatWith === null || chatWith === void 0 ? void 0 : chatWith.guid) === typingIndicator.receiverId) {
      var status = "".concat(chatWith === null || chatWith === void 0 ? void 0 : chatWith.membersCount, " ").concat((0, _2.localize)("MEMBERS"));
      setMessageHeaderStatus(status);
      setTypingText(null);
    } else if (chatWithType === _.CometChatMessageReceiverType.user && chatWithType === typingIndicator.receiverType && (chatWith === null || chatWith === void 0 ? void 0 : chatWith.uid) === typingIndicator.sender.uid) {
      if (userPresence === _2.UserStatusConstants.online) {
        setMessageHeaderStatus((0, _2.localize)("ONLINE"));
        setUserPresence(_2.UserStatusConstants.online);
        setTypingText(null);
      } else {
        setMessageHeaderStatus((0, _2.localize)("OFFLINE"));
        setUserPresence(_2.UserStatusConstants.offline);
        setTypingText(null);
      }
    }
  };
  var handlers = {
    onUserOnline: handleUsers,
    onUserOffline: handleUsers,
    onMemberAddedToGroup: handleGroups,
    onGroupMemberJoined: handleGroups,
    onGroupMemberKicked: handleGroups,
    onGroupMemberLeft: handleGroups,
    onGroupMemberBanned: handleGroups,
    onTypingStarted: handleStartTyping,
    onTypingEnded: handleEndTyping
  };
  var errorHandler = function errorHandler(errorCode) {
    _.CometChatMessageEvents.emit(_.CometChatMessageEvents.onMessageError, errorCode);
  };

  /** data item configuration */
  var dataItemConfig = new _Shared.DataItemConfiguration({});
  var _inputData = dataItemConfig.inputData;
  var _isActive = false;
  //const _options = dataItemConfig.options;
  //const _tail = dataItemConfig.tail;

  (0, _hooks.Hooks)(props, loggedInUser, setChatWith, setChatWithType, setMessageHeaderStatus, setUserPresence, messageHeaderManager, messageHeaderCallback, handlers, callbackData, errorHandler);
  return /*#__PURE__*/_react["default"].createElement("div", {
    style: (0, _style.chatHeaderStyle)(props, _theme),
    className: "chat__header"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    style: (0, _style.chatDetailStyle)(props),
    className: "chat__details"
  }, getBackButtonElem(), /*#__PURE__*/_react["default"].createElement("div", {
    style: (0, _style.chatThumbnailStyle)(props)
  }, /*#__PURE__*/_react["default"].createElement(_Shared.CometChatDataItem, {
    inputData: _inputData,
    style: (0, _style.dataItemStyle)(props, _theme),
    user: user,
    group: group,
    theme: _theme
    // options={props.options || _options}
    ,
    isActive: _isActive
  }))));
};
exports.CometChatMessageHeader = CometChatMessageHeader;
CometChatMessageHeader.defaultProps = {
  user: null,
  group: null,
  style: {
    width: "",
    height: "",
    border: "",
    borderRadius: "",
    background: "",
    backButtonIconTint: ""
  },
  showBackButton: false,
  backButtonIconURL: "",
  //options: [],
  enableTypingIndicator: false,
  dataItemConfiguration: null
};
CometChatMessageHeader.propTypes = {
  user: _propTypes["default"].instanceOf(_chat.CometChat.User),
  group: _propTypes["default"].instanceOf(_chat.CometChat.Group),
  showBackButton: _propTypes["default"].bool,
  style: _propTypes["default"].object,
  //options: PropTypes.array,
  enableTypingIndicator: _propTypes["default"].bool,
  dataItemConfiguration: _propTypes["default"].object
};