@selfcommunity/react-ui 0.7.50-event.30 → 0.7.50-events.101

package/lib/cjs/components/Notification/Notification.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const CardContent_1 = tslib_1.__importDefault(require("@mui/material/CardContent"));
 const Comment_1 = tslib_1.__importDefault(require("./Comment"));
@@ -36,6 +37,7 @@ const UserDeletedSnackBar_1 = tslib_1.__importDefault(require("../../shared/User
 const UserAvatar_1 = tslib_1.__importDefault(require("../../shared/UserAvatar"));
 const constants_1 = require("./constants");
 const Group_1 = tslib_1.__importDefault(require("./Group"));
+const Event_1 = tslib_1.__importDefault(require("./Event/Event"));
 const messages = (0, react_intl_1.defineMessages)({
     receivePrivateMessage: {
         id: 'ui.notification.receivePrivateMessage',
@@ -183,19 +185,33 @@ function UserNotification(inProps) {
          */
         if (notificationObject.aggregated && notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.PRIVATE_MESSAGE) {
             let messageNotification = notificationObject.aggregated[0];
-            return (react_1.default.createElement(material_1.CardHeader, { className: classes.header, avatar: react_1.default.createElement(react_core_1.Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
+            return ((0, jsx_runtime_1.jsx)(material_1.CardHeader, { className: classes.header, avatar: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
                     to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
-                }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null }),
-                    react_1.default.createElement(UserAvatar_1.default, { hide: !messageNotification.message.sender.community_badge, smaller: true },
-                        react_1.default.createElement(material_1.Avatar, { className: classes.avatar, alt: messageNotification.message.sender.username, variant: "circular", src: messageNotification.message.sender.avatar }))), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(react_core_1.Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
-                        to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
-                    }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null, className: classes.username }), messageNotification.message.sender.username),
-                    ' ',
-                    intl.formatMessage(messages.receivePrivateMessage, {
-                        total: notificationObject.aggregated.length,
-                        b: (...chunks) => react_1.default.createElement("strong", null, chunks)
-                    })) }));
+                }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !messageNotification.message.sender.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, alt: messageNotification.message.sender.username, variant: "circular", src: messageNotification.message.sender.avatar }) })) })), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
+                            to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
+                        }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: messageNotification.message.sender.username })), ' ', intl.formatMessage(messages.receivePrivateMessage, {
+                            total: notificationObject.aggregated.length,
+                            b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
+                        })] }) }));
+        }
+        /**
+         * Event notifications header
+         */
+        if (notificationObject.aggregated &&
+            (notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_INVITED_TO_JOIN_EVENT ||
+                notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_EVENT ||
+                notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_ADDED_TO_EVENT ||
+                notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT)) {
+            let eventNotification = notificationObject.aggregated[0];
+            return ((0, jsx_runtime_1.jsx)(material_1.CardHeader, { className: classes.header, avatar: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!eventNotification.user.deleted && {
+                    to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, eventNotification.user)
+                }), { onClick: eventNotification.user.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !eventNotification.user.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, alt: eventNotification.user.username, variant: "circular", src: eventNotification.user.avatar }) })) })), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!eventNotification.user.deleted && {
+                            to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, eventNotification.user)
+                        }), { onClick: eventNotification.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: eventNotification.user.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.${notificationObject.aggregated[0].type}`, defaultMessage: `ui.notification.${notificationObject.aggregated[0].type}`, values: {
+                                icon: (...chunks) => (0, jsx_runtime_1.jsx)(Icon_1.default, { children: chunks }),
+                                event: eventNotification.event.name,
+                                link: (...chunks) => (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_ROUTE_NAME, eventNotification.event) }, { children: chunks }))
+                            } })] }) }));
         }
         /**
          * Group notifications header
@@ -206,22 +222,17 @@ function UserNotification(inProps) {
                 notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_ADDED_TO_GROUP ||
                 notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP)) {
             let groupNotification = notificationObject.aggregated[0];
-            return (react_1.default.createElement(material_1.CardHeader, { className: classes.header, avatar: react_1.default.createElement(react_core_1.Link, Object.assign({}, (!groupNotification.user.deleted && {
+            return ((0, jsx_runtime_1.jsx)(material_1.CardHeader, { className: classes.header, avatar: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!groupNotification.user.deleted && {
                     to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, groupNotification.user)
-                }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null }),
-                    react_1.default.createElement(UserAvatar_1.default, { hide: !groupNotification.user.community_badge, smaller: true },
-                        react_1.default.createElement(material_1.Avatar, { className: classes.avatar, alt: groupNotification.user.username, variant: "circular", src: groupNotification.user.avatar }))), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(react_core_1.Link, Object.assign({}, (!groupNotification.user.deleted && {
-                        to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, groupNotification.user)
-                    }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }), groupNotification.user.username),
-                    ' ',
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: `ui.notification.${notificationObject.aggregated[0].type}`, defaultMessage: `ui.notification.${notificationObject.aggregated[0].type}`, values: {
-                            group: groupNotification.group.name,
-                            link: (...chunks) => (react_1.default.createElement(react_core_1.Link, { to: notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
-                                    notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
-                                    ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MEMBERS_ROUTE_NAME, groupNotification.group)
-                                    : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, groupNotification.group) }, chunks))
-                        } })) }));
+                }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !groupNotification.user.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, alt: groupNotification.user.username, variant: "circular", src: groupNotification.user.avatar }) })) })), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!groupNotification.user.deleted && {
+                            to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, groupNotification.user)
+                        }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: groupNotification.user.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.${notificationObject.aggregated[0].type}`, defaultMessage: `ui.notification.${notificationObject.aggregated[0].type}`, values: {
+                                group: groupNotification.group.name,
+                                link: (...chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+                                        notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
+                                        ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MEMBERS_ROUTE_NAME, groupNotification.group)
+                                        : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, groupNotification.group) }, { children: chunks })))
+                            } })] }) }));
         }
         /**
          * Comment, NestedComment, Follow Contribution header
@@ -234,8 +245,7 @@ function UserNotification(inProps) {
                 notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.VOTE_UP ||
                 notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.CONTRIBUTION)) {
             const contribution = (0, contribution_1.getContribution)(notificationObject);
-            return (react_1.default.createElement(material_1.CardHeader, { className: classes.header, titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(contribution), (0, contribution_1.getRouteData)(notificationObject[contribution.type])) }, (0, contribution_1.getContributionSnippet)(contribution)), action: contribution && (react_1.default.createElement(material_1.Tooltip, { title: contribution.suspended ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspended', defaultMessage: 'ui.notification.notificationSuspended' })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspend', defaultMessage: 'ui.notification.notificationSuspend' })) },
-                    react_1.default.createElement(LoadingButton_1.default, { variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, contribution.suspended ? react_1.default.createElement(Icon_1.default, { color: 'primary' }, "notifications_off") : react_1.default.createElement(Icon_1.default, { color: 'inherit' }, "notifications")))) }));
+            return ((0, jsx_runtime_1.jsx)(material_1.CardHeader, { className: classes.header, titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(contribution), (0, contribution_1.getRouteData)(notificationObject[contribution.type])) }, { children: (0, contribution_1.getContributionSnippet)(contribution) })), action: contribution && ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: contribution.suspended ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspended', defaultMessage: 'ui.notification.notificationSuspended' })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspend', defaultMessage: 'ui.notification.notificationSuspend' })) }, { children: (0, jsx_runtime_1.jsx)(LoadingButton_1.default, Object.assign({ variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, { children: contribution.suspended ? (0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ color: 'primary' }, { children: "notifications_off" })) : (0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ color: 'inherit' }, { children: "notifications" })) })) }))) }));
         }
         return null;
     }
@@ -246,86 +256,82 @@ function UserNotification(inProps) {
      */
     function renderAggregatedItem(n, i) {
         if (n.type === types_1.SCNotificationTypologyType.COMMENT || n.type === types_1.SCNotificationTypologyType.NESTED_COMMENT) {
-            return react_1.default.createElement(Comment_1.default, { notificationObject: n, key: i, onVote: handleVote(i) });
+            return (0, jsx_runtime_1.jsx)(Comment_1.default, { notificationObject: n, onVote: handleVote(i) }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.FOLLOW) {
-            return react_1.default.createElement(ContributionFollow_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(ContributionFollow_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.USER_FOLLOW) {
-            return react_1.default.createElement(UserFollow_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(UserFollow_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.CONNECTION_REQUEST || n.type === types_1.SCNotificationTypologyType.CONNECTION_ACCEPT) {
-            return react_1.default.createElement(UserConnection_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(UserConnection_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.VOTE_UP) {
-            return react_1.default.createElement(VoteUp_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(VoteUp_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.KINDLY_NOTICE_ADVERTISING ||
             n.type === types_1.SCNotificationTypologyType.KINDLY_NOTICE_AGGRESSIVE ||
             n.type === types_1.SCNotificationTypologyType.KINDLY_NOTICE_POOR ||
             n.type === types_1.SCNotificationTypologyType.KINDLY_NOTICE_VULGAR ||
             n.type === types_1.SCNotificationTypologyType.KINDLY_NOTICE_OFFTOPIC) {
-            return react_1.default.createElement(KindlyNoticeFor_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(KindlyNoticeFor_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.KINDLY_NOTICE_FLAG) {
-            return react_1.default.createElement(KindlyNoticeFlag_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(KindlyNoticeFlag_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.DELETED_FOR_ADVERTISING ||
             n.type === types_1.SCNotificationTypologyType.DELETED_FOR_AGGRESSIVE ||
             n.type === types_1.SCNotificationTypologyType.DELETED_FOR_POOR ||
             n.type === types_1.SCNotificationTypologyType.DELETED_FOR_VULGAR ||
             n.type === types_1.SCNotificationTypologyType.DELETED_FOR_OFFTOPIC) {
-            return react_1.default.createElement(DeletedFor_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(DeletedFor_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.UNDELETED_FOR) {
-            return react_1.default.createElement(UndeletedFor_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(UndeletedFor_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.COLLAPSED_FOR_ADVERTISING ||
             n.type === types_1.SCNotificationTypologyType.COLLAPSED_FOR_AGGRESSIVE ||
             n.type === types_1.SCNotificationTypologyType.COLLAPSED_FOR_POOR ||
             n.type === types_1.SCNotificationTypologyType.COLLAPSED_FOR_VULGAR ||
             n.type === types_1.SCNotificationTypologyType.COLLAPSED_FOR_OFFTOPIC) {
-            return react_1.default.createElement(CollapsedFor_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(CollapsedFor_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.PRIVATE_MESSAGE) {
-            return react_1.default.createElement(PrivateMessage_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(PrivateMessage_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.BLOCKED_USER || n.type === types_1.SCNotificationTypologyType.UNBLOCKED_USER) {
-            return react_1.default.createElement(UserBlocked_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(UserBlocked_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.MENTION) {
-            return react_1.default.createElement(Mention_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(Mention_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.INCUBATOR_APPROVED) {
-            return react_1.default.createElement(IncubatorApproved_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(IncubatorApproved_1.default, { notificationObject: n }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.CUSTOM_NOTIFICATION) {
             handleCustomNotification && handleCustomNotification(n);
         }
         else if (n.type === types_1.SCNotificationTypologyType.CONTRIBUTION) {
-            return react_1.default.createElement(Contribution_1.default, { notificationObject: n, key: i, onVote: handleVote(i) });
+            return (0, jsx_runtime_1.jsx)(Contribution_1.default, { notificationObject: n, onVote: handleVote(i) }, i);
         }
         else if (n.type === types_1.SCNotificationTypologyType.USER_ADDED_TO_GROUP ||
             n.type === types_1.SCNotificationTypologyType.USER_INVITED_TO_JOIN_GROUP ||
             n.type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP ||
             n.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP) {
-            return react_1.default.createElement(Group_1.default, { notificationObject: n, key: i });
+            return (0, jsx_runtime_1.jsx)(Group_1.default, { notificationObject: n }, i);
+        }
+        else if (n.type === types_1.SCNotificationTypologyType.USER_ADDED_TO_EVENT ||
+            n.type === types_1.SCNotificationTypologyType.USER_INVITED_TO_JOIN_EVENT ||
+            n.type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_EVENT ||
+            n.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT) {
+            return (0, jsx_runtime_1.jsx)(Event_1.default, { notificationObject: n }, i);
         }
         return null;
     }
     /**
      * Renders root object
      */
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
-            renderNotificationHeader(),
-            react_1.default.createElement(CardContent_1.default, { className: classes.content },
-                react_1.default.createElement("div", { className: classes.unCollapsed }, notificationObject.aggregated.slice(0, showMaxAggregated).map((n, i) => renderAggregatedItem(n, i))),
-                notificationObject.aggregated.length > showMaxAggregated && (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(material_1.ListItemButton, { onClick: setStateAggregated, classes: { root: classes.showOtherAggregated } },
-                        react_1.default.createElement(material_1.ListItemText, { primary: react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.showOthers', defaultMessage: 'ui.notification.showOthers' }) }),
-                        openOtherAggregated ? react_1.default.createElement(Icon_1.default, null, "expand_less") : react_1.default.createElement(Icon_1.default, null, "expand_more")),
-                    react_1.default.createElement(material_1.Collapse, { in: openOtherAggregated, timeout: "auto", unmountOnExit: true, classes: { root: classes.collapsed } }, notificationObject.aggregated.slice(showMaxAggregated).map((n, i) => renderAggregatedItem(n, i))))))),
-        openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [renderNotificationHeader(), (0, jsx_runtime_1.jsxs)(CardContent_1.default, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes.unCollapsed }, { children: notificationObject.aggregated.slice(0, showMaxAggregated).map((n, i) => renderAggregatedItem(n, i)) })), notificationObject.aggregated.length > showMaxAggregated && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ onClick: setStateAggregated, classes: { root: classes.showOtherAggregated } }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.notification.showOthers', defaultMessage: 'ui.notification.showOthers' }) }), openOtherAggregated ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] })), (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: openOtherAggregated, timeout: "auto", unmountOnExit: true, classes: { root: classes.collapsed } }, { children: notificationObject.aggregated.slice(showMaxAggregated).map((n, i) => renderAggregatedItem(n, i)) }))] }))] }))] })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = UserNotification;

package/lib/cjs/components/Notification/PrivateMessage/PrivateMessage.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const react_core_1 = require("@selfcommunity/react-core");
@@ -79,55 +80,31 @@ function PrivateMessageNotification(props) {
     });
     // RENDER
     if (isSnippetTemplate || isToastTemplate) {
-        return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: react_1.default.createElement(react_core_1.Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
+        return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
                 to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
-            }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null }),
-                react_1.default.createElement(UserAvatar_1.default, { hide: !notificationObject.message.sender.community_badge, smaller: true },
-                    react_1.default.createElement(material_1.Avatar, { alt: notificationObject.message.sender.username, variant: "circular", src: notificationObject.message.sender.avatar, classes: { root: classes.avatar } }))), primary: react_1.default.createElement(react_1.default.Fragment, null,
-                isToastTemplate && (react_1.default.createElement(material_1.Box, null,
-                    react_1.default.createElement(react_core_1.Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
-                        to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
-                    }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null }), notificationObject.message.sender.username),
-                    ' ',
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.userToastNotifications.privateMessage.sentMessage', defaultMessage: 'ui.userToastNotifications.privateMessage.sentMessage' }),
-                    ":",
-                    react_1.default.createElement(material_1.Box, { className: classes.messageWrap },
-                        react_1.default.createElement(react_core_1.Link, { to: ((_a = notificationObject.message) === null || _a === void 0 ? void 0 : _a.group)
+            }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !notificationObject.message.sender.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject.message.sender.username, variant: "circular", src: notificationObject.message.sender.avatar, classes: { root: classes.avatar } }) })) })), primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isToastTemplate && ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
+                                to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
+                            }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: notificationObject.message.sender.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.userToastNotifications.privateMessage.sentMessage', defaultMessage: 'ui.userToastNotifications.privateMessage.sentMessage' }), ":", (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.messageWrap }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: ((_a = notificationObject.message) === null || _a === void 0 ? void 0 : _a.group)
+                                        ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
+                                        : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.message }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.message.message } }) })) }))] })), isSnippetTemplate && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "div", color: "inherit" }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
+                                    to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
+                                }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.message.sender.username })), ' ', (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: ((_b = notificationObject.message) === null || _b === void 0 ? void 0 : _b.group)
+                                        ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
+                                        : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.messageLabel }, { children: intl.formatMessage(messages.receivePrivateMessage, {
+                                        total: 1,
+                                        b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
+                                    }) }))] })) }))] }), footer: isToastTemplate && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "primary" }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: ((_c = notificationObject.message) === null || _c === void 0 ? void 0 : _c.group)
                                 ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
