@selfcommunity/react-ui 0.8.0-embeds.16 → 0.8.0-live.40

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

@@ -53,22 +53,22 @@ function GroupNotification(props) {
     if (isSnippetTemplate || isToastTemplate) {
         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.user.deleted && {
                 to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
-            }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !notificationObject.user.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar, classes: { root: classes.avatar } }) })) })), primary: (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.user.deleted && {
+            }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, { hide: !notificationObject.user.community_badge, smaller: true, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar, classes: { root: classes.avatar } }) }) })), primary: (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.user.deleted && {
                         to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
-                    }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.${notificationObject.type}`, defaultMessage: `ui.notification.${notificationObject.type}`, values: {
+                    }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username, children: notificationObject.user.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.${notificationObject.type}`, defaultMessage: `ui.notification.${notificationObject.type}`, values: {
                             group: notificationObject.group.name,
-                            link: (...chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: notificationObject.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+                            link: (...chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, { to: notificationObject.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                     notificationObject.type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                     ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MEMBERS_ROUTE_NAME, notificationObject.group)
-                                    : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { 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 }), status && status !== types_1.SCGroupSubscriptionStatusType.SUBSCRIBED && ((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: notificationObject.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+                                    : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, notificationObject.group), children: chunks }))
+                        } })] }), footer: isToastTemplate && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2, children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }), status && status !== types_1.SCGroupSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(material_1.Typography, { color: "primary", children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { to: notificationObject.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                 notificationObject.type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                 ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MEMBERS_ROUTE_NAME, notificationObject.group)
-                                : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.group.button.see", defaultMessage: "ui.notification.group.button.see" }) })) })))] }))) }, rest)));
+                                : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, notificationObject.group), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.group.button.see", defaultMessage: "ui.notification.group.button.see" }) }) }))] })) }, 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 }), status && status !== types_1.SCGroupSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.acceptButton }, component: react_core_1.Link, loading: scUserContext.user ? status === null || manager.isLoading(notificationObject.group) : null, to: notificationObject.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+    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, { 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 }), status && status !== types_1.SCGroupSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(lab_1.LoadingButton, { color: 'primary', variant: "outlined", size: "small", classes: { root: classes.acceptButton }, component: react_core_1.Link, loading: scUserContext.user ? status === null || manager.isLoading(notificationObject.group) : null, to: notificationObject.type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                 notificationObject.type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                 ? scRoutingContext.url(react_core_1.SCRoutes.GROUP_MEMBERS_ROUTE_NAME, notificationObject.group)
-                                : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.group.button.see", defaultMessage: "ui.notification.group.button.see" }) })))] })) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                                : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, notificationObject.group), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.group.button.see", defaultMessage: "ui.notification.group.button.see" }) }))] }) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = GroupNotification;

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

