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

package/lib/cjs/shared/ContributionActionsMenu/index.js

@@ -651,7 +651,7 @@ function ContributionActionsMenu(props) {
                 : handleDeleteContribution;
         let value = section === ContributionsActionsMenu_1.FLAG_CONTRIBUTION_SECTION ? flagType : section === ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION ? hideType : deleteType;
         return Flagging_1.REPORTS.map((report, index) => {
-            return ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, Object.assign({ classes: { root: classes.selectedIcon } }, { children: value === report && (0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ color: "secondary" }, { children: "check" })) })), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: getReportName(report), onClick: () => handlerFunc(report), classes: { root: classes.subItemText } })] }), `${section}_${index}`));
+            return ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { classes: { root: classes.selectedIcon }, children: value === report && (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "secondary", children: "check" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: getReportName(report), onClick: () => handlerFunc(report), classes: { root: classes.subItemText } })] }, `${section}_${index}`));
         });
     }
     /**
@@ -659,21 +659,21 @@ function ContributionActionsMenu(props) {
      */
     function renderFlagContributionSection() {
         const open = openSection === ContributionsActionsMenu_1.FLAG_CONTRIBUTION_SECTION;
-        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: !contributionObj.deleted && !contributionObj.collapsed && ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging, onClick: () => handleOpenSection(ContributionsActionsMenu_1.FLAG_CONTRIBUTION_SECTION) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: flagType !== undefined && flagType !== null ? ((0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ classes: { badge: classes.sectionBadge }, badgeContent: (0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ className: classes.sectionWithSelectionIcon }, { children: "check" })), color: "primary" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" }) }))) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.flagContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.flagContributionWithMotivation" }) }), open ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] })), (0, jsx_runtime_1.jsxs)(material_1.Collapse, Object.assign({ in: open, timeout: "auto", unmountOnExit: true }, { children: [renderReports(ContributionsActionsMenu_1.FLAG_CONTRIBUTION_SECTION), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'caption', component: "div", className: classes.footerSubItems }, { children: intl.formatMessage(messages.footer) }))] }))] })) }));
+        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: !contributionObj.deleted && !contributionObj.collapsed && ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, onClick: () => handleOpenSection(ContributionsActionsMenu_1.FLAG_CONTRIBUTION_SECTION), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: flagType !== undefined && flagType !== null ? ((0, jsx_runtime_1.jsx)(material_1.Badge, { classes: { badge: classes.sectionBadge }, badgeContent: (0, jsx_runtime_1.jsx)(Icon_1.default, { className: classes.sectionWithSelectionIcon, children: "check" }), color: "primary", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" }) })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "outlined_flag" })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.flagContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.flagContributionWithMotivation" }) }), open ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] }), (0, jsx_runtime_1.jsxs)(material_1.Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: [renderReports(ContributionsActionsMenu_1.FLAG_CONTRIBUTION_SECTION), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: 'caption', component: "div", className: classes.footerSubItems, children: intl.formatMessage(messages.footer) })] })] })) }));
     }
     /**
      * Renders section hide actions
      */
     function renderHideContributionSection() {
         const open = openSection === ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION;
-        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: !contributionObj.deleted && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: hideType !== undefined && hideType !== null ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleAction(ContributionsActionsMenu_1.MODERATE_CONTRIBUTION_HIDDEN) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "restore" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.restoreFromHidden", defaultMessage: "ui.contributionActionMenu.restoreFromHidden" }), ' ', "(", getReportName(hideType), ")"] }) })] })) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleOpenSection(ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "hide_image" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.hideContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.hideContributionWithMotivation" }) }), open ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] })), (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: open, timeout: "auto", unmountOnExit: true }, { children: renderReports(ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION) }))] })) })) }, ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION));
+        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: !contributionObj.deleted && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: hideType !== undefined && hideType !== null ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleAction(ContributionsActionsMenu_1.MODERATE_CONTRIBUTION_HIDDEN), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "restore" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.restoreFromHidden", defaultMessage: "ui.contributionActionMenu.restoreFromHidden" }), ' ', "(", getReportName(hideType), ")"] }) })] }) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleOpenSection(ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "hide_image" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.hideContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.hideContributionWithMotivation" }) }), open ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] }), (0, jsx_runtime_1.jsx)(material_1.Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: renderReports(ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION) })] })) })) }, ContributionsActionsMenu_1.HIDE_CONTRIBUTION_SECTION));
     }
     /**
      * Renders section hidden actions
      */
     function renderDeleteContributionSection() {
         const open = openSection === ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION;
-        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: !contributionObj.collapsed && !(contributionObj.deleted && !deleteType) && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: deleteType !== undefined && deleteType !== null ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleAction(ContributionsActionsMenu_1.MODERATE_CONTRIBUTION_DELETED) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "restore_from_trash" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.restoreFromDeleted", defaultMessage: "ui.contributionActionMenu.restoreFromDeleted" }), ' ', "(", getReportName(deleteType), ")"] }) })] })) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleOpenSection(ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.deleteContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.deleteContributionWithMotivation" }) }), open ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] })), (0, jsx_runtime_1.jsx)(material_1.Collapse, Object.assign({ in: open, timeout: "auto", unmountOnExit: true }, { children: renderReports(ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION) }))] })) })) }, ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION));
+        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: !contributionObj.collapsed && !(contributionObj.deleted && !deleteType) && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: deleteType !== undefined && deleteType !== null ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleAction(ContributionsActionsMenu_1.MODERATE_CONTRIBUTION_DELETED), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "restore_from_trash" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.restoreFromDeleted", defaultMessage: "ui.contributionActionMenu.restoreFromDeleted" }), ' ', "(", getReportName(deleteType), ")"] }) })] }) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: Boolean(currentAction), onClick: () => handleOpenSection(ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.deleteContributionWithMotivation", defaultMessage: "ui.contributionActionMenu.deleteContributionWithMotivation" }) }), open ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_less" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] }), (0, jsx_runtime_1.jsx)(material_1.Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: renderReports(ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION) })] })) })) }, ContributionsActionsMenu_1.DELETE_CONTRIBUTION_SECTION));
     }
     /**
      * Can authenticated user modify the contribution
@@ -711,7 +711,7 @@ function ContributionActionsMenu(props) {
      * Renders section general
      */
     function renderGeneralSection() {
-        return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "link" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.permanentLink", defaultMessage: "ui.contributionActionMenu.permanentLink" }), onClick: () => handleAction(ContributionsActionsMenu_1.GET_CONTRIBUTION_PERMALINK), classes: { root: classes.itemText } })] })), canModifyContribution() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "edit" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.editContribution", defaultMessage: "ui.contributionActionMenu.editContribution" }), onClick: () => handleAction(ContributionsActionsMenu_1.EDIT_CONTRIBUTION), classes: { root: classes.itemText } })] }))), canDeleteContribution() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: currentActionLoading === ContributionsActionsMenu_1.DELETE_CONTRIBUTION || currentActionLoading === ContributionsActionsMenu_1.RESTORE_CONTRIBUTION ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20 })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" })) }), contributionObj.deleted ? ((0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.restoreContribution", defaultMessage: "ui.contributionActionMenu.restoreContribution" }), onClick: () => handleAction(ContributionsActionsMenu_1.RESTORE_CONTRIBUTION), classes: { root: classes.itemText } })) : ((0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.deleteContribution", defaultMessage: "ui.contributionActionMenu.deleteContribution" }), onClick: () => handleAction(ContributionsActionsMenu_1.DELETE_CONTRIBUTION), classes: { root: classes.itemText } }))] }))), canSuspendNotificationContribution() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: currentActionLoading === ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_CONTRIBUTION ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20 })) : contributionObj['suspended'] ? ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_active" })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_off" })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: contributionObj['suspended'] ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.enableNotificationContribution", defaultMessage: "ui.contributionActionMenu.enableNotificationContribution" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.suspendNotificationContribution", defaultMessage: "ui.contributionActionMenu.suspendNotificationContribution" })), onClick: () => handleAction(ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_CONTRIBUTION), classes: { root: classes.itemText } })] }))), canSuspendNotificationEvent() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.subItem, disabled: isFlagging }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: currentActionLoading === ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_EVENT ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20 })) : contributionObj.event['show_on_feed'] ? ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_active" })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_off" })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: !contributionObj.event['show_on_feed'] ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.enableNotificationContribution", defaultMessage: "ui.contributionActionMenu.enableNotificationContribution" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.suspendNotificationContribution", defaultMessage: "ui.contributionActionMenu.suspendNotificationContribution" })), onClick: () => handleAction(ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_EVENT), classes: { root: classes.itemText } })] })))] }, ContributionsActionsMenu_1.GENERAL_SECTION));
+        return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "link" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.permanentLink", defaultMessage: "ui.contributionActionMenu.permanentLink" }), onClick: () => handleAction(ContributionsActionsMenu_1.GET_CONTRIBUTION_PERMALINK), classes: { root: classes.itemText } })] }), canModifyContribution() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "edit" }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.editContribution", defaultMessage: "ui.contributionActionMenu.editContribution" }), onClick: () => handleAction(ContributionsActionsMenu_1.EDIT_CONTRIBUTION), classes: { root: classes.itemText } })] })), canDeleteContribution() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: currentActionLoading === ContributionsActionsMenu_1.DELETE_CONTRIBUTION || currentActionLoading === ContributionsActionsMenu_1.RESTORE_CONTRIBUTION ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20 })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" })) }), contributionObj.deleted ? ((0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.restoreContribution", defaultMessage: "ui.contributionActionMenu.restoreContribution" }), onClick: () => handleAction(ContributionsActionsMenu_1.RESTORE_CONTRIBUTION), classes: { root: classes.itemText } })) : ((0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.deleteContribution", defaultMessage: "ui.contributionActionMenu.deleteContribution" }), onClick: () => handleAction(ContributionsActionsMenu_1.DELETE_CONTRIBUTION), classes: { root: classes.itemText } }))] })), canSuspendNotificationContribution() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: currentActionLoading === ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_CONTRIBUTION ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20 })) : contributionObj['suspended'] ? ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_active" })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_off" })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: contributionObj['suspended'] ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.enableNotificationContribution", defaultMessage: "ui.contributionActionMenu.enableNotificationContribution" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.suspendNotificationContribution", defaultMessage: "ui.contributionActionMenu.suspendNotificationContribution" })), onClick: () => handleAction(ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_CONTRIBUTION), classes: { root: classes.itemText } })] })), canSuspendNotificationEvent() && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.subItem, disabled: isFlagging, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: currentActionLoading === ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_EVENT ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20 })) : contributionObj.event['show_on_feed'] ? ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_active" })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "notifications_off" })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: !contributionObj.event['show_on_feed'] ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.enableNotificationContribution", defaultMessage: "ui.contributionActionMenu.enableNotificationContribution" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.suspendNotificationContribution", defaultMessage: "ui.contributionActionMenu.suspendNotificationContribution" })), onClick: () => handleAction(ContributionsActionsMenu_1.SUSPEND_NOTIFICATION_EVENT), classes: { root: classes.itemText } })] }))] }, ContributionsActionsMenu_1.GENERAL_SECTION));
     }
     /**
      * Renders contribution menu content
@@ -722,18 +722,18 @@ function ContributionActionsMenu(props) {
     /**
      * Renders component
      */
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton
+    return ((0, jsx_runtime_1.jsxs)(Root, { className: (0, classnames_1.default)(classes.root, className), children: [(0, jsx_runtime_1.jsx)(material_1.IconButton
             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
             // @ts-ignore
-            , Object.assign({ 
+            , { 
                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                 // @ts-ignore
                 ref: (ref) => {
                     popperRef.current = ref;
-                }, "aria-haspopup": "true", onClick: handleOpen, className: classes.button, size: "small" }, { children: contributionObj && (contributionObj.collapsed || contributionObj.deleted) ? ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: classes.visibilityIcons }, { children: [contributionObj.collapsed ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "visibility_off" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] }))) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "more_vert" })) })), isMobile ? ((0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, Object.assign({ open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderContent() }))) : ((0, jsx_runtime_1.jsx)(PopperRoot, Object.assign({ open: open, anchorEl: popperRef.current, role: undefined, transition: true, className: classes.popperRoot }, PopperProps, { placement: "bottom-end" }, { children: ({ TransitionProps, placement }) => ((0, jsx_runtime_1.jsx)(material_1.Grow, Object.assign({}, TransitionProps, { style: { transformOrigin: placement === 'bottom' ? 'center top' : 'center bottom' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ variant: 'outlined', className: classes.paper }, { children: (0, jsx_runtime_1.jsx)(material_1.ClickAwayListener, Object.assign({ onClickAway: handleClose }, { children: renderContent() })) })) }))) }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, Object.assign({ open: openConfirmDialog }, (currentAction === ContributionsActionsMenu_1.DELETE_CONTRIBUTION
+                }, "aria-haspopup": "true", onClick: handleOpen, className: classes.button, size: "small", children: contributionObj && (contributionObj.collapsed || contributionObj.deleted) ? ((0, jsx_runtime_1.jsxs)("span", { className: classes.visibilityIcons, children: [contributionObj.collapsed ? (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "visibility_off" }) : (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" }), (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "expand_more" })] })) : ((0, jsx_runtime_1.jsx)(Icon_1.default, { children: "more_vert" })) }), isMobile ? ((0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, { open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true, children: renderContent() })) : ((0, jsx_runtime_1.jsx)(PopperRoot, Object.assign({ open: open, anchorEl: popperRef.current, role: undefined, transition: true, className: classes.popperRoot }, PopperProps, { placement: "bottom-end", children: ({ TransitionProps, placement }) => ((0, jsx_runtime_1.jsx)(material_1.Grow, Object.assign({}, TransitionProps, { style: { transformOrigin: placement === 'bottom' ? 'center top' : 'center bottom' }, children: (0, jsx_runtime_1.jsx)(material_1.Paper, { variant: 'outlined', className: classes.paper, children: (0, jsx_runtime_1.jsx)(material_1.ClickAwayListener, { onClickAway: handleClose, children: renderContent() }) }) }))) }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, Object.assign({ open: openConfirmDialog }, (currentAction === ContributionsActionsMenu_1.DELETE_CONTRIBUTION
                 ? {
-                    content: ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.contributionActionMenu.deleteContributionInfo", defaultMessage: "ui.contributionActionMenu.deleteContributionInfo" }))
+                    content: (<react_intl_1.FormattedMessage id="ui.contributionActionMenu.deleteContributionInfo" defaultMessage="ui.contributionActionMenu.deleteContributionInfo"/>)
                 }
-                : {}), { onConfirm: handleConfirmedAction, isUpdating: Boolean(currentActionLoading), onClose: () => setOpenConfirmDialog(false) })))] })));
+                : {}), { onConfirm: handleConfirmedAction, isUpdating: Boolean(currentActionLoading), onClose: () => setOpenConfirmDialog(false) })))] }));
 }
 exports.default = ContributionActionsMenu;