-                                : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.message },
-                            react_1.default.createElement(material_1.Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.message.message } }))))),
-                isSnippetTemplate && (react_1.default.createElement(material_1.Box, null,
-                    react_1.default.createElement(material_1.Typography, { component: "div", color: "inherit" },
-                        react_1.default.createElement(react_core_1.Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
-                            to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
-                        }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null, className: classes.username }), notificationObject.message.sender.username),
-                        ' ',
-                        react_1.default.createElement(react_core_1.Link, { to: ((_b = notificationObject.message) === null || _b === void 0 ? void 0 : _b.group)
+                                : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender) }, { children: scUserContext.user && follower ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.replyMessage", defaultMessage: 'ui.userToastNotifications.replyMessage' })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewMessage", defaultMessage: 'ui.userToastNotifications.viewMessage' })) })) }))] }))) }, rest)));
+    }
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, actions: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt }), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.replyButton }, component: react_core_1.Link, loading: notificationObject.message.sender.deleted
+                                ? null
+                                : scUserContext.user
+                                    ? follower === null || manager.isLoading(notificationObject.message.sender)
+                                    : null, to: ((_d = notificationObject.message) === null || _d === void 0 ? void 0 : _d.group)
                                 ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
-                                : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.messageLabel }, intl.formatMessage(messages.receivePrivateMessage, {
-                            total: 1,
-                            b: (...chunks) => react_1.default.createElement("strong", null, chunks)
-                        })))))), footer: isToastTemplate && (react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-                react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at }),
-                react_1.default.createElement(material_1.Typography, { color: "primary" },
-                    react_1.default.createElement(react_core_1.Link, { to: ((_c = notificationObject.message) === null || _c === void 0 ? void 0 : _c.group)
+                                : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender) }, { children: scUserContext.user && follower ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.privateMessage.btnReplyLabel", defaultMessage: "ui.notification.privateMessage.btnReplyLabel" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.privateMessage.btnViewLabel", defaultMessage: "ui.notification.privateMessage.btnViewLabel" })) }))] })), primary: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.messageWrap }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: ((_e = notificationObject.message) === null || _e === void 0 ? void 0 : _e.group)
                             ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
