@bigbinary/neeto-molecules 3.15.38 → 3.15.39

package/README.md

@@ -35,6 +35,7 @@ https://neeto-molecules.neeto.com/
 - [EmailPreview](./docs/components/EmailPreview.md)
 - [EmojiPicker](./docs/components/EmojiPicker.md)
 - [EmojiReactions](./docs/components/EmojiReactions.md)
+- [Engagements](./docs/components/Engagements.md)
 - [ErrorPage](./docs/components/ErrorPage.md)
 - [FileUpload](./docs/components/FileUpload.md)
 - [FinderModal](./docs/components/FinderModal.md)

package/dist/Engagements.js

@@ -0,0 +1,292 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import React__default, { memo, forwardRef } from 'react';
+import { isPresent, findIndexBy, noop } from '@bigbinary/neeto-cist';
+import classnames from 'classnames';
+import Avatar from '@bigbinary/neetoui/Avatar';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { P as PropTypes } from './index-DAYCJu79.js';
+import Typography from '@bigbinary/neetoui/Typography';
+import DateFormat from './DateFormat.js';
+import MoreDropdown from './MoreDropdown.js';
+import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
+import Tooltip from '@bigbinary/neetoui/Tooltip';
+import { collectBy, prop, eqProps, pluck, pathEq } from 'ramda';
+import { useTranslation } from 'react-i18next';
+import EmojiPicker from './EmojiPicker.js';
+import { n } from './inject-css-DmrvuTKK.js';
+import './_commonjsHelpers-BFTU3MAI.js';
+import '@bigbinary/neeto-commons-frontend/react-utils/useTimer';
+import '@bigbinary/neeto-commons-frontend/utils/datetime';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@bigbinary/neeto-icons/MenuHorizontal';
+import '@bigbinary/neeto-icons/MenuVertical';
+import '@bigbinary/neetoui/Button';
+import '@bigbinary/neetoui/Dropdown';
+import '@babel/runtime/helpers/slicedToArray';
+import '@bigbinary/neeto-icons/SmileFaceGrey';
+import 'emoji-mart';
+import '@tanstack/react-query';
+import 'axios';
+
+var ActivityIcon = function ActivityIcon(_ref) {
+  var icon = _ref.icon,
+    unread = _ref.unread;
+  return /*#__PURE__*/jsx("div", {
+    className: "flex-shrink-0",
+    children: /*#__PURE__*/jsxs("span", {
+      className: classnames("neeto-ui-bg-gray-200 neeto-ui-text-gray-600 neeto-ui-rounded-full relative z-10 flex h-7 w-7 items-center justify-center p-1", {
+        "neeto-ui-text-primary-600 neeto-ui-bg-primary-100": unread
+      }),
+      children: [icon, unread && /*#__PURE__*/jsx("span", {
+        className: "neeto-ui-rounded-full neeto-ui-bg-primary-800 absolute -right-0.5 -top-0.5 h-2 w-2"
+      })]
+    })
+  });
+};
+
+var Activity = function Activity(_ref) {
+  var user = _ref.user,
+    icon = _ref.icon,
+    _ref$unread = _ref.unread,
+    unread = _ref$unread === void 0 ? false : _ref$unread,
+    className = _ref.className,
+    children = _ref.children;
+  var avatar = {
+    name: user.name,
+    imageUrl: user.profileImageUrl
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames("neeto-molecules-engagements-node relative -mt-4 flex items-center gap-2 py-4", className),
+    children: [/*#__PURE__*/jsx(ActivityIcon, {
+      icon: icon,
+      unread: unread
+    }), /*#__PURE__*/jsx(Avatar, {
+      size: "medium",
+      user: avatar
+    }), /*#__PURE__*/jsx("div", {
+      className: "pt-0.5",
+      children: children
+    })]
+  });
+};
+
+var CommentHeader = function CommentHeader(_ref) {
+  var user = _ref.user,
+    comment = _ref.comment,
+    info = _ref.info,
+    actions = _ref.actions;
+  var avatar = {
+    name: user.name,
+    imageUrl: user.profileImageUrl
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: "neeto-ui-bg-gray-100 neeto-ui-border-gray-300 flex items-center justify-between rounded-t-md border-b py-2 pl-4 pr-2",
+    children: [/*#__PURE__*/jsxs("div", {
+      className: "flex items-center gap-2",
+      children: [/*#__PURE__*/jsx(Avatar, {
+        size: "medium",
+        user: avatar
+      }), /*#__PURE__*/jsx(Typography, {
+        className: "neeto-ui-text-gray-700",
+        style: "body2",
+        weight: "semibold",
+        children: user.name
+      }), /*#__PURE__*/jsx(Typography, {
+        className: "neeto-ui-text-gray-700",
+        style: "body2",
+        children: "\u2022"
+      }), info && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Typography, {
+          className: "neeto-ui-text-gray-500 lowercase",
+          style: "body2",
+          children: info
+        }), /*#__PURE__*/jsx(Typography, {
+          className: "neeto-ui-text-gray-700",
+          style: "body2",
+          children: "\u2022"
+        })]
+      }), comment.createdAt && /*#__PURE__*/jsx(DateFormat.FromNow, {
+        date: comment.createdAt,
+        typographyProps: {
+          style: "body2",
+          className: "neeto-ui-text-gray-500"
+        }
+      })]
+    }), isPresent(actions) && /*#__PURE__*/jsx(MoreDropdown, {
+      dropdownProps: {
+        position: "bottom-start"
+      },
+      menuItems: actions
+    })]
+  });
+};
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var findOwnIndex = findIndexBy({
+  userId: globalProps.user.id
+});
+var groupReactions = collectBy(prop("unified"));
+var Reactions = function Reactions(_ref) {
+  var reactions = _ref.reactions,
+    onAdd = _ref.onAdd,
+    onRemove = _ref.onRemove;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var groups = groupReactions(reactions);
+  var onSelect = function onSelect(emoji) {
+    // Try to find group to which emoji belongs in existing reactions.
+    var group = groups.find(pathEq(emoji.unified, [0, "unified"]));
+    if (group && findOwnIndex(group) >= 0) return; // User already reacted with same emoji.
+    onAdd(_objectSpread(_objectSpread({}, emoji), {}, {
+      emoji: emoji["native"]
+    }));
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: "mt-2 flex flex-wrap gap-0.5",
+    children: [/*#__PURE__*/jsx("div", {
+      className: "neeto-ui-rounded-full neeto-ui-bg-gray-200 mr-2",
+      children: /*#__PURE__*/jsx(EmojiPicker, {
+        onSelect: onSelect
+      })
+    }), groups.map(function (reactions) {
+      var ownIndex = findOwnIndex(reactions);
+      var selected = ownIndex >= 0;
+      var reaction = selected ? reactions[ownIndex] : reactions[0];
+      var names = pluck("reactor", reactions).join(", ");
+      return /*#__PURE__*/jsx(Tooltip, {
+        position: "top",
+        content: /*#__PURE__*/jsx("p", {
+          className: "text-center text-xs",
+          children: t("neetoMolecules.common.reacted", {
+            names: names
+          })
+        }),
+        children: /*#__PURE__*/jsx("div", {
+          className: classnames("neeto-ui-rounded-full mx-1 flex cursor-pointer items-center justify-center px-2 py-1", {
+            "neeto-ui-bg-accent-100": selected,
+            "neeto-ui-bg-gray-100": !selected
+          }),
+          onClick: function onClick() {
+            return (selected ? onRemove : onAdd)(reaction);
+          },
+          children: /*#__PURE__*/jsxs(Typography, {
+            className: "space-x-1 text-sm",
+            style: "body2",
+            children: [/*#__PURE__*/jsx("span", {
+              className: "text-sm",
+              children: reaction.emoji
+            }), /*#__PURE__*/jsx("span", {
+              className: "text-sm",
+              children: reactions.length
+            })]
+          })
+        })
+      }, reaction.unified);
+    })]
+  });
+};
+var Reactions$1 = /*#__PURE__*/memo(Reactions, eqProps("reactions"));
+
+var ENGAGEMENT_TYPES = {
+  COMMENT: "comment",
+  ACTIVITY: "activity"
+};
+
+var createCommentElementId = function createCommentElementId(comment) {
+  return "neeto-molecules-engagement-comment--".concat(comment.id);
+};
+var defaultMatchType = function defaultMatchType(engagement) {
+  if (engagement.commenter) return ENGAGEMENT_TYPES.COMMENT;else if (engagement.creator) return ENGAGEMENT_TYPES.ACTIVITY;
+  return null;
+};
+
+var Comment = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var user = _ref.user,
+    comment = _ref.comment,
+    reactions = _ref.reactions,
+    info = _ref.info,
+    actions = _ref.actions,
+    className = _ref.className,
+    children = _ref.children,
+    onAddReaction = _ref.onAddReaction,
+    onRemoveReaction = _ref.onRemoveReaction;
+  return /*#__PURE__*/jsxs("div", {
+    ref: ref,
+    id: createCommentElementId(comment),
+    className: classnames("neeto-ui-bg-white neeto-ui-rounded-md neeto-ui-border-gray-300 neeto-molecules-comments-node mb-4 w-full border", className),
+    children: [/*#__PURE__*/jsx(CommentHeader, {
+      actions: actions,
+      comment: comment,
+      info: info,
+      user: user
+    }), /*#__PURE__*/jsxs("div", {
+      className: "neeto-molecules-comments-node__inner p-4",
+      children: [children, reactions !== false && /*#__PURE__*/jsx(Reactions$1, {
+        reactions: reactions,
+        onAdd: onAddReaction,
+        onRemove: onRemoveReaction
+      })]
+    })]
+  });
+});
+Comment.displayName = "Comment";
+Comment.propTypes = {
+  /** Object representing the user information  */
+  user: PropTypes.shape({
+    name: PropTypes.string.isRequired
+  }).isRequired,
+  /** Object representing the comment item.  */
+  comment: PropTypes.shape({
+    id: PropTypes.string.isRequired,
+    createdAt: PropTypes.string.isRequired
+  }).isRequired,
+  /** Array of reactions. Settings this to `false` will disable reactions for the item  */
+  reactions: PropTypes.oneOfType([PropTypes.array, PropTypes.bool]),
+  /**  Optional text label to be displayed in the header. */
+  info: PropTypes.string,
+  /**  Optional action items to be passed to the menuItems prop of the actions dropdown */
+  actions: PropTypes.arrayOf(PropTypes.shape({
+    isVisible: PropTypes.bool,
+    key: PropTypes.string.isRequired,
+    label: PropTypes.string.isRequired,
+    onClick: PropTypes.func.isRequired
+  })),
+  /**  Additional classes passed on to the board view. */
+  className: PropTypes.string,
+  /** Callback function triggered when a reaction (emoji) is added */
+  onAddReaction: PropTypes.func,
+  /** Callback function triggered when a reaction (emoji) is removed*/
+  onRemoveReaction: PropTypes.func
+};
+
+var css = ".neeto-molecules-comments-node{position:relative}.neeto-molecules-comments-node:before{background-color:rgb(var(--neeto-ui-gray-200));content:\"\";height:1rem;left:13px;position:absolute;top:calc(100% + 1px);transform:translateX(-50%);width:2px}.neeto-molecules-comments-node:last-child:before{display:none}.neeto-molecules-engagements-node{position:relative}.neeto-molecules-engagements-node:before{background-color:rgb(var(--neeto-ui-gray-200));content:\"\";height:100%;left:14px;position:absolute;top:0;transform:translateX(-50%);width:2px}";
+n(css,{});
+
+var Engagements = function Engagements(_ref) {
+  var data = _ref.data,
+    _ref$isActivitiesEnab = _ref.isActivitiesEnabled,
+    isActivitiesEnabled = _ref$isActivitiesEnab === void 0 ? false : _ref$isActivitiesEnab,
+    _ref$matchType = _ref.matchType,
+    matchType = _ref$matchType === void 0 ? defaultMatchType : _ref$matchType,
+    renderComment = _ref.renderComment,
+    renderActivity = _ref.renderActivity;
+  var rendererHashmap = _defineProperty(_defineProperty({}, ENGAGEMENT_TYPES.COMMENT, renderComment), ENGAGEMENT_TYPES.ACTIVITY, isActivitiesEnabled ? renderActivity : noop);
+  return /*#__PURE__*/jsx(Fragment, {
+    children: data.map(function (engagement, index) {
+      var type = matchType(engagement);
+      var renderer = rendererHashmap[type];
+      if (!renderer) return null;
+      return /*#__PURE__*/jsx(React__default.Fragment, {
+        children: renderer(engagement, index)
+      }, engagement.id);
+    })
+  });
+};
+Engagements.displayName = "Engagements";
+Engagements.Comment = Comment;
+Engagements.Activity = Activity;
+Engagements.TYPES = ENGAGEMENT_TYPES;
+
+export { Engagements as default };
+//# sourceMappingURL=Engagements.js.map