@@ -41,12 +41,12 @@ function IncubatorApprovedNotification(props) {
     /**
      * Renders root object
      */
-    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, { alt: notificationObject.incubator.approved_category.name, src: notificationObject.incubator.approved_category.image_medium, variant: "square", classes: { root: classes.categoryIcon } }), 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.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", className: classes.categoryApprovedText, color: "inherit" }, { children: intl.formatMessage(messages.incubatorApproved, {
+    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, { alt: notificationObject.incubator.approved_category.name, src: notificationObject.incubator.approved_category.image_medium, variant: "square", classes: { root: classes.categoryIcon } }), primary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isSnippetTemplate ? ((0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category), children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "div", className: classes.categoryApprovedText, color: "inherit", children: intl.formatMessage(messages.incubatorApproved, {
                         name: notificationObject.incubator.name,
                         b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                    }) })) }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [template === types_1.SCNotificationObjectTemplateType.DETAIL && notificationObject.is_new && (0, jsx_runtime_1.jsx)(NewChip_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", className: classes.categoryApprovedText, color: "inherit" }, { children: intl.formatMessage(messages.incubatorApproved, {
+                    }) }) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [template === types_1.SCNotificationObjectTemplateType.DETAIL && notificationObject.is_new && (0, jsx_runtime_1.jsx)(NewChip_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "div", className: classes.categoryApprovedText, color: "inherit", children: intl.formatMessage(messages.incubatorApproved, {
                             name: notificationObject.incubator.name,
                             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.DETAIL ? ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category), className: classes.viewIncubatorButton }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.notification.incubatorApproved.viewIncubator', defaultMessage: 'ui.notification.incubatorApproved.viewIncubator' }) }))) : 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.CATEGORY_ROUTE_NAME, notificationObject.incubator) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.incubatorApproved.viewIncubator", defaultMessage: 'ui.userToastNotifications.incubatorApproved.viewIncubator' }) })) }))] }))) : null }, rest)));
+                        }) })] })) }), 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.DETAIL ? ((0, jsx_runtime_1.jsx)(material_1.Button, { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category), className: classes.viewIncubatorButton, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.notification.incubatorApproved.viewIncubator', defaultMessage: 'ui.notification.incubatorApproved.viewIncubator' }) })) : template === types_1.SCNotificationObjectTemplateType.TOAST ? ((0, jsx_runtime_1.jsxs)(material_1.Stack, { 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, { color: "primary", component: 'div', children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.incubatorApproved.viewIncubator", defaultMessage: 'ui.userToastNotifications.incubatorApproved.viewIncubator' }) }) })] })) : null }, rest)));
 }
 exports.default = IncubatorApprovedNotification;

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

@@ -51,6 +51,6 @@ function KindlyNoticeFlagNotification(props) {
     /**
      * Renders root object
      */
-    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.flagIcon } }, { 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.flagText }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet`, defaultMessage: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet` }) })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[(0, utils_1.camelCase)(notificationObject.type)], { 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: !isSnippetTemplate && ((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]) })) }))] }))) }, 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, { variant: "circular", classes: { root: classes.flagIcon }, 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, { 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, { component: "div", color: "inherit", className: classes.flagText, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet`, defaultMessage: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet` }) }) })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { component: "div", color: "inherit", className: classes.flagText, children: intl.formatMessage(messages[(0, utils_1.camelCase)(notificationObject.type)], { 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: !isSnippetTemplate && ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: classes.contributionWrap, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { 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, { 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, { component: 'span', variant: "body2", children: (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]) }) })] })) }, rest)));
 }
 exports.default = KindlyNoticeFlagNotification;

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

@@ -71,8 +71,8 @@ function KindlyNoticeForNotification(props) {
     /**
      * Renders root object
      */
-    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.flagIcon } }, { 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.flagText }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.kindlyNoticeFor.${(0, utils_1.camelCase)(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.kindlyNoticeFor.${(0, utils_1.camelCase)(notificationObject.type)}Snippet` }) })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[(0, utils_1.camelCase)(notificationObject.type)], { 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: 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: intl.formatMessage(messages.youWrote, {
+    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, { variant: "circular", classes: { root: classes.flagIcon }, 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, { 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, { component: "div", color: "inherit", className: classes.flagText, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.kindlyNoticeFor.${(0, utils_1.camelCase)(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.kindlyNoticeFor.${(0, utils_1.camelCase)(notificationObject.type)}Snippet` }) }) })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { component: "div", color: "inherit", className: classes.flagText, children: intl.formatMessage(messages[(0, utils_1.camelCase)(notificationObject.type)], { 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: isSnippetTemplate ? null : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: classes.contributionWrap, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel }, children: intl.formatMessage(messages.youWrote, {
                                 b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                            }) })), (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)));
