@selfcommunity/react-ui 0.7.0-alpha.36 → 0.7.0-alpha.361

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

@@ -1,147 +1,63 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
-const CardContent_1 = __importDefault(require("@mui/material/CardContent"));
-const Comment_1 = __importDefault(require("./Comment"));
-const UserFollow_1 = __importDefault(require("./UserFollow"));
-const UndeletedFor_1 = __importDefault(require("./UndeletedFor"));
-const DeletedFor_1 = __importDefault(require("./DeletedFor"));
-const UserConnection_1 = __importDefault(require("./UserConnection"));
-const PrivateMessage_1 = __importDefault(require("./PrivateMessage"));
-const UserBlocked_1 = __importDefault(require("./UserBlocked"));
-const Mention_1 = __importDefault(require("./Mention"));
-const CollapsedFor_1 = __importDefault(require("./CollapsedFor"));
-const KindlyNoticeFor_1 = __importDefault(require("./KindlyNoticeFor"));
+const CardContent_1 = tslib_1.__importDefault(require("@mui/material/CardContent"));
+const Comment_1 = tslib_1.__importDefault(require("./Comment"));
+const UserFollow_1 = tslib_1.__importDefault(require("./UserFollow"));
+const UndeletedFor_1 = tslib_1.__importDefault(require("./UndeletedFor"));
+const DeletedFor_1 = tslib_1.__importDefault(require("./DeletedFor"));
+const UserConnection_1 = tslib_1.__importDefault(require("./UserConnection"));
+const PrivateMessage_1 = tslib_1.__importDefault(require("./PrivateMessage"));
+const UserBlocked_1 = tslib_1.__importDefault(require("./UserBlocked"));
+const Mention_1 = tslib_1.__importDefault(require("./Mention"));
+const CollapsedFor_1 = tslib_1.__importDefault(require("./CollapsedFor"));
+const KindlyNoticeFor_1 = tslib_1.__importDefault(require("./KindlyNoticeFor"));
 const react_intl_1 = require("react-intl");
-const colors_1 = require("@mui/material/colors");
-const KindlyNoticeFlag_1 = __importDefault(require("./KindlyNoticeFlag"));
-const VoteUp_1 = __importDefault(require("./VoteUp"));
-const Icon_1 = __importDefault(require("@mui/material/Icon"));
+const KindlyNoticeFlag_1 = tslib_1.__importDefault(require("./KindlyNoticeFlag"));
+const VoteUp_1 = tslib_1.__importDefault(require("./VoteUp"));
+const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
 const Errors_1 = require("../../constants/Errors");
 const contribution_1 = require("../../utils/contribution");
-const ContributionFollow_1 = __importDefault(require("./ContributionFollow"));
+const ContributionFollow_1 = tslib_1.__importDefault(require("./ContributionFollow"));
 const material_1 = require("@mui/material");
-const IncubatorApproved_1 = __importDefault(require("./IncubatorApproved"));
+const IncubatorApproved_1 = tslib_1.__importDefault(require("./IncubatorApproved"));
 const api_services_1 = require("@selfcommunity/api-services");
 const react_core_1 = require("@selfcommunity/react-core");