package/lib/cjs/shared/CustomSnackMessage/index.js

@@ -33,6 +33,6 @@ const CustomSnackMessage = (0, react_1.forwardRef)((props, ref) => {
     const handleDismiss = (0, react_1.useCallback)(() => {
         closeSnackbar(props.id);
     }, [props.id, closeSnackbar]);
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ ref: ref, className: classes.root }, { children: (0, jsx_runtime_1.jsx)(Widget_1.default, Object.assign({ className: classes.card }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.close, onClick: handleDismiss }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) })), props.message] })) })) }), props.id));
+    return ((0, jsx_runtime_1.jsx)(Root, { ref: ref, className: classes.root, children: (0, jsx_runtime_1.jsx)(Widget_1.default, { className: classes.card, children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { className: classes.content, children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, { className: classes.close, onClick: handleDismiss, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }), props.message] }) }) }, props.id));
 });
 exports.default = CustomSnackMessage;

package/lib/cjs/shared/DateTimeAgo/index.js

@@ -39,7 +39,7 @@ function DateTimeAgo(props) {
      */
     if (date) {
         const formattedDate = (0, formatRelativeTime_1.getRelativeTime)(date);
-        return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ component: "span", className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [showStartIcon && (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "access_time" }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: `${intl.formatDate(date, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' })}`, enterTouchDelay: 0 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: 'body2', component: 'span' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedRelativeTime, { value: -formattedDate.value, unit: formattedDate.unit, numeric: "auto" }) })) }))] })));
+        return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ component: "span", className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [showStartIcon && (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "access_time" }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: `${intl.formatDate(date, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' })}`, enterTouchDelay: 0, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: 'body2', component: 'span', children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedRelativeTime, { value: -formattedDate.value, unit: formattedDate.unit, numeric: "auto" }) }) })] })));
     }
     return null;
 }