-                            : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender) }, scUserContext.user && follower ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.replyMessage", defaultMessage: 'ui.userToastNotifications.replyMessage' })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewMessage", defaultMessage: 'ui.userToastNotifications.viewMessage' })))))) }, rest)));
-    }
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, actions: react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-                react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt }),
-                react_1.default.createElement(lab_1.LoadingButton, { color: 'primary', variant: "outlined", size: "small", classes: { root: classes.replyButton }, component: react_core_1.Link, loading: notificationObject.message.sender.deleted
-                        ? null
-                        : scUserContext.user
-                            ? follower === null || manager.isLoading(notificationObject.message.sender)
-                            : null, to: ((_d = notificationObject.message) === null || _d === void 0 ? void 0 : _d.group)
-                        ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
-                        : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender) }, scUserContext.user && follower ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.notification.privateMessage.btnReplyLabel", defaultMessage: "ui.notification.privateMessage.btnReplyLabel" })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.notification.privateMessage.btnViewLabel", defaultMessage: "ui.notification.privateMessage.btnViewLabel" })))), primary: react_1.default.createElement(material_1.Box, { className: classes.messageWrap },
-                react_1.default.createElement(react_core_1.Link, { to: ((_e = notificationObject.message) === null || _e === void 0 ? void 0 : _e.group)
-                        ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
-                        : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.message },
-                    react_1.default.createElement(material_1.Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.message.message } }))) }, rest)),
-        openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
+                            : scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.message }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.message.message } }) })) })) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = PrivateMessageNotification;