-const Contribution_1 = __importDefault(require("./Contribution"));
-const classnames_1 = __importDefault(require("classnames"));
-const LoadingButton_1 = __importDefault(require("@mui/lab/LoadingButton"));
-const Widget_1 = __importDefault(require("../Widget"));
+const Contribution_1 = tslib_1.__importDefault(require("./Contribution"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const LoadingButton_1 = tslib_1.__importDefault(require("@mui/lab/LoadingButton"));
+const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const system_1 = require("@mui/system");
-const BaseItem_1 = __importDefault(require("../../shared/BaseItem"));
 const utils_1 = require("@selfcommunity/utils");
 const types_1 = require("@selfcommunity/types");
+const UserDeletedSnackBar_1 = tslib_1.__importDefault(require("../../shared/UserDeletedSnackBar"));
+const UserAvatar_1 = tslib_1.__importDefault(require("../../shared/UserAvatar"));
+const constants_1 = require("./constants");
 const messages = (0, react_intl_1.defineMessages)({
     receivePrivateMessage: {
         id: 'ui.notification.receivePrivateMessage',
         defaultMessage: 'ui.notification.receivePrivateMessage'
     }
 });
-const PREFIX = 'SCUserNotification';
 const classes = {
-    root: `${PREFIX}-root`,
-    notificationWrap: `${PREFIX}-notification-wrap`,
-    notificationHeader: `${PREFIX}-notification-header`,
-    title: `${PREFIX}-title`,
-    image: `${PREFIX}-image`,
-    username: `${PREFIX}-username`,
-    notificationContent: `${PREFIX}-notification-content`,
-    notificationUnCollapsed: `${PREFIX}-notification-uncollapsed`,
-    notificationCollapsed: `${PREFIX}-notification-collapsed`,
-    stopNotificationButton: `${PREFIX}-stop-notification-button`,
-    showOtherAggregated: `${PREFIX}-show-other-aggregated`
+    root: `${constants_1.PREFIX}-root`,
+    header: `${constants_1.PREFIX}-header`,
+    avatar: `${constants_1.PREFIX}-avatar`,
+    title: `${constants_1.PREFIX}-title`,
+    image: `${constants_1.PREFIX}-image`,
+    username: `${constants_1.PREFIX}-username`,
+    content: `${constants_1.PREFIX}-content`,
+    unCollapsed: `${constants_1.PREFIX}-uncollapsed`,
+    collapsed: `${constants_1.PREFIX}-collapsed`,
+    stopButton: `${constants_1.PREFIX}-stop-button`,
+    showOtherAggregated: `${constants_1.PREFIX}-show-other-aggregated`
 };
 const Root = (0, styles_1.styled)(Widget_1.default, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({
-    width: '100%',
-    marginBottom: theme.spacing(1),
-    [`& .${classes.title}`]: {
-        fontSize: 15,
-        padding: `${theme.spacing()} ${theme.spacing(2)} 5px ${theme.spacing(2)}`,
-        '&:hover': {
-            textDecoration: 'underline'
-        }
-    },
-    [`& .${classes.username}`]: {
-        fontWeight: 700,
-        '&:hover': {
-            textDecoration: 'underline'
-        }
-    },
-    [`& .${classes.notificationWrap}`]: {
-        padding: `${theme.spacing()} 0px`
-    },
-    [`& .${classes.notificationContent}`]: {
-        position: 'relative'
-    },
-    [`& .${classes.notificationHeader}`]: {
-        boxSizing: 'border-box',
-        boxShadow: 'none',
-        border: 'none'
-    },
-    [`& .${classes.stopNotificationButton}`]: {
-        margin: '5px 10px',
-        padding: '2px 2px 2px 2px',
-        minWidth: 'auto',
-        '& span': {
-            fontSize: 20
-        }
-    },
-    [`& .${classes.showOtherAggregated}`]: {
-        position: 'relative',
-        top: theme.spacing(),
-        backgroundColor: colors_1.grey[100]
-    },
-    [`& .${classes.notificationCollapsed}`]: {
-        paddingTop: theme.spacing()
-    },
-    '& a': {
-        textDecoration: 'none',
-        color: theme.palette.text.primary
-    }
-}));
+    name: constants_1.PREFIX,
+    slot: 'Root'
+})(() => ({}));
 /**
  *
  > API documentation for the Community-JS UserNotification component. Learn about the available props and the CSS API.
@@ -154,24 +70,24 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
 
  #### Component Name
 
- The name `SCUserNotification` can be used when providing style overrides in the theme.
+ The name `SCNotification` can be used when providing style overrides in the theme.
 
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCUserNotification-root|Styles applied to the root element.|
- |notificationWrap|.SCUserNotification-notification-wrap|Styles applied to the element wrap.|
- |notificationHeader|.SCUserNotification-notification-wrap|Styles applied to the notification header.|
- |title|.SCUserNotification-title|Styles applied to the title element in the notification header.|
- |image|.SCUserNotification-image|Styles applied to the image element in the notification header.|
- |username|.SCUserNotification-username|Styles applied to the user element in the notification header.|
- |notificationContent|.SCUserNotification-notification-content|Styles applied to the notification content.|
- |notificationUnCollapsed|.SCUserNotification-notification-wrap|Styles applied to the uncollapsed elements.|
- |notificationCollapsed|.SCUserNotification-notification-wrap|Styles applied to the collapsed elements.|
- |stopNotificationButton|.SCUserNotification-stop-notification-button|Styles applied to the stop notification button.|
- |showOtherAggregated|.SCUserNotification-show-other-aggregated|Styles applied to the show other aggregated element.|
+ |root|.SCNotification-root|Styles applied to the root element.|
+ |content|.SCNotification-notification-wrap|Styles applied to the element wrap.|
+ |header|.SCNotification-notification-wrap|Styles applied to the notification header.|
+ |title|.SCNotification-title|Styles applied to the title element in the notification header.|
+ |image|.SCNotification-image|Styles applied to the image element in the notification header.|
+ |username|.SCNotification-username|Styles applied to the user element in the notification header.|
+ |content|.SCNotification-notification-content|Styles applied to the notification content.|
+ |unCollapsed|.SCNotification-notification-wrap|Styles applied to the uncollapsed elements.|
+ |collapsed|.SCNotification-notification-wrap|Styles applied to the collapsed elements.|
+ |stopButton|.SCNotification-stop-notification-button|Styles applied to the stop notification button.|
+ |showOtherAggregated|.SCNotification-show-other-aggregated|Styles applied to the show other aggregated element.|
 
  * @param inProps
  */
