@selfcommunity/react-ui 0.9.0-alpha.18 → 0.9.0-alpha.19

package/lib/cjs/components/EventHeader/EventHeader.js

@@ -96,8 +96,8 @@ function EventHeader(inProps) {
     /**
      * Handles callback subscribe/unsubscribe event
      */
-    const handleSubscribe = (_event, status) => {
-        setSCEvent(Object.assign({}, scEvent, { subscription_status: status }));
+    const handleSubscribe = (event) => {
+        setSCEvent(event);
     };
     // RENDER
     if (!scEvent) {
@@ -141,6 +141,6 @@ function EventHeader(inProps) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === types_1.SCEventLocationType.PERSON ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), (0, jsx_runtime_1.jsx)(User_1.default, { className: classes.planner, userId: scEvent.managed_by.id, secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isEventAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, disabled: isEventFinished }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [!isMobile && ((0, jsx_runtime_1.jsx)(EditEventButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(EventSubscribeButton_1.default, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })) }) })] }))] })));
+                            } })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === types_1.SCEventLocationType.PERSON ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), (0, jsx_runtime_1.jsx)(User_1.default, { className: classes.planner, userId: scEvent.managed_by.id, secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isEventAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, disabled: isEventFinished }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [!isMobile && ((0, jsx_runtime_1.jsx)(EditEventButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, onEditSuccess: setSCEvent, disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(EventSubscribeButton_1.default, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: setSCEvent }, EventActionsProps))] })) }) })] }))] })));
 }
 exports.default = EventHeader;

package/lib/cjs/components/EventSubscribeButton/EventSubscribeButton.d.ts

@@ -1,4 +1,4 @@
-import { SCEventSubscriptionStatusType, SCEventType, SCUserType } from '@selfcommunity/types';
+import { SCEventType, SCUserType } from '@selfcommunity/types';
 export interface EventSubscribeButtonProps {
     /**
      * Overrides or extends the styles applied to the component.
@@ -25,7 +25,7 @@ export interface EventSubscribeButtonProps {
      * @param user
      * @param joined
      */
-    onSubscribe?: (event: SCEventType, status: SCEventSubscriptionStatusType | null) => any;
+    onSubscribe?: (event: SCEventType) => any;
     /**
      * Others properties
      */

package/lib/cjs/components/EventSubscribeButton/EventSubscribeButton.js

@@ -102,12 +102,12 @@ function EventSubscribeButton(inProps) {
     });
     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]);
     // HANDLERS
-    const handleOpen = (event) => {
+    const handleOpen = (0, react_1.useCallback)((event) => {
         setAnchorEl(event.currentTarget);
-    };
-    const handleClose = () => {
+    }, [setAnchorEl]);
+    const handleClose = (0, react_1.useCallback)(() => {
         setAnchorEl(null);
-    };
+    }, [setAnchorEl]);
     (0, react_1.useEffect)(() => {
         /**
          * Call scEventsManager.subscriptionStatus inside an effect
@@ -117,25 +117,23 @@ function EventSubscribeButton(inProps) {
             setStatus(scEventsManager === null || scEventsManager === void 0 ? void 0 : scEventsManager.subscriptionStatus(scEvent));
         }
     }, [authUserId, scEventsManager === null || scEventsManager === void 0 ? void 0 : scEventsManager.subscriptionStatus, scEvent]);
-    const toggleEventAttendance = (eventStatus) => {
+    const toggleEventAttendance = (0, react_1.useCallback)((eventStatus) => {
         setLoading(true);
         const isGoing = eventStatus === types_1.SCEventSubscriptionStatusType.GOING ||
             !(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) ||
             (scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) === types_1.SCEventSubscriptionStatusType.INVITED;
         const toggleAction = isGoing ? scEventsManager.toggleEventAttendance(scEvent) : scEventsManager.toggleEventNonattendance(scEvent);
         toggleAction
-            .then(() => {
-            onSubscribe
-                ? onSubscribe(scEvent, (0, react_core_1.getEventStatus)(scEvent, isGoing))
-                : setSCEvent(Object.assign({}, scEvent, { subscription_status: (0, react_core_1.getEventStatus)(scEvent, isGoing) }));
+            .then((data) => {
+            onSubscribe ? onSubscribe(data) : setSCEvent(data);
             setLoading(false);
             pubsub_js_1.default.publish(`${PubSub_1.SCTopicType.EVENT}.${PubSub_1.SCGroupEventType.MEMBERS}`);
         })
             .catch((e) => {
             utils_1.Logger.error(Errors_1.SCOPE_SC_UI, e);
         });
-    };
-    const handleToggleAction = (event) => {
+    }, [scEvent, scEventsManager, onSubscribe, setLoading]);
+    const handleToggleAction = (0, react_1.useCallback)((event) => {
         setAnchorEl(null);
         if (!scUserContext.user) {
             scContext.settings.handleAnonymousAction();
@@ -143,7 +141,7 @@ function EventSubscribeButton(inProps) {
         else if (status !== undefined) {
             toggleEventAttendance(event.target.value);
         }
-    };
+    }, [scUserContext.user, status, scContext.settings]);
     function renderMenuItems() {
         return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ className: classes.item, disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { label: option.label, control: loading ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "primary", size: 20 })) : ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { size: "small", checked: status === option.value, value: option.value, onChange: handleToggleAction, name: `${option.value}-option`, inputProps: { 'aria-label': `${option.label}` } })), labelPlacement: "start" }) }), option.value))) }));
     }

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

@@ -94,8 +94,8 @@ export default function EventHeader(inProps) {
     /**
      * Handles callback subscribe/unsubscribe event
      */
-    const handleSubscribe = (_event, status) => {
-        setSCEvent(Object.assign({}, scEvent, { subscription_status: status }));
+    const handleSubscribe = (event) => {
+        setSCEvent(event);
     };
     // RENDER
     if (!scEvent) {
@@ -139,5 +139,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, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, 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))] })) }) })] }))] })));
+                            } })) })), _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, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, onEditSuccess: setSCEvent, 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: setSCEvent }, EventActionsProps))] })) }) })] }))] })));
 }