+                            }) }), (0, jsx_runtime_1.jsx)(react_core_1.Link, { 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, { component: 'span', variant: "body2", children: (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]) }) })] }), template === types_1.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { 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, { color: "primary", component: 'div', children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { 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 = KindlyNoticeForNotification;

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

@@ -55,10 +55,10 @@ function MentionNotification(props) {
      */
     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[objectType].author.deleted && {
                     to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject[objectType].author)
-                }), { onClick: notificationObject[objectType].author.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !notificationObject[objectType].author.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject[objectType].author.username, variant: "circular", src: notificationObject[objectType].author.avatar, classes: { root: classes.avatar } }) })) })), primary: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "div", color: "inherit", className: classes.mentionText }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject[objectType].author.deleted && {
+                }), { onClick: notificationObject[objectType].author.deleted ? () => setOpenAlert(true) : null, children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, { hide: !notificationObject[objectType].author.community_badge, smaller: true, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject[objectType].author.username, variant: "circular", src: notificationObject[objectType].author.avatar, classes: { root: classes.avatar } }) }) })), primary: (0, jsx_runtime_1.jsxs)(material_1.Typography, { component: "div", color: "inherit", className: classes.mentionText, children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject[objectType].author.deleted && {
                             to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject[objectType].author)
-                        }), { onClick: notificationObject[objectType].author.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject[objectType].author.username })), ' ', intl.formatMessage(messages.quotedYouOn, {
+                        }), { onClick: notificationObject[objectType].author.deleted ? () => setOpenAlert(true) : null, className: classes.username, children: notificationObject[objectType].author.username })), ' ', intl.formatMessage(messages.quotedYouOn, {
                             b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                        }), ' '] })), secondary: (0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes[`${objectType.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[objectType])) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'span', variant: "body2", className: classes.contributionText }, { children: (0, contribution_1.getContributionSnippet)(notificationObject[objectType]) })) })), (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (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({ to: scRoutingContext.url(react_core_1.SCRoutes[`${contribution.type.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(contribution)) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] }))) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                        }), ' '] }), secondary: (0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes[`${objectType.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[objectType])), children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: 'span', variant: "body2", className: classes.contributionText, children: (0, contribution_1.getContributionSnippet)(notificationObject[objectType]) }) }), (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (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, { 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, { color: "primary", component: 'div', children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes[`${contribution.type.toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(contribution)), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) }) })] })) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = MentionNotification;

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

@@ -187,9 +187,9 @@ function UserNotification(inProps) {
             let messageNotification = 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({}, (!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 }, { 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 && {
+                }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null, children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, { 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, {
+                        }), { 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 })
                         })] }) }));
@@ -205,14 +205,14 @@ function UserNotification(inProps) {
             let groupNotification = 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({}, (!groupNotification.user.deleted && {
                     to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, groupNotification.user)
-                }), { 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 && {
+                }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null, children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, { 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: {
+                        }), { 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 ||
+                                link: (...chunks) => ((0, jsx_runtime_1.jsx)(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) }, { children: chunks })))
+                                        : scRoutingContext.url(react_core_1.SCRoutes.GROUP_ROUTE_NAME, groupNotification.group), children: chunks }))
                             } })] }) }));
         }
         /**
@@ -226,7 +226,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 ((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 ((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, { 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, { 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, { 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, { color: 'primary', children: "notifications_off" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { color: 'inherit', children: "notifications" }) }) })) }));
         }
         return null;
     }
@@ -313,6 +313,6 @@ function UserNotification(inProps) {
     /**
      * Renders root object
      */
-    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) })] }));
+    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, { className: classes.content, children: [(0, jsx_runtime_1.jsx)("div", { 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, { 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, { 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

@@ -82,29 +82,29 @@ function PrivateMessageNotification(props) {
     if (isSnippetTemplate || isToastTemplate) {
         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 }, { 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 && {
+            }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null, children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, { 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)
+                            }), { 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, { className: classes.messageWrap, children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { 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 && {
+                                        : 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, { 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)
+                                }), { 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, { 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, {
+                                        : 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)
+                                    }) })] }) }))] }), footer: isToastTemplate && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { 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, { color: "primary", children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { 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) }, { 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)));
+                                : 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
+    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, { 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, { 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) }, { 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.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, { className: classes.messageWrap, children: (0, jsx_runtime_1.jsx)(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 }, { 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) })] }));
+                            : 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