package/lib/cjs/components/Notification/Skeleton.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
 const CardContent_1 = tslib_1.__importDefault(require("@mui/material/CardContent"));
 const styles_1 = require("@mui/material/styles");
@@ -37,12 +38,7 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
  */
 function NotificationSkeleton(props) {
     const theme = (0, material_1.useTheme)();
-    const notification = (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(material_1.CardHeader, { avatar: react_1.default.createElement(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), title: react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "80%", style: { marginBottom: 6 } }), subheader: react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "40%" }) })));
-    return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props),
-        react_1.default.createElement(CardContent_1.default, { sx: { paddingBottom: 1 } },
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 20, style: { marginBottom: 0 } }),
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 15, width: "60%", style: { marginBottom: 0 } })),
-        [...Array(Math.floor(Math.random() * 5) + 1)].map((x, i) => (react_1.default.createElement(react_1.default.Fragment, { key: i }, notification)))));
+    const notification = ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.CardHeader, { avatar: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), title: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: "80%", style: { marginBottom: 6 } }), subheader: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: "40%" }) }) }));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, props, { children: [(0, jsx_runtime_1.jsxs)(CardContent_1.default, Object.assign({ sx: { paddingBottom: 1 } }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 20, style: { marginBottom: 0 } }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 15, width: "60%", style: { marginBottom: 0 } })] })), [...Array(Math.floor(Math.random() * 5) + 1)].map((x, i) => ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: notification }, i)))] })));
 }
 exports.default = NotificationSkeleton;