package/dist/Engagements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Engagements.js","sources":["../src/components/Engagements/Activity/Icon.jsx","../src/components/Engagements/Activity/index.jsx","../src/components/Engagements/Comment/Header.jsx","../src/components/Engagements/Comment/Reactions.jsx","../src/components/Engagements/constants.js","../src/components/Engagements/utils.js","../src/components/Engagements/Comment/index.jsx","../src/components/Engagements/index.jsx"],"sourcesContent":["import classNames from \"classnames\";\n\nconst ActivityIcon = ({ icon, unread }) => (\n  <div className=\"flex-shrink-0\">\n    <span\n      className={classNames(\n        \"neeto-ui-bg-gray-200 neeto-ui-text-gray-600 neeto-ui-rounded-full relative z-10 flex h-7 w-7 items-center justify-center p-1\",\n        {\n          \"neeto-ui-text-primary-600 neeto-ui-bg-primary-100\": unread,\n        }\n      )}\n    >\n      {icon}\n      {unread && (\n        <span className=\"neeto-ui-rounded-full neeto-ui-bg-primary-800 absolute -right-0.5 -top-0.5 h-2 w-2\" />\n      )}\n    </span>\n  </div>\n);\n\nexport default ActivityIcon;\n","import classNames from \"classnames\";\nimport { Avatar } from \"neetoui\";\nimport PropTypes from \"prop-types\";\n\nimport ActivityIcon from \"./Icon\";\n\nconst Activity = ({ user, icon, unread = false, className, children }) => {\n  const avatar = { name: user.name, imageUrl: user.profileImageUrl };\n\n  return (\n    <div\n      className={classNames(\n        \"neeto-molecules-engagements-node relative -mt-4 flex items-center gap-2 py-4\",\n        className\n      )}\n    >\n      <ActivityIcon {...{ icon, unread }} />\n      <Avatar size=\"medium\" user={avatar} />\n      <div className=\"pt-0.5\">{children}</div>\n    </div>\n  );\n};\n\nActivity.propTypes = {\n  /** Object representing the user information  */\n  user: PropTypes.shape({ name: PropTypes.string.isRequired }).isRequired,\n\n  /** Element to render as the icon  */\n  icon: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,\n\n  /** Boolean indicating if the activity is unread to show unread badge */\n  unread: PropTypes.bool,\n\n  /**  Additional classes passed on to the board view. */\n  className: PropTypes.string,\n};\n\nexport default Activity;\n","import { isPresent } from \"neetocist\";\nimport { Avatar, Typography } from \"neetoui\";\n\nimport DateFormat from \"components/DateFormat\";\nimport MoreDropdown from \"components/MoreDropdown\";\n\nconst CommentHeader = ({ user, comment, info, actions }) => {\n  const avatar = { name: user.name, imageUrl: user.profileImageUrl };\n\n  return (\n    <div className=\"neeto-ui-bg-gray-100 neeto-ui-border-gray-300 flex items-center justify-between rounded-t-md border-b py-2 pl-4 pr-2\">\n      <div className=\"flex items-center gap-2\">\n        <Avatar size=\"medium\" user={avatar} />\n        <Typography\n          className=\"neeto-ui-text-gray-700\"\n          style=\"body2\"\n          weight=\"semibold\"\n        >\n          {user.name}\n        </Typography>\n        <Typography className=\"neeto-ui-text-gray-700\" style=\"body2\">\n          •\n        </Typography>\n        {info && (\n          <>\n            <Typography\n              className=\"neeto-ui-text-gray-500 lowercase\"\n              style=\"body2\"\n            >\n              {info}\n            </Typography>\n            <Typography className=\"neeto-ui-text-gray-700\" style=\"body2\">\n              •\n            </Typography>\n          </>\n        )}\n        {comment.createdAt && (\n          <DateFormat.FromNow\n            date={comment.createdAt}\n            typographyProps={{\n              style: \"body2\",\n              className: \"neeto-ui-text-gray-500\",\n            }}\n          />\n        )}\n      </div>\n      {isPresent(actions) && (\n        <MoreDropdown\n          dropdownProps={{ position: \"bottom-start\" }}\n          menuItems={actions}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default CommentHeader;\n","import { memo } from \"react\";\n\nimport classNames from \"classnames\";\nimport { findIndexBy } from \"neetocist\";\nimport { globalProps } from \"neetocommons/initializers\";\nimport { Tooltip, Typography } from \"neetoui\";\nimport { collectBy, eqProps, pathEq, pluck, prop } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport EmojiPicker from \"components/EmojiPicker\";\n\nconst findOwnIndex = findIndexBy({ userId: globalProps.user.id });\nconst groupReactions = collectBy(prop(\"unified\"));\n\nconst Reactions = ({ reactions, onAdd, onRemove }) => {\n  const { t } = useTranslation();\n  const groups = groupReactions(reactions);\n\n  const onSelect = emoji => {\n    // Try to find group to which emoji belongs in existing reactions.\n    const group = groups.find(pathEq(emoji.unified, [0, \"unified\"]));\n    if (group && findOwnIndex(group) >= 0) return; // User already reacted with same emoji.\n    onAdd({ ...emoji, emoji: emoji.native });\n  };\n\n  return (\n    <div className=\"mt-2 flex flex-wrap gap-0.5\">\n      <div className=\"neeto-ui-rounded-full neeto-ui-bg-gray-200 mr-2\">\n        <EmojiPicker {...{ onSelect }} />\n      </div>\n      {groups.map(reactions => {\n        const ownIndex = findOwnIndex(reactions);\n        const selected = ownIndex >= 0;\n        const reaction = selected ? reactions[ownIndex] : reactions[0];\n        const names = pluck(\"reactor\", reactions).join(\", \");\n\n        return (\n          <Tooltip\n            key={reaction.unified}\n            position=\"top\"\n            content={\n              <p className=\"text-center text-xs\">\n                {t(\"neetoMolecules.common.reacted\", { names })}\n              </p>\n            }\n          >\n            <div\n              className={classNames(\n                \"neeto-ui-rounded-full mx-1 flex cursor-pointer items-center justify-center px-2 py-1\",\n                {\n                  \"neeto-ui-bg-accent-100\": selected,\n                  \"neeto-ui-bg-gray-100\": !selected,\n                }\n              )}\n              onClick={() => (selected ? onRemove : onAdd)(reaction)}\n            >\n              <Typography className=\"space-x-1 text-sm\" style=\"body2\">\n                <span className=\"text-sm\">{reaction.emoji}</span>\n                <span className=\"text-sm\">{reactions.length}</span>\n              </Typography>\n            </div>\n          </Tooltip>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default memo(Reactions, eqProps(\"reactions\"));\n","export const ACTIVITY_TYPES = {\n  TIMELINE: \"Timeline\",\n  FIELD_VALUE: \"FieldValue\",\n  TASK: \"Task\",\n  ASSIGNEE: \"Assignee\",\n  CHECKLIST: \"Checklist\",\n  FIELD: \"Field\",\n  PROJECT: \"Project\",\n  COMMENT: \"Comment\",\n  DOCUMENT: \"Document\",\n  CHAT_MESSAGE: \"ChatMessage\",\n  MESSAGE: \"Message\",\n  SECTION: \"Section\",\n  PROJECT_MEMBER: \"ProjectMember\",\n  PULL_REQUEST: \"NeetoGithubEngine::PullRequest\",\n};\n\nexport const ENGAGEMENT_TYPES = {\n  COMMENT: \"comment\",\n  ACTIVITY: \"activity\",\n};\n","import { ENGAGEMENT_TYPES } from \"./constants\";\n\nexport const createCommentElementId = comment =>\n  `neeto-molecules-engagement-comment--${comment.id}`;\n\nexport const defaultMatchType = engagement => {\n  if (engagement.commenter) return ENGAGEMENT_TYPES.COMMENT;\n  else if (engagement.creator) return ENGAGEMENT_TYPES.ACTIVITY;\n\n  return null;\n};\n","import { forwardRef } from \"react\";\n\nimport classNames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport CommentHeader from \"./Header\";\nimport Reactions from \"./Reactions\";\n\nimport { createCommentElementId } from \"../utils\";\n\nconst Comment = forwardRef(\n  (\n    {\n      user,\n      comment,\n      reactions,\n      info,\n      actions,\n      className,\n      children,\n      onAddReaction,\n      onRemoveReaction,\n    },\n    ref\n  ) => (\n    <div\n      {...{ ref }}\n      id={createCommentElementId(comment)}\n      className={classNames(\n        \"neeto-ui-bg-white neeto-ui-rounded-md neeto-ui-border-gray-300 neeto-molecules-comments-node mb-4 w-full border\",\n        className\n      )}\n    >\n      <CommentHeader {...{ actions, comment, info, user }} />\n      <div className=\"neeto-molecules-comments-node__inner p-4\">\n        {children}\n        {reactions !== false && (\n          <Reactions\n            {...{ reactions }}\n            onAdd={onAddReaction}\n            onRemove={onRemoveReaction}\n          />\n        )}\n      </div>\n    </div>\n  )\n);\n\nComment.displayName = \"Comment\";\nComment.propTypes = {\n  /** Object representing the user information  */\n  user: PropTypes.shape({ name: PropTypes.string.isRequired }).isRequired,\n\n  /** Object representing the comment item.  */\n  comment: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    createdAt: PropTypes.string.isRequired,\n  }).isRequired,\n\n  /** Array of reactions. Settings this to `false` will disable reactions for the item  */\n  reactions: PropTypes.oneOfType([PropTypes.array, PropTypes.bool]),\n\n  /**  Optional text label to be displayed in the header. */\n  info: PropTypes.string,\n\n  /**  Optional action items to be passed to the menuItems prop of the actions dropdown */\n  actions: PropTypes.arrayOf(\n    PropTypes.shape({\n      isVisible: PropTypes.bool,\n      key: PropTypes.string.isRequired,\n      label: PropTypes.string.isRequired,\n      onClick: PropTypes.func.isRequired,\n    })\n  ),\n\n  /**  Additional classes passed on to the board view. */\n  className: PropTypes.string,\n\n  /** Callback function triggered when a reaction (emoji) is added */\n  onAddReaction: PropTypes.func,\n\n  /** Callback function triggered when a reaction (emoji) is removed*/\n  onRemoveReaction: PropTypes.func,\n};\n\nexport default Comment;\n","import React from \"react\";\n\nimport { noop } from \"neetocist\";\nimport PropTypes from \"prop-types\";\n\nimport Activity from \"./Activity\";\nimport Comment from \"./Comment\";\nimport { ENGAGEMENT_TYPES } from \"./constants\";\nimport \"./engagements.scss\";\nimport { defaultMatchType } from \"./utils\";\n\nconst Engagements = ({\n  data,\n  isActivitiesEnabled = false,\n  matchType = defaultMatchType,\n  renderComment,\n  renderActivity,\n}) => {\n  const rendererHashmap = {\n    [ENGAGEMENT_TYPES.COMMENT]: renderComment,\n    [ENGAGEMENT_TYPES.ACTIVITY]: isActivitiesEnabled ? renderActivity : noop,\n  };\n\n  return (\n    <>\n      {data.map((engagement, index) => {\n        const type = matchType(engagement);\n        const renderer = rendererHashmap[type];\n        if (!renderer) return null;\n\n        return (\n          <React.Fragment key={engagement.id}>\n            {renderer(engagement, index)}\n          </React.Fragment>\n        );\n      })}\n    </>\n  );\n};\n\nEngagements.displayName = \"Engagements\";\nEngagements.Comment = Comment;\nEngagements.Activity = Activity;\nEngagements.TYPES = ENGAGEMENT_TYPES;\n\nEngagements.propTypes = {\n  /**  An array of engagement items */\n  data: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired }))\n    .isRequired,\n\n  /** Boolean, determines whether activities are rendered. Defaults to false  */\n  isActivitiesEnabled: PropTypes.bool,\n\n  /** Optional function to match the item type. Receives item as argument and should return one of Engagements.TYPES.*/\n  matchType: PropTypes.func,\n\n  /** A function to render individual comment item. Receives comment and index as arguments  */\n  renderComment: PropTypes.func.isRequired,\n\n  /** A function to render individual activity item. Receives comment and index as arguments  */\n  renderActivity: PropTypes.func.isRequired,\n};\n\nexport default Engagements;\n"],"names":["ActivityIcon","_ref","icon","unread","_jsx","className","children","_jsxs","classNames","Activity","user","_ref$unread","avatar","name","imageUrl","profileImageUrl","Avatar","size","CommentHeader","comment","info","actions","Typography","style","weight","_Fragment","createdAt","DateFormat","FromNow","date","typographyProps","isPresent","MoreDropdown","dropdownProps","position","menuItems","findOwnIndex","findIndexBy","userId","globalProps","id","groupReactions","collectBy","prop","Reactions","reactions","onAdd","onRemove","_useTranslation","useTranslation","t","groups","onSelect","emoji","group","find","pathEq","unified","_objectSpread","EmojiPicker","map","ownIndex","selected","reaction","names","pluck","join","Tooltip","content","onClick","length","memo","eqProps","ENGAGEMENT_TYPES","COMMENT","ACTIVITY","createCommentElementId","concat","defaultMatchType","engagement","commenter","creator","Comment","forwardRef","ref","onAddReaction","onRemoveReaction","displayName","propTypes","PropTypes","shape","string","isRequired","oneOfType","array","bool","arrayOf","isVisible","key","label","func","Engagements","data","_ref$isActivitiesEnab","isActivitiesEnabled","_ref$matchType","matchType","renderComment","renderActivity","rendererHashmap","_defineProperty","noop","index","type","renderer","React","Fragment","TYPES"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,YAAY,GAAG,SAAfA,YAAYA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IAAEC,MAAM,GAAAF,IAAA,CAANE,MAAM,CAAA;AAAA,EAAA,oBAClCC,GAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,eAAe;AAAAC,IAAAA,QAAA,eAC5BC,IAAA,CAAA,MAAA,EAAA;AACEF,MAAAA,SAAS,EAAEG,UAAU,CACnB,8HAA8H,EAC9H;AACE,QAAA,mDAAmD,EAAEL,MAAAA;AACvD,OACF,CAAE;AAAAG,MAAAA,QAAA,EAEDJ,CAAAA,IAAI,EACJC,MAAM,iBACLC,GAAA,CAAA,MAAA,EAAA;AAAMC,QAAAA,SAAS,EAAC,oFAAA;AAAoF,OAAE,CACvG,CAAA;KACG,CAAA;AAAC,GACJ,CAAC,CAAA;AAAA,CACP;;ACZD,IAAMI,QAAQ,GAAG,SAAXA,QAAQA,CAAAR,IAAA,EAA4D;AAAA,EAAA,IAAtDS,IAAI,GAAAT,IAAA,CAAJS,IAAI;IAAER,IAAI,GAAAD,IAAA,CAAJC,IAAI;IAAAS,WAAA,GAAAV,IAAA,CAAEE,MAAM;AAANA,IAAAA,MAAM,GAAAQ,WAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,WAAA;IAAEN,SAAS,GAAAJ,IAAA,CAATI,SAAS;IAAEC,QAAQ,GAAAL,IAAA,CAARK,QAAQ,CAAA;AACjE,EAAA,IAAMM,MAAM,GAAG;IAAEC,IAAI,EAAEH,IAAI,CAACG,IAAI;IAAEC,QAAQ,EAAEJ,IAAI,CAACK,eAAAA;GAAiB,CAAA;AAElE,EAAA,oBACER,IAAA,CAAA,KAAA,EAAA;AACEF,IAAAA,SAAS,EAAEG,UAAU,CACnB,8EAA8E,EAC9EH,SACF,CAAE;IAAAC,QAAA,EAAA,cAEFF,GAAA,CAACJ,YAAY,EAAA;AAAOE,MAAAA,IAAI,EAAJA,IAAI;AAAEC,MAAAA,MAAM,EAANA,MAAAA;AAAM,KAAK,CAAC,eACtCC,GAAA,CAACY,MAAM,EAAA;AAACC,MAAAA,IAAI,EAAC,QAAQ;AAACP,MAAAA,IAAI,EAAEE,MAAAA;KAAS,CAAC,eACtCR,GAAA,CAAA,KAAA,EAAA;AAAKC,MAAAA,SAAS,EAAC,QAAQ;AAAAC,MAAAA,QAAA,EAAEA,QAAAA;AAAQ,KAAM,CAAC,CAAA;AAAA,GACrC,CAAC,CAAA;AAEV,CAAC;;ACfD,IAAMY,aAAa,GAAG,SAAhBA,aAAaA,CAAAjB,IAAA,EAAyC;AAAA,EAAA,IAAnCS,IAAI,GAAAT,IAAA,CAAJS,IAAI;IAAES,OAAO,GAAAlB,IAAA,CAAPkB,OAAO;IAAEC,IAAI,GAAAnB,IAAA,CAAJmB,IAAI;IAAEC,OAAO,GAAApB,IAAA,CAAPoB,OAAO,CAAA;AACnD,EAAA,IAAMT,MAAM,GAAG;IAAEC,IAAI,EAAEH,IAAI,CAACG,IAAI;IAAEC,QAAQ,EAAEJ,IAAI,CAACK,eAAAA;GAAiB,CAAA;AAElE,EAAA,oBACER,IAAA,CAAA,KAAA,EAAA;AAAKF,IAAAA,SAAS,EAAC,sHAAsH;AAAAC,IAAAA,QAAA,gBACnIC,IAAA,CAAA,KAAA,EAAA;AAAKF,MAAAA,SAAS,EAAC,yBAAyB;MAAAC,QAAA,EAAA,cACtCF,GAAA,CAACY,MAAM,EAAA;AAACC,QAAAA,IAAI,EAAC,QAAQ;AAACP,QAAAA,IAAI,EAAEE,MAAAA;AAAO,OAAE,CAAC,eACtCR,GAAA,CAACkB,UAAU,EAAA;AACTjB,QAAAA,SAAS,EAAC,wBAAwB;AAClCkB,QAAAA,KAAK,EAAC,OAAO;AACbC,QAAAA,MAAM,EAAC,UAAU;QAAAlB,QAAA,EAEhBI,IAAI,CAACG,IAAAA;AAAI,OACA,CAAC,eACbT,GAAA,CAACkB,UAAU,EAAA;AAACjB,QAAAA,SAAS,EAAC,wBAAwB;AAACkB,QAAAA,KAAK,EAAC,OAAO;AAAAjB,QAAAA,QAAA,EAAC,QAAA;AAE7D,OAAY,CAAC,EACZc,IAAI,iBACHb,IAAA,CAAAkB,QAAA,EAAA;QAAAnB,QAAA,EAAA,cACEF,GAAA,CAACkB,UAAU,EAAA;AACTjB,UAAAA,SAAS,EAAC,kCAAkC;AAC5CkB,UAAAA,KAAK,EAAC,OAAO;AAAAjB,UAAAA,QAAA,EAEZc,IAAAA;AAAI,SACK,CAAC,eACbhB,GAAA,CAACkB,UAAU,EAAA;AAACjB,UAAAA,SAAS,EAAC,wBAAwB;AAACkB,UAAAA,KAAK,EAAC,OAAO;AAAAjB,UAAAA,QAAA,EAAC,QAAA;AAE7D,SAAY,CAAC,CAAA;OACb,CACH,EACAa,OAAO,CAACO,SAAS,iBAChBtB,GAAA,CAACuB,UAAU,CAACC,OAAO,EAAA;QACjBC,IAAI,EAAEV,OAAO,CAACO,SAAU;AACxBI,QAAAA,eAAe,EAAE;AACfP,UAAAA,KAAK,EAAE,OAAO;AACdlB,UAAAA,SAAS,EAAE,wBAAA;AACb,SAAA;AAAE,OACH,CACF,CAAA;KACE,CAAC,EACL0B,SAAS,CAACV,OAAO,CAAC,iBACjBjB,GAAA,CAAC4B,YAAY,EAAA;AACXC,MAAAA,aAAa,EAAE;AAAEC,QAAAA,QAAQ,EAAE,cAAA;OAAiB;AAC5CC,MAAAA,SAAS,EAAEd,OAAAA;AAAQ,KACpB,CACF,CAAA;AAAA,GACE,CAAC,CAAA;AAEV,CAAC;;;;AC3CD,IAAMe,YAAY,GAAGC,WAAW,CAAC;AAAEC,EAAAA,MAAM,EAAEC,WAAW,CAAC7B,IAAI,CAAC8B,EAAAA;AAAG,CAAC,CAAC,CAAA;AACjE,IAAMC,cAAc,GAAGC,SAAS,CAACC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAA;AAEjD,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAA3C,IAAA,EAAuC;AAAA,EAAA,IAAjC4C,SAAS,GAAA5C,IAAA,CAAT4C,SAAS;IAAEC,KAAK,GAAA7C,IAAA,CAAL6C,KAAK;IAAEC,QAAQ,GAAA9C,IAAA,CAAR8C,QAAQ,CAAA;AAC7C,EAAA,IAAAC,eAAA,GAAcC,cAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AACT,EAAA,IAAMC,MAAM,GAAGV,cAAc,CAACI,SAAS,CAAC,CAAA;AAExC,EAAA,IAAMO,QAAQ,GAAG,SAAXA,QAAQA,CAAGC,KAAK,EAAI;AACxB;AACA,IAAA,IAAMC,KAAK,GAAGH,MAAM,CAACI,IAAI,CAACC,MAAM,CAACH,KAAK,CAACI,OAAO,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAA;IAChE,IAAIH,KAAK,IAAIlB,YAAY,CAACkB,KAAK,CAAC,IAAI,CAAC,EAAE,OAAO;AAC9CR,IAAAA,KAAK,CAAAY,aAAA,CAAAA,aAAA,KAAML,KAAK,CAAA,EAAA,EAAA,EAAA;AAAEA,MAAAA,KAAK,EAAEA,KAAK,CAAA,QAAA,CAAA;AAAO,KAAA,CAAE,CAAC,CAAA;GACzC,CAAA;AAED,EAAA,oBACE9C,IAAA,CAAA,KAAA,EAAA;AAAKF,IAAAA,SAAS,EAAC,6BAA6B;AAAAC,IAAAA,QAAA,gBAC1CF,GAAA,CAAA,KAAA,EAAA;AAAKC,MAAAA,SAAS,EAAC,iDAAiD;MAAAC,QAAA,eAC9DF,GAAA,CAACuD,WAAW,EAAA;AAAOP,QAAAA,QAAQ,EAARA,QAAAA;OAAa,CAAA;KAC7B,CAAC,EACLD,MAAM,CAACS,GAAG,CAAC,UAAAf,SAAS,EAAI;AACvB,MAAA,IAAMgB,QAAQ,GAAGzB,YAAY,CAACS,SAAS,CAAC,CAAA;AACxC,MAAA,IAAMiB,QAAQ,GAAGD,QAAQ,IAAI,CAAC,CAAA;AAC9B,MAAA,IAAME,QAAQ,GAAGD,QAAQ,GAAGjB,SAAS,CAACgB,QAAQ,CAAC,GAAGhB,SAAS,CAAC,CAAC,CAAC,CAAA;AAC9D,MAAA,IAAMmB,KAAK,GAAGC,KAAK,CAAC,SAAS,EAAEpB,SAAS,CAAC,CAACqB,IAAI,CAAC,IAAI,CAAC,CAAA;MAEpD,oBACE9D,GAAA,CAAC+D,OAAO,EAAA;AAENjC,QAAAA,QAAQ,EAAC,KAAK;AACdkC,QAAAA,OAAO,eACLhE,GAAA,CAAA,GAAA,EAAA;AAAGC,UAAAA,SAAS,EAAC,qBAAqB;AAAAC,UAAAA,QAAA,EAC/B4C,CAAC,CAAC,+BAA+B,EAAE;AAAEc,YAAAA,KAAK,EAALA,KAAAA;WAAO,CAAA;AAAC,SAC7C,CACJ;AAAA1D,QAAAA,QAAA,eAEDF,GAAA,CAAA,KAAA,EAAA;AACEC,UAAAA,SAAS,EAAEG,UAAU,CACnB,sFAAsF,EACtF;AACE,YAAA,wBAAwB,EAAEsD,QAAQ;AAClC,YAAA,sBAAsB,EAAE,CAACA,QAAAA;AAC3B,WACF,CAAE;UACFO,OAAO,EAAE,SAATA,OAAOA,GAAA;YAAA,OAAQ,CAACP,QAAQ,GAAGf,QAAQ,GAAGD,KAAK,EAAEiB,QAAQ,CAAC,CAAA;WAAC;UAAAzD,QAAA,eAEvDC,IAAA,CAACe,UAAU,EAAA;AAACjB,YAAAA,SAAS,EAAC,mBAAmB;AAACkB,YAAAA,KAAK,EAAC,OAAO;AAAAjB,YAAAA,QAAA,gBACrDF,GAAA,CAAA,MAAA,EAAA;AAAMC,cAAAA,SAAS,EAAC,SAAS;cAAAC,QAAA,EAAEyD,QAAQ,CAACV,KAAAA;aAAY,CAAC,eACjDjD,GAAA,CAAA,MAAA,EAAA;AAAMC,cAAAA,SAAS,EAAC,SAAS;cAAAC,QAAA,EAAEuC,SAAS,CAACyB,MAAAA;AAAM,aAAO,CAAC,CAAA;WACzC,CAAA;SACT,CAAA;OAtBAP,EAAAA,QAAQ,CAACN,OAuBP,CAAC,CAAA;AAEd,KAAC,CAAC,CAAA;AAAA,GACC,CAAC,CAAA;AAEV,CAAC,CAAA;AAED,kBAAec,aAAAA,IAAI,CAAC3B,SAAS,EAAE4B,OAAO,CAAC,WAAW,CAAC,CAAC;;ACnD7C,IAAMC,gBAAgB,GAAG;AAC9BC,EAAAA,OAAO,EAAE,SAAS;AAClBC,EAAAA,QAAQ,EAAE,UAAA;AACZ,CAAC;;AClBM,IAAMC,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAGzD,OAAO,EAAA;AAAA,EAAA,OAAA,sCAAA,CAAA0D,MAAA,CACJ1D,OAAO,CAACqB,EAAE,CAAA,CAAA;AAAA,CAAE,CAAA;AAE9C,IAAMsC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAGC,UAAU,EAAI;AAC5C,EAAA,IAAIA,UAAU,CAACC,SAAS,EAAE,OAAOP,gBAAgB,CAACC,OAAO,CAAC,KACrD,IAAIK,UAAU,CAACE,OAAO,EAAE,OAAOR,gBAAgB,CAACE,QAAQ,CAAA;AAE7D,EAAA,OAAO,IAAI,CAAA;AACb,CAAC;;ACAD,IAAMO,OAAO,gBAAGC,UAAU,CACxB,UAAAlF,IAAA,EAYEmF,GAAG,EAAA;AAAA,EAAA,IAVD1E,IAAI,GAAAT,IAAA,CAAJS,IAAI;IACJS,OAAO,GAAAlB,IAAA,CAAPkB,OAAO;IACP0B,SAAS,GAAA5C,IAAA,CAAT4C,SAAS;IACTzB,IAAI,GAAAnB,IAAA,CAAJmB,IAAI;IACJC,OAAO,GAAApB,IAAA,CAAPoB,OAAO;IACPhB,SAAS,GAAAJ,IAAA,CAATI,SAAS;IACTC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IACR+E,aAAa,GAAApF,IAAA,CAAboF,aAAa;IACbC,gBAAgB,GAAArF,IAAA,CAAhBqF,gBAAgB,CAAA;AAAA,EAAA,oBAIlB/E,IAAA,CAAA,KAAA,EAAA;AACQ6E,IAAAA,GAAG,EAAHA,GAAG;AACT5C,IAAAA,EAAE,EAAEoC,sBAAsB,CAACzD,OAAO,CAAE;AACpCd,IAAAA,SAAS,EAAEG,UAAU,CACnB,iHAAiH,EACjHH,SACF,CAAE;IAAAC,QAAA,EAAA,cAEFF,GAAA,CAACc,aAAa,EAAA;AAAOG,MAAAA,OAAO,EAAPA,OAAO;AAAEF,MAAAA,OAAO,EAAPA,OAAO;AAAEC,MAAAA,IAAI,EAAJA,IAAI;AAAEV,MAAAA,IAAI,EAAJA,IAAAA;KAAS,CAAC,eACvDH,IAAA,CAAA,KAAA,EAAA;AAAKF,MAAAA,SAAS,EAAC,0CAA0C;MAAAC,QAAA,EAAA,CACtDA,QAAQ,EACRuC,SAAS,KAAK,KAAK,iBAClBzC,GAAA,CAACwC,WAAS,EAAA;AACFC,QAAAA,SAAS,EAATA,SAAS;AACfC,QAAAA,KAAK,EAAEuC,aAAc;AACrBtC,QAAAA,QAAQ,EAAEuC,gBAAAA;AAAiB,OAC5B,CACF,CAAA;AAAA,KACE,CAAC,CAAA;AAAA,GACH,CAAC,CAAA;AAAA,CAEV,CAAC,CAAA;AAEDJ,OAAO,CAACK,WAAW,GAAG,SAAS,CAAA;AAC/BL,OAAO,CAACM,SAAS,GAAG;AAClB;AACA9E,EAAAA,IAAI,EAAE+E,SAAS,CAACC,KAAK,CAAC;AAAE7E,IAAAA,IAAI,EAAE4E,SAAS,CAACE,MAAM,CAACC,UAAAA;GAAY,CAAC,CAACA,UAAU;AAEvE;AACAzE,EAAAA,OAAO,EAAEsE,SAAS,CAACC,KAAK,CAAC;AACvBlD,IAAAA,EAAE,EAAEiD,SAAS,CAACE,MAAM,CAACC,UAAU;AAC/BlE,IAAAA,SAAS,EAAE+D,SAAS,CAACE,MAAM,CAACC,UAAAA;GAC7B,CAAC,CAACA,UAAU;AAEb;AACA/C,EAAAA,SAAS,EAAE4C,SAAS,CAACI,SAAS,CAAC,CAACJ,SAAS,CAACK,KAAK,EAAEL,SAAS,CAACM,IAAI,CAAC,CAAC;AAEjE;EACA3E,IAAI,EAAEqE,SAAS,CAACE,MAAM;AAEtB;EACAtE,OAAO,EAAEoE,SAAS,CAACO,OAAO,CACxBP,SAAS,CAACC,KAAK,CAAC;IACdO,SAAS,EAAER,SAAS,CAACM,IAAI;AACzBG,IAAAA,GAAG,EAAET,SAAS,CAACE,MAAM,CAACC,UAAU;AAChCO,IAAAA,KAAK,EAAEV,SAAS,CAACE,MAAM,CAACC,UAAU;AAClCvB,IAAAA,OAAO,EAAEoB,SAAS,CAACW,IAAI,CAACR,UAAAA;AAC1B,GAAC,CACH,CAAC;AAED;EACAvF,SAAS,EAAEoF,SAAS,CAACE,MAAM;AAE3B;EACAN,aAAa,EAAEI,SAAS,CAACW,IAAI;AAE7B;EACAd,gBAAgB,EAAEG,SAAS,CAACW,IAAAA;AAC9B,CAAC;;;;;ACxED,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CAAApG,IAAA,EAMX;AAAA,EAAA,IALJqG,IAAI,GAAArG,IAAA,CAAJqG,IAAI;IAAAC,qBAAA,GAAAtG,IAAA,CACJuG,mBAAmB;AAAnBA,IAAAA,mBAAmB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,qBAAA;IAAAE,cAAA,GAAAxG,IAAA,CAC3ByG,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG3B,KAAAA,CAAAA,GAAAA,gBAAgB,GAAA2B,cAAA;IAC5BE,aAAa,GAAA1G,IAAA,CAAb0G,aAAa;IACbC,cAAc,GAAA3G,IAAA,CAAd2G,cAAc,CAAA;EAEd,IAAMC,eAAe,GAAAC,eAAA,CAAAA,eAAA,CAClBrC,EAAAA,EAAAA,gBAAgB,CAACC,OAAO,EAAGiC,aAAa,CACxClC,EAAAA,gBAAgB,CAACE,QAAQ,EAAG6B,mBAAmB,GAAGI,cAAc,GAAGG,IAAI,CACzE,CAAA;EAED,oBACE3G,GAAA,CAAAqB,QAAA,EAAA;IAAAnB,QAAA,EACGgG,IAAI,CAAC1C,GAAG,CAAC,UAACmB,UAAU,EAAEiC,KAAK,EAAK;AAC/B,MAAA,IAAMC,IAAI,GAAGP,SAAS,CAAC3B,UAAU,CAAC,CAAA;AAClC,MAAA,IAAMmC,QAAQ,GAAGL,eAAe,CAACI,IAAI,CAAC,CAAA;AACtC,MAAA,IAAI,CAACC,QAAQ,EAAE,OAAO,IAAI,CAAA;AAE1B,MAAA,oBACE9G,GAAA,CAAC+G,cAAK,CAACC,QAAQ,EAAA;AAAA9G,QAAAA,QAAA,EACZ4G,QAAQ,CAACnC,UAAU,EAAEiC,KAAK,CAAA;OADRjC,EAAAA,UAAU,CAACvC,EAEhB,CAAC,CAAA;KAEpB,CAAA;AAAC,GACF,CAAC,CAAA;AAEP,EAAC;AAED6D,WAAW,CAACd,WAAW,GAAG,aAAa,CAAA;AACvCc,WAAW,CAACnB,OAAO,GAAGA,OAAO,CAAA;AAC7BmB,WAAW,CAAC5F,QAAQ,GAAGA,QAAQ,CAAA;AAC/B4F,WAAW,CAACgB,KAAK,GAAG5C,gBAAgB;;;;"}

package/dist/cjs/Engagements.js

@@ -0,0 +1,294 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var React = require('react');
+var neetoCist = require('@bigbinary/neeto-cist');
+var classnames = require('classnames');
+var Avatar = require('@bigbinary/neetoui/Avatar');
+var jsxRuntime = require('react/jsx-runtime');
+var index = require('./index-JY2zVpnv.js');
+var Typography = require('@bigbinary/neetoui/Typography');
+var DateFormat = require('./DateFormat.js');
+var MoreDropdown = require('./MoreDropdown.js');
+var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
+var Tooltip = require('@bigbinary/neetoui/Tooltip');
+var ramda = require('ramda');
+var reactI18next = require('react-i18next');
+var EmojiPicker = require('./EmojiPicker.js');
+var injectCss = require('./inject-css-vQvjPR2x.js');
+require('./_commonjsHelpers-BJu3ubxk.js');
+require('@bigbinary/neeto-commons-frontend/react-utils/useTimer');
+require('@bigbinary/neeto-commons-frontend/utils/datetime');
+require('@babel/runtime/helpers/objectWithoutProperties');
+require('@bigbinary/neeto-icons/MenuHorizontal');
+require('@bigbinary/neeto-icons/MenuVertical');
+require('@bigbinary/neetoui/Button');
+require('@bigbinary/neetoui/Dropdown');
+require('@babel/runtime/helpers/slicedToArray');
+require('@bigbinary/neeto-icons/SmileFaceGrey');
+require('emoji-mart');
+require('@tanstack/react-query');
+require('axios');
+
+var ActivityIcon = function ActivityIcon(_ref) {
+  var icon = _ref.icon,
+    unread = _ref.unread;
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    className: "flex-shrink-0",
+    children: /*#__PURE__*/jsxRuntime.jsxs("span", {
+      className: classnames("neeto-ui-bg-gray-200 neeto-ui-text-gray-600 neeto-ui-rounded-full relative z-10 flex h-7 w-7 items-center justify-center p-1", {
+        "neeto-ui-text-primary-600 neeto-ui-bg-primary-100": unread
+      }),
+      children: [icon, unread && /*#__PURE__*/jsxRuntime.jsx("span", {
+        className: "neeto-ui-rounded-full neeto-ui-bg-primary-800 absolute -right-0.5 -top-0.5 h-2 w-2"
+      })]
+    })
+  });
+};
+
+var Activity = function Activity(_ref) {
+  var user = _ref.user,
+    icon = _ref.icon,
+    _ref$unread = _ref.unread,
+    unread = _ref$unread === void 0 ? false : _ref$unread,
+    className = _ref.className,
+    children = _ref.children;
+  var avatar = {
+    name: user.name,
+    imageUrl: user.profileImageUrl
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: classnames("neeto-molecules-engagements-node relative -mt-4 flex items-center gap-2 py-4", className),
+    children: [/*#__PURE__*/jsxRuntime.jsx(ActivityIcon, {
+      icon: icon,
+      unread: unread
+    }), /*#__PURE__*/jsxRuntime.jsx(Avatar, {
+      size: "medium",
+      user: avatar
+    }), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "pt-0.5",
+      children: children
+    })]
+  });
+};
+
+var CommentHeader = function CommentHeader(_ref) {
+  var user = _ref.user,
+    comment = _ref.comment,
+    info = _ref.info,
+    actions = _ref.actions;
+  var avatar = {
+    name: user.name,
+    imageUrl: user.profileImageUrl
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-ui-bg-gray-100 neeto-ui-border-gray-300 flex items-center justify-between rounded-t-md border-b py-2 pl-4 pr-2",
+    children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "flex items-center gap-2",
+      children: [/*#__PURE__*/jsxRuntime.jsx(Avatar, {
+        size: "medium",
+        user: avatar
+      }), /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        className: "neeto-ui-text-gray-700",
+        style: "body2",
+        weight: "semibold",
+        children: user.name
+      }), /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        className: "neeto-ui-text-gray-700",
+        style: "body2",
+        children: "\u2022"
+      }), info && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [/*#__PURE__*/jsxRuntime.jsx(Typography, {
+          className: "neeto-ui-text-gray-500 lowercase",
+          style: "body2",
+          children: info
+        }), /*#__PURE__*/jsxRuntime.jsx(Typography, {
+          className: "neeto-ui-text-gray-700",
+          style: "body2",
+          children: "\u2022"
+        })]
+      }), comment.createdAt && /*#__PURE__*/jsxRuntime.jsx(DateFormat.FromNow, {
+        date: comment.createdAt,
+        typographyProps: {
+          style: "body2",
+          className: "neeto-ui-text-gray-500"
+        }
+      })]
+    }), neetoCist.isPresent(actions) && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown, {
+      dropdownProps: {
+        position: "bottom-start"
+      },
+      menuItems: actions
+    })]
+  });
+};
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var findOwnIndex = neetoCist.findIndexBy({
+  userId: initializers.globalProps.user.id
+});
+var groupReactions = ramda.collectBy(ramda.prop("unified"));
+var Reactions = function Reactions(_ref) {
+  var reactions = _ref.reactions,
+    onAdd = _ref.onAdd,
+    onRemove = _ref.onRemove;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var groups = groupReactions(reactions);
+  var onSelect = function onSelect(emoji) {
+    // Try to find group to which emoji belongs in existing reactions.
+    var group = groups.find(ramda.pathEq(emoji.unified, [0, "unified"]));
+    if (group && findOwnIndex(group) >= 0) return; // User already reacted with same emoji.
+    onAdd(_objectSpread(_objectSpread({}, emoji), {}, {
+      emoji: emoji["native"]
+    }));
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "mt-2 flex flex-wrap gap-0.5",
+    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-ui-rounded-full neeto-ui-bg-gray-200 mr-2",
+      children: /*#__PURE__*/jsxRuntime.jsx(EmojiPicker, {
+        onSelect: onSelect
+      })
+    }), groups.map(function (reactions) {
+      var ownIndex = findOwnIndex(reactions);
+      var selected = ownIndex >= 0;
+      var reaction = selected ? reactions[ownIndex] : reactions[0];
+      var names = ramda.pluck("reactor", reactions).join(", ");
+      return /*#__PURE__*/jsxRuntime.jsx(Tooltip, {
+        position: "top",
+        content: /*#__PURE__*/jsxRuntime.jsx("p", {
+          className: "text-center text-xs",
+          children: t("neetoMolecules.common.reacted", {
+            names: names
+          })
+        }),
+        children: /*#__PURE__*/jsxRuntime.jsx("div", {
+          className: classnames("neeto-ui-rounded-full mx-1 flex cursor-pointer items-center justify-center px-2 py-1", {
+            "neeto-ui-bg-accent-100": selected,
+            "neeto-ui-bg-gray-100": !selected
+          }),
+          onClick: function onClick() {
+            return (selected ? onRemove : onAdd)(reaction);
+          },
+          children: /*#__PURE__*/jsxRuntime.jsxs(Typography, {
+            className: "space-x-1 text-sm",
+            style: "body2",
+            children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "text-sm",
+              children: reaction.emoji
+            }), /*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "text-sm",
+              children: reactions.length
+            })]
+          })
+        })
+      }, reaction.unified);
+    })]
+  });
+};
+var Reactions$1 = /*#__PURE__*/React.memo(Reactions, ramda.eqProps("reactions"));
+
+var ENGAGEMENT_TYPES = {
+  COMMENT: "comment",
+  ACTIVITY: "activity"
+};
+
+var createCommentElementId = function createCommentElementId(comment) {
+  return "neeto-molecules-engagement-comment--".concat(comment.id);
+};
+var defaultMatchType = function defaultMatchType(engagement) {
+  if (engagement.commenter) return ENGAGEMENT_TYPES.COMMENT;else if (engagement.creator) return ENGAGEMENT_TYPES.ACTIVITY;
+  return null;
+};
+
+var Comment = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var user = _ref.user,
+    comment = _ref.comment,
+    reactions = _ref.reactions,
+    info = _ref.info,
+    actions = _ref.actions,
+    className = _ref.className,
+    children = _ref.children,
+    onAddReaction = _ref.onAddReaction,
+    onRemoveReaction = _ref.onRemoveReaction;
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    ref: ref,
+    id: createCommentElementId(comment),
+    className: classnames("neeto-ui-bg-white neeto-ui-rounded-md neeto-ui-border-gray-300 neeto-molecules-comments-node mb-4 w-full border", className),
+    children: [/*#__PURE__*/jsxRuntime.jsx(CommentHeader, {
+      actions: actions,
+      comment: comment,
+      info: info,
+      user: user
+    }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "neeto-molecules-comments-node__inner p-4",
+      children: [children, reactions !== false && /*#__PURE__*/jsxRuntime.jsx(Reactions$1, {
+        reactions: reactions,
+        onAdd: onAddReaction,
+        onRemove: onRemoveReaction
+      })]
+    })]
+  });
+});
+Comment.displayName = "Comment";
+Comment.propTypes = {
+  /** Object representing the user information  */
+  user: index.PropTypes.shape({
+    name: index.PropTypes.string.isRequired
+  }).isRequired,
+  /** Object representing the comment item.  */
+  comment: index.PropTypes.shape({
+    id: index.PropTypes.string.isRequired,
+    createdAt: index.PropTypes.string.isRequired
+  }).isRequired,
+  /** Array of reactions. Settings this to `false` will disable reactions for the item  */
+  reactions: index.PropTypes.oneOfType([index.PropTypes.array, index.PropTypes.bool]),
+  /**  Optional text label to be displayed in the header. */
+  info: index.PropTypes.string,
+  /**  Optional action items to be passed to the menuItems prop of the actions dropdown */
+  actions: index.PropTypes.arrayOf(index.PropTypes.shape({
+    isVisible: index.PropTypes.bool,
+    key: index.PropTypes.string.isRequired,
+    label: index.PropTypes.string.isRequired,
+    onClick: index.PropTypes.func.isRequired
+  })),
+  /**  Additional classes passed on to the board view. */
+  className: index.PropTypes.string,
+  /** Callback function triggered when a reaction (emoji) is added */
+  onAddReaction: index.PropTypes.func,
+  /** Callback function triggered when a reaction (emoji) is removed*/
+  onRemoveReaction: index.PropTypes.func
+};
+
+var css = ".neeto-molecules-comments-node{position:relative}.neeto-molecules-comments-node:before{background-color:rgb(var(--neeto-ui-gray-200));content:\"\";height:1rem;left:13px;position:absolute;top:calc(100% + 1px);transform:translateX(-50%);width:2px}.neeto-molecules-comments-node:last-child:before{display:none}.neeto-molecules-engagements-node{position:relative}.neeto-molecules-engagements-node:before{background-color:rgb(var(--neeto-ui-gray-200));content:\"\";height:100%;left:14px;position:absolute;top:0;transform:translateX(-50%);width:2px}";
+injectCss.n(css,{});
+
+var Engagements = function Engagements(_ref) {
+  var data = _ref.data,
+    _ref$isActivitiesEnab = _ref.isActivitiesEnabled,
+    isActivitiesEnabled = _ref$isActivitiesEnab === void 0 ? false : _ref$isActivitiesEnab,
+    _ref$matchType = _ref.matchType,
+    matchType = _ref$matchType === void 0 ? defaultMatchType : _ref$matchType,
+    renderComment = _ref.renderComment,
+    renderActivity = _ref.renderActivity;
+  var rendererHashmap = _defineProperty(_defineProperty({}, ENGAGEMENT_TYPES.COMMENT, renderComment), ENGAGEMENT_TYPES.ACTIVITY, isActivitiesEnabled ? renderActivity : neetoCist.noop);
+  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: data.map(function (engagement, index) {
+      var type = matchType(engagement);
+      var renderer = rendererHashmap[type];
+      if (!renderer) return null;
+      return /*#__PURE__*/jsxRuntime.jsx(React.Fragment, {
+        children: renderer(engagement, index)
+      }, engagement.id);
+    })
+  });
+};
+Engagements.displayName = "Engagements";
+Engagements.Comment = Comment;
+Engagements.Activity = Activity;
+Engagements.TYPES = ENGAGEMENT_TYPES;
+
+module.exports = Engagements;
+//# sourceMappingURL=Engagements.js.map

