@selfcommunity/react-ui 0.11.0-mui7.29 → 0.11.0-react-17.0.1.2

package/lib/esm/components/Notification/Course/Course.js

@@ -1,7 +1,7 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
-import { Avatar, Box, Button, Stack, Typography, styled } from '@mui/material';
+import { Avatar, Box, Stack, Typography, styled } from '@mui/material';
 import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
 import { SCNotificationTypologyType } from '@selfcommunity/types';
 import { FormattedMessage } from 'react-intl';
@@ -9,6 +9,7 @@ import DateTimeAgo from '../../../shared/DateTimeAgo';
 import classNames from 'classnames';
 import { SCCourseTemplateType, SCNotificationObjectTemplateType } from '../../../types';
 import NotificationItem from '../../../shared/NotificationItem';
+import { LoadingButton } from '@mui/lab';
 import UserDeletedSnackBar from '../../../shared/UserDeletedSnackBar';
 import UserAvatar from '../../../shared/UserAvatar';
 import { PREFIX } from '../constants';
@@ -53,14 +54,16 @@ export default function CourseNotification(props) {
             }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.user.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Box, { children: [_jsx(Link, Object.assign({}, (!notificationObject.user.deleted && {
                         to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
                     }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.course.${notificationObject.type}`, defaultMessage: `ui.notification.course.${notificationObject.type}`, values: {
+                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                            // @ts-ignore
                             name: notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
                                 ? notificationObject.comment.lesson_name
                                 : notificationObject.course.name,
-                            link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
+                            link: (...chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
                                     ? SCRoutes.COURSE_LESSON_ROUTE_NAME
                                     : SCRoutes.COURSE_ROUTE_NAME, notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
                                     ? formatLessonUrl(notificationObject)
-                                    : notificationObject.course) }, { children: chunks }), `ui.notification.course.${notificationObject.type}.link`))
+                                    : notificationObject.course) }, { children: chunks })))
                         } })] }), footer: isToastTemplate ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(getRouteName(notificationObject), getRouteParams(notificationObject)) }, { children: _jsx(FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) })) }))] }))) : (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.snippetTime })) }, rest)));
     }
     return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.user.deleted && {
@@ -68,13 +71,15 @@ export default function CourseNotification(props) {
                 }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.user.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar }) })) })), primary: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!notificationObject.user.deleted && {
                             to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
                         }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.course.${notificationObject.type}`, defaultMessage: `ui.notification.course.${notificationObject.type}`, values: {
+                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                                // @ts-ignore
                                 name: notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
                                     ? notificationObject.comment.lesson_name
                                     : notificationObject.course.name,
-                                link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
+                                link: (...chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
                                         ? SCRoutes.COURSE_LESSON_ROUTE_NAME
                                         : SCRoutes.COURSE_ROUTE_NAME, notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
                                         ? formatLessonUrl(notificationObject)
-                                        : notificationObject.course) }, { children: chunks }), `ui.notification.course.${notificationObject.type}.link`))
-                            } }), notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ? (_jsx(Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.comment.html } })) : (_jsx(CourseItem, { course: notificationObject.course, actions: _jsx(_Fragment, {}), template: SCCourseTemplateType.SNIPPET, elevation: 0 }))] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(Button, Object.assign({ color: "primary", variant: "outlined", size: "small", classes: { root: classes.seeButton }, component: Link, to: scRoutingContext.url(getRouteName(notificationObject), getRouteParams(notificationObject)) }, { children: _jsx(FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) }))] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                                        : notificationObject.course) }, { children: chunks })))
+                            } }), notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ? (_jsx(Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.comment.html } })) : (_jsx(CourseItem, { course: notificationObject.course, actions: _jsx(_Fragment, {}), template: SCCourseTemplateType.SNIPPET, elevation: 0 }))] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.seeButton }, component: Link, to: scRoutingContext.url(getRouteName(notificationObject), getRouteParams(notificationObject)) }, { children: _jsx(FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) }))] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

package/lib/esm/components/Notification/DeletedFor/DeletedFor.js

