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

package/lib/cjs/components/PrivateMessageThread/PrivateMessageThread.js

@@ -468,20 +468,20 @@ function PrivateMessageThread(inProps) {
         if (loadingMessageObjs) {
             return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
         }
-        return ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ height: '100%', dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: (0, jsx_runtime_1.jsx)(PrivateMessageThreadItem_1.PrivateMessageThreadItemSkeleton, {}) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ ref: messagesEndRef }, { children: Object.keys(formattedMessages).map((key) => ((0, jsx_runtime_1.jsx)("li", Object.assign({ className: classes.section }, { children: (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)(material_1.ListSubheader, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ align: "center", className: classes.subHeader }, { children: key })) }), formattedMessages[key].map((msg) => {
+        return ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { height: '100%', dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: (0, jsx_runtime_1.jsx)(PrivateMessageThreadItem_1.PrivateMessageThreadItemSkeleton, {}), children: (0, jsx_runtime_1.jsx)(material_1.List, { ref: messagesEndRef, children: Object.keys(formattedMessages).map((key) => ((0, jsx_runtime_1.jsx)("li", { className: classes.section, children: (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)(material_1.ListSubheader, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { align: "center", className: classes.subHeader, children: key }) }), formattedMessages[key].map((msg) => {
                                         var _a;
-                                        return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.item }, { children: [msg.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== msg.sender.username && ((0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: msg.sender.username, src: msg.sender.avatar, className: classes.avatar }) })), (0, jsx_runtime_1.jsx)(PrivateMessageThreadItem_1.default, { className: authUserId === msg.sender.id ? classes.sender : classes.receiver, message: msg, mouseEvents: {
+                                        return ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: classes.item, children: [msg.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== msg.sender.username && ((0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: msg.sender.username, src: msg.sender.avatar, className: classes.avatar }) })), (0, jsx_runtime_1.jsx)(PrivateMessageThreadItem_1.default, { className: authUserId === msg.sender.id ? classes.sender : classes.receiver, message: msg, mouseEvents: {
                                                         onMouseEnter: () => handleMouseEnter(msg.id),
                                                         onMouseLeave: () => handleMouseLeave(msg.id)
-                                                    }, isHovering: isHovered[msg.id], showMenuIcon: authUserId === msg.sender.id, onMenuIconClick: () => handleOpenDeleteMessageDialog(msg) }, msg.id)] }), msg.id));
-                                    })] }) }), key))) })) })), (0, jsx_runtime_1.jsx)(PrivateMessageEditor_1.default, { className: classes.editor, send: handleSend, autoHide: type !== types_1.SCPrivateMessageType.GROUP && !(scUser === null || scUser === void 0 ? void 0 : scUser.can_send_pm_to), autoHideDeletion: type === types_1.SCPrivateMessageType.USER && ((receiver === null || receiver === void 0 ? void 0 : receiver.deleted) || (scUser === null || scUser === void 0 ? void 0 : scUser.deleted)), onThreadChangeId: isNumber ? threadObj : type === types_1.SCPrivateMessageType.USER ? threadObj.receiver.id : threadObj.group.id, error: error, onErrorRemove: () => setError(false) }), openDeleteMessageDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openDeleteMessageDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.msg", defaultMessage: "ui.privateMessage.component.delete.message.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.confirm", defaultMessage: "ui.privateMessage.component.delete.message.dialog.confirm" }), onConfirm: handleDeleteMessage, onClose: handleCloseDeleteMessageDialog }))] }));
+                                                    }, isHovering: isHovered[msg.id], showMenuIcon: authUserId === msg.sender.id, onMenuIconClick: () => handleOpenDeleteMessageDialog(msg) }, msg.id)] }, msg.id));
+                                    })] }) }, key))) }) }), (0, jsx_runtime_1.jsx)(PrivateMessageEditor_1.default, { className: classes.editor, send: handleSend, autoHide: type !== types_1.SCPrivateMessageType.GROUP && !(scUser === null || scUser === void 0 ? void 0 : scUser.can_send_pm_to), autoHideDeletion: type === types_1.SCPrivateMessageType.USER && ((receiver === null || receiver === void 0 ? void 0 : receiver.deleted) || (scUser === null || scUser === void 0 ? void 0 : scUser.deleted)), onThreadChangeId: isNumber ? threadObj : type === types_1.SCPrivateMessageType.USER ? threadObj.receiver.id : threadObj.group.id, error: error, onErrorRemove: () => setError(false) }), openDeleteMessageDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openDeleteMessageDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.msg", defaultMessage: "ui.privateMessage.component.delete.message.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.confirm", defaultMessage: "ui.privateMessage.component.delete.message.dialog.confirm" }), onConfirm: handleDeleteMessage, onClose: handleCloseDeleteMessageDialog }))] }));
     }
     /**
      * Renders empty box (when there is no thread open) or new message box
      * @return {JSX.Element}
      */
     function renderNewOrNoMessageBox() {
-        return ((0, jsx_runtime_1.jsx)(material_1.CardContent, { children: isNew || singleMessageThread ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.newMessageHeader }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.newMessageHeaderContent }, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ className: classes.newMessageHeaderIcon }, { children: "person" })), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.privateMessage.thread.newMessage.to", id: "ui.privateMessage.thread.newMessage.to" }) }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { className: classes.autocomplete, loading: loading, multiple: !singleMessageThread, limitTags: 3, freeSolo: true, disableClearable: true, options: followers, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, value: singleMessageThread ? singleMessageUser : recipients, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { placeholder: singleMessageThread ? '...' : `${intl.formatMessage(translMessages.placeholder)}`, variant: "standard", InputProps: Object.assign(Object.assign({}, params.InputProps), { disableUnderline: true }) }))), classes: { popper: classes.autocompleteDialog }, disabled: Boolean(singleMessageUser) })] })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ size: "small", onClick: handleNewMessageClose }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.List, { className: classes.newMessageContent }), (0, jsx_runtime_1.jsx)(PrivateMessageEditor_1.default, { className: classes.editor, send: handleSend, autoHide: !followers, error: error, onErrorRemove: () => setError(false) })] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.emptyMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.thread.emptyBox.message", defaultMessage: "ui.privateMessage.thread.emptyBox.message" }) }))) }));
+        return ((0, jsx_runtime_1.jsx)(material_1.CardContent, { children: isNew || singleMessageThread ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: classes.newMessageHeader, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: classes.newMessageHeaderContent, children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { className: classes.newMessageHeaderIcon, children: "person" }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.privateMessage.thread.newMessage.to", id: "ui.privateMessage.thread.newMessage.to" }) }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { className: classes.autocomplete, loading: loading, multiple: !singleMessageThread, limitTags: 3, freeSolo: true, disableClearable: true, options: followers, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, value: singleMessageThread ? singleMessageUser : recipients, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { placeholder: singleMessageThread ? '...' : `${intl.formatMessage(translMessages.placeholder)}`, variant: "standard", InputProps: Object.assign(Object.assign({}, params.InputProps), { disableUnderline: true }) }))), classes: { popper: classes.autocompleteDialog }, disabled: Boolean(singleMessageUser) })] }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "small", onClick: handleNewMessageClose, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) })] }), (0, jsx_runtime_1.jsx)(material_1.List, { className: classes.newMessageContent }), (0, jsx_runtime_1.jsx)(PrivateMessageEditor_1.default, { className: classes.editor, send: handleSend, autoHide: !followers, error: error, onErrorRemove: () => setError(false) })] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.emptyMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.thread.emptyBox.message", defaultMessage: "ui.privateMessage.thread.emptyBox.message" }) })) }));
     }
     // Anonymous
     if (!authUserId) {
@@ -490,6 +490,6 @@ function PrivateMessageThread(inProps) {
     /**
      * Renders the component
      */
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className) }, { children: threadObj !== null && !isNew && !singleMessageThread ? renderThread() : renderNewOrNoMessageBox() })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className), children: threadObj !== null && !isNew && !singleMessageThread ? renderThread() : renderNewOrNoMessageBox() })));
 }
 exports.default = PrivateMessageThread;

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