@@ -179,16 +95,16 @@ function UserNotification(inProps) {
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
-        name: PREFIX
+        name: constants_1.PREFIX
     });
-    const { id = `notification_${props.notificationObject.sid}`, className, notificationObject, handleCustomNotification, showMaxAggregated = 2, collapsedOtherAggregated = true, onStateChange, onHeightChange } = props, rest = __rest(props, ["id", "className", "notificationObject", "handleCustomNotification", "showMaxAggregated", "collapsedOtherAggregated", "onStateChange", "onHeightChange"]);
+    const { id = `notification_${props.notificationObject.sid}`, className, notificationObject, handleCustomNotification, showMaxAggregated = 2, collapsedOtherAggregated = true, onStateChange, onHeightChange } = props, rest = tslib_1.__rest(props, ["id", "className", "notificationObject", "handleCustomNotification", "showMaxAggregated", "collapsedOtherAggregated", "onStateChange", "onHeightChange"]);
     // ROUTING
     const scRoutingContext = (0, react_core_1.useSCRouting)();
     // STATE
     const [obj, setObj] = (0, react_1.useState)(notificationObject);
-    const [loadingVote, setLoadingVote] = (0, react_1.useState)(null);
     const [loadingSuspendNotification, setLoadingSuspendNotification] = (0, react_1.useState)(false);
     const [openOtherAggregated, setOpenOtherAggregated] = (0, react_1.useState)(!collapsedOtherAggregated);
+    const [openAlert, setOpenAlert] = (0, react_1.useState)(false);
     //INTL
     const intl = (0, react_intl_1.useIntl)();
     /**
@@ -233,44 +149,19 @@ function UserNotification(inProps) {
             utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
         });
     }
-    /**
-     * Perform vote
-     */
-    const performVote = (0, react_1.useMemo)(() => (contribution) => {
-        return api_services_1.http
-            .request({
-            url: api_services_1.Endpoints.Vote.url({ type: contribution.type, id: contribution.id }),
-            method: api_services_1.Endpoints.Vote.method
-        })
-            .then((res) => {
-            if (res.status >= 300) {
-                return Promise.reject(res);
-            }
-            return Promise.resolve(res.data);
-        });
-    }, [obj]);
     /**
      * Handles vote
      * @param comment
      */