package/lib/cjs/components/Notification/UndeletedFor/UndeletedFor.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
@@ -42,20 +42,6 @@ function UndeletedForNotification(props) {
     /**
      * Renders root object
      */
-    return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: react_1.default.createElement(material_1.Avatar, { variant: "circular", classes: { root: classes.undeletedIcon } },
-            react_1.default.createElement(Icon_1.default, null, "outlined_flag")), primary: react_1.default.createElement(react_1.default.Fragment, null, isSnippetTemplate ? (react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])) },
-            react_1.default.createElement(material_1.Typography, { component: "div", color: "inherit", className: classes.undeletedText },
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.notification.undeletedFor.restoredContentSnippet", defaultMessage: "ui.notification.undeletedFor.restoredContentSnippet" })))) : (react_1.default.createElement(material_1.Typography, { component: "div", color: "inherit", className: classes.undeletedText },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.notification.undeletedFor.restoredContent", defaultMessage: "ui.notification.undeletedFor.restoredContent" })))), secondary: (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && (react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.Box, { className: classes.contributionWrap },
-                react_1.default.createElement(material_1.Typography, { variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel } },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.notification.undeletedFor.youWrote", defaultMessage: "ui.notification.undeletedFor.youWrote" })),
-                react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])), className: classes.contributionText },
-                    react_1.default.createElement(material_1.Typography, { component: 'span', variant: "body2" }, (0, contribution_1.getContributionSnippet)(notificationObject[contributionType])))),
-            template === types_1.SCNotificationObjectTemplateType.TOAST && (react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-                react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at }),
-                react_1.default.createElement(material_1.Typography, { color: "primary", component: 'div' },
-                    react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])) },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }))))))) }, rest)));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ variant: "circular", classes: { root: classes.undeletedIcon } }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" }) })), primary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isSnippetTemplate ? ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.undeletedText }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.undeletedFor.restoredContentSnippet", defaultMessage: "ui.notification.undeletedFor.restoredContentSnippet" }) })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.undeletedText }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.undeletedFor.restoredContent", defaultMessage: "ui.notification.undeletedFor.restoredContent" }) }))) }), secondary: (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.contributionWrap }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.undeletedFor.youWrote", defaultMessage: "ui.notification.undeletedFor.youWrote" }) })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])), className: classes.contributionText }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'span', variant: "body2" }, { children: (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]) })) }))] })), template === types_1.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "primary", component: 'div' }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] })))] })) }, rest)));
 }
 exports.default = UndeletedForNotification;