package/lib/cjs/shared/EmojiPicker/EmojiPicker.js

@@ -29,6 +29,6 @@ function EmojiPicker(inProps) {
         name: PREFIX
     });
     const { className = '', emojiStyle = emoji_picker_react_1.EmojiStyle.NATIVE } = props, rest = tslib_1.__rest(props, ["className", "emojiStyle"]);
-    return (0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: Picker && (0, jsx_runtime_1.jsx)(Picker, Object.assign({ emojiStyle: emojiStyle }, rest)) }));
+    return (0, jsx_runtime_1.jsx)(Root, { className: (0, classnames_1.default)(classes.root, className), children: Picker && (0, jsx_runtime_1.jsx)(Picker, Object.assign({ emojiStyle: emojiStyle }, rest)) });
 }
 exports.default = EmojiPicker;

package/lib/cjs/shared/EventActionsMenu/index.d.ts

@@ -9,7 +9,7 @@ export interface EventActionsMenuProps extends IconButtonProps {
     /**
      * The event
      */
-    event: SCEventType;
+    event?: SCEventType;
     /**
      * The event id
      */

package/lib/cjs/shared/EventActionsMenu/index.js

@@ -2,22 +2,23 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
-const react_intl_1 = require("react-intl");
 const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
-const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const styles_1 = require("@mui/material/styles");
 const system_1 = require("@mui/system");
-const react_core_1 = require("@selfcommunity/react-core");
-const ConfirmDialog_1 = tslib_1.__importDefault(require("../../shared/ConfirmDialog/ConfirmDialog"));
 const api_services_1 = require("@selfcommunity/api-services");
-const EventActionsMenu_1 = require("../../constants/EventActionsMenu");
+const react_core_1 = require("@selfcommunity/react-core");
 const utils_1 = require("@selfcommunity/utils");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const notistack_1 = require("notistack");
 const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
-const PubSub_1 = require("../../constants/PubSub");
+const react_1 = require("react");
+const react_intl_1 = require("react-intl");
 const EventForm_1 = tslib_1.__importDefault(require("../../components/EventForm"));
+const EventActionsMenu_1 = require("../../constants/EventActionsMenu");
+const PubSub_1 = require("../../constants/PubSub");
+const ConfirmDialog_1 = tslib_1.__importDefault(require("../../shared/ConfirmDialog/ConfirmDialog"));
+const events_1 = require("../../utils/events");
 const PREFIX = 'SCEventActionsMenu';
 const classes = {
     root: `${PREFIX}-root`,
@@ -84,12 +85,7 @@ function EventActionsMenu(inProps) {
     const scUserContext = (0, react_core_1.useSCUser)();
     const { scEvent, setSCEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
     const isEventAdmin = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && ((_a = scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by) === null || _a === void 0 ? void 0 : _a.id) === scUserContext.user.id; }, [scUserContext.user, (_a = scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by) === null || _a === void 0 ? void 0 : _a.id]);
-    const isEventFinished = (0, react_1.useMemo)(() => {
-        if (scEvent && !scEvent.running) {
-            return new Date().getTime() > new Date(scEvent.end_date || scEvent.start_date).getTime();
-        }
-        return false;
-    }, [scEvent]);
+    const isEventFinished = (0, react_1.useMemo)(() => (0, events_1.checkEventFinished)(scEvent), [scEvent]);
     // HANDLERS
     const handleOpen = (event) => {
         setAnchorEl(event.currentTarget);
@@ -154,19 +150,19 @@ function EventActionsMenu(inProps) {
      */
     const renderList = () => {
         return [
-            (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: () => handleAction(EventActionsMenu_1.GET_EVENT_LINK) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "link" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.link", defaultMessage: "ui.shared.eventActionsMenu.item.link" })] }), "link"),
-            (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: () => handleAction(EventActionsMenu_1.ADD_EVENT_TO_CALENDAR) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "CalendarIcon" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.calendar", defaultMessage: "ui.shared.eventActionsMenu.item.calendar" })] }), "calendar"),
+            (0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: () => handleAction(EventActionsMenu_1.GET_EVENT_LINK), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "link" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.link", defaultMessage: "ui.shared.eventActionsMenu.item.link" })] }, "link"),
+            !isEventFinished && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: () => handleAction(EventActionsMenu_1.ADD_EVENT_TO_CALENDAR), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "CalendarIcon" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.calendar", defaultMessage: "ui.shared.eventActionsMenu.item.calendar" })] }, "calendar")),
             isEventAdmin &&
                 !isEventFinished && [
                 (0, jsx_runtime_1.jsx)(material_1.Divider, {}, "divider"),
-                isMobile && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: handleEditClick }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "edit" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.edit", defaultMessage: "ui.shared.eventActionsMenu.item.edit" })] }), "edit")),
-                (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.item, onClick: () => handleAction(EventActionsMenu_1.CANCEL_EVENT) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.cancel", defaultMessage: "ui.shared.eventActionsMenu.item.cancel" })] }), "cancel")
+                isMobile && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: handleEditClick, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "edit" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.edit", defaultMessage: "ui.shared.eventActionsMenu.item.edit" })] }, "edit")),
+                (0, jsx_runtime_1.jsxs)(material_1.MenuItem, { className: classes.item, onClick: () => handleAction(EventActionsMenu_1.CANCEL_EVENT), children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.item.cancel", defaultMessage: "ui.shared.eventActionsMenu.item.cancel" })] }, "cancel")
             ]
         ];
     };
     if (!scEvent) {
         return null;
     }
-    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)(Icon_1.default, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openConfirmDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog })), openEdit && (0, jsx_runtime_1.jsx)(EventForm_1.default, { onClose: handleEditClick, event: scEvent, onSuccess: handleEditSuccess })] }));
+    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)(Icon_1.default, { children: "more_vert" }) })), isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, { className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true, children: (0, jsx_runtime_1.jsx)(material_1.List, { children: renderList() }) })) : ((0, jsx_runtime_1.jsx)(MenuRoot, { className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper }, children: renderList() })), openConfirmDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openConfirmDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog })), openEdit && (0, jsx_runtime_1.jsx)(EventForm_1.default, { onClose: handleEditClick, event: scEvent, onSuccess: handleEditSuccess })] }));
 }
 exports.default = EventActionsMenu;