@@ -39,6 +39,6 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
 function NotificationSkeleton(props) {
     const theme = (0, material_1.useTheme)();
     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)))] })));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, props, { children: [(0, jsx_runtime_1.jsxs)(CardContent_1.default, { 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

@@ -42,6 +42,6 @@ function UndeletedForNotification(props) {
     /**
      * Renders root object
      */
-    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)));
+    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, { 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, { 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, { 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, { 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, { className: classes.contributionWrap, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { 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, { 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, { component: 'span', variant: "body2", children: (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]) }) })] }), template === types_1.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { 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, { color: "primary", component: 'div', children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { 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

@@ -46,12 +46,12 @@ function UserBlockedNotification(props) {
     /**
      * Renders root object
      */
-    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: {
+    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, { variant: "circular", classes: {
                 root: (0, classnames_1.default)(classes.unBlockedIcon, {
                     [classes.blockedIcon]: notificationObject.type === types_1.SCNotificationTypologyType.BLOCKED_USER
                 })
-            } }, { 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
+            }, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" }) }), primary: (0, jsx_runtime_1.jsx)(material_1.Typography, { 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)));
+                : 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, { 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

@@ -55,8 +55,8 @@ function UserConnectionNotification(props) {
     /**
      * Renders root object
      */
-    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
+    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, { 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, { 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) })] }));
+                            : 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, { 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, { 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

@@ -48,8 +48,8 @@ function UserFollowNotification(props) {
     /**
      * Renders root object
      */
-    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 && {
+    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, { 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, { 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, { 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, { 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) })] }));
+                            }), { 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;

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

@@ -53,9 +53,9 @@ function VoteUpNotification(props) {
     /**
      * Renders root object
      */
-    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.user.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user) }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !notificationObject.user.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar, classes: { root: classes.avatar } }) })) })), primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.user.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user) }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', intl.formatMessage(messages.appreciated, {
+    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.user.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user) }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, { hide: !notificationObject.user.community_badge, smaller: true, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar, classes: { root: classes.avatar } }) }) })), primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.user.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user) }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username, children: notificationObject.user.username })), ' ', intl.formatMessage(messages.appreciated, {
                             username: notificationObject.user.username,
                             b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                        })] }), secondary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(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({ variant: "body2", className: classes.contributionText, component: 'div' }, { children: (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]) })) })), (template === notification_1.SCNotificationObjectTemplateType.DETAIL || template === notification_1.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt }))] }), footer: template === notification_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((0, contribution_1.getContributionRouteName)(contribution), (0, contribution_1.getRouteData)(contribution)) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] }))) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                        })] }), secondary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, { 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, { variant: "body2", className: classes.contributionText, component: 'div', children: (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]) }) }), (template === notification_1.SCNotificationObjectTemplateType.DETAIL || template === notification_1.SCNotificationObjectTemplateType.SNIPPET) && ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt }))] }), footer: template === notification_1.SCNotificationObjectTemplateType.TOAST && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { 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, { color: "primary", component: 'div', children: (0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(contribution), (0, contribution_1.getRouteData)(contribution)), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) }) })] })) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = VoteUpNotification;

package/lib/cjs/components/OnBoardingWidget/ActionsButton.d.ts

@@ -0,0 +1,7 @@
+import { IconButtonProps } from '@mui/material';
+export interface OnBoardingActionsButtonProps extends IconButtonProps {
+    isExpanded: boolean;
+    onExpandChange: () => void;
+    onHideOnBoarding: () => void;
+}
+export default function OnBoardingActionsButton(inProps: OnBoardingActionsButtonProps): JSX.Element;