package/lib/esm/components/EventSubscribeButton/EventSubscribeButton.d.ts

@@ -1,4 +1,4 @@
-import { SCEventSubscriptionStatusType, SCEventType, SCUserType } from '@selfcommunity/types';
+import { SCEventType, SCUserType } from '@selfcommunity/types';
 export interface EventSubscribeButtonProps {
     /**
      * Overrides or extends the styles applied to the component.
@@ -25,7 +25,7 @@ export interface EventSubscribeButtonProps {
      * @param user
      * @param joined
      */
-    onSubscribe?: (event: SCEventType, status: SCEventSubscriptionStatusType | null) => any;
+    onSubscribe?: (event: SCEventType) => any;
     /**
      * Others properties
      */

package/lib/esm/components/EventSubscribeButton/EventSubscribeButton.js

@@ -4,12 +4,12 @@ import { LoadingButton } from '@mui/lab';
 import { Box, Button, Checkbox, CircularProgress, FormControlLabel, Icon, Menu, MenuItem, SwipeableDrawer, useMediaQuery, useTheme } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import { useThemeProps } from '@mui/system';
-import { getEventStatus, useSCContext, useSCFetchEvent, useSCUser } from '@selfcommunity/react-core';
+import { useSCContext, useSCFetchEvent, useSCUser } from '@selfcommunity/react-core';
 import { SCEventPrivacyType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
 import { CacheStrategies, Logger } from '@selfcommunity/utils';
 import classNames from 'classnames';
 import PubSub from 'pubsub-js';
-import { useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
@@ -100,12 +100,12 @@ export default function EventSubscribeButton(inProps) {
     });
     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]);
     // HANDLERS
-    const handleOpen = (event) => {
+    const handleOpen = useCallback((event) => {
         setAnchorEl(event.currentTarget);
-    };
-    const handleClose = () => {
+    }, [setAnchorEl]);
+    const handleClose = useCallback(() => {
         setAnchorEl(null);
-    };
+    }, [setAnchorEl]);
     useEffect(() => {
         /**
          * Call scEventsManager.subscriptionStatus inside an effect
@@ -115,25 +115,23 @@ export default function EventSubscribeButton(inProps) {
             setStatus(scEventsManager === null || scEventsManager === void 0 ? void 0 : scEventsManager.subscriptionStatus(scEvent));
         }
     }, [authUserId, scEventsManager === null || scEventsManager === void 0 ? void 0 : scEventsManager.subscriptionStatus, scEvent]);
-    const toggleEventAttendance = (eventStatus) => {
+    const toggleEventAttendance = useCallback((eventStatus) => {
         setLoading(true);
         const isGoing = eventStatus === SCEventSubscriptionStatusType.GOING ||
             !(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) ||
             (scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) === SCEventSubscriptionStatusType.INVITED;
         const toggleAction = isGoing ? scEventsManager.toggleEventAttendance(scEvent) : scEventsManager.toggleEventNonattendance(scEvent);
         toggleAction
-            .then(() => {
-            onSubscribe
-                ? onSubscribe(scEvent, getEventStatus(scEvent, isGoing))
-                : setSCEvent(Object.assign({}, scEvent, { subscription_status: getEventStatus(scEvent, isGoing) }));
+            .then((data) => {
+            onSubscribe ? onSubscribe(data) : setSCEvent(data);
             setLoading(false);
             PubSub.publish(`${SCTopicType.EVENT}.${SCGroupEventType.MEMBERS}`);
         })
             .catch((e) => {
             Logger.error(SCOPE_SC_UI, e);
         });
-    };
-    const handleToggleAction = (event) => {
+    }, [scEvent, scEventsManager, onSubscribe, setLoading]);
+    const handleToggleAction = useCallback((event) => {
         setAnchorEl(null);
         if (!scUserContext.user) {
             scContext.settings.handleAnonymousAction();
@@ -141,7 +139,7 @@ export default function EventSubscribeButton(inProps) {
         else if (status !== undefined) {
             toggleEventAttendance(event.target.value);
         }
-    };
+    }, [scUserContext.user, status, scContext.settings]);
     function renderMenuItems() {
         return (_jsx(Box, { children: options.map((option) => (_jsx(MenuItem, Object.assign({ className: classes.item, disabled: loading }, { children: _jsx(FormControlLabel, { label: option.label, control: loading ? (_jsx(CircularProgress, { color: "primary", size: 20 })) : (_jsx(Checkbox, { size: "small", checked: status === option.value, value: option.value, onChange: handleToggleAction, name: `${option.value}-option`, inputProps: { 'aria-label': `${option.label}` } })), labelPlacement: "start" }) }), option.value))) }));
     }