-    function handleVote(index, contribution) {
-        setLoadingVote(index);
-        performVote(contribution)
-            .then((data) => {
+    const handleVote = (index) => {
+        return (contribution) => {
             const newObj = Object.assign({}, notificationObject);
             const _notification = Object.assign({}, newObj.aggregated[index]);
-            const _contribution = _notification[contribution.type];
-            _contribution.voted = !_contribution.voted;
-            _contribution.vote_count = _contribution.vote_count - (_contribution.voted ? -1 : 1);
-            _notification[contribution.type] = _contribution;
+            _notification[contribution.type] = contribution;
             newObj.aggregated[index] = _notification;
             setObj(newObj);
-            setLoadingVote(null);
-        })
-            .catch((error) => {
-            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
-        });
-    }
+        };
+    };
     /**
      * Open/close other aggregated activities
      * The layout change -> call onStateChange
@@ -291,14 +182,19 @@ function UserNotification(inProps) {
          */
         if (notificationObject.aggregated && notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.PRIVATE_MESSAGE) {
             let messageNotification = notificationObject.aggregated[0];
-            return (react_1.default.createElement(BaseItem_1.default, { className: classes.notificationHeader, image: react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender) },
-                    react_1.default.createElement(material_1.Avatar, { alt: messageNotification.message.sender.username, variant: "circular", src: messageNotification.message.sender.avatar })), primary: react_1.default.createElement(material_1.Typography, { component: "span", color: "inherit" },
-                    react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender), className: classes.username }, messageNotification.message.sender.username),
+            return (react_1.default.createElement(material_1.CardHeader, { className: classes.header, avatar: react_1.default.createElement(react_core_1.Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
+                    to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
+                }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null }),
+                    react_1.default.createElement(UserAvatar_1.default, { hide: !messageNotification.message.sender.community_badge, smaller: true },
+                        react_1.default.createElement(material_1.Avatar, { className: classes.avatar, alt: messageNotification.message.sender.username, variant: "circular", src: messageNotification.message.sender.avatar }))), titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(react_core_1.Link, Object.assign({}, (!messageNotification.message.sender.deleted && {
+                        to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, messageNotification.message.sender)
+                    }), { onClick: messageNotification.message.sender.deleted ? () => setOpenAlert(true) : null, className: classes.username }), messageNotification.message.sender.username),
                     ' ',
                     intl.formatMessage(messages.receivePrivateMessage, {
                         total: notificationObject.aggregated.length,
                         b: (...chunks) => react_1.default.createElement("strong", null, chunks)
-                    })), disableTypography: true }));
+                    })) }));
         }
         /**
          * Comment, NestedComment, Follow Contribution header
@@ -311,11 +207,8 @@ function UserNotification(inProps) {
                 notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.VOTE_UP ||
                 notificationObject.aggregated[0].type === types_1.SCNotificationTypologyType.CONTRIBUTION)) {
             const contribution = (0, contribution_1.getContribution)(notificationObject);
-            return (react_1.default.createElement("div", { className: classes.notificationHeader }, contribution && contribution.type !== types_1.SCCommentTypologyType && (react_1.default.createElement(material_1.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 },
-                react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(contribution), (0, contribution_1.getRouteData)(notificationObject[contribution.type])) },
-                    react_1.default.createElement(material_1.Typography, { variant: "body2", gutterBottom: true, classes: { root: classes.title } }, (0, contribution_1.getContributionSnippet)(contribution))),
-                contribution && (react_1.default.createElement(material_1.Tooltip, { title: contribution.suspended ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspended', defaultMessage: 'ui.notification.notificationSuspended' })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspend', defaultMessage: 'ui.notification.notificationSuspend' })) },
-                    react_1.default.createElement(LoadingButton_1.default, { variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopNotificationButton }, onClick: () => handleStopContentNotification(contribution) }, contribution.suspended ? (react_1.default.createElement(Icon_1.default, { fontSize: "small", color: 'primary' }, "notifications_off")) : (react_1.default.createElement(Icon_1.default, { fontSize: "small", color: 'inherit' }, "notifications")))))))));
+            return (react_1.default.createElement(material_1.CardHeader, { className: classes.header, titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url((0, contribution_1.getContributionRouteName)(contribution), (0, contribution_1.getRouteData)(notificationObject[contribution.type])) }, (0, contribution_1.getContributionSnippet)(contribution)), action: contribution && (react_1.default.createElement(material_1.Tooltip, { title: contribution.suspended ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspended', defaultMessage: 'ui.notification.notificationSuspended' })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.notificationSuspend', defaultMessage: 'ui.notification.notificationSuspend' })) },
+                    react_1.default.createElement(LoadingButton_1.default, { variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, contribution.suspended ? (react_1.default.createElement(Icon_1.default, { fontSize: "small", color: 'primary' }, "notifications_off")) : (react_1.default.createElement(Icon_1.default, { fontSize: "small", color: 'inherit' }, "notifications"))))) }));
         }
         return null;
     }
@@ -326,7 +219,7 @@ function UserNotification(inProps) {
      */
     function renderAggregatedItem(n, i) {
         if (n.type === types_1.SCNotificationTypologyType.COMMENT || n.type === types_1.SCNotificationTypologyType.NESTED_COMMENT) {
-            return react_1.default.createElement(Comment_1.default, { notificationObject: n, key: i, index: i, onVote: handleVote, loadingVote: loadingVote });
+            return react_1.default.createElement(Comment_1.default, { notificationObject: n, key: i, onVote: handleVote(i) });
         }
         else if (n.type === types_1.SCNotificationTypologyType.FOLLOW) {
             return react_1.default.createElement(ContributionFollow_1.default, { notificationObject: n, key: i });
@@ -383,23 +276,23 @@ function UserNotification(inProps) {
             handleCustomNotification && handleCustomNotification(n);
         }
         else if (n.type === types_1.SCNotificationTypologyType.CONTRIBUTION) {
-            return react_1.default.createElement(Contribution_1.default, { notificationObject: n, key: i, index: i, onVote: handleVote, loadingVote: loadingVote });
+            return react_1.default.createElement(Contribution_1.default, { notificationObject: n, key: i, onVote: handleVote(i) });
         }
         return null;
     }
     /**
      * Renders root object
      */
-    return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
-        react_1.default.createElement(CardContent_1.default, { classes: { root: classes.notificationWrap } },
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
             renderNotificationHeader(),
-            react_1.default.createElement("div", { className: classes.notificationContent },
-                react_1.default.createElement("div", { className: classes.notificationUnCollapsed }, notificationObject.aggregated.slice(0, showMaxAggregated).map((n, i) => renderAggregatedItem(n, i))),
+            react_1.default.createElement(CardContent_1.default, { className: classes.content },
+                react_1.default.createElement("div", { className: classes.unCollapsed }, notificationObject.aggregated.slice(0, showMaxAggregated).map((n, i) => renderAggregatedItem(n, i))),
                 notificationObject.aggregated.length > showMaxAggregated && (react_1.default.createElement(react_1.default.Fragment, null,
                     react_1.default.createElement(material_1.ListItemButton, { onClick: setStateAggregated, classes: { root: classes.showOtherAggregated } },
                         react_1.default.createElement(material_1.ListItemText, { primary: react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.notification.showOthers', defaultMessage: 'ui.notification.showOthers' }) }),
                         openOtherAggregated ? react_1.default.createElement(Icon_1.default, null, "expand_less") : react_1.default.createElement(Icon_1.default, null, "expand_more")),
-                    react_1.default.createElement(material_1.Collapse, { in: openOtherAggregated, timeout: "auto", unmountOnExit: true, classes: { root: classes.notificationCollapsed } }, notificationObject.aggregated.slice(showMaxAggregated).map((n, i) => renderAggregatedItem(n, i)))))))));
+                    react_1.default.createElement(material_1.Collapse, { in: openOtherAggregated, timeout: "auto", unmountOnExit: true, classes: { root: classes.collapsed } }, notificationObject.aggregated.slice(showMaxAggregated).map((n, i) => renderAggregatedItem(n, i))))))),
+        openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
 }
 exports.default = UserNotification;