package/lib/cjs/components/Notification/UserBlocked/UserBlocked.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
@@ -46,14 +46,12 @@ function UserBlockedNotification(props) {
     /**
      * Renders root object
      */
-    return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: react_1.default.createElement(material_1.Avatar, { variant: "circular", classes: {
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ variant: "circular", classes: {
                 root: (0, classnames_1.default)(classes.unBlockedIcon, {
                     [classes.blockedIcon]: notificationObject.type === types_1.SCNotificationTypologyType.BLOCKED_USER
                 })
-            } },
-            react_1.default.createElement(Icon_1.default, null, "outlined_flag")), primary: react_1.default.createElement(material_1.Typography, { component: "div", color: "inherit", className: classes.blockedText }, notificationObject.type === types_1.SCNotificationTypologyType.BLOCKED_USER
-            ? intl.formatMessage(messages.accountBlocked, { b: (...chunks) => react_1.default.createElement("strong", null, chunks) })
-            : intl.formatMessage(messages.accountReactivated, { b: (...chunks) => react_1.default.createElement("strong", null, chunks) })), secondary: (template === types_2.SCNotificationObjectTemplateType.DETAIL || template === types_2.SCNotificationObjectTemplateType.SNIPPET) && (react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === types_2.SCNotificationObjectTemplateType.TOAST && (react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-            react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at }))) }, rest)));
+            } }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" }) })), primary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.blockedText }, { children: notificationObject.type === types_1.SCNotificationTypologyType.BLOCKED_USER
+                ? intl.formatMessage(messages.accountBlocked, { b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }) })
+                : intl.formatMessage(messages.accountReactivated, { b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }) }) })), secondary: (template === types_2.SCNotificationObjectTemplateType.DETAIL || template === types_2.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === types_2.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: (0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }) }))) }, rest)));
 }
 exports.default = UserBlockedNotification;