@@ -45,7 +45,7 @@ const classes = {
 const Root = styled(NotificationItem, {
     name: PREFIX,
     slot: 'DeletedForRoot',
-    overridesResolver: (_props, styles) => styles.root
+    overridesResolver: (props, styles) => styles.root
 })(() => ({}));
 /**
  * This component render the content of the notification of type deleted for
@@ -65,7 +65,5 @@ export default function DeletedForNotification(props) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.deletedFor.${camelCase(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.deletedFor.${camelCase(notificationObject.type)}Snippet` }) })) }))) : (_jsxs(_Fragment, { children: [template === SCNotificationObjectTemplateType.DETAIL && notificationObject.is_new && _jsx(NewChip, {}), _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], {
-                            b: (chunks) => _jsx("strong", { children: chunks }, `${messages[camelCase(notificationObject.type)]}.b`)
-                        }) }))] })) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: "body2", color: "inherit", classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.deletedFor.youWrote", defaultMessage: "ui.notification.deletedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: "span", color: "inherit", variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: "ui.userToastNotifications.viewContribution" }) })) }))] })))] })) }, rest)));
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.deletedFor.${camelCase(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.deletedFor.${camelCase(notificationObject.type)}Snippet` }) })) }))) : (_jsxs(_Fragment, { children: [template === SCNotificationObjectTemplateType.DETAIL && notificationObject.is_new && _jsx(NewChip, {}), _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], { b: (...chunks) => _jsx("strong", { children: chunks }) }) }))] })) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: 'body2', color: 'inherit', classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.deletedFor.youWrote", defaultMessage: "ui.notification.deletedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: 'span', color: 'inherit', variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] })))] })) }, rest)));
 }

package/lib/esm/components/Notification/Event/Event.js

@@ -1,7 +1,7 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
-import { Avatar, Box, Button, Icon, Stack, Typography, styled } from '@mui/material';
+import { Avatar, Box, Icon, Stack, Typography, styled } from '@mui/material';
 import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
 import { SCEventLocationType, SCEventSubscriptionStatusType, SCNotificationTypologyType } from '@selfcommunity/types';
 import { FormattedMessage, useIntl } from 'react-intl';
@@ -9,6 +9,7 @@ import DateTimeAgo from '../../../shared/DateTimeAgo';
 import classNames from 'classnames';
 import { SCNotificationObjectTemplateType } from '../../../types';
 import NotificationItem from '../../../shared/NotificationItem';
+import { LoadingButton } from '@mui/lab';
 import UserDeletedSnackBar from '../../../shared/UserDeletedSnackBar';
 import UserAvatar from '../../../shared/UserAvatar';
 import { PREFIX } from '../constants';
@@ -60,9 +61,11 @@ export default function EventNotification(props) {
             }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.user.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Box, { children: [_jsx(Link, Object.assign({}, (!notificationObject.user.deleted && {
                         to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
                     }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.event.${notificationObject.type}`, defaultMessage: `ui.notification.event.${notificationObject.type}`, values: {
-                            icon: (chunks) => _jsx(Icon, { children: chunks }, `ui.notification.event.${notificationObject.type}.icon`),
+                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                            // @ts-ignore
+                            icon: (...chunks) => _jsx(Icon, { children: chunks }),
                             event: notificationObject.event.name,
-                            link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event) }, { children: chunks }), `ui.notification.event.${notificationObject.type}.link`))
+                            link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event) }, { children: chunks }))
                         } })] }), secondary: _jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ component: "span" }, { children: _jsx(FormattedMessage, { id: "ui.notification.event.dateTime", defaultMessage: "ui.notification.event.dateTime", values: {
                                 date: intl.formatDate(notificationObject.event.start_date, {
                                     weekday: 'long',
@@ -71,19 +74,21 @@ export default function EventNotification(props) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(notificationObject.event.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } }) })), _jsxs(Typography, Object.assign({ component: "p", variant: "body2" }, { children: [_jsx(FormattedMessage, { id: `ui.notification.event.privacy.${notificationObject.event.privacy}`, defaultMessage: `ui.notification.event.privacy.${notificationObject.event.privacy}` }), ' ', "-", ' ', notificationObject.event.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: `ui.notification.event.address.live.label`, defaultMessage: `ui.notification.event.address.live.label` })) : (_jsx(FormattedMessage, { id: `ui.notification.event.address.online.label`, defaultMessage: `ui.notification.event.address.online.label` }))] }))] }), footer: isToastTemplate ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary" }, { children: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT ? (_jsx(Button, Object.assign({ disabled: disabled, loading: loading, color: "primary", variant: "text", size: "small", onClick: () => acceptRequest(notificationObject.event) }, { children: disabled ? (_jsx(FormattedMessage, { id: "ui.notification.event.button.accepted", defaultMessage: "ui.notification.event.button.accepted" })) : (_jsx(FormattedMessage, { id: "ui.notification.event.button.accept", defaultMessage: "ui.notification.event.button.accept" })) }))) : (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event) }, { children: _jsx(FormattedMessage, { id: "ui.notification.event.button.see", defaultMessage: "ui.notification.event.button.see" }) }))) }))] }))) : (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.snippetTime })) }, rest)));
+                            } }) })), _jsxs(Typography, Object.assign({ component: "p", variant: "body2" }, { children: [_jsx(FormattedMessage, { id: `ui.notification.event.privacy.${notificationObject.event.privacy}`, defaultMessage: `ui.notification.event.privacy.${notificationObject.event.privacy}` }), ' ', "-", ' ', notificationObject.event.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: `ui.notification.event.address.live.label`, defaultMessage: `ui.notification.event.address.live.label` })) : (_jsx(FormattedMessage, { id: `ui.notification.event.address.online.label`, defaultMessage: `ui.notification.event.address.online.label` }))] }))] }), footer: isToastTemplate ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary" }, { children: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT ? (_jsx(LoadingButton, Object.assign({ disabled: disabled, loading: loading, color: 'primary', variant: "text", size: "small", onClick: () => acceptRequest(notificationObject.event) }, { children: disabled ? (_jsx(FormattedMessage, { id: "ui.notification.event.button.accepted", defaultMessage: "ui.notification.event.button.accepted" })) : (_jsx(FormattedMessage, { id: "ui.notification.event.button.accept", defaultMessage: "ui.notification.event.button.accept" })) }))) : (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event) }, { children: _jsx(FormattedMessage, { id: "ui.notification.event.button.see", defaultMessage: "ui.notification.event.button.see" }) }))) }))] }))) : (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.snippetTime })) }, rest)));
     }
     return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.user.deleted && {
                     to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
                 }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.user.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: notificationObject.user.username, variant: "circular", src: notificationObject.user.avatar }) })) })), primary: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!notificationObject.user.deleted && {
                             to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
                         }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.${notificationObject.type}`, defaultMessage: `ui.notification.${notificationObject.type}`, values: {
-                                icon: (chunks) => _jsx(Icon, { children: chunks }, `ui.notification.${notificationObject.type}.icon`),
+                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                                // @ts-ignore
+                                icon: (...chunks) => _jsx(Icon, { children: chunks }),
                                 event: notificationObject.event.name,
-                                link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event) }, { children: chunks }), `ui.notification.${notificationObject.type}.link`))
-                            } }), _jsx(EventItem, { event: notificationObject.event, actions: _jsx(_Fragment, {}), elevation: 0 })] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(Button, Object.assign({}, (notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT && {
+                                link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event) }, { children: chunks }))
+                            } }), _jsx(EventItem, { event: notificationObject.event, actions: _jsx(_Fragment, {}), elevation: 0 })] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(LoadingButton, Object.assign({}, (notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT && {
                             disabled: disabled
-                        }), { loading: loading, color: "primary", variant: "outlined", size: "small", classes: { root: classes.seeButton } }, (notificationObject.type !== SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT && {
+                        }), { loading: loading, color: 'primary', variant: "outlined", size: "small", classes: { root: classes.seeButton } }, (notificationObject.type !== SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT && {
                             component: Link,
                             to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, notificationObject.event)
                         }), { onClick: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT

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

@@ -1,7 +1,7 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useContext, useEffect, useState } from 'react';
-import { Avatar, Box, Button, Stack, Typography, styled } from '@mui/material';
+import { Avatar, Box, Stack, Typography, styled } from '@mui/material';
 import { Link, SCRoutes, SCUserContext, useSCRouting } from '@selfcommunity/react-core';
 import { SCGroupSubscriptionStatusType, SCNotificationTypologyType } from '@selfcommunity/types';
 import { FormattedMessage } from 'react-intl';
@@ -9,6 +9,7 @@ import DateTimeAgo from '../../../shared/DateTimeAgo';
 import classNames from 'classnames';
 import { SCNotificationObjectTemplateType } from '../../../types';
 import NotificationItem from '../../../shared/NotificationItem';
+import { LoadingButton } from '@mui/lab';
 import UserDeletedSnackBar from '../../../shared/UserDeletedSnackBar';
 import UserAvatar from '../../../shared/UserAvatar';
 import { PREFIX } from '../constants';
@@ -53,16 +54,16 @@ export default function GroupNotification(props) {
                         to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.user)
                     }), { onClick: notificationObject.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.user.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.${notificationObject.type}`, defaultMessage: `ui.notification.${notificationObject.type}`, values: {
                             group: notificationObject.group.name,
-                            link: (chunks) => (_jsx(Link, Object.assign({ to: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+                            link: (...chunks) => (_jsx(Link, Object.assign({ to: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                     notificationObject.type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                     ? scRoutingContext.url(SCRoutes.GROUP_MEMBERS_ROUTE_NAME, notificationObject.group)
-                                    : scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { children: chunks }), `ui.notification.${notificationObject.type}.link`))
+                                    : scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { children: chunks })))
                         } })] }), footer: isToastTemplate && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), status && status !== SCGroupSubscriptionStatusType.SUBSCRIBED && (_jsx(Typography, Object.assign({ color: "primary" }, { children: _jsx(Link, Object.assign({ to: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                 notificationObject.type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                 ? scRoutingContext.url(SCRoutes.GROUP_MEMBERS_ROUTE_NAME, notificationObject.group)
                                 : scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { children: _jsx(FormattedMessage, { id: "ui.notification.group.button.see", defaultMessage: "ui.notification.group.button.see" }) })) })))] }))) }, rest)));
     }
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), status && status !== SCGroupSubscriptionStatusType.SUBSCRIBED && (_jsx(Button, Object.assign({ color: "primary", variant: "outlined", size: "small", classes: { root: classes.acceptButton }, component: Link, loading: scUserContext.user ? status === null || manager.isLoading(notificationObject.group) : null, to: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), status && status !== SCGroupSubscriptionStatusType.SUBSCRIBED && (_jsx(LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.acceptButton }, component: Link, loading: scUserContext.user ? status === null || manager.isLoading(notificationObject.group) : null, to: notificationObject.type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                 notificationObject.type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                 ? scRoutingContext.url(SCRoutes.GROUP_MEMBERS_ROUTE_NAME, notificationObject.group)
                                 : scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, notificationObject.group) }, { children: _jsx(FormattedMessage, { id: "ui.notification.group.button.see", defaultMessage: "ui.notification.group.button.see" }) })))] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));

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

@@ -40,9 +40,9 @@ export default function IncubatorApprovedNotification(props) {
      */
     return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, { alt: notificationObject.incubator.approved_category.name, src: notificationObject.incubator.approved_category.image_medium, variant: "square", classes: { root: classes.categoryIcon } }), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category) }, { children: _jsx(Typography, Object.assign({ component: "div", className: classes.categoryApprovedText, color: "inherit" }, { children: intl.formatMessage(messages.incubatorApproved, {
                         name: notificationObject.incubator.name,
-                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.incubatorApproved.approved.b.1")
+                        b: (...chunks) => _jsx("strong", { children: chunks })
                     }) })) }))) : (_jsxs(_Fragment, { children: [template === SCNotificationObjectTemplateType.DETAIL && notificationObject.is_new && _jsx(NewChip, {}), _jsx(Typography, Object.assign({ component: "div", className: classes.categoryApprovedText, color: "inherit" }, { children: intl.formatMessage(messages.incubatorApproved, {
                             name: notificationObject.incubator.name,
-                            b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.incubatorApproved.approved.b.2")
-                        }) }))] })) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.DETAIL ? (_jsx(Button, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category), className: classes.viewIncubatorButton }, { children: _jsx(FormattedMessage, { id: "ui.notification.incubatorApproved.viewIncubator", defaultMessage: "ui.notification.incubatorApproved.viewIncubator" }) }))) : template === SCNotificationObjectTemplateType.TOAST ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.incubatorApproved.viewIncubator", defaultMessage: "ui.userToastNotifications.incubatorApproved.viewIncubator" }) })) }))] }))) : null }, rest)));
+                            b: (...chunks) => _jsx("strong", { children: chunks })
+                        }) }))] })) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.DETAIL ? (_jsx(Button, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator.approved_category), className: classes.viewIncubatorButton }, { children: _jsx(FormattedMessage, { id: 'ui.notification.incubatorApproved.viewIncubator', defaultMessage: 'ui.notification.incubatorApproved.viewIncubator' }) }))) : template === SCNotificationObjectTemplateType.TOAST ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, notificationObject.incubator) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.incubatorApproved.viewIncubator", defaultMessage: 'ui.userToastNotifications.incubatorApproved.viewIncubator' }) })) }))] }))) : null }, rest)));
 }

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