@@ -40,6 +40,6 @@ const Root = (0, styles_1.styled)(material_1.Card, {
 function PrivateMessageThreadSkeleton(props) {
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('sm'));
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsxs)(List_1.default, Object.assign({ className: classes.list }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListSubheader, Object.assign({ sx: { display: 'flex', justifyContent: 'center' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 30, width: 120, style: { borderRadius: 20 } }) })), [...Array(isMobile ? 6 : 8)].map((item, index) => ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { index: index }, index)))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.editor }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 55, width: '100%', variant: 'rectangular' }) }))] }) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsxs)(List_1.default, { className: classes.list, children: [(0, jsx_runtime_1.jsx)(material_1.ListSubheader, { sx: { display: 'flex', justifyContent: 'center' }, children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 30, width: 120, style: { borderRadius: 20 } }) }), [...Array(isMobile ? 6 : 8)].map((item, index) => ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { index: index }, index)))] }), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.editor, children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", height: 55, width: '100%', variant: 'rectangular' }) })] }) })));
 }
 exports.default = PrivateMessageThreadSkeleton;

package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js

@@ -127,23 +127,23 @@ function PrivateMessageThreadItem(inProps) {
             return null;
         }
         let section = null;
-        const defaultSection = ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.other }, { children: (0, jsx_runtime_1.jsxs)(material_1.Button, Object.assign({ onClick: () => handleDownload(m.file), startIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "download" }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: m.file.filename }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, sizeCoverter_1.bytesToSize)(m.file.filesize) })] })) })));
+        const defaultSection = ((0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.other, children: (0, jsx_runtime_1.jsxs)(material_1.Button, { onClick: () => handleDownload(m.file), startIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "download" }), children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: m.file.filename }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, sizeCoverter_1.bytesToSize)(m.file.filesize) })] }) }));
         if (m.file) {
             let type = m.file.mimetype;
             switch (true) {
                 case type.startsWith(types_1.SCMessageFileType.IMAGE):
-                    section = ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.img }, { children: (0, jsx_runtime_1.jsx)("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img', onClick: () => setOpenDialog(true) }) })));
+                    section = ((0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.img, children: (0, jsx_runtime_1.jsx)("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img', onClick: () => setOpenDialog(true) }) }));
                     break;
                 case type.startsWith(types_1.SCMessageFileType.VIDEO):
                     if (!(0, thumbnailCoverter_1.isSupportedVideoFormat)(m.file.filename)) {
                         section = defaultSection;
                     }
                     else {
-                        section = ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.img, classes.video) }, { children: [(0, jsx_runtime_1.jsx)("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => setOpenDialog(true) }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "play_circle_outline" }) }))] })));
+                        section = ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: (0, classnames_1.default)(classes.img, classes.video), children: [(0, jsx_runtime_1.jsx)("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => setOpenDialog(true), children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "play_circle_outline" }) })] }));
                     }
                     break;
                 case type.startsWith(types_1.SCMessageFileType.DOCUMENT):
-                    section = ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: m.file.filename.endsWith('.pdf') ? classes.document : classes.other }, { children: [m.file.filename.endsWith('.pdf') && (0, jsx_runtime_1.jsx)("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), (0, jsx_runtime_1.jsxs)(material_1.Button, Object.assign({ onClick: () => handleDownload(m.file), startIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "download" }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: m.file.filename }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, sizeCoverter_1.bytesToSize)(m.file.filesize) })] }))] })));
+                    section = ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: m.file.filename.endsWith('.pdf') ? classes.document : classes.other, children: [m.file.filename.endsWith('.pdf') && (0, jsx_runtime_1.jsx)("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), (0, jsx_runtime_1.jsxs)(material_1.Button, { onClick: () => handleDownload(m.file), startIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "download" }), children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: m.file.filename }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, sizeCoverter_1.bytesToSize)(m.file.filesize) })] })] }));
                     break;
                 default:
                     // section = <Icon>hide_image</Icon>;
@@ -161,11 +161,9 @@ function PrivateMessageThreadItem(inProps) {
      */
     return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, getMouseEvents(mouseEvents.onMouseEnter, mouseEvents.onMouseLeave), rest, { secondaryAction: (isHovering || isMobile) &&
             showMenuIcon &&
-            message.status !== types_1.SCPrivateMessageStatusType.HIDDEN && (0, jsx_runtime_1.jsx)(PrivateMessageSettingsIconButton_1.default, { onMenuItemDeleteClick: handleMenuItemClick }) }, { children: [message.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== message.sender.username && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "secondary", variant: "h4", className: classes.username }, { children: message.sender.username }))), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [hasFile && message.status !== types_1.SCPrivateMessageStatusType.HIDDEN ? (renderMessageFile(message)) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.text }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "span", dangerouslySetInnerHTML: { __html: message.message } }) }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.messageTime, color: "text.secondary" }, { children: `${intl.formatDate(message.created_at, {
+            message.status !== types_1.SCPrivateMessageStatusType.HIDDEN && (0, jsx_runtime_1.jsx)(PrivateMessageSettingsIconButton_1.default, { onMenuItemDeleteClick: handleMenuItemClick }), children: [message.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== message.sender.username && ((0, jsx_runtime_1.jsx)(material_1.Typography, { color: "secondary", variant: "h4", className: classes.username, children: message.sender.username })), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [hasFile && message.status !== types_1.SCPrivateMessageStatusType.HIDDEN ? (renderMessageFile(message)) : ((0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.text, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "span", dangerouslySetInnerHTML: { __html: message.message } }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.messageTime, color: "text.secondary", children: `${intl.formatDate(message.created_at, {
                             hour: 'numeric',
                             minute: 'numeric'
-                        })}` }))] }), openDialog && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (message === null || message === void 0 ? void 0 : message.file.mimetype.startsWith(types_1.SCMessageFileType.VIDEO)) ? ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ open: openDialog, onClose: () => setOpenDialog(false), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsx)(AutoPlayer_1.default, { url: message === null || message === void 0 ? void 0 : message.file.url, width: '100%', enableAutoplay: false }) }))) : ((0, jsx_runtime_1.jsx)(Lightbox_1.default, { images: [{ src: message === null || message === void 0 ? void 0 : message.file.url, key: message.file.uuid }], onClose: () => setOpenDialog(false), toolbarButtons: [
-                        (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => handleDownload(message === null || message === void 0 ? void 0 : message.file), className: classes.downloadButton }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "download" }) }), 'download')
-                    ] })) }))] })));
+                        })}` })] }), openDialog && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (message === null || message === void 0 ? void 0 : message.file.mimetype.startsWith(types_1.SCMessageFileType.VIDEO)) ? ((0, jsx_runtime_1.jsx)(DialogRoot, { open: openDialog, onClose: () => setOpenDialog(false), className: classes.dialogRoot, children: (0, jsx_runtime_1.jsx)(AutoPlayer_1.default, { url: message === null || message === void 0 ? void 0 : message.file.url, width: '100%', enableAutoplay: false }) })) : ((0, jsx_runtime_1.jsx)(Lightbox_1.default, { images: [{ src: message === null || message === void 0 ? void 0 : message.file.url, key: message.file.uuid }], onClose: () => setOpenDialog(false), toolbarButtons: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => handleDownload(message === null || message === void 0 ? void 0 : message.file), className: classes.downloadButton, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "download" }) }, 'download') })) }))] })));
 }
 exports.default = PrivateMessageThreadItem;