package/lib/cjs/components/OnBoardingWidget/ActionsButton.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+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 classnames_1 = tslib_1.__importDefault(require("classnames"));
+const system_1 = require("@mui/system");
+const react_intl_1 = require("react-intl");
+const api_services_1 = require("@selfcommunity/api-services");
+const Errors_1 = require("../../constants/Errors");
+const utils_1 = require("@selfcommunity/utils");
+const types_1 = require("@selfcommunity/types");
+const constants_1 = require("./constants");
+const classes = {
+    root: `${constants_1.PREFIX}-actions-button-root`,
+    drawerRoot: `${constants_1.PREFIX}-actions-drawer-root`,
+    menuRoot: `${constants_1.PREFIX}-actions-menu-root`,
+    paper: `${constants_1.PREFIX}-actions-paper`,
+    item: `${constants_1.PREFIX}-actions-item`
+};
+const Root = (0, styles_1.styled)(material_1.IconButton, {
+    name: constants_1.PREFIX,
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.root
+})(() => ({}));
+const SwipeableDrawerRoot = (0, styles_1.styled)(material_1.SwipeableDrawer, {
+    name: constants_1.PREFIX,
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.drawerRoot
+})(() => ({}));
+const MenuRoot = (0, styles_1.styled)(material_1.Menu, {
+    name: constants_1.PREFIX,
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.menuRoot
+})(() => ({}));
+function OnBoardingActionsButton(inProps) {
+    // PROPS
+    const props = (0, system_1.useThemeProps)({
+        props: inProps,
+        name: constants_1.PREFIX
+    });
+    const { className = null, isExpanded, onExpandChange, onHideOnBoarding } = props, rest = tslib_1.__rest(props, ["className", "isExpanded", "onExpandChange", "onHideOnBoarding"]);
+    // STATE
+    const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
+    const theme = (0, material_1.useTheme)();
+    const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
+    // HANDLERS
+    const handleOpen = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+    /**
+     * Updates onBoarding dynamic preference
+     */
+    const hideOnBoarding = () => {
+        api_services_1.PreferenceService.updatePreferences({ [`${types_1.SCPreferenceName.ONBOARDING_HIDDEN}`]: true })
+            .then(() => {
+            onHideOnBoarding();
+        })
+            .catch((e) => {
+            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, e);
+        });
+    };
+    const renderList = () => {
+        if (isMobile) {
+            return [
+                isExpanded ? ((0, jsx_runtime_1.jsx)(material_1.ListItem, { className: classes.item, children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: onExpandChange, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_less" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.actionsMenu.view.less", defaultMessage: "ui.onBoardingWidget.actionsMenu.view.less" })] }) }, "expand_less")) : ((0, jsx_runtime_1.jsx)(material_1.ListItem, { className: classes.item, children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: onExpandChange, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.actionsMenu.view.more", defaultMessage: "ui.onBoardingWidget.actionsMenu.view.more" })] }) }, "expand_more")),
+                (0, jsx_runtime_1.jsx)(material_1.ListItem, { className: classes.item, children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: hideOnBoarding, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.actionsMenu.close", defaultMessage: "ui.onBoardingWidget.actionsMenu.close" })] }) }, "close")
+            ];
+        }
+        else {
+            return [
+                isExpanded ? ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: onExpandChange, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_less" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.actionsMenu.view.less", defaultMessage: "ui.onBoardingWidget.actionsMenu.view.less" })] }, "expand_less")) : ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: onExpandChange, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.actionsMenu.view.more", defaultMessage: "ui.onBoardingWidget.actionsMenu.view.more" })] }, "expand_more")),
+                (0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: hideOnBoarding, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.onBoardingWidget.actionsMenu.close", defaultMessage: "ui.onBoardingWidget.actionsMenu.close" })] }, "close")
+            ];
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen, children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, { onClick: () => setAnchorEl(null), className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true, children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) })) : ((0, jsx_runtime_1.jsx)(MenuRoot, { onClick: () => setAnchorEl(null), className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper }, children: renderList() }))] }));
+}
+exports.default = OnBoardingActionsButton;

package/lib/cjs/components/OnBoardingWidget/OnBoardingWidget.d.ts

@@ -1,5 +1,5 @@
 import { StartStepParams } from '@selfcommunity/api-services';
-import { SCFeedObjectType } from '@selfcommunity/types';
+import { SCFeedObjectType, SCOnBoardingStepType } from '@selfcommunity/types';
 import { VirtualScrollerItemProps } from '../../types/virtualScroller';
 export interface OnBoardingWidgetProps extends VirtualScrollerItemProps {
     /**
@@ -18,6 +18,15 @@ export interface OnBoardingWidgetProps extends VirtualScrollerItemProps {
      * @default null
      */
     onGeneratedContent?: (feedObjs: SCFeedObjectType[]) => void;
+    /**
+     * Force widget expanded
+     * @default false
+     */
+    forceExpanded?: boolean;
+    /**
+     * The initial step to display
+     */
+    initialStep?: SCOnBoardingStepType;
 }
 declare const OnBoardingWidget: (inProps: OnBoardingWidgetProps) => JSX.Element;
 export default OnBoardingWidget;