package/dist/cjs/Engagements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Engagements.js","sources":["../../src/components/Engagements/Activity/Icon.jsx","../../src/components/Engagements/Activity/index.jsx","../../src/components/Engagements/Comment/Header.jsx","../../src/components/Engagements/Comment/Reactions.jsx","../../src/components/Engagements/constants.js","../../src/components/Engagements/utils.js","../../src/components/Engagements/Comment/index.jsx","../../src/components/Engagements/index.jsx"],"sourcesContent":["import classNames from \"classnames\";\n\nconst ActivityIcon = ({ icon, unread }) => (\n  <div className=\"flex-shrink-0\">\n    <span\n      className={classNames(\n        \"neeto-ui-bg-gray-200 neeto-ui-text-gray-600 neeto-ui-rounded-full relative z-10 flex h-7 w-7 items-center justify-center p-1\",\n        {\n          \"neeto-ui-text-primary-600 neeto-ui-bg-primary-100\": unread,\n        }\n      )}\n    >\n      {icon}\n      {unread && (\n        <span className=\"neeto-ui-rounded-full neeto-ui-bg-primary-800 absolute -right-0.5 -top-0.5 h-2 w-2\" />\n      )}\n    </span>\n  </div>\n);\n\nexport default ActivityIcon;\n","import classNames from \"classnames\";\nimport { Avatar } from \"neetoui\";\nimport PropTypes from \"prop-types\";\n\nimport ActivityIcon from \"./Icon\";\n\nconst Activity = ({ user, icon, unread = false, className, children }) => {\n  const avatar = { name: user.name, imageUrl: user.profileImageUrl };\n\n  return (\n    <div\n      className={classNames(\n        \"neeto-molecules-engagements-node relative -mt-4 flex items-center gap-2 py-4\",\n        className\n      )}\n    >\n      <ActivityIcon {...{ icon, unread }} />\n      <Avatar size=\"medium\" user={avatar} />\n      <div className=\"pt-0.5\">{children}</div>\n    </div>\n  );\n};\n\nActivity.propTypes = {\n  /** Object representing the user information  */\n  user: PropTypes.shape({ name: PropTypes.string.isRequired }).isRequired,\n\n  /** Element to render as the icon  */\n  icon: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,\n\n  /** Boolean indicating if the activity is unread to show unread badge */\n  unread: PropTypes.bool,\n\n  /**  Additional classes passed on to the board view. */\n  className: PropTypes.string,\n};\n\nexport default Activity;\n","import { isPresent } from \"neetocist\";\nimport { Avatar, Typography } from \"neetoui\";\n\nimport DateFormat from \"components/DateFormat\";\nimport MoreDropdown from \"components/MoreDropdown\";\n\nconst CommentHeader = ({ user, comment, info, actions }) => {\n  const avatar = { name: user.name, imageUrl: user.profileImageUrl };\n\n  return (\n    <div className=\"neeto-ui-bg-gray-100 neeto-ui-border-gray-300 flex items-center justify-between rounded-t-md border-b py-2 pl-4 pr-2\">\n      <div className=\"flex items-center gap-2\">\n        <Avatar size=\"medium\" user={avatar} />\n        <Typography\n          className=\"neeto-ui-text-gray-700\"\n          style=\"body2\"\n          weight=\"semibold\"\n        >\n          {user.name}\n        </Typography>\n        <Typography className=\"neeto-ui-text-gray-700\" style=\"body2\">\n          •\n        </Typography>\n        {info && (\n          <>\n            <Typography\n              className=\"neeto-ui-text-gray-500 lowercase\"\n              style=\"body2\"\n            >\n              {info}\n            </Typography>\n            <Typography className=\"neeto-ui-text-gray-700\" style=\"body2\">\n              •\n            </Typography>\n          </>\n        )}\n        {comment.createdAt && (\n          <DateFormat.FromNow\n            date={comment.createdAt}\n            typographyProps={{\n              style: \"body2\",\n              className: \"neeto-ui-text-gray-500\",\n            }}\n          />\n        )}\n      </div>\n      {isPresent(actions) && (\n        <MoreDropdown\n          dropdownProps={{ position: \"bottom-start\" }}\n          menuItems={actions}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default CommentHeader;\n","import { memo } from \"react\";\n\nimport classNames from \"classnames\";\nimport { findIndexBy } from \"neetocist\";\nimport { globalProps } from \"neetocommons/initializers\";\nimport { Tooltip, Typography } from \"neetoui\";\nimport { collectBy, eqProps, pathEq, pluck, prop } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport EmojiPicker from \"components/EmojiPicker\";\n\nconst findOwnIndex = findIndexBy({ userId: globalProps.user.id });\nconst groupReactions = collectBy(prop(\"unified\"));\n\nconst Reactions = ({ reactions, onAdd, onRemove }) => {\n  const { t } = useTranslation();\n  const groups = groupReactions(reactions);\n\n  const onSelect = emoji => {\n    // Try to find group to which emoji belongs in existing reactions.\n    const group = groups.find(pathEq(emoji.unified, [0, \"unified\"]));\n    if (group && findOwnIndex(group) >= 0) return; // User already reacted with same emoji.\n    onAdd({ ...emoji, emoji: emoji.native });\n  };\n\n  return (\n    <div className=\"mt-2 flex flex-wrap gap-0.5\">\n      <div className=\"neeto-ui-rounded-full neeto-ui-bg-gray-200 mr-2\">\n        <EmojiPicker {...{ onSelect }} />\n      </div>\n      {groups.map(reactions => {\n        const ownIndex = findOwnIndex(reactions);\n        const selected = ownIndex >= 0;\n        const reaction = selected ? reactions[ownIndex] : reactions[0];\n        const names = pluck(\"reactor\", reactions).join(\", \");\n\n        return (\n          <Tooltip\n            key={reaction.unified}\n            position=\"top\"\n            content={\n              <p className=\"text-center text-xs\">\n                {t(\"neetoMolecules.common.reacted\", { names })}\n              </p>\n            }\n          >\n            <div\n              className={classNames(\n                \"neeto-ui-rounded-full mx-1 flex cursor-pointer items-center justify-center px-2 py-1\",\n                {\n                  \"neeto-ui-bg-accent-100\": selected,\n                  \"neeto-ui-bg-gray-100\": !selected,\n                }\n              )}\n              onClick={() => (selected ? onRemove : onAdd)(reaction)}\n            >\n              <Typography className=\"space-x-1 text-sm\" style=\"body2\">\n                <span className=\"text-sm\">{reaction.emoji}</span>\n                <span className=\"text-sm\">{reactions.length}</span>\n              </Typography>\n            </div>\n          </Tooltip>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default memo(Reactions, eqProps(\"reactions\"));\n","export const ACTIVITY_TYPES = {\n  TIMELINE: \"Timeline\",\n  FIELD_VALUE: \"FieldValue\",\n  TASK: \"Task\",\n  ASSIGNEE: \"Assignee\",\n  CHECKLIST: \"Checklist\",\n  FIELD: \"Field\",\n  PROJECT: \"Project\",\n  COMMENT: \"Comment\",\n  DOCUMENT: \"Document\",\n  CHAT_MESSAGE: \"ChatMessage\",\n  MESSAGE: \"Message\",\n  SECTION: \"Section\",\n  PROJECT_MEMBER: \"ProjectMember\",\n  PULL_REQUEST: \"NeetoGithubEngine::PullRequest\",\n};\n\nexport const ENGAGEMENT_TYPES = {\n  COMMENT: \"comment\",\n  ACTIVITY: \"activity\",\n};\n","import { ENGAGEMENT_TYPES } from \"./constants\";\n\nexport const createCommentElementId = comment =>\n  `neeto-molecules-engagement-comment--${comment.id}`;\n\nexport const defaultMatchType = engagement => {\n  if (engagement.commenter) return ENGAGEMENT_TYPES.COMMENT;\n  else if (engagement.creator) return ENGAGEMENT_TYPES.ACTIVITY;\n\n  return null;\n};\n","import { forwardRef } from \"react\";\n\nimport classNames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport CommentHeader from \"./Header\";\nimport Reactions from \"./Reactions\";\n\nimport { createCommentElementId } from \"../utils\";\n\nconst Comment = forwardRef(\n  (\n    {\n      user,\n      comment,\n      reactions,\n      info,\n      actions,\n      className,\n      children,\n      onAddReaction,\n      onRemoveReaction,\n    },\n    ref\n  ) => (\n    <div\n      {...{ ref }}\n      id={createCommentElementId(comment)}\n      className={classNames(\n        \"neeto-ui-bg-white neeto-ui-rounded-md neeto-ui-border-gray-300 neeto-molecules-comments-node mb-4 w-full border\",\n        className\n      )}\n    >\n      <CommentHeader {...{ actions, comment, info, user }} />\n      <div className=\"neeto-molecules-comments-node__inner p-4\">\n        {children}\n        {reactions !== false && (\n          <Reactions\n            {...{ reactions }}\n            onAdd={onAddReaction}\n            onRemove={onRemoveReaction}\n          />\n        )}\n      </div>\n    </div>\n  )\n);\n\nComment.displayName = \"Comment\";\nComment.propTypes = {\n  /** Object representing the user information  */\n  user: PropTypes.shape({ name: PropTypes.string.isRequired }).isRequired,\n\n  /** Object representing the comment item.  */\n  comment: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    createdAt: PropTypes.string.isRequired,\n  }).isRequired,\n\n  /** Array of reactions. Settings this to `false` will disable reactions for the item  */\n  reactions: PropTypes.oneOfType([PropTypes.array, PropTypes.bool]),\n\n  /**  Optional text label to be displayed in the header. */\n  info: PropTypes.string,\n\n  /**  Optional action items to be passed to the menuItems prop of the actions dropdown */\n  actions: PropTypes.arrayOf(\n    PropTypes.shape({\n      isVisible: PropTypes.bool,\n      key: PropTypes.string.isRequired,\n      label: PropTypes.string.isRequired,\n      onClick: PropTypes.func.isRequired,\n    })\n  ),\n\n  /**  Additional classes passed on to the board view. */\n  className: PropTypes.string,\n\n  /** Callback function triggered when a reaction (emoji) is added */\n  onAddReaction: PropTypes.func,\n\n  /** Callback function triggered when a reaction (emoji) is removed*/\n  onRemoveReaction: PropTypes.func,\n};\n\nexport default Comment;\n","import React from \"react\";\n\nimport { noop } from \"neetocist\";\nimport PropTypes from \"prop-types\";\n\nimport Activity from \"./Activity\";\nimport Comment from \"./Comment\";\nimport { ENGAGEMENT_TYPES } from \"./constants\";\nimport \"./engagements.scss\";\nimport { defaultMatchType } from \"./utils\";\n\nconst Engagements = ({\n  data,\n  isActivitiesEnabled = false,\n  matchType = defaultMatchType,\n  renderComment,\n  renderActivity,\n}) => {\n  const rendererHashmap = {\n    [ENGAGEMENT_TYPES.COMMENT]: renderComment,\n    [ENGAGEMENT_TYPES.ACTIVITY]: isActivitiesEnabled ? renderActivity : noop,\n  };\n\n  return (\n    <>\n      {data.map((engagement, index) => {\n        const type = matchType(engagement);\n        const renderer = rendererHashmap[type];\n        if (!renderer) return null;\n\n        return (\n          <React.Fragment key={engagement.id}>\n            {renderer(engagement, index)}\n          </React.Fragment>\n        );\n      })}\n    </>\n  );\n};\n\nEngagements.displayName = \"Engagements\";\nEngagements.Comment = Comment;\nEngagements.Activity = Activity;\nEngagements.TYPES = ENGAGEMENT_TYPES;\n\nEngagements.propTypes = {\n  /**  An array of engagement items */\n  data: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired }))\n    .isRequired,\n\n  /** Boolean, determines whether activities are rendered. Defaults to false  */\n  isActivitiesEnabled: PropTypes.bool,\n\n  /** Optional function to match the item type. Receives item as argument and should return one of Engagements.TYPES.*/\n  matchType: PropTypes.func,\n\n  /** A function to render individual comment item. Receives comment and index as arguments  */\n  renderComment: PropTypes.func.isRequired,\n\n  /** A function to render individual activity item. Receives comment and index as arguments  */\n  renderActivity: PropTypes.func.isRequired,\n};\n\nexport default Engagements;\n"],"names":["ActivityIcon","_ref","icon","unread","_jsx","className","children","_jsxs","classNames","Activity","user","_ref$unread","avatar","name","imageUrl","profileImageUrl","Avatar","size","CommentHeader","comment","info","actions","Typography","style","weight","_Fragment","createdAt","DateFormat","FromNow","date","typographyProps","isPresent","MoreDropdown","dropdownProps","position","menuItems","findOwnIndex","findIndexBy","userId","globalProps","id","groupReactions","collectBy","prop","Reactions","reactions","onAdd","onRemove","_useTranslation","useTranslation","t","groups","onSelect","emoji","group","find","pathEq","unified","_objectSpread","EmojiPicker","map","ownIndex","selected","reaction","names","pluck","join","Tooltip","content","onClick","length","memo","eqProps","ENGAGEMENT_TYPES","COMMENT","ACTIVITY","createCommentElementId","concat","defaultMatchType","engagement","commenter","creator","Comment","forwardRef","ref","onAddReaction","onRemoveReaction","displayName","propTypes","PropTypes","shape","string","isRequired","oneOfType","array","bool","arrayOf","isVisible","key","label","func","Engagements","data","_ref$isActivitiesEnab","isActivitiesEnabled","_ref$matchType","matchType","renderComment","renderActivity","rendererHashmap","_defineProperty","noop","index","type","renderer","React","Fragment","TYPES"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neeto-molecules",
-  "version": "3.15.38",
+  "version": "3.15.39",
   "description": "A package of reusable molecular components for neeto products.",
   "repository": "git@github.com:bigbinary/neeto-molecules.git",
   "author": "Amaljith K <amaljith.k@bigbinary.com>",

package/src/translations/en.json

@@ -37,6 +37,7 @@
         "share": "Share",
         "done": "Done"
       },
