@selfcommunity/react-ui 0.8.0-alpha.0 → 0.8.0-alpha.10

package/lib/esm/components/EventForm/utils.js

@@ -0,0 +1,21 @@
+import { addDays, addHours } from 'date-fns';
+export function getNewDate(date) {
+    if (date) {
+        return new Date(date);
+    }
+    return new Date();
+}
+export function getLaterHoursDate(h) {
+    return addHours(getNewDate(), h);
+}
+export function getLaterDaysDate(d) {
+    return addDays(getNewDate(), d);
+}
+export const combineDateAndTime = (date, time) => {
+    const combined = date;
+    combined.setHours(time.getHours());
+    combined.setMinutes(time.getMinutes());
+    combined.setSeconds(time.getSeconds());
+    combined.setMilliseconds(time.getMilliseconds());
+    return combined.toISOString();
+};

package/lib/esm/components/EventHeader/EventHeader.js

@@ -174,5 +174,5 @@ export default function EventHeader(inProps) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), _jsxs(Box, Object.assign({ className: classes.visibility }, { children: [_jsx(_Fragment, { children: scEvent.privacy === SCEventPrivacyType.PUBLIC ? (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), _jsx(Bullet, {}), _jsx(Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : (_jsx(FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), _jsx(User, { className: classes.planner, userId: scEvent.managed_by.id, secondary: _jsx(FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: _jsx(_Fragment, { children: isEventAdmin ? (_jsxs(Box, Object.assign({ className: classes.multiActions }, { children: [_jsx(EventInviteButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), _jsxs(Box, { children: [_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished }), _jsx(EventActionsMenu, Object.assign({ event: scEvent }, EventActionsProps))] })] }))) : (_jsxs(_Fragment, { children: [_jsx(EventSubscribeButton, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent }, EventActionsProps))] })) }) })] }))] })));
+                            } })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), _jsxs(Box, Object.assign({ className: classes.visibility }, { children: [_jsx(_Fragment, { children: scEvent.privacy === SCEventPrivacyType.PUBLIC ? (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), _jsx(Bullet, {}), _jsx(Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : (_jsx(FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), _jsx(User, { className: classes.planner, userId: scEvent.managed_by.id, secondary: _jsx(FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: _jsx(_Fragment, { children: isEventAdmin ? (_jsxs(Box, Object.assign({ className: classes.multiActions }, { children: [_jsx(EventInviteButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : (_jsxs(_Fragment, { children: [_jsx(EventSubscribeButton, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })) }) })] }))] })));
 }

package/lib/esm/components/EventInfoWidget/EventInfoWidget.js

@@ -3,13 +3,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Button, CardContent, Icon, Stack, styled, Typography, useThemeProps } from '@mui/material';
 import { useSCFetchEvent } from '@selfcommunity/react-core';
 import { SCEventPrivacyType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import EventInfoDetails from '../../shared/EventInfoDetails';
 import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
 import Widget from '../Widget';
 import { PREFIX } from './constants';
 import Skeleton from './Skeleton';
+import PubSub from 'pubsub-js';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 const classes = {
     root: `${PREFIX}-root`,
     content: `${PREFIX}-content`,
@@ -43,7 +45,9 @@ export default function EventInfoWidget(inProps) {
     const [showButton, setShowButton] = useState(!summaryExpanded);
     const [loading, setLoading] = useState(true);
     // HOOKS
-    const { scEvent } = useSCFetchEvent({ id: eventId, event });
+    const { scEvent, setSCEvent } = useSCFetchEvent({ id: eventId, event });
+    // REFS
+    const updatesSubscription = useRef(null);
     useEffect(() => {
         setLoading(false);
     }, []);
@@ -65,6 +69,25 @@ export default function EventInfoWidget(inProps) {
     const showInfo = useMemo(() => (scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === SCEventPrivacyType.PUBLIC ||
         [SCEventSubscriptionStatusType.SUBSCRIBED, SCEventSubscriptionStatusType.GOING, SCEventSubscriptionStatusType.NOT_GOING].indexOf(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) > -1, [scEvent]);
     const description = useMemo(() => (expanded ? scEvent === null || scEvent === void 0 ? void 0 : scEvent.description : getTruncatedText(scEvent === null || scEvent === void 0 ? void 0 : scEvent.description, 220)), [expanded, scEvent]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onChangeGroupHandler = useCallback((_msg, data) => {
+        if (data && scEvent.id === data.id) {
+            setSCEvent(data);
+        }
+    }, [scEvent, setSCEvent]);
+    /**
+     * On mount, subscribe to receive groups updates (only edit)
+     */
+    useEffect(() => {
+        if (scEvent) {
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.EDIT}`, onChangeGroupHandler);
+        }
+        return () => {
+            updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);
+        };
+    }, [scEvent]);
     // RENDER
     if (!scEvent && loading) {
         return _jsx(Skeleton, {});

package/lib/esm/components/Events/Events.js

@@ -8,7 +8,7 @@ import { SCPreferences, SCPreferencesContext, SCUserContext, UserUtils } from '@
 import { SCEventDateFilterType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
 import { Logger } from '@selfcommunity/utils';
 import classNames from 'classnames';
-import { useContext, useEffect, useMemo, useState } from 'react';
+import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { DEFAULT_PAGINATION_OFFSET } from '../../constants/Pagination';
@@ -17,6 +17,8 @@ import Event, { EventSkeleton } from '../Event';
 import Skeleton from '../Events/Skeleton';
 import { PREFIX } from './constants';
 import PastEventsFilter from './PastEventsFilter';
+import PubSub from 'pubsub-js';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 const classes = {
     root: `${PREFIX}-root`,
     filters: `${PREFIX}-filters`,
@@ -98,6 +100,8 @@ export default function Events(inProps) {
     const authUserId = scUserContext.user ? scUserContext.user.id : null;
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
+    // REFS
+    const updatesSubscription = useRef(null);
     // HANDLERS
     const handleChipClick = () => {
         setShowFollowed(!showFollowed);
@@ -143,6 +147,28 @@ export default function Events(inProps) {
             query === '' && fetchEvents();
         }
     }, [contentAvailability, dateSearch, showFollowed, showPastEvents, showMyEvents, query]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onDeleteEventHandler = useCallback((_msg, deleted) => {
+        setEvents((prev) => {
+            if (prev.some((e) => e.id === deleted)) {
+                return prev.filter((e) => e.id !== deleted);
+            }
+            return prev;
+        });
+    }, [events]);
+    /**
+     * On mount, subscribe to receive event updates (only delete)
+     */
+    useEffect(() => {
+        if (events) {
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.DELETE}`, onDeleteEventHandler);
+        }
+        return () => {
+            updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);
+        };
+    }, [events]);
     const handleNext = useMemo(() => () => {
         if (!next) {
             return;
@@ -188,14 +214,14 @@ export default function Events(inProps) {
                                 variant: showMyEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents), 
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
-                                showFollowed: showMyEvents, deleteIcon: showMyEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, disabled: loading }) })))] })) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ item: true, xs: 12, md: 4 }, { children: _jsx(TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: _jsx(FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
+                                showFollowed: showMyEvents, deleteIcon: showMyEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, disabled: loading }) })))] })) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ item: true, xs: 12, md: 4 }, { children: _jsx(TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: _jsx(FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading || (!events.length && !query), onKeyUp: (e) => {
                                     e.preventDefault();
                                     if (e.key === 'Enter') {
                                         fetchEvents(true);
                                     }
                                 }, InputProps: {
-                                    endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchEvents(true), disabled: loading }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(true), endIcon: _jsx(Icon, { children: "search" }), disabled: loading })) })))
-                                } }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [_jsx(InputLabel, { children: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), _jsx(Select, Object.assign({ disabled: showPastEvents || loading, size: 'small', label: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => (_jsxs(MenuItem, Object.assign({ value: option.value }, { children: [_jsx(Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), authUserId && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(EventsChipRoot
+                                    endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchEvents(true), disabled: loading || (!events.length && !query) }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(true), endIcon: _jsx(Icon, { children: "search" }), disabled: loading || (!events.length && !query) })) })))
+                                } }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [_jsx(InputLabel, { children: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), _jsx(Select, Object.assign({ disabled: showPastEvents || loading || (!events.length && dateSearch === SCEventDateFilterType.ANY), size: 'small', label: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => (_jsxs(MenuItem, Object.assign({ value: option.value }, { children: [_jsx(Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), authUserId && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(EventsChipRoot
                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                             // @ts-ignore
                             , { 
@@ -207,7 +233,7 @@ export default function Events(inProps) {
                                 variant: showFollowed ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick, 
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
-                                showFollowed: showFollowed, deleteIcon: showFollowed ? _jsx(Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: dateSearch !== SCEventDateFilterType.ANY || loading }) }))] })) }))), _jsx(_Fragment, { children: loading ? (_jsx(Skeleton, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : (_jsx(_Fragment, { children: !events.length ? (_jsx(Box, Object.assign({ className: classes.noResults }, { children: (onlyStaffEnabled && !UserUtils.isStaff(scUserContext.user)) ||
+                                showFollowed: showFollowed, deleteIcon: showFollowed ? _jsx(Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading || (!events.length && !showFollowed) }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: dateSearch !== SCEventDateFilterType.ANY || loading || (!events.length && !showPastEvents) }) }))] })) }))), _jsx(_Fragment, { children: loading ? (_jsx(Skeleton, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : (_jsx(_Fragment, { children: !events.length ? (_jsx(Box, Object.assign({ className: classes.noResults }, { children: (onlyStaffEnabled && !UserUtils.isStaff(scUserContext.user)) ||
                             (onlyStaffEnabled && UserUtils.isStaff(scUserContext.user) && general) ? (_jsxs(_Fragment, { children: [_jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps)), _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) }))] })) : (_jsxs(_Fragment, { children: [_jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: _jsx(CreateEventButton, {}) })), _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.events.noEvents.title.onlyStaff", defaultMessage: "ui.events.noEvents.title.onlyStaff" }) }))] })) }))) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ container: true, spacing: { xs: 2 }, className: classes.events }, GridContainerComponentProps, { children: _jsxs(_Fragment, { children: [events.map((event) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.item }, GridItemComponentProps, { children: _jsx(Event, Object.assign({ event: event, eventId: event.id }, EventComponentProps)) }), event.id))), authUserId && events.length % 2 !== 0 && (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.itemSkeleton }, GridItemComponentProps, { children: _jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: _jsx(CreateEventButton, Object.assign({ variant: "outlined", color: "primary", size: "small" }, { children: _jsx(FormattedMessage, { id: "ui.events.skeleton.action.add", defaultMessage: "ui.events.skeleton.action.add" }) })) })) }), 'skeleton-item'))] }) })), Boolean(next) && (_jsx(Button, Object.assign({ color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore }, { children: _jsx(FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }) })))] })) })) })] }));
     /**
      * Renders root object (if content availability community option is false and user is anonymous, component is hidden)

package/lib/esm/components/MyEventsWidget/MyEventsWidget.js

@@ -4,10 +4,10 @@ import { Button, CardActions, Icon, IconButton, Typography } from '@mui/material
 import { styled } from '@mui/material/styles';
 import { Box, useThemeProps } from '@mui/system';
 import { Endpoints, EventService, http } from '@selfcommunity/api-services';
-import { SCCache, SCRoutes, useSCPreferences, useSCRouting, useSCUser } from '@selfcommunity/react-core';
+import { SCCache, SCPreferences, SCRoutes, useSCPreferences, useSCRouting, useSCUser } from '@selfcommunity/react-core';
 import { SCEventSubscriptionStatusType, SCFeatureName } from '@selfcommunity/types';
 import { Logger } from '@selfcommunity/utils';
-import { useCallback, useEffect, useMemo, useReducer, useState } from 'react';
+import { useCallback, useEffect, useMemo, useReducer, useRef, useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET } from '../../constants/Pagination';
@@ -18,6 +18,8 @@ import Event from '../Event';
 import Widget from '../Widget';
 import { PREFIX } from './constants';
 import Skeleton from './Skeleton';
+import PubSub from 'pubsub-js';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 const classes = {
     root: `${PREFIX}-root`,
     titleWrapper: `${PREFIX}-title-wrapper`,
@@ -62,8 +64,14 @@ export default function MyEventsWidget(inProps) {
     // CONTEXT
     const scUserContext = useSCUser();
     const scRoutingContext = useSCRouting();
-    const { features } = useSCPreferences();
-    const eventsEnabled = useMemo(() => features && features.includes(SCFeatureName.EVENT) && features.includes(SCFeatureName.TAGGING), [features]);
+    const { preferences, features } = useSCPreferences();
+    const eventsEnabled = useMemo(() => preferences &&
+        features &&
+        features.includes(SCFeatureName.TAGGING) &&
+        SCPreferences.CONFIGURATIONS_EVENTS_ENABLED in preferences &&
+        preferences[SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
+    // REFS
+    const updatesSubscription = useRef(null);
     /**
      * Initialize component
      * Fetch data only if the component is not initialized and it is not loading data
@@ -118,6 +126,30 @@ export default function MyEventsWidget(inProps) {
             _fetchNext();
         }
     }, [eventIndex, state.results]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onDeleteEventHandler = useCallback((_msg, deleted) => {
+        const _events = [...state.results];
+        if (_events.some((e) => e.id === deleted)) {
+            const updatedEvents = _events.filter((e) => e.id !== deleted);
+            dispatch({
+                type: actionWidgetTypes.SET_RESULTS,
+                payload: { results: updatedEvents }
+            });
+        }
+    }, [state.results]);
+    /**
+     * On mount, subscribe to receive event updates (only delete)
+     */
+    useEffect(() => {
+        if (state.results) {
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.DELETE}`, onDeleteEventHandler);
+        }
+        return () => {
+            updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);
+        };
+    }, [state.results]);
     // RENDER
     if (!eventsEnabled || (state.initialized && state.count === 0)) {
         return _jsx(HiddenPlaceholder, {});

package/lib/esm/components/NavigationToolbar/NavigationToolbar.js

@@ -108,12 +108,21 @@ export default function NavigationToolbar(inProps) {
         return _preferences;
     }, [scPreferences.preferences]);
     const privateMessagingEnabled = useMemo(() => scPreferences.features.includes(SCFeatureName.PRIVATE_MESSAGING), [scPreferences.features]);
-    const groupsEnabled = useMemo(() => scPreferences.features && scPreferences.features.includes(SCFeatureName.GROUPING) && scPreferences.features.includes(SCFeatureName.TAGGING), [scPreferences.features]);
-    const eventsEnabled = useMemo(() => scPreferences.features && scPreferences.features.includes(SCFeatureName.EVENT) && scPreferences.features.includes(SCFeatureName.TAGGING), [scPreferences.features]);
+    const groupsEnabled = useMemo(() => scPreferences.preferences &&
+        scPreferences.features &&
+        scPreferences.features.includes(SCFeatureName.TAGGING) &&
+        scPreferences.features.includes(SCFeatureName.GROUPING) &&
+        SCPreferences.CONFIGURATIONS_GROUPS_ENABLED in scPreferences.preferences &&
+        scPreferences.preferences[SCPreferences.CONFIGURATIONS_GROUPS_ENABLED].value, [scPreferences.preferences, scPreferences.features]);
+    const eventsEnabled = useMemo(() => scPreferences.preferences &&
+        scPreferences.features &&
+        scPreferences.features.includes(SCFeatureName.TAGGING) &&
+        SCPreferences.CONFIGURATIONS_EVENTS_ENABLED in preferences &&
+        scPreferences.preferences[SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [scPreferences.preferences, scPreferences.features]);
     const showComposer = useMemo(() => {
         return (!disableComposer &&
             (!scPreferences.preferences[SCPreferences.CONFIGURATIONS_POST_ONLY_STAFF_ENABLED].value || UserUtils.isStaff(scUserContext.user)));
-    }, [scPreferences, disableComposer, scUserContext.user]);
+    }, [preferences, disableComposer, scUserContext.user]);
     // STATE
     const [anchorNotification, setAnchorNotification] = React.useState(null);
     // HANDLERS

package/lib/esm/components/NavigationToolbarMobile/NavigationToolbarMobile.js

@@ -78,8 +78,17 @@ export default function NavigationToolbarMobile(inProps) {
     // STATE
     const [searchOpen, setSearchOpen] = useState(false);
     // MEMO
-    const groupsEnabled = useMemo(() => features && features.includes(SCFeatureName.GROUPING) && features.includes(SCFeatureName.TAGGING), [features]);
-    const eventsEnabled = useMemo(() => features && features.includes(SCFeatureName.EVENT) && features.includes(SCFeatureName.TAGGING), [features]);
+    const groupsEnabled = useMemo(() => preferences &&
+        features &&
+        features.includes(SCFeatureName.TAGGING) &&
+        features.includes(SCFeatureName.GROUPING) &&
+        SCPreferences.CONFIGURATIONS_GROUPS_ENABLED in preferences &&
+        preferences[SCPreferences.CONFIGURATIONS_GROUPS_ENABLED].value, [preferences, features]);
+    const eventsEnabled = useMemo(() => preferences &&
+        features &&
+        features.includes(SCFeatureName.TAGGING) &&
+        SCPreferences.CONFIGURATIONS_EVENTS_ENABLED in preferences &&
+        preferences[SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
     const exploreStreamEnabled = preferences[SCPreferences.CONFIGURATIONS_EXPLORE_STREAM_ENABLED].value;
     const postOnlyStaffEnabled = preferences[SCPreferences.CONFIGURATIONS_POST_ONLY_STAFF_ENABLED].value;
     const contentAvailable = preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY].value;

package/lib/esm/components/OnBoardingWidget/OnBoardingWidget.js

@@ -8,7 +8,7 @@ import classNames from 'classnames';
 import { useThemeProps } from '@mui/system';
 import Category from './Steps/Category';
 import { PREFIX } from './constants';
-import { getTheme, usePreviousValue, UserUtils, useSCContext, useSCPreferences, useSCTheme, useSCUser } from '@selfcommunity/react-core';
+import { getTheme, usePreviousValue, UserUtils, useSCContext, useSCFetchCategories, useSCPreferences, useSCTheme, useSCUser } from '@selfcommunity/react-core';
 import Appearance from './Steps/Appearance';
 import Profile from './Steps/Profile';
 import Invite from './Steps/Invite';
@@ -24,6 +24,7 @@ import OnBoardingWidgetSkeleton from './Skeleton';
 import { closeSnackbar, useSnackbar } from 'notistack';
 import { CONSOLE_PROD, CONSOLE_STAGE } from '../PlatformWidget/constants';
 import HeaderPlaceholder from '../../assets/onBoarding/header';
+import BaseDialog from '../../shared/BaseDialog';
 const classes = {
     root: `${PREFIX}-root`,
     content: `${PREFIX}-content`,
@@ -52,7 +53,7 @@ const OnBoardingWidget = (inProps) => {
     });
     const { className, GenerateContentsParams = {}, onGeneratedContent = null, onHeightChange } = props, rest = __rest(props, ["className", "GenerateContentsParams", "onGeneratedContent", "onHeightChange"]);
     // STATE
-    const [isLoading, setIsLoading] = useState(true);
+    const [loading, setLoading] = useState(true);
     const [initialized, setInitialized] = useState(false);
     const [steps, setSteps] = useState([]);
     const nextStep = useMemo(() => {
@@ -68,6 +69,7 @@ const OnBoardingWidget = (inProps) => {
     const prevContentsStep = usePreviousValue(currentContentsStep);
     const currentCategoriesStep = steps === null || steps === void 0 ? void 0 : steps.find((s) => s.step === SCOnBoardingStepType.CATEGORIES);
     const prevCategoriesStep = usePreviousValue(currentCategoriesStep);
+    const [showCategoriesModal, setShowCategoriesModal] = useState(false);
     // CONTEXT
     const scUserContext = useSCUser();
     const isAdmin = useMemo(() => UserUtils.isCommunityCreator(scUserContext.user), [scUserContext.user]);
@@ -80,6 +82,7 @@ const OnBoardingWidget = (inProps) => {
     // HOOKS
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
+    const { categories, isLoading } = useSCFetchCategories();
     // HANDLERS
     const completeStep = (s) => __awaiter(void 0, void 0, void 0, function* () {
         if (s.status !== SCOnBoardingStepStatusType.COMPLETED) {
@@ -112,14 +115,14 @@ const OnBoardingWidget = (inProps) => {
             const contentStep = res.results.find((step) => step.step === SCOnBoardingStepType.CONTENTS);
             setIsGenerating(res.results.some((step) => step.status === 'in_progress'));
             setSteps(res.results);
-            setIsLoading(false);
+            setLoading(false);
             if (contentStep.status === SCOnBoardingStepStatusType.IN_PROGRESS && contentStep.results.length !== 0 && onGeneratedContent) {
                 onGeneratedContent(contentStep.results);
             }
         })
             .catch((error) => {
             Logger.error(SCOPE_SC_UI, error);
-            setIsLoading(false);
+            setLoading(false);
         });
     });
     const handleChange = (newStep) => {
@@ -130,17 +133,22 @@ const OnBoardingWidget = (inProps) => {
         onHeightChange && onHeightChange();
     };
     const generateContent = (stepId) => __awaiter(void 0, void 0, void 0, function* () {
-        yield OnBoardingService.startAStep(stepId, GenerateContentsParams)
-            .then(() => {
-            setIsGenerating(true);
-        })
-            .catch((error) => {
-            Logger.error(SCOPE_SC_UI, error);
-            enqueueSnackbar(_jsx(FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
-                variant: 'error',
-                autoHideDuration: 3000
+        if (!isLoading && !categories.length) {
+            setShowCategoriesModal(true);
+        }
+        else {
+            yield OnBoardingService.startAStep(stepId, GenerateContentsParams)
+                .then(() => {
+                setIsGenerating(true);
+            })
+                .catch((error) => {
+                Logger.error(SCOPE_SC_UI, error);
+                enqueueSnackbar(_jsx(FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
+                    variant: 'error',
+                    autoHideDuration: 3000
+                });
             });
-        });
+        }
     });
     const handlePreferencesUpdate = () => {
         PreferenceService.getAllPreferences().then((preferences) => {
@@ -152,7 +160,7 @@ const OnBoardingWidget = (inProps) => {
     // EFFECTS
     useEffect(() => {
         if (prevContentsStep &&
-            prevCategoriesStep.status === SCOnBoardingStepStatusType.IN_PROGRESS &&
+            prevContentsStep.status === SCOnBoardingStepStatusType.IN_PROGRESS &&
             (currentContentsStep === null || currentContentsStep === void 0 ? void 0 : currentContentsStep.status) === SCOnBoardingStepStatusType.COMPLETED) {
             showSuccessAlert(currentContentsStep);
         }
@@ -233,6 +241,6 @@ const OnBoardingWidget = (inProps) => {
                                     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                     // @ts-ignore
                                     icon: (...chunks) => (_jsx(Icon, Object.assign({ color: "secondary", fontSize: "medium" }, { children: chunks })))
-                                } }) }))) }) })), _jsx(AccordionDetails, { children: _jsx(Widget, Object.assign({ className: classes.content, elevation: 0 }, { children: isLoading ? (_jsx(OnBoardingWidgetSkeleton, {})) : (_jsxs(CardContent, { children: [_jsx(List, Object.assign({ className: isMobile ? classes.stepsMobile : classes.steps }, { children: steps === null || steps === void 0 ? void 0 : steps.map((step) => (_jsx(ListItem, { children: isMobile ? (_jsx(Chip, { size: "small", label: _jsxs(_Fragment, { children: [_jsx(FormattedMessage, { id: `ui.onBoardingWidget.${step.step}`, defaultMessage: `ui.onBoardingWidget.${step.step}` }), ' ', step.status === SCOnBoardingStepStatusType.COMPLETED && (_jsx(Icon, Object.assign({ color: (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.COMPLETED && (step === null || step === void 0 ? void 0 : step.step) !== (_step === null || _step === void 0 ? void 0 : _step.step) ? 'success' : 'inherit' }, { children: "check" })))] }), onClick: () => handleChange(step), variant: step.step === (_step === null || _step === void 0 ? void 0 : _step.step) ? 'filled' : 'outlined', color: step.status === SCOnBoardingStepStatusType.COMPLETED ? 'success' : 'default' })) : (_jsxs(ListItemButton, Object.assign({ onClick: () => handleChange(step), selected: (step === null || step === void 0 ? void 0 : step.step) === (_step === null || _step === void 0 ? void 0 : _step.step) }, { children: [_jsx(ListItemIcon, { children: _jsx(Checkbox, { edge: "start", checked: step.status === SCOnBoardingStepStatusType.COMPLETED, tabIndex: -1, disableRipple: true, inputProps: { 'aria-labelledby': step.step }, size: 'small' }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: `ui.onBoardingWidget.${step.step}`, defaultMessage: `ui.onBoardingWidget.${step.step}` }) })] }))) }, step.id))) })), _jsx(Box, Object.assign({ className: classes.stepContent }, { children: _jsx(Fade, Object.assign({ in: true, timeout: 2400 }, { children: _jsx(Box, { children: getStepContent() }) })) }))] })) })) })] })) })));
+                                } }) }))) }) })), _jsx(AccordionDetails, { children: _jsx(Widget, Object.assign({ className: classes.content, elevation: 0 }, { children: loading ? (_jsx(OnBoardingWidgetSkeleton, {})) : (_jsxs(CardContent, { children: [_jsx(List, Object.assign({ className: isMobile ? classes.stepsMobile : classes.steps }, { children: steps === null || steps === void 0 ? void 0 : steps.map((step) => (_jsx(ListItem, { children: isMobile ? (_jsx(Chip, { size: "small", label: _jsxs(_Fragment, { children: [_jsx(FormattedMessage, { id: `ui.onBoardingWidget.${step.step}`, defaultMessage: `ui.onBoardingWidget.${step.step}` }), ' ', step.status === SCOnBoardingStepStatusType.COMPLETED && (_jsx(Icon, Object.assign({ color: (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.COMPLETED && (step === null || step === void 0 ? void 0 : step.step) !== (_step === null || _step === void 0 ? void 0 : _step.step) ? 'success' : 'inherit' }, { children: "check" })))] }), onClick: () => handleChange(step), variant: step.step === (_step === null || _step === void 0 ? void 0 : _step.step) ? 'filled' : 'outlined', color: step.status === SCOnBoardingStepStatusType.COMPLETED ? 'success' : 'default' })) : (_jsxs(ListItemButton, Object.assign({ onClick: () => handleChange(step), selected: (step === null || step === void 0 ? void 0 : step.step) === (_step === null || _step === void 0 ? void 0 : _step.step) }, { children: [_jsx(ListItemIcon, { children: _jsx(Checkbox, { edge: "start", checked: step.status === SCOnBoardingStepStatusType.COMPLETED, tabIndex: -1, disableRipple: true, inputProps: { 'aria-labelledby': step.step }, size: 'small' }) }), _jsx(ListItemText, { primary: _jsx(FormattedMessage, { id: `ui.onBoardingWidget.${step.step}`, defaultMessage: `ui.onBoardingWidget.${step.step}` }) })] }))) }, step.id))) })), _jsxs(Box, Object.assign({ className: classes.stepContent }, { children: [_jsx(Fade, Object.assign({ in: true, timeout: 2400 }, { children: _jsx(Box, { children: getStepContent() }) })), showCategoriesModal && (_jsx(BaseDialog, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.ai.no.categories", defaultMessage: "ui.onBoardingWidget.ai.no.categories" }), DialogContentProps: { dividers: false }, open: showCategoriesModal, onClose: () => setShowCategoriesModal(false), actions: _jsx(Button, Object.assign({ color: "secondary", onClick: () => setShowCategoriesModal(false) }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.ai.no.categories.cancel", defaultMessage: "ui.onBoardingWidget.ai.no.categories.cancel" }) })) }, { children: _jsx(Button, Object.assign({ color: "primary", href: isStage ? CONSOLE_STAGE : CONSOLE_PROD, onClick: () => setShowCategoriesModal(false), target: "_blank", startIcon: _jsx(Icon, Object.assign({ fontSize: "small" }, { children: "edit" })) }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.ai.no.categories.link", defaultMessage: "ui.onBoardingWidget.ai.no.categories.link" }) })) })))] }))] })) })) })] })) })));
 };
 export default OnBoardingWidget;

package/lib/esm/components/SuggestedEventsWidget/SuggestedEventsWidget.js

@@ -6,7 +6,7 @@ import { Endpoints, http, SuggestionService } from '@selfcommunity/api-services'
 import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
 import { Logger } from '@selfcommunity/utils';
 import classNames from 'classnames';
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { Swiper, SwiperSlide } from 'swiper/react';
 import { SCOPE_SC_UI } from '../../constants/Errors';
@@ -18,6 +18,8 @@ import Widget from '../Widget';
 import Arrow from './Arrow';
 import { PREFIX } from './constants';
 import Skeleton from './Skeleton';
+import PubSub from 'pubsub-js';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 const classes = {
     root: `${PREFIX}-root`,
     content: `${PREFIX}-content`,
@@ -56,6 +58,8 @@ export default function SuggestedEventsWidget(inProps) {
     const scRoutingContext = useSCRouting();
     //HOOKS
     const theme = useTheme();
+    // REFS
+    const updatesSubscription = useRef(null);
     useEffect(() => {
         SuggestionService.getEventSuggestion(Object.assign({}, endpointQueryParams))
             .then((payload) => {
@@ -104,6 +108,28 @@ export default function SuggestedEventsWidget(inProps) {
             }
         }
     }, [count, hideMarginLeft, hideMarginRight]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onDeleteEventHandler = useCallback((_msg, deleted) => {
+        setEvents((prev) => {
+            if (prev.some((e) => e.id === deleted)) {
+                return prev.filter((e) => e.id !== deleted);
+            }
+            return prev;
+        });
+    }, [events]);
+    /**
+     * On mount, subscribe to receive event updates (only delete)
+     */
+    useEffect(() => {
+        if (events) {
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.DELETE}`, onDeleteEventHandler);
+        }
+        return () => {
+            updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);
+        };
+    }, [events]);
     // RENDER
     if (!events && loading) {
         return _jsx(Skeleton, {});

package/lib/esm/components/UserSubscribedGroupsWidget/UserSubscribedGroupsWidget.js

@@ -6,7 +6,7 @@ import List from '@mui/material/List';
 import { Button, CardContent, ListItem, Typography } from '@mui/material';
 import { GroupService } from '@selfcommunity/api-services';
 import { CacheStrategies, isInteger, Logger } from '@selfcommunity/utils';
-import { SCCache, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
+import { SCCache, SCPreferences, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
 import { actionWidgetTypes, dataWidgetReducer, stateWidgetInitializer } from '../../utils/widget';
 import { SCFeatureName, SCGroupPrivacyType, SCGroupSubscriptionStatusType } from '@selfcommunity/types';
 import { SCOPE_SC_UI } from '../../constants/Errors';
@@ -71,8 +71,13 @@ export default function UserSubscribedGroupsWidget(inProps) {
     // CONTEXT
     const scUserContext = useSCUser();
     const isMe = useMemo(() => scUserContext.user && userId === scUserContext.user.id, [scUserContext.user, userId]);
-    const { features } = useSCPreferences();
-    const groupsEnabled = useMemo(() => features.includes(SCFeatureName.GROUPING) && features.includes(SCFeatureName.TAGGING), [features]);
+    const { preferences, features } = useSCPreferences();
+    const groupsEnabled = useMemo(() => preferences &&
+        features &&
+        features.includes(SCFeatureName.TAGGING) &&
+        features.includes(SCFeatureName.GROUPING) &&
+        SCPreferences.CONFIGURATIONS_GROUPS_ENABLED in preferences &&
+        preferences[SCPreferences.CONFIGURATIONS_GROUPS_ENABLED].value, [preferences, features]);
     // STATE
     const [state, dispatch] = useReducer(dataWidgetReducer, {
         isLoadingNext: false,

package/lib/esm/constants/PubSub.d.ts

@@ -12,6 +12,7 @@ export declare enum SCTopicType {
 export declare enum SCGroupEventType {
     CREATE = "create",
     EDIT = "edit",
+    DELETE = "delete",
     MEMBERS = "members",
     ADD_MEMBER = "members.add_member",
     INVITE_MEMBER = "members.invite_member",

package/lib/esm/constants/PubSub.js

@@ -13,6 +13,7 @@ export var SCGroupEventType;
 (function (SCGroupEventType) {
     SCGroupEventType["CREATE"] = "create";
     SCGroupEventType["EDIT"] = "edit";
+    SCGroupEventType["DELETE"] = "delete";
     SCGroupEventType["MEMBERS"] = "members";
     SCGroupEventType["ADD_MEMBER"] = "members.add_member";
     SCGroupEventType["INVITE_MEMBER"] = "members.invite_member";

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

@@ -18,6 +18,10 @@ export interface EventActionsMenuProps extends IconButtonProps {
      * Handles callback on delete confirm
      */
     onDeleteConfirm?: () => void;
+    /**
+     * Handles on edit success
+     */
+    onEditSuccess?: (data: SCEventType) => any;
     /**
      * Any other properties
      */

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

@@ -13,6 +13,9 @@ import { EventService } from '@selfcommunity/api-services';
 import { ADD_EVENT_TO_CALENDAR, CANCEL_EVENT, GET_EVENT_LINK } from '../../constants/EventActionsMenu';
 import { copyTextToClipboard } from '@selfcommunity/utils';
 import { enqueueSnackbar } from 'notistack';
+import PubSub from 'pubsub-js';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
+import EventForm from '../../components/EventForm';
 const PREFIX = 'SCEventActionsMenu';
 const classes = {
     root: `${PREFIX}-root`,
@@ -67,16 +70,17 @@ export default function EventActionsMenu(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { className, event, eventId, onDeleteConfirm } = props, rest = __rest(props, ["className", "event", "eventId", "onDeleteConfirm"]);
+    const { className, event, eventId, onDeleteConfirm, onEditSuccess } = props, rest = __rest(props, ["className", "event", "eventId", "onDeleteConfirm", "onEditSuccess"]);
     // STATE
     const [anchorEl, setAnchorEl] = useState(null);
     const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
+    const [openEdit, setOpenEdit] = useState(false);
     // HOOKS
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
     const scRoutingContext = useSCRouting();
     const scUserContext = useSCUser();
-    const { scEvent } = useSCFetchEvent({ id: eventId, event });
+    const { scEvent, setSCEvent } = useSCFetchEvent({ id: eventId, event });
     const isEventAdmin = 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 = useMemo(() => {
         if (scEvent && !scEvent.running) {
@@ -91,10 +95,17 @@ export default function EventActionsMenu(inProps) {
     const handleClose = () => {
         setAnchorEl(null);
     };
+    const handleEditClick = () => {
+        setOpenEdit((o) => !o);
+    };
     const handleCloseDialog = () => {
         setOpenConfirmDialog(false);
         setAnchorEl(null);
     };
+    const handleEditSuccess = (data) => {
+        setSCEvent(data);
+        onEditSuccess && onEditSuccess(data);
+    };
     /**
      * Handles thread deletion
      */
@@ -103,6 +114,7 @@ export default function EventActionsMenu(inProps) {
             .then(() => {
             onDeleteConfirm();
             handleCloseDialog();
+            PubSub.publish(`${SCTopicType.EVENT}.${SCGroupEventType.DELETE}`, scEvent.id);
         })
             .catch((error) => {
             setOpenConfirmDialog(false);
@@ -145,6 +157,7 @@ export default function EventActionsMenu(inProps) {
             isEventAdmin &&
                 !isEventFinished && [
                 _jsx(Divider, {}, "divider"),
+                isMobile && (_jsxs(MenuItem, Object.assign({ className: classes.item, onClick: handleEditClick }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "edit" }) }), _jsx(FormattedMessage, { id: "ui.shared.eventActionsMenu.item.edit", defaultMessage: "ui.shared.eventActionsMenu.item.edit" })] }), "edit")),
                 _jsxs(MenuItem, Object.assign({ className: classes.item, onClick: () => handleAction(CANCEL_EVENT) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "close" }) }), _jsx(FormattedMessage, { id: "ui.shared.eventActionsMenu.item.cancel", defaultMessage: "ui.shared.eventActionsMenu.item.cancel" })] }), "cancel")
             ]
         ];
@@ -152,5 +165,5 @@ export default function EventActionsMenu(inProps) {
     if (!scEvent) {
         return null;
     }
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen }, { children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: _jsx(List, { children: renderList() }) }))) : (_jsx(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && (_jsx(ConfirmDialog, { open: openConfirmDialog, title: _jsx(FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen }, { children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: _jsx(List, { children: renderList() }) }))) : (_jsx(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && (_jsx(ConfirmDialog, { open: openConfirmDialog, title: _jsx(FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.msg", defaultMessage: "ui.shared.eventActionsMenu.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.shared.eventActionsMenu.dialog.confirm", defaultMessage: "ui.shared.eventActionsMenu.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog })), openEdit && _jsx(EventForm, { onClose: handleEditClick, event: scEvent, onSuccess: handleEditSuccess })] }));
 }