-//# sourceMappingURL=Notification.js.map

package/lib/cjs/components/Notification/PrivateMessage/PrivateMessage.d.ts

@@ -1,35 +1,15 @@
 import { SCNotificationPrivateMessageType } from '@selfcommunity/types';
-import { SCNotificationObjectTemplateType } from '../../../types';
-export interface NotificationPrivateMessageProps {
-    /**
-     * Id of the feedObject
-     * @default `n_<notificationObject.sid>`
-     */
-    id?: string;
-    /**
-     * Overrides or extends the styles applied to the component.
-     * @default null
-     */
-    className?: string;
+import { NotificationItemProps } from '../../../shared/NotificationItem';
+export interface NotificationPrivateMessageProps extends Pick<NotificationItemProps, Exclude<keyof NotificationItemProps, 'image' | 'disableTypography' | 'primary' | 'primaryTypographyProps' | 'secondary' | 'secondaryTypographyProps' | 'actions' | 'footer' | 'isNew'>> {
     /**
      * Notification obj
      * @default null
      */
     notificationObject: SCNotificationPrivateMessageType;
-    /**
-     * Notification Object template type
-     * @default 'detail'
-     */
-    template?: SCNotificationObjectTemplateType;
-    /**
-     * Any other properties
-     */
-    [p: string]: any;
 }
 /**
  * This component render the content of the notification of type private message
- * @param inProps
  * @constructor
+ * @param props
  */
-export default function PrivateMessageNotification(inProps: NotificationPrivateMessageProps): JSX.Element;
-//# sourceMappingURL=PrivateMessage.d.ts.map
+export default function PrivateMessageNotification(props: NotificationPrivateMessageProps): JSX.Element;