package/lib/cjs/components/RelatedEventsWidget/RelatedEventsWidget.js

@@ -121,6 +121,6 @@ function RelatedEventsWidget(inProps) {
     if (!scEvent || (state === null || state === void 0 ? void 0 : state.count) === 0) {
         return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.header }, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, { id: (_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id }), className: classes.avatarWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "rounded", src: scEvent.managed_by.avatar, alt: scEvent.managed_by.username, className: classes.avatar }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4" }, { children: (0, jsx_runtime_1.jsx)("b", { children: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }) }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.eventWrapper }, { children: state === null || state === void 0 ? void 0 : state.results.map((_event, i, array) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ event: _event, eventId: _event.id }, eventComponentProps, { className: classes.event })), i < array.length - 1 && (0, jsx_runtime_1.jsx)(material_1.Divider, {})] }, i))) }))] })), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleToggleDialogOpen, className: classes.actionButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "caption" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedEventsWidget.showAll", defaultMessage: "ui.relatedEventsWidget.showAll" }) })) })) }))), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({ elevation: 0 }, eventComponentProps)), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedEventsWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.map((event) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ elevation: 0, event: event }, eventComponentProps)) }, event.id))) }) })) })))] })));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.CardContent, { className: classes.content, children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.header, children: [(0, jsx_runtime_1.jsx)(material_1.Button, { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, { id: (_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id }), className: classes.avatarWrapper, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "rounded", src: scEvent.managed_by.avatar, alt: scEvent.managed_by.username, className: classes.avatar }) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h4", children: (0, jsx_runtime_1.jsx)("b", { children: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }) }) })] }), (0, jsx_runtime_1.jsx)(material_1.Stack, { className: classes.eventWrapper, children: state === null || state === void 0 ? void 0 : state.results.map((_event, i, array) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ event: _event, eventId: _event.id }, eventComponentProps, { className: classes.event })), i < array.length - 1 && (0, jsx_runtime_1.jsx)(material_1.Divider, {})] }, i))) })] }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.CardActions, { className: classes.actions, children: (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: handleToggleDialogOpen, className: classes.actionButton, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "caption", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedEventsWidget.showAll", defaultMessage: "ui.relatedEventsWidget.showAll" }) }) }) })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({ elevation: 0 }, eventComponentProps)), className: classes.infiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedEventsWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.map((event) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ elevation: 0, event: event }, eventComponentProps)) }, event.id))) }) }) })))] })));
 }
 exports.default = RelatedEventsWidget;

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