package/lib/cjs/components/Notification/UserConnection/UserConnection.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const react_intl_1 = require("react-intl");
@@ -54,19 +55,8 @@ function UserConnectionNotification(props) {
     /**
      * Renders root object
      */
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: react_1.default.createElement(react_core_1.Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }),
-                react_1.default.createElement(UserAvatar_1.default, { hide: !userConnection.community_badge, smaller: true },
-                    react_1.default.createElement(material_1.Avatar, { alt: userConnection.username, variant: "circular", src: userConnection.avatar, classes: { root: classes.avatar } }))), primary: react_1.default.createElement(material_1.Typography, { component: "div", color: "inherit", className: classes.connectionText },
-                react_1.default.createElement(react_core_1.Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null, className: classes.username }), userConnection.username),
-                ' ',
-                notificationObject.type === types_1.SCNotificationTypologyType.CONNECTION_REQUEST
-                    ? intl.formatMessage(messages.requestConnection, { b: (...chunks) => react_1.default.createElement("strong", null, chunks) })
-                    : intl.formatMessage(messages.acceptConnection, { b: (...chunks) => react_1.default.createElement("strong", null, chunks) })), secondary: (template === types_2.SCNotificationObjectTemplateType.DETAIL || template === types_2.SCNotificationObjectTemplateType.SNIPPET) && (react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === types_2.SCNotificationObjectTemplateType.TOAST && (react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-                react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at }),
-                react_1.default.createElement(material_1.Typography, { color: "primary", component: 'div' },
-                    react_1.default.createElement(react_core_1.Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }),
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: 'ui.userToastNotifications.goToProfile' }))))) }, rest)),
-        openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !userConnection.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: userConnection.username, variant: "circular", src: userConnection.avatar, classes: { root: classes.avatar } }) })) })), primary: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.connectionText }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: userConnection.username })), ' ', notificationObject.type === types_1.SCNotificationTypologyType.CONNECTION_REQUEST
+                            ? intl.formatMessage(messages.requestConnection, { b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }) })
+                            : intl.formatMessage(messages.acceptConnection, { b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }) })] })), secondary: (template === types_2.SCNotificationObjectTemplateType.DETAIL || template === types_2.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === types_2.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "primary", component: 'div' }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: 'ui.userToastNotifications.goToProfile' }) })) }))] }))) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = UserConnectionNotification;