@@ -47,7 +47,5 @@ export default function KindlyNoticeFlagNotification(props) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet`, defaultMessage: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet` }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], {
-                    b: (chunks) => _jsx("strong", { children: chunks }, `${messages[camelCase(notificationObject.type)]}.b`)
-                }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: !isSnippetTemplate && (_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: "body2", color: "inherit", component: "div", classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.youWrote", defaultMessage: "ui.notification.undeletedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: "span", variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] }))) }, rest)));
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet`, defaultMessage: `ui.notification.kindlyNoticeFlag.kindlyNoticeFlagSnippet` }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], { b: (...chunks) => _jsx("strong", { children: chunks }) }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: !isSnippetTemplate && (_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.youWrote", defaultMessage: "ui.notification.undeletedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: 'span', variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] }))) }, rest)));
 }

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

@@ -67,9 +67,7 @@ export default function KindlyNoticeForNotification(props) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.kindlyNoticeFor.${camelCase(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.kindlyNoticeFor.${camelCase(notificationObject.type)}Snippet` }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], {
-                    b: (chunks) => _jsx("strong", { children: chunks }, `${messages[camelCase(notificationObject.type)]}.b`)
-                }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: "body2", color: "inherit", component: "div", classes: { root: classes.contributionYouWroteLabel } }, { children: intl.formatMessage(messages.youWrote, {
-                                b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.kindlyNoticeFor.youWrote.b")
-                            }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: "span", variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: "ui.userToastNotifications.viewContribution" }) })) }))] })))] })) }, rest)));
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.kindlyNoticeFor.${camelCase(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.kindlyNoticeFor.${camelCase(notificationObject.type)}Snippet` }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], { b: (...chunks) => _jsx("strong", { children: chunks }) }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel } }, { children: intl.formatMessage(messages.youWrote, {
+                                b: (...chunks) => _jsx("strong", { children: chunks })
+                            }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: 'span', variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] })))] })) }, rest)));
 }

package/lib/esm/components/Notification/LiveStream/LiveStream.js

@@ -1,13 +1,14 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
-import { Avatar, Box, Button, Icon, Stack, Typography, styled } from '@mui/material';
+import { Avatar, Box, Icon, Stack, Typography, styled } from '@mui/material';
 import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
 import { FormattedMessage } from 'react-intl';
 import DateTimeAgo from '../../../shared/DateTimeAgo';
 import classNames from 'classnames';
 import { SCNotificationObjectTemplateType } from '../../../types';
 import NotificationItem from '../../../shared/NotificationItem';
+import { LoadingButton } from '@mui/lab';
 import UserDeletedSnackBar from '../../../shared/UserDeletedSnackBar';
 import UserAvatar from '../../../shared/UserAvatar';
 import { PREFIX } from '../constants';
@@ -50,9 +51,11 @@ export default function LiveStreamNotification(props) {
             }), { onClick: notificationObject.live_stream.host.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.live_stream.host.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.live_stream.host.username, variant: "circular", src: notificationObject.live_stream.host.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Box, { children: [_jsx(Link, Object.assign({}, (!notificationObject.live_stream.host.deleted && {
                         to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.live_stream.host)
                     }), { onClick: notificationObject.live_stream.host.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.live_stream.host.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.${notificationObject.type}.title`, defaultMessage: `ui.notification.${notificationObject.type}.title`, values: {
-                            icon: (chunks) => _jsx(Icon, { children: chunks }, `ui.notification.${notificationObject.type}.title.icon`),
+                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                            // @ts-ignore
+                            icon: (...chunks) => _jsx(Icon, { children: chunks }),
                             live: notificationObject.live_stream.title,
-                            link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: chunks }), `ui.notification.${notificationObject.type}.title.link`))
+                            link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: chunks }))
                         } })] }), footer: isToastTemplate ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: _jsx(FormattedMessage, { id: "ui.notification.live_stream_started.join", defaultMessage: "ui.notification.live_stream_started.join" }) })) }))] }))) : (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.snippetTime })) }, rest)));
     }
     return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.live_stream.host.deleted && {
@@ -60,7 +63,9 @@ export default function LiveStreamNotification(props) {
                 }), { onClick: notificationObject.live_stream.host.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.live_stream.host.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: notificationObject.live_stream.host.username, variant: "circular", src: notificationObject.live_stream.host.avatar }) })) })), primary: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!notificationObject.live_stream.host.deleted && {
                             to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.live_stream.host)
                         }), { onClick: notificationObject.live_stream.host.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.live_stream.host.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.${notificationObject.type}`, defaultMessage: `ui.notification.${notificationObject.type}`, values: {
+                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                                // @ts-ignore
                                 live: notificationObject.live_stream.title,
-                                link: (chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: chunks }), `ui.notification.${notificationObject.type}.link`))
-                            } }), _jsx(LiveStream, { liveStream: notificationObject.live_stream, hideInProgress: !inProgress, actions: _jsx(_Fragment, {}), elevation: 0 })] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(Button, Object.assign({ color: "primary", variant: "outlined", size: "small", classes: { root: classes.seeButton }, component: Link, disabled: Boolean(notificationObject.live_stream.closed_at_by_host), to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: _jsx(FormattedMessage, { id: "ui.notification.live_stream_started.join", defaultMessage: "ui.notification.live_stream_started.join" }) }))] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                                link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: chunks }))
+                            } }), _jsx(LiveStream, { liveStream: notificationObject.live_stream, hideInProgress: !inProgress, actions: _jsx(_Fragment, {}), elevation: 0 })] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.seeButton }, component: Link, disabled: Boolean(notificationObject.live_stream.closed_at_by_host), to: scRoutingContext.url(SCRoutes.LIVESTREAM_ROUTE_NAME, notificationObject.live_stream) }, { children: _jsx(FormattedMessage, { id: "ui.notification.live_stream_started.join", defaultMessage: "ui.notification.live_stream_started.join" }) }))] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

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

@@ -55,6 +55,6 @@ export default function MentionNotification(props) {
                 }), { onClick: notificationObject[objectType].author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject[objectType].author.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject[objectType].author.username, variant: "circular", src: notificationObject[objectType].author.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Typography, Object.assign({ component: "div", color: "inherit", className: classes.mentionText }, { children: [_jsx(Link, Object.assign({}, (!notificationObject[objectType].author.deleted && {
                             to: scRoutingContext.url(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, {
-                            b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.mention.quotedYou.b")
-                        }), ' '] })), secondary: _jsxs(React.Fragment, { children: [_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${objectType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[objectType])) }, { children: _jsx(Typography, Object.assign({ component: "span", variant: "body2", className: classes.contributionText }, { children: getContributionSnippet(notificationObject[objectType]) })) })), (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(Box, { children: _jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }) }))] }), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contribution.type.toUpperCase()}_ROUTE_NAME`], getRouteData(contribution)) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: "ui.userToastNotifications.viewContribution" }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                            b: (...chunks) => _jsx("strong", { children: chunks })
+                        }), ' '] })), secondary: _jsxs(React.Fragment, { children: [_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${objectType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[objectType])) }, { children: _jsx(Typography, Object.assign({ component: 'span', variant: "body2", className: classes.contributionText }, { children: getContributionSnippet(notificationObject[objectType]) })) })), (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(Box, { children: _jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }) }))] }), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contribution.type.toUpperCase()}_ROUTE_NAME`], getRouteData(contribution)) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

package/lib/esm/components/Notification/Notification.js

@@ -19,12 +19,13 @@ import LiveStreamNotification from './LiveStream/LiveStream';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { getContribution, getContributionRouteName, getContributionSnippet, getRouteData } from '../../utils/contribution';
 import ContributionFollowNotification from './ContributionFollow';
-import { Avatar, CardHeader, Collapse, ListItemButton, ListItemText, Tooltip, styled, CardContent, Icon, Button } from '@mui/material';
+import { Avatar, CardHeader, Collapse, ListItemButton, ListItemText, Tooltip, styled, CardContent, Icon } from '@mui/material';
 import IncubatorApprovedNotification from './IncubatorApproved';
 import { Endpoints, http } from '@selfcommunity/api-services';
 import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
 import ContributionNotification from './Contribution';
 import classNames from 'classnames';
+import LoadingButton from '@mui/lab/LoadingButton';
 import Widget from '../Widget';
 import { useThemeProps } from '@mui/system';
 import { Logger } from '@selfcommunity/utils';
@@ -138,7 +139,7 @@ export default function UserNotification(inProps) {
     function handleStopContentNotification(contribution) {
         setLoadingSuspendNotification(true);
         performSuspendNotification(contribution)
-            .then(() => {
+            .then((data) => {
             const newObj = obj;
             newObj[contribution.type].suspended = !newObj[contribution.type].suspended;
             setObj(newObj);
@@ -183,13 +184,11 @@ export default function UserNotification(inProps) {
             let messageNotification = notificationObject.aggregated[0];
             return (_jsx(CardHeader, { className: classes.header, avatar: _jsx(Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
                     to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
-                }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !messageNotification.message.sender.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: messageNotification.message.sender.username, variant: "circular", src: messageNotification.message.sender.avatar }) })) })), slotProps: {
-                    title: { className: classes.title, variant: 'subtitle1' }
-                }, title: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
+                }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !messageNotification.message.sender.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: messageNotification.message.sender.username, variant: "circular", src: messageNotification.message.sender.avatar }) })) })), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
                             to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
                         }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: messageNotification.message.sender.username })), ' ', intl.formatMessage(messages.receivePrivateMessage, {
                             total: notificationObject.aggregated.length,
-                            b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.receivePrivateMessage.b")
+                            b: (...chunks) => _jsx("strong", { children: chunks })
                         })] }) }));
         }
         /**
@@ -203,16 +202,14 @@ export default function UserNotification(inProps) {
             let groupNotification = notificationObject.aggregated[0];
             return (_jsx(CardHeader, { className: classes.header, avatar: _jsx(Link, Object.assign({}, (!groupNotification.user.deleted && {
                     to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, groupNotification.user)
-                }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !groupNotification.user.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: groupNotification.user.username, variant: "circular", src: groupNotification.user.avatar }) })) })), slotProps: {
-                    title: { className: classes.title, variant: 'subtitle1' }
-                }, title: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!groupNotification.user.deleted && {
+                }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !groupNotification.user.community_badge, smaller: true }, { children: _jsx(Avatar, { className: classes.avatar, alt: groupNotification.user.username, variant: "circular", src: groupNotification.user.avatar }) })) })), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!groupNotification.user.deleted && {
                             to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, groupNotification.user)
                         }), { onClick: groupNotification.user.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: groupNotification.user.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.${notificationObject.aggregated[0].type}`, defaultMessage: `ui.notification.${notificationObject.aggregated[0].type}`, values: {
                                 group: groupNotification.group.name,
-                                link: (chunks) => (_jsx(Link, Object.assign({ to: notificationObject.aggregated[0].type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
+                                link: (...chunks) => (_jsx(Link, Object.assign({ to: notificationObject.aggregated[0].type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_GROUP ||
                                         notificationObject.aggregated[0].type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_GROUP
                                         ? scRoutingContext.url(SCRoutes.GROUP_MEMBERS_ROUTE_NAME, groupNotification.group)
-                                        : scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, groupNotification.group) }, { children: chunks }), `ui.notification.${notificationObject.aggregated[0].type}.link`))
+                                        : scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, groupNotification.group) }, { children: chunks })))
                             } })] }) }));
         }
         /**
@@ -226,12 +223,7 @@ export default function UserNotification(inProps) {
                 notificationObject.aggregated[0].type === SCNotificationTypologyType.VOTE_UP ||
                 notificationObject.aggregated[0].type === SCNotificationTypologyType.CONTRIBUTION)) {
             const contribution = getContribution(notificationObject);
-            return (_jsx(CardHeader, { className: classes.header, slotProps: {
-                    title: {
-                        className: classes.title,
-                        variant: 'subtitle1'
-                    }
-                }, title: _jsx(Link, Object.assign({ to: scRoutingContext.url(getContributionRouteName(contribution), getRouteData(notificationObject[contribution.type])) }, { children: getContributionSnippet(contribution) })), action: contribution && (_jsx(Tooltip, Object.assign({ title: contribution.suspended ? (_jsx(FormattedMessage, { id: "ui.notification.notificationSuspended", defaultMessage: "ui.notification.notificationSuspended" })) : (_jsx(FormattedMessage, { id: "ui.notification.notificationSuspend", defaultMessage: "ui.notification.notificationSuspend" })) }, { children: _jsx(Button, Object.assign({ variant: "text", size: "small", loading: loadingSuspendNotification, color: "inherit", classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, { children: contribution.suspended ? _jsx(Icon, Object.assign({ color: "primary" }, { children: "notifications_off" })) : _jsx(Icon, Object.assign({ color: "inherit" }, { children: "notifications_active" })) })) }))) }));
+            return (_jsx(CardHeader, { className: classes.header, titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: _jsx(Link, Object.assign({ to: scRoutingContext.url(getContributionRouteName(contribution), getRouteData(notificationObject[contribution.type])) }, { children: getContributionSnippet(contribution) })), action: contribution && (_jsx(Tooltip, Object.assign({ title: contribution.suspended ? (_jsx(FormattedMessage, { id: 'ui.notification.notificationSuspended', defaultMessage: 'ui.notification.notificationSuspended' })) : (_jsx(FormattedMessage, { id: 'ui.notification.notificationSuspend', defaultMessage: 'ui.notification.notificationSuspend' })) }, { children: _jsx(LoadingButton, Object.assign({ variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, { children: contribution.suspended ? _jsx(Icon, Object.assign({ color: 'primary' }, { children: "notifications_off" })) : _jsx(Icon, Object.assign({ color: 'inherit' }, { children: "notifications_active" })) })) }))) }));
         }
         return null;
     }
@@ -329,5 +321,5 @@ export default function UserNotification(inProps) {
     /**
      * Renders root object
      */