@@ -23,6 +23,6 @@ const Root = (0, system_1.styled)(Widget_1.default, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 function RelatedEventsWidgetSkeleton() {
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardContent, Object.assign({ className: classes.content }, { children: (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.eventWrapper }, { children: [1, 2, 3, 4].map((_event, i, array) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, { elevation: 0, className: classes.event }), i < array.length - 1 && (0, jsx_runtime_1.jsx)(material_1.Divider, {})] }, i))) })) })), (0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "52px", height: "20px" }) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(Root, { className: classes.root, children: [(0, jsx_runtime_1.jsx)(material_1.CardContent, { className: classes.content, children: (0, jsx_runtime_1.jsx)(material_1.Stack, { className: classes.eventWrapper, children: [1, 2, 3, 4].map((_event, i, array) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, { elevation: 0, className: classes.event }), i < array.length - 1 && (0, jsx_runtime_1.jsx)(material_1.Divider, {})] }, i))) }) }), (0, jsx_runtime_1.jsx)(material_1.CardActions, { className: classes.actions, children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "52px", height: "20px" }) })] }));
 }
 exports.default = RelatedEventsWidgetSkeleton;

package/lib/cjs/components/RelatedFeedObjectsWidget/RelatedFeedObjectsWidget.js

@@ -199,7 +199,7 @@ function RelatedFeedObjectWidget(inProps) {
         return null;
     };
     const advPosition = Math.floor(Math.random() * (Math.min(state.count, 5) - 1 + 1) + 1);
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedFeedObjectsWidget.title", defaultMessage: "ui.relatedFeedObjectsWidget.title" }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedFeedObjectsWidget.noResults", defaultMessage: "ui.relatedFeedObjectsWidget.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((obj, index) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj, template: template }, FeedObjectProps)) }, obj.id), advPosition === index && renderAdvertising()] }, index))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.button.showAll", defaultMessage: "ui.categoryTrendingFeedWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryTrendingFeedWidget.title", id: "ui.categoryTrendingFeedWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(FeedObject_1.FeedObjectSkeleton, Object.assign({ elevation: 0 }, FeedObjectProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noMoreResults", defaultMessage: "ui.categoryTrendingFeedWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((obj) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj }, FeedObjectProps)) }, obj.id))) }) })) })))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedFeedObjectsWidget.title", defaultMessage: "ui.relatedFeedObjectsWidget.title" }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.relatedFeedObjectsWidget.noResults", defaultMessage: "ui.relatedFeedObjectsWidget.noResults" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((obj, index) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj, template: template }, FeedObjectProps)) }, obj.id), advPosition === index && renderAdvertising()] }, index))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.button.showAll", defaultMessage: "ui.categoryTrendingFeedWidget.button.showAll" }) }))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryTrendingFeedWidget.title", id: "ui.categoryTrendingFeedWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(FeedObject_1.FeedObjectSkeleton, Object.assign({ elevation: 0 }, FeedObjectProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noMoreResults", defaultMessage: "ui.categoryTrendingFeedWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((obj) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj }, FeedObjectProps)) }, obj.id))) }) }) })))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = RelatedFeedObjectWidget;

package/lib/cjs/components/SearchAutocomplete/SearchAutocomplete.js

@@ -127,8 +127,8 @@ function SearchAutocomplete(inProps) {
                 return option;
             }
             return optionLabel(option);
-        }, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ component: "li" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ ml: 1 }, { children: getOptionData(option).name }))] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
+        }, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ component: "li" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }), (0, jsx_runtime_1.jsx)(material_1.Typography, { ml: 1, children: getOptionData(option).name })] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
                 community: scPreferences.preferences[react_core_1.SCPreferences.TEXT_APPLICATION_NAME].value
-            })}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { autoFocus, name: 'search-autocomplete', className: classes.input, startAdornment: (0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ className: classes.icon }, { children: "search" })), endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Fade, Object.assign({ in: value.length > 0 || Boolean(onClear), appear: false }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.clear, onClick: handleClear, size: "small" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) })) }))) }) }))) }, rest)));
+            })}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { autoFocus, name: 'search-autocomplete', className: classes.input, startAdornment: (0, jsx_runtime_1.jsx)(Icon_1.default, { className: classes.icon, children: "search" }), endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Fade, { in: value.length > 0 || Boolean(onClear), appear: false, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { className: classes.clear, onClick: handleClear, size: "small", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }) })) }) }))) }, rest)));
 }
 exports.default = SearchAutocomplete;

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

@@ -41,6 +41,6 @@ const Root = (0, styles_1.styled)(material_1.List, {
 function SnippetNotificationSkeleton(props) {
     const theme = (0, material_1.useTheme)();
     const notificationSkeleton = ((0, jsx_runtime_1.jsx)(NotificationItem_1.default, { className: classes.item, template: notification_1.SCNotificationObjectTemplateType.SNIPPET, image: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeSmall, height: theme.selfcommunity.user.avatar.sizeSmall }), primary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }) }));
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: [...Array(7)].map((x, i) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, Object.assign({ className: classes.item }, { children: notificationSkeleton }), i))) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: [...Array(7)].map((x, i) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { className: classes.item, children: notificationSkeleton }, i))) })));
 }
 exports.default = SnippetNotificationSkeleton;

package/lib/cjs/components/SnippetNotifications/SnippetNotifications.js

