react-discussionview/dist/index.js

A pure frontend react component that can be used for developing the discussions functionality in your app. It uses AWS DynamoDB as the backend database.

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var React = require('react');
var React__default = _interopDefault(React);
var reactCommentview = require('react-commentview');
require('react-bootstrap/Modal');
require('react-bootstrap');
var reactBootstrapIcons = require('react-bootstrap-icons');
var Themes = _interopDefault(require('react-ui-themes-superflows'));
require('aws-sdk/clients/dynamodb');
var DynamoDB = require('react-dynamodb-helper');
var reactUiComponentsSuperflows = require('react-ui-components-superflows');

// A type of promise-like that resolves synchronously and supports only one observer
const _Pact = /*#__PURE__*/(function() {
	function _Pact() {}
	_Pact.prototype.then = function(onFulfilled, onRejected) {
		const result = new _Pact();
		const state = this.s;
		if (state) {
			const callback = state & 1 ? onFulfilled : onRejected;
			if (callback) {
				try {
					_settle(result, 1, callback(this.v));
				} catch (e) {
					_settle(result, 2, e);
				}
				return result;
			} else {
				return this;
			}
		}
		this.o = function(_this) {
			try {
				const value = _this.v;
				if (_this.s & 1) {
					_settle(result, 1, onFulfilled ? onFulfilled(value) : value);
				} else if (onRejected) {
					_settle(result, 1, onRejected(value));
				} else {
					_settle(result, 2, value);
				}
			} catch (e) {
				_settle(result, 2, e);
			}
		};
		return result;
	};
	return _Pact;
})();

// Settles a pact synchronously
function _settle(pact, state, value) {
	if (!pact.s) {
		if (value instanceof _Pact) {
			if (value.s) {
				if (state & 1) {
					state = value.s;
				}
				value = value.v;
			} else {
				value.o = _settle.bind(null, pact, state);
				return;
			}
		}
		if (value && value.then) {
			value.then(_settle.bind(null, pact, state), _settle.bind(null, pact, 2));
			return;
		}
		pact.s = state;
		pact.v = value;
		const observer = pact.o;
		if (observer) {
			observer(pact);
		}
	}
}

function _isSettledPact(thenable) {
	return thenable instanceof _Pact && thenable.s & 1;
}

// Asynchronously iterate through an object that has a length property, passing the index as the first argument to the callback (even as the length property changes)
function _forTo(array, body, check) {
	var i = -1, pact, reject;
	function _cycle(result) {
		try {
			while (++i < array.length && (!check || !check())) {
				result = body(i);
				if (result && result.then) {
					if (_isSettledPact(result)) {
						result = result.v;
					} else {
						result.then(_cycle, reject || (reject = _settle.bind(null, pact = new _Pact(), 2)));
						return;
					}
				}
			}
			if (pact) {
				_settle(pact, 1, result);
			} else {
				pact = result;
			}
		} catch (e) {
			_settle(pact || (pact = new _Pact()), 2, e);
		}
	}
	_cycle();
	return pact;
}

const _iteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.iterator || (Symbol.iterator = Symbol("Symbol.iterator"))) : "@@iterator";

const _asyncIteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.asyncIterator || (Symbol.asyncIterator = Symbol("Symbol.asyncIterator"))) : "@@asyncIterator";

var Constants = {
  REPLY_TITLE_REPLY: "Write your reply",
  REPLY_TITLE_NEW_DISCUSSION: "Message",
  FILTER_TODAY: 0,
  FILTER_YESTERDAY: 1,
  FILTER_LAST_WEEK: 2,
  FILTER_LAST_MONTH: 3,
  FILTER_BEGINNING: 4
};

var updateDiscussion = function updateDiscussion(table, region, secret, key, data) {
  try {
    var params = {
      TableName: table,
      Item: data
    };
    console.log(params);
    return Promise.resolve(DynamoDB.putData(region, secret, key, params)).then(function (result) {
      console.log(result);
      return result;
    });
  } catch (e) {
    return Promise.reject(e);
  }
};