-    return (_jsxs(_Fragment, { children: [_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: [renderNotificationHeader(), _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx("div", Object.assign({ className: classes.unCollapsed }, { children: notificationObject.aggregated.slice(0, showMaxAggregated).map((n, i) => renderAggregatedItem(n, i)) })), notificationObject.aggregated.length > showMaxAggregated && (_jsxs(_Fragment, { children: [_jsxs(ListItemButton, Object.assign({ onClick: setStateAggregated, classes: { root: classes.showOtherAggregated } }, { children: [_jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: "ui.notification.showOthers", defaultMessage: "ui.notification.showOthers" }) }), openOtherAggregated ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" })] })), _jsx(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 && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: [renderNotificationHeader(), _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx("div", Object.assign({ className: classes.unCollapsed }, { children: notificationObject.aggregated.slice(0, showMaxAggregated).map((n, i) => renderAggregatedItem(n, i)) })), notificationObject.aggregated.length > showMaxAggregated && (_jsxs(_Fragment, { children: [_jsxs(ListItemButton, Object.assign({ onClick: setStateAggregated, classes: { root: classes.showOtherAggregated } }, { children: [_jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: 'ui.notification.showOthers', defaultMessage: 'ui.notification.showOthers' }) }), openOtherAggregated ? _jsx(Icon, { children: "expand_less" }) : _jsx(Icon, { children: "expand_more" })] })), _jsx(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 && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

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

@@ -1,13 +1,14 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useContext, useEffect, useMemo, useState } from 'react';
-import { Avatar, Box, Button, Stack, Typography, styled } from '@mui/material';
+import { Avatar, Box, Stack, Typography, styled } from '@mui/material';
 import { Link, SCPreferences, SCRoutes, SCUserContext, useSCPreferences, useSCRouting } from '@selfcommunity/react-core';
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 import DateTimeAgo from '../../../shared/DateTimeAgo';
 import classNames from 'classnames';
 import { SCNotificationObjectTemplateType } from '../../../types';
 import NotificationItem from '../../../shared/NotificationItem';
+import { LoadingButton } from '@mui/lab';
 import UserDeletedSnackBar from '../../../shared/UserDeletedSnackBar';
 import UserAvatar from '../../../shared/UserAvatar';
 import { PREFIX } from '../constants';
@@ -80,7 +81,7 @@ export default function PrivateMessageNotification(props) {
                 to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
             }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.message.sender.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.message.sender.username, variant: "circular", src: notificationObject.message.sender.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(_Fragment, { children: [isToastTemplate && (_jsxs(Box, { children: [_jsx(Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
                                 to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
-                            }), { onClick: notificationObject.message.sender.deleted ? () => setOpenAlert(true) : null }, { children: notificationObject.message.sender.username })), ' ', _jsx(FormattedMessage, { id: "ui.userToastNotifications.privateMessage.sentMessage", defaultMessage: "ui.userToastNotifications.privateMessage.sentMessage" }), ":", _jsx(Box, Object.assign({ className: classes.messageWrap }, { children: _jsx(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 })), ' ', _jsx(FormattedMessage, { id: 'ui.userToastNotifications.privateMessage.sentMessage', defaultMessage: 'ui.userToastNotifications.privateMessage.sentMessage' }), ":", _jsx(Box, Object.assign({ className: classes.messageWrap }, { children: _jsx(Link, Object.assign({ to: ((_a = notificationObject.message) === null || _a === void 0 ? void 0 : _a.group)
                                         ? scRoutingContext.url(SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
                                         : scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.message }, { children: _jsx(Typography, { variant: "body2", dangerouslySetInnerHTML: { __html: notificationObject.message.message } }) })) }))] })), isSnippetTemplate && (_jsx(Box, { children: _jsxs(Typography, Object.assign({ component: "div", color: "inherit" }, { children: [_jsx(Link, Object.assign({}, (!notificationObject.message.sender.deleted && {
                                     to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.message.sender)
@@ -88,12 +89,12 @@ export default function PrivateMessageNotification(props) {
                                         ? scRoutingContext.url(SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
                                         : scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender), className: classes.messageLabel }, { children: intl.formatMessage(messages.receivePrivateMessage, {
                                         total: 1,
-                                        b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.receivePrivateMessage.b")
+                                        b: (...chunks) => _jsx("strong", { children: chunks })
                                     }) }))] })) }))] }), footer: isToastTemplate && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary" }, { children: _jsx(Link, Object.assign({ to: ((_c = notificationObject.message) === null || _c === void 0 ? void 0 : _c.group)
                                 ? scRoutingContext.url(SCRoutes.GROUP_MESSAGES_ROUTE_NAME, notificationObject.message.group)
-                                : scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender) }, { children: scUserContext.user && follower ? (_jsx(FormattedMessage, { id: "ui.userToastNotifications.replyMessage", defaultMessage: "ui.userToastNotifications.replyMessage" })) : (_jsx(FormattedMessage, { id: "ui.userToastNotifications.viewMessage", defaultMessage: "ui.userToastNotifications.viewMessage" })) })) }))] }))) }, rest)));
+                                : scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, notificationObject.message.sender) }, { children: scUserContext.user && follower ? (_jsx(FormattedMessage, { id: "ui.userToastNotifications.replyMessage", defaultMessage: 'ui.userToastNotifications.replyMessage' })) : (_jsx(FormattedMessage, { id: "ui.userToastNotifications.viewMessage", defaultMessage: 'ui.userToastNotifications.viewMessage' })) })) }))] }))) }, rest)));
     }
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(Button, Object.assign({ color: "primary", variant: "outlined", size: "small", classes: { root: classes.replyButton }, component: Link, loading: notificationObject.message.sender.deleted
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.replyButton }, component: Link, loading: notificationObject.message.sender.deleted
                                 ? null
                                 : scUserContext.user
                                     ? follower === null || manager.isLoading(notificationObject.message.sender)

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

@@ -38,5 +38,5 @@ export default function UndeletedForNotification(props) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.undeletedIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.undeletedText }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.restoredContentSnippet", defaultMessage: "ui.notification.undeletedFor.restoredContentSnippet" }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.undeletedText }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.restoredContent", defaultMessage: "ui.notification.undeletedFor.restoredContent" }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: "body2", color: "inherit", component: "div", classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.youWrote", defaultMessage: "ui.notification.undeletedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: "span", variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: "ui.userToastNotifications.viewContribution" }) })) }))] })))] })) }, rest)));
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.undeletedIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.undeletedText }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.restoredContentSnippet", defaultMessage: "ui.notification.undeletedFor.restoredContentSnippet" }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.undeletedText }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.restoredContent", defaultMessage: "ui.notification.undeletedFor.restoredContent" }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.undeletedFor.youWrote", defaultMessage: "ui.notification.undeletedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: 'span', variant: "body2" }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] })))] })) }, rest)));
 }

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