@@ -278,10 +278,10 @@ function SnippetNotifications(inProps) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.notificationsWrap }, { children: !initialized || loading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: 0 })) : ((0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsxs)(material_1.MenuList, Object.assign({ className: classes.list, disabledItemsFocusable: true, disableListWrap: true }, { children: [scUserContext.user.unseen_notification_banners_counter ? ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ className: (0, classnames_1.default)(classes.item, classes.broadcastMessagesBanner), component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: (0, jsx_runtime_1.jsx)(NotificationItem_1.default, { template: types_1.SCNotificationObjectTemplateType.SNIPPET, isNew: true, disableTypography: true, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: preferences[react_core_1.SCPreferences.TEXT_APPLICATION_NAME], src: preferences[react_core_1.SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), primary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div' }, { children: intl.formatMessage({ id: 'ui.snippetNotifications.broadcastMessages', defaultMessage: 'ui.snippetNotifications.broadcastMessages' }, {
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.notificationsWrap, children: !initialized || loading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: 0 })) : ((0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsxs)(material_1.MenuList, { className: classes.list, disabledItemsFocusable: true, disableListWrap: true, children: [scUserContext.user.unseen_notification_banners_counter ? ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { className: (0, classnames_1.default)(classes.item, classes.broadcastMessagesBanner), component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), children: (0, jsx_runtime_1.jsx)(NotificationItem_1.default, { template: types_1.SCNotificationObjectTemplateType.SNIPPET, isNew: true, disableTypography: true, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: preferences[react_core_1.SCPreferences.TEXT_APPLICATION_NAME], src: preferences[react_core_1.SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), primary: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: 'div', children: intl.formatMessage({ id: 'ui.snippetNotifications.broadcastMessages', defaultMessage: 'ui.snippetNotifications.broadcastMessages' }, {
                                         count: scUserContext.user.unseen_notification_banners_counter,
                                         b: (...chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }),
-                                        link: (...chunks) => (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: chunks }))
-                                    }) })) }) }), "banner")) : null, notifications.length === 0 ? ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ className: classes.emptyBoxNotifications }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.snippetNotifications.noNotifications", defaultMessage: "ui.snippetNotifications.noNotifications" }) }))) : (notifications.slice(0, showMax).map((notificationObject, i) => notificationObject.aggregated.map((n, k) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: (e) => handleSingleNotificationClick(e, n), disableRipple: true, disableTouchRipple: true }, { children: renderAggregatedItem(n, i) }), k)))))] })) }))) })) })));
+                                        link: (...chunks) => (0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), children: chunks })
+                                    }) }) }) }, "banner")) : null, notifications.length === 0 ? ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { className: classes.emptyBoxNotifications, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.snippetNotifications.noNotifications", defaultMessage: "ui.snippetNotifications.noNotifications" }) })) : (notifications.slice(0, showMax).map((notificationObject, i) => notificationObject.aggregated.map((n, k) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { className: classes.item, onClick: (e) => handleSingleNotificationClick(e, n), disableRipple: true, disableTouchRipple: true, children: renderAggregatedItem(n, i) }, k)))))] }) }))) }) })));
 }
 exports.default = SnippetNotifications;

package/lib/cjs/components/SuggestedEventsWidget/Arrow.js

@@ -23,8 +23,8 @@ function Arrow(props) {
         setCurrentItem(swiper.snapIndex);
     }, [type]);
     if (type === 'prev') {
-        return (currentItem > 0 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('prev') }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_left" }) }))));
+        return (currentItem > 0 && ((0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", className: className, size: "medium", onClick: () => handleChange('prev'), children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_left" }) })));
     }
-    return (currentItem < itemsLength - 1 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('next') }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_right" }) }))));
+    return (currentItem < itemsLength - 1 && ((0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", className: className, size: "medium", onClick: () => handleChange('next'), children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_right" }) })));
 }
 exports.default = Arrow;

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