package/lib/cjs/components/Notification/UserFollow/UserFollow.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const react_core_1 = require("@selfcommunity/react-core");
@@ -47,19 +48,8 @@ function UserFollowNotification(props) {
     /**
      * Renders root object
      */
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: react_1.default.createElement(react_core_1.Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower) }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }),
-                react_1.default.createElement(UserAvatar_1.default, { hide: !notificationObject.follower.community_badge, smaller: true },
-                    react_1.default.createElement(material_1.Avatar, { alt: notificationObject.follower.username, variant: "circular", src: notificationObject.follower.avatar, classes: { root: classes.avatar } }))), primary: react_1.default.createElement(material_1.Typography, { component: "div", color: "inherit", className: classes.followText },
-                react_1.default.createElement(react_core_1.Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower) }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null, className: classes.username }), notificationObject.follower.username),
-                ' ',
-                intl.formatMessage(messages.followUser, { b: (...chunks) => react_1.default.createElement("strong", null, chunks) })), secondary: (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && (react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === types_1.SCNotificationObjectTemplateType.TOAST && (react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-                react_1.default.createElement(DateTimeAgo_1.default, { date: notificationObject.active_at }),
-                react_1.default.createElement(material_1.Typography, { color: "primary", component: 'div' },
-                    react_1.default.createElement(react_core_1.Link, Object.assign({}, (!notificationObject.follower.deleted && {
-                        to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower)
-                    }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }),
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: 'ui.userToastNotifications.goToProfile' }))))) }, rest)),
-        openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower) }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !notificationObject.follower.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject.follower.username, variant: "circular", src: notificationObject.follower.avatar, classes: { root: classes.avatar } }) })) })), primary: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.followText }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower) }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.follower.username })), ' ', intl.formatMessage(messages.followUser, { b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }) })] })), secondary: (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === types_1.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "primary", component: 'div' }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.follower.deleted && {
+                                to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower)
+                            }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: 'ui.userToastNotifications.goToProfile' }) })) }))] }))) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = UserFollowNotification;