@@ -47,10 +47,6 @@ export default function UserBlockedNotification(props) {
                     [classes.blockedIcon]: notificationObject.type === SCNotificationTypologyType.BLOCKED_USER
                 })
             } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.blockedText }, { children: notificationObject.type === SCNotificationTypologyType.BLOCKED_USER
-                ? intl.formatMessage(messages.accountBlocked, {
-                    b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.userBlocked.accountBlocked.b")
-                })
-                : intl.formatMessage(messages.accountReactivated, {
-                    b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.userBlocked.accountReactivated.b")
-                }) })), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsx(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: _jsx(DateTimeAgo, { date: notificationObject.active_at }) }))) }, rest)));
+                ? intl.formatMessage(messages.accountBlocked, { b: (...chunks) => _jsx("strong", { children: chunks }) })
+                : intl.formatMessage(messages.accountReactivated, { b: (...chunks) => _jsx("strong", { children: chunks }) }) })), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsx(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: _jsx(DateTimeAgo, { date: notificationObject.active_at }) }))) }, rest)));
 }

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

@@ -53,10 +53,6 @@ export default function UserConnectionNotification(props) {
      * Renders root object
      */
     return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !userConnection.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: userConnection.username, variant: "circular", src: userConnection.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Typography, Object.assign({ component: "div", color: "inherit", className: classes.connectionText }, { children: [_jsx(Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: userConnection.username })), ' ', notificationObject.type === SCNotificationTypologyType.CONNECTION_REQUEST
-                            ? intl.formatMessage(messages.requestConnection, {
-                                b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.userConnection.requestConnection.b")
-                            })
-                            : intl.formatMessage(messages.acceptConnection, {
-                                b: (chunks) => _jsx("strong", { children: chunks }, "ui.notification.userConnection.acceptConnection.b")
-                            })] })), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: "ui.userToastNotifications.goToProfile" }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                            ? intl.formatMessage(messages.requestConnection, { b: (...chunks) => _jsx("strong", { children: chunks }) })
+                            : intl.formatMessage(messages.acceptConnection, { b: (...chunks) => _jsx("strong", { children: chunks }) })] })), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({}, (!userConnection.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, userConnection) }), { onClick: userConnection.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: 'ui.userToastNotifications.goToProfile' }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

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

@@ -45,7 +45,7 @@ export default function UserFollowNotification(props) {
     /**
      * Renders root object
      */
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower) }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.follower.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.follower.username, variant: "circular", src: notificationObject.follower.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Typography, Object.assign({ component: "div", color: "inherit", className: classes.followText }, { children: [_jsx(Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(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) => _jsx("strong", { children: chunks }, "ui.notification.userFollow.followUser.b") })] })), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: "div" }, { children: _jsx(Link, Object.assign({}, (!notificationObject.follower.deleted && {
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower) }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.follower.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.follower.username, variant: "circular", src: notificationObject.follower.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(Typography, Object.assign({ component: "div", color: "inherit", className: classes.followText }, { children: [_jsx(Link, Object.assign({}, (!notificationObject.follower.deleted && { to: scRoutingContext.url(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) => _jsx("strong", { children: chunks }) })] })), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({}, (!notificationObject.follower.deleted && {
                                 to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.follower)
-                            }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: "ui.userToastNotifications.goToProfile" }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                            }), { onClick: notificationObject.follower.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.goToProfile", defaultMessage: 'ui.userToastNotifications.goToProfile' }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }