cometchat-react-ui-kit2/dist/Messages/Bubbles/CometChatTextBubble/index.js

CometChat UI Kit for React App

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CometChatTextBubble = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _CometChatMessageConstants = require("../../CometChatMessageConstants");
var _ = require("../../..");
var _style = require("./style");
var _hooks = require("./hooks");
var CometChatTextBubble = function CometChatTextBubble(props) {
  var _React$useState = _react["default"].useState(),
    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
    linkPreviewData = _React$useState2[0],
    setLinkPreview = _React$useState2[1];
  var theme = props.theme ? new _.CometChatTheme(props === null || props === void 0 ? void 0 : props.theme) : new _.CometChatTheme({});
  function linkPreviewHandler(preview) {
    var linkObject = preview["links"][0];
    var linkText = linkObject["url"];
    return /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.messagePreviewContainerStyle)(props, theme),
      className: "message__preview"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.messagePreviewWrapperStyle)(),
      className: "preview__card"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.previewImageStyle)(linkObject["image"]),
      className: "card__image"
    }), /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.previewDataStyle)(),
      className: "card__info"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.previewTitleStyle)(props, theme),
      className: "card__title"
    }, /*#__PURE__*/_react["default"].createElement("span", null, linkObject["title"]))), /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.previewLinkStyle)(),
      className: "card__link"
    }, /*#__PURE__*/_react["default"].createElement("a", {
      href: linkObject["url"],
      target: "_blank",
      rel: "noopener noreferrer",
      style: (0, _style.linkSubtitleStyle)(props, theme)
    }, linkText))));
  }
  var linkify = function linkify(messageText) {
    var _outputStr, _outputStr2;
    var outputStr = messageText === null || messageText === void 0 ? void 0 : messageText.replace(_CometChatMessageConstants.phoneNumPattern, "<a target='blank' rel='noopener noreferrer' href='tel:$&'>$&</a>");
    outputStr = (_outputStr = outputStr) === null || _outputStr === void 0 ? void 0 : _outputStr.replace(_CometChatMessageConstants.emailPattern, "<a target='blank' rel='noopener noreferrer' href='mailto:$&'>$&</a>");
    var results = (_outputStr2 = outputStr) === null || _outputStr2 === void 0 ? void 0 : _outputStr2.match(_CometChatMessageConstants.urlPattern);
    results && (results === null || results === void 0 ? void 0 : results.forEach(function (url) {
      url = url.trim();
      var normalizedURL = url;
      if (!url.startsWith("http")) {
        normalizedURL = "//".concat(url);
      }
      outputStr = outputStr.replace(url, "<a target='blank' rel='noopener noreferrer' href=\"".concat(normalizedURL, "\">").concat(url, "</a>"));
    }));
    return outputStr;
  };
  (0, _hooks.Hooks)(props, setLinkPreview);
  var getMessageText = function getMessageText() {
    var _props$messageObject;
    if (linkPreviewData && linkPreviewData !== null && linkPreviewData !== void 0 && linkPreviewData.links[0]) {
      return linkPreviewHandler(linkPreviewData);
    }
    var messageText;
    if (props.text && props.text.length) {
      messageText = props.text;
    }
    if (props !== null && props !== void 0 && props.messageObject && props !== null && props !== void 0 && (_props$messageObject = props.messageObject) !== null && _props$messageObject !== void 0 && _props$messageObject.text) {
      var _props$messageObject2;
      messageText = props === null || props === void 0 ? void 0 : (_props$messageObject2 = props.messageObject) === null || _props$messageObject2 === void 0 ? void 0 : _props$messageObject2.text;

      //xss extensions data
      var xssData = (0, _.getExtensionsData)(props.messageObject, _.ExtensionConstants.xssFilter);
      if (xssData && xssData.hasOwnProperty(_.ExtensionConstants.sanitizedText) && xssData.hasOwnProperty(_.ExtensionConstants.hasXSS) && xssData.hasXSS === "yes") {
        messageText = xssData.sanitized_text;
      }

      //datamasking extensions data
      var maskedData = (0, _.getExtensionsData)(props.messageObject, _.ExtensionConstants.dataMasking);
      if (maskedData && maskedData.hasOwnProperty("data") && maskedData.data.hasOwnProperty(_.ExtensionConstants.sensitiveData) && maskedData.data.hasOwnProperty(_.ExtensionConstants.messageMasked) && maskedData.data.sensitive_data === "yes") {
        messageText = maskedData.data.message_masked;
      }

      //profanity extensions data
      var profaneData = (0, _.getExtensionsData)(props.messageObject, _.ExtensionConstants.profanityFilter);
      if (profaneData && profaneData.hasOwnProperty(_.ExtensionConstants.profanity) && profaneData.hasOwnProperty(_.ExtensionConstants.messageClean) && profaneData.profanity === "yes") {
        messageText = profaneData.message_clean;
      }
    }
    var formattedText = linkify(messageText);
    return /*#__PURE__*/_react["default"].createElement("div", {
      style: (0, _style.messageKitTextBubbleBlockStyle)(props, theme),
      className: "message_kit__blocks"
    }, /*#__PURE__*/_react["default"].createElement("p", {
      className: "message__message-blocks",
      style: (0, _style.messageTextBubbleStyle)(props, theme, formattedText)
    }, formattedText));
  };
  return getMessageText();
};
exports.CometChatTextBubble = CometChatTextBubble;
CometChatTextBubble.defaultProps = {
  messageObject: null,
  text: "",
  linkPreviewTitle: "",
  linkPreviewSubtitle: "",
  style: {
    width: "",
    height: "",
    border: "0 none",
    background: "rgb(255,255,255)",
    borderRadius: "8px",
    textFont: "",
    textColor: "",
    linkPreviewTitleFont: "",
    linkPreviewTitleColor: "",
    linkPreviewSubtitleFont: "",
    linkPreviewSubtitleColor: "",
    linkPreviewBackgroundColor: ""
  }
};
CometChatTextBubble.propTypes = {
  messageObject: _propTypes["default"].object,
  text: _propTypes["default"].string,
  linkPreviewTitle: _propTypes["default"].string,
  linkPreviewSubtitle: _propTypes["default"].string,
  style: _propTypes["default"].object
};