@@ -23,6 +23,6 @@ const Root = (0, system_1.styled)(Widget_1.default, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 function SuggestedEventsWidgetSkeleton() {
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { className: classes.title, animation: "wave", width: "141px", height: "23px" }), (0, jsx_runtime_1.jsx)(react_1.Swiper, Object.assign({ spaceBetween: 8, slidesPerView: "auto" }, { children: [1, 2, 3, 4, 5, 6, 7].map((_element, i) => ((0, jsx_runtime_1.jsx)(react_1.SwiperSlide, Object.assign({ className: classes.swiperSlide }, { children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, { template: event_1.SCEventTemplateType.PREVIEW, variant: "outlined", actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) }) }), i))) }))] })), (0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "52px", height: "20px" }) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(Root, { className: classes.root, children: [(0, jsx_runtime_1.jsxs)(material_1.CardContent, { className: classes.content, children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { className: classes.title, animation: "wave", width: "141px", height: "23px" }), (0, jsx_runtime_1.jsx)(react_1.Swiper, { spaceBetween: 8, slidesPerView: "auto", children: [1, 2, 3, 4, 5, 6, 7].map((_element, i) => ((0, jsx_runtime_1.jsx)(react_1.SwiperSlide, { className: classes.swiperSlide, children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, { template: event_1.SCEventTemplateType.PREVIEW, variant: "outlined", actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) }) }, i))) })] }), (0, jsx_runtime_1.jsx)(material_1.CardActions, { className: classes.actions, children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", width: "52px", height: "20px" }) })] }));
 }
 exports.default = SuggestedEventsWidgetSkeleton;

package/lib/cjs/components/SuggestedEventsWidget/SuggestedEventsWidget.js

@@ -139,9 +139,9 @@ function SuggestedEventsWidget(inProps) {
     if (!events || count === 0) {
         return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.title }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.suggestedEventsWidget.title", defaultMessage: "ui.suggestedEventsWidget.title" }) })), (0, jsx_runtime_1.jsxs)(react_2.Swiper, Object.assign({ spaceBetween: 8, slidesPerView: "auto", grabCursor: true, onReachBeginning: handleReachBeginning, onReachEnd: handleReachEnd, onSlideChange: handleChange, className: classes.swiper, style: {
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.CardContent, { className: classes.content, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", className: classes.title, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.suggestedEventsWidget.title", defaultMessage: "ui.suggestedEventsWidget.title" }) }), (0, jsx_runtime_1.jsxs)(react_2.Swiper, { spaceBetween: 8, slidesPerView: "auto", grabCursor: true, onReachBeginning: handleReachBeginning, onReachEnd: handleReachEnd, onSlideChange: handleChange, className: classes.swiper, style: {
                             marginLeft: hideMarginLeft ? `-${theme.spacing(2)}` : 0,
                             marginRight: hideMarginRight ? `-${theme.spacing(2)}` : 0
-                        } }, { children: [(showSkeleton ? [...events, undefined] : events).map((event, i) => ((0, jsx_runtime_1.jsx)(react_2.SwiperSlide, Object.assign({ className: classes.swiperSlide }, { children: (0, jsx_runtime_1.jsx)(Event_1.default, { event: event, template: event_1.SCEventTemplateType.PREVIEW, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}), variant: "outlined", className: classes.event }) }), i))), (0, jsx_runtime_1.jsx)(Arrow_1.default, { className: (0, classnames_1.default)(classes.swiperArrow, classes.swiperPrevArrow), type: "prev", currentItem: currentItem, setCurrentItem: setCurrentItem }), (0, jsx_runtime_1.jsx)(Arrow_1.default, { className: (0, classnames_1.default)(classes.swiperArrow, classes.swiperNextArrow), type: "next", currentItem: currentItem, setCurrentItem: setCurrentItem })] }))] })), (0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_SUGGESTED_ROUTE_NAME, {}), className: classes.actionButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "caption" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.suggestedEventsWidget.showAll", defaultMessage: "ui.suggestedEventsWidget.showAll" }) })) })) }))] })));
+                        }, children: [(showSkeleton ? [...events, undefined] : events).map((event, i) => ((0, jsx_runtime_1.jsx)(react_2.SwiperSlide, { className: classes.swiperSlide, children: (0, jsx_runtime_1.jsx)(Event_1.default, { event: event, template: event_1.SCEventTemplateType.PREVIEW, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}), variant: "outlined", className: classes.event }) }, i))), (0, jsx_runtime_1.jsx)(Arrow_1.default, { className: (0, classnames_1.default)(classes.swiperArrow, classes.swiperPrevArrow), type: "prev", currentItem: currentItem, setCurrentItem: setCurrentItem }), (0, jsx_runtime_1.jsx)(Arrow_1.default, { className: (0, classnames_1.default)(classes.swiperArrow, classes.swiperNextArrow), type: "next", currentItem: currentItem, setCurrentItem: setCurrentItem })] })] }), (0, jsx_runtime_1.jsx)(material_1.CardActions, { className: classes.actions, children: (0, jsx_runtime_1.jsx)(material_1.Button, { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_SUGGESTED_ROUTE_NAME, {}), className: classes.actionButton, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "caption", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.suggestedEventsWidget.showAll", defaultMessage: "ui.suggestedEventsWidget.showAll" }) }) }) })] })));
 }
 exports.default = SuggestedEventsWidget;

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

@@ -36,6 +36,6 @@ const Root = (0, styles_1.styled)(BaseItem_1.default, {
  */
 function UserSkeleton(props) {
     const theme = (0, material_1.useTheme)();
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { image: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), primary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }), actions: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) })) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { image: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), primary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }), actions: (0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "outlined", disabled: true, children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) }) })));
 }
 exports.default = UserSkeleton;

package/lib/cjs/components/User/User.js

@@ -89,7 +89,7 @@ function User(inProps) {
      * @return {JSX.Element}
      */
     function renderAuthenticatedActions() {
-        return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [handleIgnoreAction && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", onClick: handleIgnoreAction }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.user.ignore", id: "ui.user.ignore" }) }))), (0, jsx_runtime_1.jsx)(ConnectionUserButton_1.default, Object.assign({ user: scUser }, followConnectUserButtonProps))] }));
+        return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [handleIgnoreAction && ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", onClick: handleIgnoreAction, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.user.ignore", id: "ui.user.ignore" }) })), (0, jsx_runtime_1.jsx)(ConnectionUserButton_1.default, Object.assign({ user: scUser }, followConnectUserButtonProps))] }));
     }
     /**
      * Renders user object
@@ -102,6 +102,6 @@ function User(inProps) {
      */
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ elevation: elevation }, rest, { className: (0, classnames_1.default)(classes.root, className), ButtonBaseProps: buttonProps !== null && buttonProps !== void 0 ? buttonProps : (scUser.deleted
                     ? { onClick: () => setOpenAlert(true) }
-                    : { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? ((0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))) : ((0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !hasBadge }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))), primary: (hasBadge && preferences) || isGroupAdmin ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [scUser.username, (0, jsx_runtime_1.jsx)(material_1.Chip, { component: "span", className: isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel, size: "small", label: isGroupAdmin ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL]) })] })) : (scUser.username), secondary: secondary || (showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description), actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                    : { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? ((0, jsx_runtime_1.jsx)(material_1.Badge, { overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) })) : ((0, jsx_runtime_1.jsx)(UserAvatar_1.default, { hide: !hasBadge, children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) })), primary: (hasBadge && preferences) || isGroupAdmin ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [scUser.username, (0, jsx_runtime_1.jsx)(material_1.Chip, { component: "span", className: isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel, size: "small", label: isGroupAdmin ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL]) })] })) : (scUser.username), secondary: secondary || (showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description), actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = User;

package/lib/cjs/components/UserActionIconButton/UserActionIconButton.js

@@ -131,17 +131,17 @@ function UserActionIconButton(inProps) {
     const renderList = () => {
         if (isMobile) {
             return [
-                ...items.map((item, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: item.to }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: item.label }) })) }, index))),
-                (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ onClick: handleInfoOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }) })) }, "info"),
+                ...items.map((item, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, { component: react_core_1.Link, to: item.to, children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: item.label }) }) }, index))),
+                (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, { onClick: handleInfoOpen, children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }) }) }, "info"),
                 ...(isMe
                     ? []
                     : [
                         (0, jsx_runtime_1.jsx)(material_1.Divider, {}, "divider"),
-                        (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ onClick: handleHideToggle, disabled: isHiddenLoading || scUser.community_badge || (!hidden && react_core_1.UserUtils.isStaff(scUser)) }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }) })) }, "hide"),
+                        (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, { onClick: handleHideToggle, disabled: isHiddenLoading || scUser.community_badge || (!hidden && react_core_1.UserUtils.isStaff(scUser)), children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }) }) }, "hide"),
                         ...(canModerate
                             ? [
                                 (0, jsx_runtime_1.jsx)(material_1.Divider, {}, "divider_moderate"),
-                                (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, Object.assign({ component: react_core_1.Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}` }, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }) })) }, "moderate")
+                                (0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(material_1.ListItemButton, { component: react_core_1.Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}`, children: (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }) }) }, "moderate")
                             ]
                             : [])
                     ])
@@ -149,23 +149,23 @@ function UserActionIconButton(inProps) {
         }
         else {
             return [
-                ...items.map((item, index) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: item.to, onClick: handleClose }, { children: item.label }), index))),
-                (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleInfoOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }), "info"),
+                ...items.map((item, index) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { component: react_core_1.Link, to: item.to, onClick: handleClose, children: item.label }, index))),
+                (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: handleInfoOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }, "info"),
                 ...(isMe
                     ? []
                     : [
                         (0, jsx_runtime_1.jsx)(material_1.Divider, {}, "divider"),
-                        (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleHide, disabled: isHiddenLoading || scUser.community_badge }, { children: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }), "hide"),
+                        (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: handleHide, disabled: isHiddenLoading || scUser.community_badge, children: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }, "hide"),
                         ...(canModerate
                             ? [
                                 (0, jsx_runtime_1.jsx)(material_1.Divider, {}, "divider_moderate"),
-                                (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}`, onClick: handleClose }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }), "moderate")
+                                (0, jsx_runtime_1.jsx)(material_1.MenuItem, { component: react_core_1.Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}`, onClick: handleClose, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }, "moderate")
                             ]
                             : [])
                     ])
             ];
         }
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose }, { children: renderList() }))), (0, jsx_runtime_1.jsx)(UserInfoDialog_1.default, { userId: userId, user: scUser, open: infoOpen, onClose: handleInfoClose }), openHideDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openHideDialog, isUpdating: isHiddenLoading, TransitionComponent: Transition, keepMounted: true, title: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })), content: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogShowAction", id: "ui.userActionIconButton.dialogShowAction" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogHideAction", id: "ui.userActionIconButton.dialogHideAction" })), onConfirm: handleHideToggle, onClose: () => setOpenHideDialog(false) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { onClick: handleOpen, children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, { className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, disableSwipeToOpen: true, children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) })) : ((0, jsx_runtime_1.jsx)(MenuRoot, { className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, children: renderList() })), (0, jsx_runtime_1.jsx)(UserInfoDialog_1.default, { userId: userId, user: scUser, open: infoOpen, onClose: handleInfoClose }), openHideDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openHideDialog, isUpdating: isHiddenLoading, TransitionComponent: Transition, keepMounted: true, title: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })), content: hidden ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogShowAction", id: "ui.userActionIconButton.dialogShowAction" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogHideAction", id: "ui.userActionIconButton.dialogHideAction" })), onConfirm: handleHideToggle, onClose: () => setOpenHideDialog(false) }))] }));
 }
 exports.default = UserActionIconButton;

package/lib/cjs/components/UserConnectionsRequestsSentWidget/UserConnectionsRequestsSentWidget.js

@@ -175,7 +175,7 @@ function UserConnectionsRequestsSentWidget(inProps) {
     if (!state.initialized) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.title", defaultMessage: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.subtitle.noResults", defaultMessage: "" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsSentWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsSentWidget.title", id: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsSentWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }) })) })))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.title", defaultMessage: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.subtitle.noResults", defaultMessage: "" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsSentWidget.button.showAll" }) }))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsSentWidget.title", id: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsSentWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }) }) })))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserConnectionsRequestsSentWidget;

package/lib/cjs/components/UserConnectionsRequestsWidget/UserConnectionsRequestsWidget.js

@@ -175,7 +175,7 @@ function UserConnectionsRequestsWidget(inProps) {
     if (!state.initialized) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.title", defaultMessage: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.subtitle.noResults", defaultMessage: "" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsWidget.title", id: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }) })) })))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.title", defaultMessage: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.subtitle.noResults", defaultMessage: "" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsWidget.button.showAll" }) }))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsWidget.title", id: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsRequestsWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((conReq) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }) }) })))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserConnectionsRequestsWidget;

package/lib/cjs/components/UserConnectionsWidget/UserConnectionsWidget.js

@@ -177,7 +177,7 @@ function UserConnectionsWidget(inProps) {
     if (!state.initialized) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.title", defaultMessage: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.subtitle.noResults", defaultMessage: "" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.button.showAll", defaultMessage: "ui.userConnectionsWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userConnectionsWidget.title", id: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.noMoreResults", defaultMessage: "ui.userConnectionsWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }) })) })))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.title", defaultMessage: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.subtitle.noResults", defaultMessage: "" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.button.showAll", defaultMessage: "ui.userConnectionsWidget.button.showAll" }) }))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userConnectionsWidget.title", id: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userConnectionsWidget.noMoreResults", defaultMessage: "ui.userConnectionsWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }) }) })))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserConnectionsWidget;

package/lib/cjs/components/UserCounters/UserCounters.js

@@ -88,26 +88,26 @@ function UserCounters(inProps) {
     if (scUserContext.user === undefined || !scUser) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [followEnabled ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUser) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.followings", defaultMessage: "ui.userCounters.followings", values: {
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [followEnabled ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUser), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.followings", defaultMessage: "ui.userCounters.followings", values: {
                                 count: scUser === null || scUser === void 0 ? void 0 : scUser.followings_counter,
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
                                 b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                            } }) })), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUser) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.followers", defaultMessage: "ui.userCounters.followers", values: {
+                            } }) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUser), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.followers", defaultMessage: "ui.userCounters.followers", values: {
                                 count: scUser === null || scUser === void 0 ? void 0 : scUser.followers_counter,
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
                                 b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                            } }) }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUser) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.connections", defaultMessage: "ui.userCounters.connections", values: {
+                            } }) })] })) : ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUser), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.connections", defaultMessage: "ui.userCounters.connections", values: {
                         count: scUser === null || scUser === void 0 ? void 0 : scUser.connections_counter,
                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                         // @ts-ignore
                         b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                    } }) }))), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_CATEGORIES_ROUTE_NAME, scUser) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.categories", defaultMessage: "ui.userCounters.categories", values: {
+                    } }) })), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.button, variant: "text", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_CATEGORIES_ROUTE_NAME, scUser), children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userCounters.categories", defaultMessage: "ui.userCounters.categories", values: {
                         count: scUser === null || scUser === void 0 ? void 0 : scUser.categories_counter,
                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                         // @ts-ignore
                         b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                    } }) }))] })));
+                    } }) })] })));
 }
 exports.default = UserCounters;

package/lib/cjs/components/UserFollowedCategoriesWidget/UserFollowedCategoriesWidget.js

@@ -159,7 +159,7 @@ function UserFollowedCategoriesWidget(inProps) {
     if (!state.initialized) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: isMe ? state.results.filter((c) => c.followed).length : state.count } }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.subtitle.noResults", defaultMessage: "ui.userFollowedCategoriesWidget.subtitle.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, limit).map((category) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, category.id))) }), limit < state.count && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.button.showAll", defaultMessage: "ui.userFollowedCategoriesWidget.button.showAll" }) }))), openDialog && ((0, jsx_runtime_1.jsxs)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps, { children: [(0, jsx_runtime_1.jsxs)(List_1.default, { children: [state.results.map((c) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: c, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, c.id))), state.isLoadingNext && ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)) }))] }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.noMoreResults", defaultMessage: "ui.userFollowedCategoriesWidget.noMoreResults" }) }))] })))] }))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: isMe ? state.results.filter((c) => c.followed).length : state.count } }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.subtitle.noResults", defaultMessage: "ui.userFollowedCategoriesWidget.subtitle.noResults" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, limit).map((category) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, category.id))) }), limit < state.count && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.button.showAll", defaultMessage: "ui.userFollowedCategoriesWidget.button.showAll" }) })), openDialog && ((0, jsx_runtime_1.jsxs)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps, { children: [(0, jsx_runtime_1.jsxs)(List_1.default, { children: [state.results.map((c) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: c, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, c.id))), state.isLoadingNext && ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)) }))] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedCategoriesWidget.noMoreResults", defaultMessage: "ui.userFollowedCategoriesWidget.noMoreResults" }) })] })))] }))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserFollowedCategoriesWidget;

package/lib/cjs/components/UserFollowedUsersWidget/UserFollowedUsersWidget.js

@@ -185,7 +185,7 @@ function UserFollowedUsersWidget(inProps) {
     if (!state.initialized) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.title", defaultMessage: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_counter } }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.subtitle.noResults", defaultMessage: "" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.button.showAll", defaultMessage: "ui.userFollowedUsersWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userFollowedUsersWidget.title", id: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.noMoreResults", defaultMessage: "ui.userFollowedUsersWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) })) })))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.title", defaultMessage: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_counter } }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.subtitle.noResults", defaultMessage: "" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.button.showAll", defaultMessage: "ui.userFollowedUsersWidget.button.showAll" }) }))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userFollowedUsersWidget.title", id: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowedUsersWidget.noMoreResults", defaultMessage: "ui.userFollowedUsersWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) }) })))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserFollowedUsersWidget;

package/lib/cjs/components/UserFollowersWidget/UserFollowersWidget.js

@@ -183,7 +183,7 @@ function UserFollowersWidget(inProps) {
     if (!state.initialized) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.title", defaultMessage: "ui.userFollowersWidget.title", values: { total: scUser.followers_counter } }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.subtitle.noResults", defaultMessage: "" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.button.showAll", defaultMessage: "ui.userFollowersWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userFollowersWidget.title", id: "ui.userFollowersWidget.title", values: { total: scUser.followers_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.noMoreResults", defaultMessage: "ui.userFollowersWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) })) })))] }));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.title, variant: "h5", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.title", defaultMessage: "ui.userFollowersWidget.title", values: { total: scUser.followers_counter } }) }), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.noResults, variant: "body2", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.subtitle.noResults", defaultMessage: "" }) })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.button.showAll", defaultMessage: "ui.userFollowersWidget.button.showAll" }) }))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.userFollowersWidget.title", id: "ui.userFollowersWidget.title", values: { total: scUser.followers_counter } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.endMessage, children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userFollowersWidget.noMoreResults", defaultMessage: "ui.userFollowersWidget.noMoreResults" }) }), children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) }) })))] }));
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserFollowersWidget;

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

@@ -35,6 +35,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  *
  */
 function UserProfileInfoSkeleton() {
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: Array.from({ length: 3 }).map((v, i) => ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.field }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '50%' } }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '80%' } }) }))] }), i))) })));
+    return ((0, jsx_runtime_1.jsx)(Root, { className: classes.root, children: Array.from({ length: 3 }).map((v, i) => ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: classes.field, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '50%' } }) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '80%' } }) })] }, i))) }));
 }
 exports.default = UserProfileInfoSkeleton;