package/lib/cjs/shared/EventInfoDetails/index.js

@@ -31,25 +31,25 @@ function EventInfoDetails(inProps) {
     const intl = (0, react_intl_1.useIntl)();
     const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
     const privacy = (0, react_1.useMemo)(() => (scEvent && scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? 'ui.eventInfoDetails.privacy.public' : 'ui.eventInfoDetails.privacy.private'), [scEvent]);
-    const location = (0, react_1.useMemo)(() => (scEvent && scEvent.location === types_1.SCEventLocationType.ONLINE ? 'ui.eventInfoDetails.location.virtual' : 'ui.eventInfoDetails.location.inPerson'), [scEvent]);
+    const location = (0, react_1.useMemo)(() => scEvent && scEvent.location === types_1.SCEventLocationType.ONLINE ? 'ui.eventInfoDetails.location.virtual' : 'ui.eventInfoDetails.location.inPerson', [scEvent]);
     if (!scEvent) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [beforeDateInfo, hasDateInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.iconTextWrapper }, { children: [!hideDateIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: scEvent.active ? 'CalendarIcon' : 'calendar_off' })), (0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: !scEvent.active ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.deleted.tooltip", defaultMessage: "ui.eventInfoDetails.deleted.tooltip" })) : null }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.date.startEndTime", defaultMessage: "ui.eventInfoDetails.date.startEndTime", values: {
-                                    date: intl.formatDate(scEvent.running ? scEvent.running_start_date : scEvent.next_start_date, {
+    return ((0, jsx_runtime_1.jsxs)(Root, { className: classes.root, children: [beforeDateInfo, hasDateInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.iconTextWrapper, children: [!hideDateIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, { fontSize: "small", children: scEvent.active ? 'CalendarIcon' : 'calendar_off' }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: !scEvent.active ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.deleted.tooltip", defaultMessage: "ui.eventInfoDetails.deleted.tooltip" })) : null, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.date.startEndTime", defaultMessage: "ui.eventInfoDetails.date.startEndTime", values: {
+                                    date: intl.formatDate(scEvent.running ? scEvent.running_start_date : scEvent.next_start_date ? scEvent.next_start_date : scEvent.start_date, {
                                         weekday: 'long',
                                         day: 'numeric',
                                         year: 'numeric',
                                         month: 'long'
                                     }),
-                                    start: intl.formatDate(scEvent.running ? scEvent.running_start_date : scEvent.next_start_date, { hour: 'numeric', minute: 'numeric' })
-                                } }) })) })), hasInProgress && scEvent.active && scEvent.running && ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.inProgress", defaultMessage: "ui.eventInfoDetails.inProgress" }) }, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.inProgress }) })))] }))), beforeRecurringInfo, hasRecurringInfo && scEvent.recurring !== types_1.SCEventRecurrenceType.NEVER && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.iconTextWrapper }, { children: [!hideRecurringIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "frequency" })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.eventInfoDetails.frequency.${scEvent.recurring}.placeholder`, defaultMessage: `ui.eventInfoDetails.frequency.${scEvent.recurring}.placeholder` }) }))] }))), beforePrivacyInfo, hasPrivacyInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.iconTextWrapper }, { children: [!hidePrivacyIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? 'public' : 'private' })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: privacy, defaultMessage: privacy }) })), "-", (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: location, defaultMessage: location }) }))] }))), beforeLocationInfo, hasLocationInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.iconTextWrapper }, { children: [!hideLocationIcon && ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: scEvent.location === types_1.SCEventLocationType.ONLINE ? 'play_circle_outline' : 'add_location_alt' }))), scEvent.location === types_1.SCEventLocationType.ONLINE ? ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scEvent.link, target: "_blank", className: classes.link }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.url }, { children: scEvent.link })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.url }, { children: scEvent.geolocation })))] }))), beforeCreatedInfo, hasCreatedInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.creationWrapper }, { children: [!hideCreatedIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "create" })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.date.create", defaultMessage: "ui.eventInfoDetails.date.create", values: {
+                                    start: intl.formatDate(scEvent.running ? scEvent.running_start_date : scEvent.next_start_date ? scEvent.next_start_date : scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
+                                } }) }) }), hasInProgress && scEvent.active && scEvent.running && ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.inProgress", defaultMessage: "ui.eventInfoDetails.inProgress" }), children: (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.inProgress }) }))] })), beforeRecurringInfo, hasRecurringInfo && scEvent.recurring !== types_1.SCEventRecurrenceType.NEVER && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.iconTextWrapper, children: [!hideRecurringIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, { fontSize: "small", children: "frequency" }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.eventInfoDetails.frequency.${scEvent.recurring}.placeholder`, defaultMessage: `ui.eventInfoDetails.frequency.${scEvent.recurring}.placeholder` }) })] })), beforePrivacyInfo, hasPrivacyInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.iconTextWrapper, children: [!hidePrivacyIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, { fontSize: "small", children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? 'public' : 'private' }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: privacy, defaultMessage: privacy }) }), "-", (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: location, defaultMessage: location }) })] })), beforeLocationInfo, hasLocationInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.iconTextWrapper, children: [!hideLocationIcon && ((0, jsx_runtime_1.jsx)(material_1.Icon, { fontSize: "small", children: scEvent.location === types_1.SCEventLocationType.ONLINE ? 'play_circle_outline' : 'add_location_alt' })), scEvent.location === types_1.SCEventLocationType.ONLINE ? ((0, jsx_runtime_1.jsx)(react_core_1.Link, { to: scEvent.link, target: "_blank", className: classes.link, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", className: classes.url, children: scEvent.link }) })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", className: classes.url, children: scEvent.geolocation }))] })), beforeCreatedInfo, hasCreatedInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: classes.creationWrapper, children: [!hideCreatedIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, { fontSize: "small", children: "create" }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.date.create", defaultMessage: "ui.eventInfoDetails.date.create", values: {
                                 date: intl.formatDate(scEvent.created_at, {
                                     weekday: 'long',
                                     day: 'numeric',
                                     year: 'numeric',
                                     month: 'long'
                                 })
-                            } }) }))] })))] })));
+                            } }) })] }))] }));
 }
 exports.default = EventInfoDetails;

package/lib/cjs/shared/InfiniteScroll/index.d.ts

@@ -1,5 +1,5 @@
 import { Component, ReactNode, CSSProperties } from 'react';
-declare type Fn = () => any;
+type Fn = () => any;
 export interface InfiniteScrollProps {
     next?: Fn;
     hasMoreNext?: boolean;

package/lib/cjs/shared/InfiniteScroll/index.js

@@ -225,12 +225,12 @@ class InfiniteScroll extends react_1.Component {
         // because heighted infiniteScroll visualy breaks
         // on drag down as overflow becomes visible
         const outerDivStyle = this.props.pullDownToRefresh && this.props.height ? { overflow: 'auto' } : {};
-        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ style: outerDivStyle, className: "infinite-scroll-component__outerdiv" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `infinite-scroll-component ${this.props.className || ''}`, ref: (infScroll) => (this._infScroll = infScroll), style: style }, { children: [this.props.header, this.props.pullDownToRefresh && ((0, jsx_runtime_1.jsx)("div", Object.assign({ style: { position: 'relative', marginBottom: 16 }, ref: (pullDown) => (this._pullDown = pullDown) }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ style: {
+        return ((0, jsx_runtime_1.jsx)("div", { style: outerDivStyle, className: "infinite-scroll-component__outerdiv", children: (0, jsx_runtime_1.jsxs)("div", { className: `infinite-scroll-component ${this.props.className || ''}`, ref: (infScroll) => (this._infScroll = infScroll), style: style, children: [this.props.header, this.props.pullDownToRefresh && ((0, jsx_runtime_1.jsx)("div", { style: { position: 'relative' }, ref: (pullDown) => (this._pullDown = pullDown), children: (0, jsx_runtime_1.jsx)("div", { style: {
                                 position: 'absolute',
-                                left: 0,
-                                right: 0,
-                                top: -1 * this.maxPullDownDistance
-                            } }, { children: this.state.pullToRefreshThresholdBreached ? this.props.releaseToRefreshContent : this.props.pullDownToRefreshContent })) }))), !this.props.inverse && this.state.showLoaderPrevious && this.props.hasMorePrevious && this.props.loaderPrevious, this.props.children, this.props.inverse && this.state.showLoaderPrevious && this.props.hasMorePrevious && this.props.loaderPrevious, !this.state.showLoaderNext && !hasChildren && this.props.hasMoreNext && this.props.loaderNext, this.state.showLoaderNext && this.props.hasMoreNext && this.props.loaderNext, !this.props.hasMoreNext && this.props.endMessage, this.props.footer] })) })));
+                                left: '50%',
+                                transform: 'translateX(-50%)',
+                                zIndex: 1
+                            }, children: this.state.pullToRefreshThresholdBreached ? this.props.releaseToRefreshContent : this.props.pullDownToRefreshContent }) })), !this.props.inverse && this.state.showLoaderPrevious && this.props.hasMorePrevious && this.props.loaderPrevious, this.props.children, this.props.inverse && this.state.showLoaderPrevious && this.props.hasMorePrevious && this.props.loaderPrevious, !this.state.showLoaderNext && !hasChildren && this.props.hasMoreNext && this.props.loaderNext, this.state.showLoaderNext && this.props.hasMoreNext && this.props.loaderNext, !this.props.hasMoreNext && this.props.endMessage, this.props.footer] }) }));
     }
 }
 exports.default = InfiniteScroll;

package/lib/cjs/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.js

@@ -24,6 +24,6 @@ function InfiniteScrollWithHeight() {
             setItems(items.concat(Array.from({ length: 20 })));
         }, 500);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll with fixed height" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)(index_1.default, Object.assign({ dataLength: items.length, next: fetchMoreData, hasMoreNext: hasMore, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), height: 400, endMessage: (0, jsx_runtime_1.jsx)("p", Object.assign({ style: { textAlign: 'center' } }, { children: (0, jsx_runtime_1.jsx)("b", { children: "Yay! You have seen it all" }) })) }, { children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) }))] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll with fixed height" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)(index_1.default, { dataLength: items.length, next: fetchMoreData, hasMoreNext: hasMore, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), height: 400, endMessage: (0, jsx_runtime_1.jsx)("p", { style: { textAlign: 'center' }, children: (0, jsx_runtime_1.jsx)("b", { children: "Yay! You have seen it all" }) }), children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { style: style, children: ["div - #", index] }, index))) })] }));
 }
 exports.default = InfiniteScrollWithHeight;

package/lib/cjs/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.js

@@ -19,6 +19,6 @@ function PullDownToRefreshInfScroll() {
             setItems(items.concat(Array.from({ length: 20 })));
         }, 1500);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Pull down to refresh" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)(index_1.default, Object.assign({ dataLength: items.length, hasMoreNext: true, next: fetchMoreData, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), pullDownToRefresh: true, pullDownToRefreshContent: (0, jsx_runtime_1.jsx)("h3", Object.assign({ style: { textAlign: 'center' } }, { children: "\u2193 Pull down to refresh" })), releaseToRefreshContent: (0, jsx_runtime_1.jsx)("h3", Object.assign({ style: { textAlign: 'center' } }, { children: "\u2191 Release to refresh" })), refreshFunction: fetchMoreData }, { children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) }))] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Pull down to refresh" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)(index_1.default, { dataLength: items.length, hasMoreNext: true, next: fetchMoreData, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), pullDownToRefresh: true, pullDownToRefreshContent: (0, jsx_runtime_1.jsx)("h3", { style: { textAlign: 'center' }, children: "\u2193 Pull down to refresh" }), releaseToRefreshContent: (0, jsx_runtime_1.jsx)("h3", { style: { textAlign: 'center' }, children: "\u2191 Release to refresh" }), refreshFunction: fetchMoreData, children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { style: style, children: ["div - #", index] }, index))) })] }));
 }
 exports.default = PullDownToRefreshInfScroll;

package/lib/cjs/shared/InfiniteScroll/stories/ScrollableTargetFixedInfScroll.js

@@ -19,7 +19,7 @@ function ScrollableTargetFixedInfScroll() {
             setItems(items.concat(Array.from({ length: 20 })));
         }, 1500);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll with scrollable target FIXED" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "scrollableDiv", style: {
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll with scrollable target FIXED" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)("div", { id: "scrollableDiv", style: {
                     position: 'fixed',
                     bottom: 0,
                     left: 0,
@@ -29,6 +29,6 @@ function ScrollableTargetFixedInfScroll() {
                     maxWidth: '100% !important',
                     height: '50vh',
                     overflowY: 'scroll'
-                } }, { children: (0, jsx_runtime_1.jsx)(index_1.default, Object.assign({ dataLength: items.length, hasMoreNext: true, next: fetchMoreData, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), scrollableTarget: "scrollableDiv" }, { children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) })) }))] }));
+                }, children: (0, jsx_runtime_1.jsx)(index_1.default, { dataLength: items.length, hasMoreNext: true, next: fetchMoreData, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), scrollableTarget: "scrollableDiv", children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { style: style, children: ["div - #", index] }, index))) }) })] }));
 }
 exports.default = ScrollableTargetFixedInfScroll;

package/lib/cjs/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.js

@@ -19,6 +19,6 @@ function ScrollableTargetInfScroll() {
             setItems(items.concat(Array.from({ length: 20 })));
         }, 1500);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll with scrollable target" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "scrollableDiv", style: { height: 300, overflow: 'auto' } }, { children: (0, jsx_runtime_1.jsx)(index_1.default, Object.assign({ dataLength: items.length, hasMoreNext: true, next: fetchMoreData, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), scrollableTarget: "scrollableDiv" }, { children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) })) }))] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll with scrollable target" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)("div", { id: "scrollableDiv", style: { height: 300, overflow: 'auto' }, children: (0, jsx_runtime_1.jsx)(index_1.default, { dataLength: items.length, hasMoreNext: true, next: fetchMoreData, loaderNext: (0, jsx_runtime_1.jsx)("h4", { children: "Loading..." }), scrollableTarget: "scrollableDiv", children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { style: style, children: ["div - #", index] }, index))) }) })] }));
 }
 exports.default = ScrollableTargetInfScroll;

package/lib/cjs/shared/InfiniteScroll/stories/ScrolleableTop.js

@@ -19,9 +19,9 @@ function ScrolleableTop() {
             setItems(items.concat(Array.from({ length: 20 })));
         }, 500);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll on top" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "scrollableDiv", style: {
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "demo: Infinite Scroll on top" }), (0, jsx_runtime_1.jsx)("hr", {}), (0, jsx_runtime_1.jsx)("div", { id: "scrollableDiv", style: {
                     height: 300,
                     overflow: 'auto'
-                } }, { children: (0, jsx_runtime_1.jsx)(index_1.default, Object.assign({ dataLength: items.length, previous: fetchMoreData, hasMorePrevious: true, loaderPrevious: (0, jsx_runtime_1.jsx)("h4", { children: "Loading prev..." }), scrollableTarget: "scrollableDiv", scrollThreshold: '0px' }, { children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: style }, { children: ["div - #", index] }), index))) })) }))] }));
+                }, children: (0, jsx_runtime_1.jsx)(index_1.default, { dataLength: items.length, previous: fetchMoreData, hasMorePrevious: true, loaderPrevious: (0, jsx_runtime_1.jsx)("h4", { children: "Loading prev..." }), scrollableTarget: "scrollableDiv", scrollThreshold: '0px', children: items.map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { style: style, children: ["div - #", index] }, index))) }) })] }));
 }
 exports.default = ScrolleableTop;

package/lib/cjs/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.js

@@ -25,6 +25,6 @@ function WindowInfiniteScrollComponent() {
             setData(newData);
         }, 500);
     };
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(index_1.default, Object.assign({ hasMoreNext: true, next: next, hasMorePrevious: true, previous: previous, loaderNext: (0, jsx_runtime_1.jsx)("h1", { children: "Loading next..." }), loaderPrevious: (0, jsx_runtime_1.jsx)("h1", { children: "Loading prev..." }), dataLength: data.length, scrollThreshold: 1 }, { children: data.map((e) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: { height: 200, margin: 4, border: '1px solid hotpink' } }, { children: ["#", e, " row"] }), e))) })) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(index_1.default, { hasMoreNext: true, next: next, hasMorePrevious: true, previous: previous, loaderNext: (0, jsx_runtime_1.jsx)("h1", { children: "Loading next..." }), loaderPrevious: (0, jsx_runtime_1.jsx)("h1", { children: "Loading prev..." }), dataLength: data.length, scrollThreshold: 1, children: data.map((e) => ((0, jsx_runtime_1.jsxs)("div", { style: { height: 200, margin: 4, border: '1px solid hotpink' }, children: ["#", e, " row"] }, e))) }) }));
 }
 exports.default = WindowInfiniteScrollComponent;

package/lib/cjs/shared/LanguageSwitcher/index.js

@@ -77,6 +77,6 @@ function LanguageSwitcher(inProps) {
             }
         }
     };
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.label }, LabelComponentProps, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.languageSwitcher.selectLanguage", defaultMessage: "ui.languageSwitcher.selectLanguage" }) })), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: updating, labelId: "language", id: "language", value: intl.locale, onChange: handleChange, size: "small" }, SelectComponentProps, { children: languages.map((l) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: l }, { children: minimized ? l.toUpperCase() : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.languageSwitcher.language.${l}`, defaultMessage: `ui.languageSwitcher.language.${l}` }) }), l))) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.label }, LabelComponentProps, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.languageSwitcher.selectLanguage", defaultMessage: "ui.languageSwitcher.selectLanguage" }) })), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: updating, labelId: "language", id: "language", value: intl.locale, onChange: handleChange, size: "small" }, SelectComponentProps, { children: languages.map((l) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: l, children: minimized ? l.toUpperCase() : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.languageSwitcher.language.${l}`, defaultMessage: `ui.languageSwitcher.language.${l}` }) }, l))) }))] })));
 }
 exports.default = LanguageSwitcher;

package/lib/cjs/shared/Lightbox/BaseLightbox.d.ts

@@ -0,0 +1,19 @@
+import { MouseEvent, TouchEvent } from 'react';
+import { PhotoProviderBase } from 'react-photo-view/dist/types';
+import { DataType } from '../../types/lightbox';
+/**
+ * Overrides/extends the styles applied to the component.
+ * @default null
+ */
+export interface BaseLightboxProps extends PhotoProviderBase {
+    className?: string;
+    images: DataType[];
+    index?: number;
+    onIndexChange?: (index: number) => void;
+    visible?: boolean;
+    onClose?: (evt?: MouseEvent | TouchEvent) => void;
+    afterClose?: () => void;
+    toolbarButtons?: JSX.Element;
+}
+declare const BaseLightbox: (props: BaseLightboxProps) => JSX.Element;
+export default BaseLightbox;

package/lib/cjs/shared/Lightbox/BaseLightbox.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const styles_1 = require("@mui/material/styles");
+const react_1 = require("react");
+const react_photo_view_1 = require("react-photo-view");
+const constants_1 = require("./constants");
+const classes = {
+    root: `${constants_1.PREFIX}-root`
+};
+const Root = (0, styles_1.styled)(react_photo_view_1.PhotoSlider, {
+    name: constants_1.PREFIX,
+    slot: 'Root',
+    overridesResolver: (_props, styles) => styles.root
+})(() => ({}));
+const BaseLightbox = (props) => {
+    const { images = [], index, onClose, visible = true, afterClose, onIndexChange, toolbarRender, toolbarButtons } = props, rest = tslib_1.__rest(props, ["images", "index", "onClose", "visible", "afterClose", "onIndexChange", "toolbarRender", "toolbarButtons"]);
+    // STATE
+    const [currentImageIndex, setCurrentImageIndex] = (0, react_1.useState)(index || 0);
+    const handleIndexChange = (0, react_1.useCallback)((index) => {
+        onIndexChange === null || onIndexChange === void 0 ? void 0 : onIndexChange(index);
+        setCurrentImageIndex(index);
+    }, [onIndexChange, setCurrentImageIndex]);
+    /**
+     * Renders root object
+     */
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: classes.root, images: images, visible: visible && index !== -1, index: currentImageIndex, onIndexChange: handleIndexChange, onClose: onClose, afterClose: afterClose, loadingElement: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: 'primary' }), toolbarRender: toolbarRender
+            ? toolbarRender
+            : () => {
+                return toolbarButtons;
+            } })));
+};
+exports.default = BaseLightbox;

package/lib/cjs/shared/Lightbox/Lightbox.d.ts

@@ -1,19 +1,33 @@
-import React from 'react';
-import { DataType } from '../../types/lightbox';
-import { PhotoProviderBase } from 'react-photo-view/dist/types';
-/**
- * Overrides/extends the styles applied to the component.
- * @default null
- */
-export interface ReactImageLightboxProps extends PhotoProviderBase {
-    className?: string;
-    images: DataType[];
-    index?: number;
+import { SCMediaType } from '@selfcommunity/types/src/types';
+export interface LightboxProps {
+    /**
+     * Images objs
+     * @default []
+     */
+    medias: SCMediaType[];
+    /**
+     * Obj index
+     * @default 0
+     */
+    index: number;
+    /**
+     * Toolbar
+     * @default undefined
+     */
+    toolbarButtons?: JSX.Element;
+    /**
+     * Handles on close
+     * @default () => void
+     */
+    onClose: () => void;
+    /**
+     * Handles on index change
+     * @default undefined
+     */
     onIndexChange?: (index: number) => void;
-    visible?: boolean;
-    onClose?: (evt?: React.MouseEvent | React.TouchEvent) => void;
-    afterClose?: () => void;
-    toolbarButtons?: React.ReactNode[];
+    /**
+     * Any other properties
+     */
+    [p: string]: any;
 }
-declare const ReactImageLightbox: (props: ReactImageLightboxProps) => JSX.Element;
-export default ReactImageLightbox;
+export default function Lightbox(props: LightboxProps): JSX.Element;

package/lib/cjs/shared/Lightbox/Lightbox.js

@@ -2,29 +2,26 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
-const react_photo_view_1 = require("react-photo-view");
-const material_1 = require("@mui/material");
-const PREFIX = 'SCLightbox';
+const react_1 = require("react");
+const BaseLightbox_1 = tslib_1.__importDefault(require("./BaseLightbox"));
+const constants_1 = require("./constants");
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${constants_1.PREFIX}-lightbox-root`
 };
-const Root = (0, styles_1.styled)(react_photo_view_1.PhotoSlider, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+const Root = (0, styles_1.styled)(BaseLightbox_1.default, {
+    name: constants_1.PREFIX,
+    slot: 'LightboxRoot'
 })(() => ({}));
-const ReactImageLightbox = (props) => {
-    const { images = [], index, onClose, visible = true, afterClose, onIndexChange, toolbarRender, toolbarButtons = [] } = props, rest = tslib_1.__rest(props, ["images", "index", "onClose", "visible", "afterClose", "onIndexChange", "toolbarRender", "toolbarButtons"]);
-    // STATE
-    const [currentImages] = (0, react_1.useState)(images || []);
-    const [currentImageIndex, setCurrentImageIndex] = (0, react_1.useState)(index || 0);
+function Lightbox(props) {
+    // PROPS
+    const { medias = [], index = 0, toolbarButtons, onClose, onIndexChange } = props, rest = tslib_1.__rest(props, ["medias", "index", "toolbarButtons", "onClose", "onIndexChange"]);
+    const mediaToDataTypeMap = (0, react_1.useCallback)((media, index) => {
+        return { src: media.image, width: media.image_width, height: media.image_height, key: index };
+    }, []);
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: classes.root, images: currentImages, visible: visible && index !== -1, index: currentImageIndex, onIndexChange: setCurrentImageIndex, onClose: onClose, afterClose: afterClose, loadingElement: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: 'primary' }), toolbarRender: toolbarRender ? toolbarRender : () => {
-            return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: toolbarButtons });
-        } })));
-};
-exports.default = ReactImageLightbox;
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: classes.root, images: medias.map(mediaToDataTypeMap), visible: index !== -1, onClose: onClose, index: index, onIndexChange: onIndexChange, toolbarButtons: toolbarButtons })));
+}
+exports.default = Lightbox;

package/lib/cjs/shared/Lightbox/constants.d.ts

@@ -0,0 +1 @@
+export declare const PREFIX = "SCLightbox";

package/lib/cjs/shared/Lightbox/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PREFIX = void 0;
+exports.PREFIX = 'SCLightbox';