+      "reacted": "Reacted",
       "record": "record",
       "or": "or",
       "name": "name",

package/types/Engagements.d.ts

@@ -0,0 +1,131 @@
+import { ENGAGEMENT_TYPES } from 'components/Engagements/constants';
+
+type Emoji = {
+  native: string;
+  unified: string;
+};
+type MenuItems = {
+  label: string;
+  onClick: () => void;
+  key: string;
+  isVisible?: boolean;
+  hasSubItems?: boolean;
+  dropdownProps?: DropdownProps;
+  menuItems?: MenuItems[];
+};
+type UserData = {
+  name: string;
+  profileImageUrl?: string;
+};
+type CommentData = {
+  id: string;
+  createdAt?: string;
+  commenter?: UserData;
+  [key: string]: any;
+};
+type ActivityData = {
+  id: string;
+  creator?: UserData;
+  [key: string]: any;
+};
+type EngagementType = typeof ENGAGEMENT_TYPES[number];
+/**
+ *
+ * The Engagements component renders the general layout for comments and
+ *
+ * activities to show user engagement timeline.
+ *
+ * The main container component for the Engagements components that wraps the
+ *
+ * items.
+ *
+ * A wrapper component to be used within the Engagements to render individual
+ *
+ * comment.
+ *
+ * A wrapper component to be used within the Engagements to render individual
+ *
+ * activity.
+ *
+ * @example 
+ *
+ * import { useState } from "react";
+ * import { User } from "neetoicons";
+ * import { Typography } from "neetoui";
+ * 
+ * import Engagements from "neetomolecules/Engagements";
+ * 
+ * const Timeline = () => {
+ *   const [data] = useState([
+ *     {
+ *       id: "comment-1",
+ *       content: "Hi world!",
+ *       commenter: { name: "Oliver Smith" },
+ *       createdAt: Date().toString(),
+ *     },
+ *     {
+ *       id: "comment-2",
+ *       content: "Hi Oliver!",
+ *       commenter: { name: "Lily James" },
+ *       createdAt: Date().toString(),
+ *     },
+ *     {
+ *       id: "activity-1",
+ *       type: "USER_EXIT",
+ *       creator: { name: "Oliver Smith" },
+ *       createdAt: Date().toString(),
+ *     },
+ *   ]);
+ * 
+ *   return (
+ *     <Engagements
+ *       {...{ data }}
+ *       isActivitiesEnabled
+ *       renderActivity={engagement => (
+ *         <Engagements.Activity icon={<User />} user={engagement.creator}>
+ *           <Typography style="body2">
+ *             {engagement.type === "USER_EXIT" &&
+ *               `${engagement.creator.name} left this conversation`}
+ *           </Typography>
+ *         </Engagements.Activity>
+ *       )}
+ *       renderComment={engagement => (
+ *         <Engagements.Comment
+ *           comment={engagement}
+ *           info="messaged"
+ *           user={engagement.commenter}
+ *         >
+ *           <Typography style="body2">{engagement.content}</Typography>
+ *         </Engagements.Comment>
+ *       )}
+ *     />
+ *   );
+ * };
+ * @endexample
+*/
+declare const Engagements: React.FC<{
+  data: Array<CommentData | ActivityData>;
+  isActivitiesEnabled?: boolean;
+  matchType?: (engagement: CommentData | ActivityData) => EngagementType;
+  renderComment: (engagement: CommentData, index: number) => React.ReactNode;
+  renderActivity: (engagement: ActivityData, index: number) => React.ReactNode;
+}> & {
+  Comment: React.FC<{
+    user: UserData;
+    comment: CommentData;
+    reactions?: boolean | Emoji[];
+    info?: string;
+    actions?: MenuItems[];
+    className?: string;
+    onAddReaction: (emoji: Emoji) => void;
+    onRemoveReaction: (emoji: Emoji) => void;
+  }>;
+  Activity: React.FC<{
+    user: UserData;
+    icon: React.ReactNode;
+    unread?: boolean;
+    className?: string;
+  }>;
+};
+
+export { Engagements as default };