var createDiscussion = function createDiscussion(table, region, secret, key, data) {
  try {
    var params = {
      TableName: table,
      Item: data
    };
    return Promise.resolve(DynamoDB.putData(region, secret, key, params));
  } catch (e) {
    return Promise.reject(e);
  }
};

var getDiscussion = function getDiscussion(table, region, secret, key, topicId, timestamp) {
  try {
    var params = {
      TableName: table,
      KeyConditionExpression: "topicId = :a and #timestamp1 >= :t",
      ExpressionAttributeNames: {
        "#timestamp1": "timestamp"
      },
      ExpressionAttributeValues: {
        ":a": topicId,
        ":t": timestamp
      }
    };
    console.log(params);
    return Promise.resolve(DynamoDB.queryData(region, secret, key, params));
  } catch (e) {
    return Promise.reject(e);
  }
};

var exportFunctions = {
  getDiscussion: getDiscussion,
  createDiscussion: createDiscussion,
  updateDiscussion: updateDiscussion
};

var DiscussionView = function DiscussionView(props) {
  var _onDownVoteRemoved = function _onDownVoteRemoved(result) {
    try {
      var _exit14 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].downVotes != null) {
              for (var k = 0; k < jsonData[i].downVotes.length; k++) {
                if (result.userId != jsonData[i].downVotes[k]) {
                  tempArr.push(jsonData[i].downVotes[k]);
                }
              }
            }

            jsonData[i].downVotes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit14 = true;
            });
          }
        }();
      }, function () {
        return _exit14;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onDownVoted = function _onDownVoted(result) {
    try {
      var _exit12 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].downVotes != null) {
              tempArr = jsonData[i].downVotes;
            }

            tempArr.push(result.userId);
            jsonData[i].downVotes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit12 = true;
            });
          }
        }();
      }, function () {
        return _exit12;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onUpVoteRemoved = function _onUpVoteRemoved(result) {
    try {
      var _exit10 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].upVotes != null) {
              for (var k = 0; k < jsonData[i].upVotes.length; k++) {
                if (result.userId != jsonData[i].upVotes[k]) {
                  tempArr.push(jsonData[i].upVotes[k]);
                }
              }
            }

            jsonData[i].upVotes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit10 = true;
            });
          }
        }();
      }, function () {
        return _exit10;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onUpVoted = function _onUpVoted(result) {
    try {
      var _exit8 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].upVotes != null) {
              tempArr = jsonData[i].upVotes;
            }

            tempArr.push(result.userId);
            jsonData[i].upVotes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit8 = true;
            });
          }
        }();
      }, function () {
        return _exit8;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onDisLikeRemoved = function _onDisLikeRemoved(result) {
    try {
      var _exit6 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].disLikes != null) {
              for (var k = 0; k < jsonData[i].disLikes.length; k++) {
                if (result.userId != jsonData[i].disLikes[k]) {
                  tempArr.push(jsonData[i].disLikes[k]);
                }
              }
            }

            jsonData[i].disLikes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit6 = true;
            });
          }
        }();
      }, function () {
        return _exit6;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onDisLiked = function _onDisLiked(result) {
    try {
      var _exit4 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].disLikes != null) {
              tempArr = jsonData[i].disLikes;
            }

            tempArr.push(result.userId);
            jsonData[i].disLikes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit4 = true;
            });
          }
        }();
      }, function () {
        return _exit4;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onLikeRemoved = function _onLikeRemoved(result) {
    try {
      var _exit2 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].likes != null) {
              for (var k = 0; k < jsonData[i].likes.length; k++) {
                if (result.userId != jsonData[i].likes[k]) {
                  tempArr.push(jsonData[i].likes[k]);
                }
              }
            }

            jsonData[i].likes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit2 = true;
            });
          }
        }();
      }, function () {
        return _exit2;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _onLiked = function _onLiked(result) {
    try {
      var _exit16 = false;
      var jsonData = getDataWrap();
      return Promise.resolve(_forTo(jsonData, function (i) {
        return function () {
          if (jsonData[i].discussionId == result.discussionId) {
            var tempArr = [];

            if (jsonData[i].likes != null) {
              tempArr = jsonData[i].likes;
            }

            tempArr.push(result.userId);
            jsonData[i].likes = tempArr;
            return Promise.resolve(exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i])).then(function () {
              setDataWrap(jsonData);
              _exit16 = true;
            });
          }
        }();
      }, function () {
        return _exit16;
      }));
    } catch (e) {
      return Promise.reject(e);
    }
  };

  var _useState = React.useState('[]'),
      data = _useState[0],
      setdata = _useState[1];

  var _useState2 = React.useState(false),
      showFilters = _useState2[0],
      setShowFilters = _useState2[1];

  var _useState3 = React.useState(false),
      showSearch = _useState3[0],
      setShowSearch = _useState3[1];

  var _useState4 = React.useState(''),
      searchString = _useState4[0],
      setSearchString = _useState4[1];

  var _useState5 = React.useState(Constants.FILTER_LAST_MONTH),
      filter = _useState5[0],
      setFilter = _useState5[1];

  var _useState6 = React.useState(false),
      setShowReply = _useState6[1];

  var _useState7 = React.useState(''),
      setReplyTitle = _useState7[1];

  var _useState8 = React.useState(null),
      replyCallbackInfo = _useState8[0],
      setReplyCallbackInfo = _useState8[1];

  var _useState9 = React.useState('{}'),
      replyRepliedToInfo = _useState9[0],
      setReplyRepliedToInfo = _useState9[1];

  var _useState10 = React.useState(false),
      setDataFound = _useState10[1];

  var refInput = React.useRef(null);
  var refItems = React.useRef(new Array());
  var refMessageEnd = React.useRef(null);
  var theme = Themes.getTheme("Default");

  function setShowSearchWrap(value) {
    setTimeout(function () {
      setShowSearch(value);
    }, 500);
  }

  function setSearchStringWrap(value) {
    if (value.length > 2 || value.length === 0) {
      setTimeout(function () {
        setSearchString(value);
      }, 500);
    }
  }

  function setShowFiltersWrap(value) {
    setTimeout(function () {
      setShowFilters(value);
    }, 500);
  }

  function setFilterWrap(value) {
    setTimeout(function () {
      setFilter(value);
    }, 500);
  }

  function setReplyRepliedToInfoWrap(value) {
    setReplyRepliedToInfo(JSON.stringify(value));
  }

  function getReplyRepliedToInfoWrap() {
    return JSON.parse(replyRepliedToInfo);
  }

  function setReplyCallbackInfoWrap(value) {
    setReplyCallbackInfo(JSON.stringify(value));
  }

  function getReplyCallbackInfoWrap() {
    return JSON.parse(replyCallbackInfo);
  }

  function setDataWrap(value) {
    setdata(JSON.stringify(value));
  }

  function getDataWrap() {
    return JSON.parse(data);
  }

  function getDiscussionInfo(discussionId) {
    var ret = null;
    var jsonData = getDataWrap();

    for (var i = 0; i < jsonData.length; i++) {
      if (jsonData[i].discussionId == discussionId) {
        ret = jsonData[i];
      }
    }

    return ret;
  }

  function getDiscussionNumbers() {
    return getDataWrap().length;
  }

  function getDiscussionUserNumbers() {
    var ret = [];
    var jsonData = getDataWrap();

    for (var i = 0; i < jsonData.length; i++) {
      if (!ret.includes(jsonData[i].userId)) {
        ret.push(jsonData[i].userId);
      }
    }

    return ret.length;
  }

  function getDiscussionAttachmentNumbers() {
    var ret = 0;
    var jsonData = getDataWrap();

    for (var i = 0; i < jsonData.length; i++) {
      if (jsonData[i].attachment != null) {
        ret++;
      }
    }

    return ret;
  }

  function getNextDiscussionId() {
    var ret = 0;
    var jsonData = getDataWrap();

    for (var i = 0; i < jsonData.length; i++) {
      if (jsonData[i].discussionId > ret) {
        ret = jsonData[i].discussionId;
      }
    }

    return ret + 1;
  }

  function getDiscussionIndexFromId(discussionId) {
    var jsonData = getDataWrap();

    for (var i = 0; i < jsonData.length; i++) {
      if (jsonData[i].discussionId == discussionId) {
        return i;
      }
    }

    return -1;
  }

  function _onDelete(result) {
    var jsonData = getDataWrap();

    for (var i = 0; i < jsonData.length; i++) {
      if (jsonData[i].discussionId == result.discussionId) {
        jsonData[i].text = "";
        jsonData[i].attachment = null;
        jsonData[i].deleted = true;
        exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i]);
        setDataWrap(jsonData);
        return;
      }
    }
  }

  function _onSubmit(result) {
    var jsonData = getDataWrap();

    if (result.callbackInfo["new"]) {
      var newData = {};
      newData.topicId = props.topicId + '';
      newData.discussionId = getNextDiscussionId();
      newData.userId = props.userId;
      newData.userName = props.userName;
      newData.userPicture = props.userPicture;
      newData.timestamp = parseInt(new Date().getTime());
      newData.text = result.text;
      newData.attachment = result.attachment;
      newData.replyTo = result.callbackInfo.replyTo != null ? result.callbackInfo.replyTo : null;
      exportFunctions.createDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, newData);
      jsonData.push(newData);
      onReplyClose();
      setTimeout(function () {
        setDataFound(true);
        setTimeout(function () {
          setDataWrap(jsonData);
          setReplyRepliedToInfoWrap({});
        }, 100);
      }, 1000);
    } else {
      for (var i = 0; i < jsonData.length; i++) {
        if (jsonData[i].discussionId == result.callbackInfo.discussionId) {
          jsonData[i].text = result.text;
          jsonData[i].attachment = result.attachment;
          jsonData[i].edited = true;
          exportFunctions.updateDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, jsonData[i]);
          onReplyClose();
          setTimeout(function () {
            setDataFound(true);
            setTimeout(function () {
              setDataWrap(jsonData);
              setReplyRepliedToInfoWrap({});
            }, 100);
          }, 1000);
        }
      }
    }
  }

  function _onReplied(topicId, discussionId) {
    var discussion = getDiscussionInfo(discussionId);
    setReplyTitle(Constants.REPLY_TITLE_NEW_DISCUSSION);
    setReplyRepliedToInfoWrap({
      userName: discussion === null || discussion === void 0 ? void 0 : discussion.userName,
      text: discussion === null || discussion === void 0 ? void 0 : discussion.text
    });
    setReplyCallbackInfoWrap({
      topicId: topicId,
      discussionId: discussionId,
      "new": true,
      replyTo: {
        userName: discussion === null || discussion === void 0 ? void 0 : discussion.userName,
        text: discussion === null || discussion === void 0 ? void 0 : discussion.text,
        discussionId: discussion === null || discussion === void 0 ? void 0 : discussion.discussionId
      }
    });
    setTimeout(function () {
      setShowReply(true);
    }, 500);
  }

  function onReplyClose() {
    setTimeout(function () {
      setShowReply(false);
    }, 500);
  }

  function onReplyToClicked(result) {
    var discussionIndex = getDiscussionIndexFromId(result.replyTo.discussionId);
    setTimeout(function () {
      var _refItems$current$dis;

      (_refItems$current$dis = refItems.current[discussionIndex]) === null || _refItems$current$dis === void 0 ? void 0 : _refItems$current$dis.scrollIntoView({
        behavior: 'smooth'
      });
    }, 500);
  }

  function _onReplyToClosed() {
    setReplyRepliedToInfoWrap({});
  }

  React.useEffect(function () {
    var fetchData = function fetchData() {
      try {
        var i, i;
        var timestamp = 0;
        var result = null;

        var _temp2 = function () {
          if (showSearch) {
            return Promise.resolve(exportFunctions.getDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, props.topicId, 0)).then(function (_Services$getDiscussi) {
              result = _Services$getDiscussi;
              var searchedData = [];

              for (i = 0; i < result.length; i++) {
                if (result[i].userId != null) {}

                if (result[i].userId != null && result[i].text.indexOf(searchString) >= 0) {
                  searchedData.push(result[i]);
                }
              }

              setDataFound(true);
              setReplyCallbackInfoWrap({
                topicId: props.topicId,
                "new": true
              });
              setDataWrap(searchedData);
            });
          } else {
            if (filter == Constants.FILTER_TODAY) {
              timestamp = new Date().getTime() - 24 * 60 * 60 * 1000;
            }

            if (filter == Constants.FILTER_YESTERDAY) {
              timestamp = new Date().getTime() - 2 * 24 * 60 * 60 * 1000;
            }

            if (filter == Constants.FILTER_LAST_WEEK) {
              timestamp = new Date().getTime() - 7 * 24 * 60 * 60 * 1000;
            }

            if (filter == Constants.FILTER_LAST_MONTH) {
              timestamp = new Date().getTime() - 30 * 24 * 60 * 60 * 1000;
            }

            if (filter == Constants.FILTER_BEGINNING) {
              timestamp = 0;
            }

            return Promise.resolve(exportFunctions.getDiscussion(props.table, props.awsRegion, props.awsSecret, props.awsKey, props.topicId, timestamp)).then(function (_Services$getDiscussi2) {
              result = _Services$getDiscussi2;
              setDataFound(true);
              setReplyCallbackInfoWrap({
                topicId: props.topicId,
                "new": true
              });
              var data = [];

              for (i = 0; i < result.length; i++) {
                if (result[i].userId != null) {
                  data.push(result[i]);
                }
              }

              setDataWrap(data);
            });
          }
        }();

        return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
      } catch (e) {
        return Promise.reject(e);
      }
    };

    setTimeout(function () {
      if (refMessageEnd.current != null && refMessageEnd.current.scrollIntoView != null) {
        var _refMessageEnd$curren;

        (_refMessageEnd$curren = refMessageEnd.current) === null || _refMessageEnd$curren === void 0 ? void 0 : _refMessageEnd$curren.scrollIntoView({
          behavior: 'smooth'
        });
      }
    }, 500);
    fetchData();
  }, [data, filter, searchString, showSearch, showFilters]);
  return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
    className: "p-2",
    style: {
      position: 'relative',
      backgroundColor: props.theme != null ? props.theme.discussionViewBackgroundColor : theme.discussionViewBackgroundColor
    }
  }, getDataWrap().map(function (obj1, key1) {
    var refItem = function refItem(element) {
      return refItems.current[key1] = element;
    };

    return /*#__PURE__*/React__default.createElement("div", {
      className: "mt-2",
      key: key1,
      ref: refItem
    }, /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(reactCommentview.CommentView, {
      bucket: props.bucket,
      awsRegion: props.awsRegion,
      awsKey: props.awsKey,
      awsSecret: props.awsSecret,
      awsMediaConvertEndPoint: props.awsMediaConvertEndPoint,
      mode: obj1.deleted ? "deleted" : "view",
      showCancel: obj1.userId == props.userId ? true : false,
      showEdit: obj1.userId == props.userId ? true : false,
      showDelete: obj1.userId == props.userId ? true : false,
      showLikes: props.enableLikes,
      edited: obj1.edited,
      likes: obj1.likes != null && obj1.likes.length > 0 ? obj1.likes.length : 0,
      iHaveLiked: obj1.likes != null && obj1.likes.length > 0 && obj1.likes.includes(props.userId) ? true : false,
      showDisLikes: props.enableDisLikes,
      disLikes: obj1.disLikes != null && obj1.disLikes.length > 0 ? obj1.disLikes.length : 0,
      iHaveDisLiked: obj1.disLikes != null && obj1.disLikes.length > 0 && obj1.disLikes.includes(props.userId) ? true : false,
      showReplyToClose: false,
      showVotes: props.enableVotes,
      upVotes: obj1.upVotes != null && obj1.upVotes.length > 0 ? obj1.upVotes.length : 0,
      iHaveUpVoted: obj1.upVotes != null && obj1.upVotes.length > 0 && obj1.upVotes.includes(props.userId) ? true : false,
      downVotes: obj1.downVotes != null && obj1.downVotes.length > 0 ? obj1.downVotes.length : 0,
      iHaveDownVoted: obj1.downVotes != null && obj1.downVotes.length > 0 && obj1.downVotes.includes(props.userId) ? true : false,
      mediaConvertRole: props.mediaConvertRole,
      callbackInfo: {
        topicId: props.topicId,
        discussionId: obj1.discussionId,
        userId: props.userId,
        "new": false
      },
      replyTo: obj1.replyTo != null ? obj1.replyTo : null,
      user: {
        id: obj1.userId,
        name: obj1.userName,
        picture: obj1.userPicture,
        timestamp: obj1.timestamp != null ? parseInt(obj1.timestamp / 1000) : null
      },
      preFill: {
        id: obj1.id,
        text: obj1.text != null ? obj1.text : "",
        attachment: obj1.attachment != null ? obj1.attachment : null
      },
      cdnPrefix: props.cdnPrefix,
      onSubmit: function onSubmit(result) {
        _onSubmit(result);
      },
      onDelete: function onDelete(result) {
        _onDelete(result);
      },
      onLiked: function onLiked(result) {
        _onLiked(result);
      },
      onLikeRemoved: function onLikeRemoved(result) {
        _onLikeRemoved(result);
      },
      onDisLiked: function onDisLiked(result) {
        _onDisLiked(result);
      },
      onDisLikeRemoved: function onDisLikeRemoved(result) {
        _onDisLikeRemoved(result);
      },
      onReplied: function onReplied(result) {
        _onReplied(result.topicId, result.discussionId);
      },
      onUpVoted: function onUpVoted(result) {
        _onUpVoted(result);
      },
      onUpVoteRemoved: function onUpVoteRemoved(result) {
        _onUpVoteRemoved(result);
      },
      onDownVoted: function onDownVoted(result) {
        _onDownVoted(result);
      },
      onDownVoteRemoved: function onDownVoteRemoved(result) {
        _onDownVoteRemoved(result);
      },
      onReplyTo: function onReplyTo(result) {
        onReplyToClicked(result);
      },
      preventEditToView: false,
      theme: props.theme != null ? props.theme : theme
    })));
  }), /*#__PURE__*/React__default.createElement("div", {
    className: "d-flex flex-wrap justify-content-end",
    style: {
      bottom: '0px',
      position: 'sticky'
    }
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "mt-2 d-flex justify-content-between rounded p-2 flex-grow-1",
    style: {
      backgroundColor: props.theme != null ? props.theme.commentViewMyBackgroundColor : theme.commentViewMyBackgroundColor,
      border: 'solid 1px ' + theme.commentViewBorderColor,
      filter: 'brightness (20%)'
    }
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "d-flex mx-3 align-items-center",
    style: {
      color: props.theme != null ? props.theme.commentViewDecorationColor : theme.commentViewDecorationColor
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.ChatLeftDots, null), " \xA0\xA0", /*#__PURE__*/React__default.createElement("b", null, getDiscussionNumbers())), /*#__PURE__*/React__default.createElement("div", {
    className: "d-flex mx-3 align-items-center",
    style: {
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.People, null), " \xA0\xA0", /*#__PURE__*/React__default.createElement("b", null, getDiscussionUserNumbers()), /*#__PURE__*/React__default.createElement(reactBootstrapIcons.ArrowRightShort, null)), /*#__PURE__*/React__default.createElement("div", {
    className: "d-flex mx-3 align-items-center",
    style: {
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.Paperclip, null), " \xA0\xA0", /*#__PURE__*/React__default.createElement("b", null, getDiscussionAttachmentNumbers()), /*#__PURE__*/React__default.createElement(reactBootstrapIcons.ArrowRightShort, null))), props.enableSearch != null && props.enableSearch && !showFilters && /*#__PURE__*/React__default.createElement("div", {
    className: "mt-2 d-flex justify-content-between rounded p-2 ms-2",
    style: {
      backgroundColor: props.theme != null ? props.theme.commentViewMyBackgroundColor : theme.commentViewMyBackgroundColor,
      border: 'solid 1px ' + theme.commentViewBorderColor
    }
  }, !showSearch && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_search d-flex mx-1 align-items-center",
    style: {
      cursor: 'pointer',
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    },
    onClick: function onClick() {
      setShowSearchWrap(true);
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.Search, null)), showSearch && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_trash d-flex mx-1 align-items-center",
    style: {
      cursor: 'pointer',
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    },
    onClick: function onClick() {
      setShowSearchWrap(false);
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.Trash, null))), props.enableFilters != null && props.enableFilters && !showSearch && /*#__PURE__*/React__default.createElement("div", {
    className: "mt-2 d-flex justify-content-between rounded p-2 ms-2",
    style: {
      backgroundColor: props.theme != null ? props.theme.commentViewMyBackgroundColor : theme.commentViewMyBackgroundColor,
      border: 'solid 1px ' + theme.commentViewBorderColor
    }
  }, !showFilters && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_funnel d-flex mx-1 align-items-center",
    style: {
      cursor: 'pointer',
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    },
    onClick: function onClick() {
      setShowFiltersWrap(true);
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.Funnel, null)), showFilters && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_trash d-flex mx-1 align-items-center",
    style: {
      cursor: 'pointer',
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    },
    onClick: function onClick() {
      setShowFiltersWrap(false);
    }
  }, /*#__PURE__*/React__default.createElement(reactBootstrapIcons.Trash, null))), showSearch && /*#__PURE__*/React__default.createElement("div", {
    className: "input_search d-flex flex-wrap justify-content-start mt-2 rounded p-2 w-100",
    style: {
      backgroundColor: props.theme != null ? props.theme.commentViewMyBackgroundColor : theme.commentViewMyBackgroundColor,
      border: 'solid 1px ' + theme.commentViewBorderColor
    }
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.InputSearch, {
    setValue: setSearchStringWrap
  })), showFilters && /*#__PURE__*/React__default.createElement("div", {
    className: "d-flex flex-wrap justify-content-start mt-2 rounded p-2 w-100",
    style: {
      backgroundColor: props.theme != null ? props.theme.commentViewMyBackgroundColor : theme.commentViewMyBackgroundColor,
      border: 'solid 1px ' + theme.commentViewBorderColor
    }
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "my-1 w-100",
    style: {
      color: props.theme != null ? props.theme.commentViewDecorationHighlightColor : theme.commentViewDecorationHighlightColor
    }
  }, /*#__PURE__*/React__default.createElement("b", null, "Filter messages since")), /*#__PURE__*/React__default.createElement("div", {
    className: "my-1 w-100 d-flex justify-content-start flex-wrap"
  }, filter != Constants.FILTER_TODAY && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_today me-1 mb-1",
    onClick: function onClick() {
      setFilterWrap(Constants.FILTER_TODAY);
    }
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Today",
    icon: "Circle"
  })), filter == Constants.FILTER_TODAY && /*#__PURE__*/React__default.createElement("div", {
    className: "me-1 mb-1"
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Today",
    icon: "CheckCircle",
    custom: {
      backgroundColor: '#444444',
      color: theme.commentViewBackgroundColor
    }
  })), filter != Constants.FILTER_YESTERDAY && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_yesterday me-1 mb-1",
    onClick: function onClick() {
      setFilterWrap(Constants.FILTER_YESTERDAY);
    }
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Yesterday",
    icon: "Circle"
  })), filter == Constants.FILTER_YESTERDAY && /*#__PURE__*/React__default.createElement("div", {
    className: "me-1 mb-1"
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Yesterday",
    icon: "CheckCircle",
    custom: {
      backgroundColor: '#444444',
      color: theme.commentViewBackgroundColor
    }
  })), filter != Constants.FILTER_LAST_WEEK && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_last_week me-1 mb-1",
    onClick: function onClick() {
      setFilterWrap(Constants.FILTER_LAST_WEEK);
    }
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Last week",
    icon: "Circle"
  })), filter == Constants.FILTER_LAST_WEEK && /*#__PURE__*/React__default.createElement("div", {
    className: "me-1 mb-1"
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Last week",
    icon: "CheckCircle",
    custom: {
      backgroundColor: '#444444',
      color: theme.commentViewBackgroundColor
    }
  })), filter != Constants.FILTER_LAST_MONTH && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_last_month me-1 mb-1",
    onClick: function onClick() {
      setFilterWrap(Constants.FILTER_LAST_MONTH);
    }
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Last month",
    icon: "Circle"
  })), filter == Constants.FILTER_LAST_MONTH && /*#__PURE__*/React__default.createElement("div", {
    className: "me-1 mb-1"
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Last month",
    icon: "CheckCircle",
    custom: {
      backgroundColor: '#444444',
      color: theme.commentViewBackgroundColor
    }
  })), filter != Constants.FILTER_BEGINNING && /*#__PURE__*/React__default.createElement("div", {
    className: "btn_beginning me-1 mb-1",
    onClick: function onClick() {
      setFilterWrap(Constants.FILTER_BEGINNING);
    }
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Beginning",
    icon: "Circle"
  })), filter == Constants.FILTER_BEGINNING && /*#__PURE__*/React__default.createElement("div", {
    className: "me-1 mb-1"
  }, /*#__PURE__*/React__default.createElement(reactUiComponentsSuperflows.ButtonNeutral, {
    caption: "Beginning",
    icon: "CheckCircle",
    custom: {
      backgroundColor: '#444444',
      color: theme.commentViewBackgroundColor
    }
  })))), !showFilters && !showSearch && /*#__PURE__*/React__default.createElement("div", {
    className: "mt-2 w-100"
  }, /*#__PURE__*/React__default.createElement(reactCommentview.CommentView, {
    bucket: props.bucket,
    awsRegion: props.awsRegion,
    awsKey: props.awsKey,
    awsSecret: props.awsSecret,
    awsMediaConvertEndPoint: props.awsMediaConvertEndPoint,
    mode: "edit",
    clearOnSubmit: true,
    preventEditToView: true,
    showEdit: true,
    showReplyToClose: true,
    replyTo: getReplyRepliedToInfoWrap(),
    mediaConvertRole: props.mediaConvertRole,
    callbackInfo: getReplyCallbackInfoWrap(),
    user: {
      id: props.userId,
      name: props.userName,
      picture: props.userPicture
    },
    cdnPrefix: props.cdnPrefix,
    onSubmit: function onSubmit(result) {
      _onSubmit(result);
    },
    theme: props.theme != null ? props.theme : theme,
    onReplyToClosed: function onReplyToClosed() {
      _onReplyToClosed();
    }
  }))), /*#__PURE__*/React__default.createElement("div", {
    ref: refMessageEnd
  })));
};

exports.DiscussionView = DiscussionView;
//# sourceMappingURL=index.js.map