@selfcommunity/react-ui 0.11.0-alpha.67 → 0.11.0-alpha.69

package/lib/esm/components/Editor/nodes/MentionNode.js

@@ -22,16 +22,16 @@ function convertMentionElement(domNode) {
     };
 }
 export class MentionNode extends TextNode {
+    constructor(user, text, key) {
+        super(text !== null && text !== void 0 ? text : `@${user.username}`, key);
+        this.__user = user;
+    }
     static getType() {
         return 'mention';
     }
     static clone(node) {
         return new MentionNode(node.__user, node.__text, node.__key);
     }
-    constructor(user, text, key) {
-        super(text !== null && text !== void 0 ? text : `@${user.username}`, key);
-        this.__user = user;
-    }
     createDOM(config) {
         const tag = 'mention';
         const dom = document.createElement(tag);

package/lib/esm/components/Editor/plugins/ApiPlugin.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export type ApiRef = {
+export declare type ApiRef = {
     focus: () => void;
 };
 declare const _default: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<ApiRef>>;

package/lib/esm/components/Editor/plugins/MentionsPlugin.d.ts

@@ -1,9 +1,9 @@
-type MentionMatch = {
+declare type MentionMatch = {
     leadOffset: number;
     matchingString: string;
     replaceableString: string;
 };
-type Resolution = {
+declare type Resolution = {
     match: MentionMatch;
     range: Range;
 };

package/lib/esm/components/Editor/shared/useDecorators.d.ts

@@ -7,10 +7,10 @@
  */
 import type { LexicalEditor } from 'lexical';
 import * as React from 'react';
-type ErrorBoundaryProps = {
+declare type ErrorBoundaryProps = {
     children: JSX.Element;
     onError: (error: Error) => void;
 };
-export type ErrorBoundaryType = React.ComponentClass<ErrorBoundaryProps> | React.FC<ErrorBoundaryProps>;
+export declare type ErrorBoundaryType = React.ComponentClass<ErrorBoundaryProps> | React.FC<ErrorBoundaryProps>;
 export declare function useDecorators(editor: LexicalEditor, ErrorBoundary: ErrorBoundaryType): Array<JSX.Element>;
 export {};

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

@@ -1,4 +1,5 @@
 import { SCEventType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
 import React from 'react';
 import { SCEventTemplateType } from '../../types/event';
 import { EventParticipantsButtonProps } from '../EventParticipantsButton';
@@ -50,6 +51,10 @@ export interface EventProps extends WidgetProps {
      * @default {}
      */
     EventSkeletonComponentProps?: EventSkeletonProps;
+    /**
+     * Override default cache strategy on fetch element
+     */
+    cacheStrategy?: CacheStrategies;
     /**
      * Any other properties
      */

package/lib/esm/components/Event/Event.js

@@ -105,9 +105,9 @@ export default function Event(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { id = `event_object_${props.eventId ? props.eventId : props.event ? props.event.id : ''}`, eventId = null, event = null, className = null, template = SCEventTemplateType.SNIPPET, hideInProgress = false, hideEventParticipants = false, hideEventPlanner = false, actions, EventParticipantsButtonComponentProps = {}, EventSkeletonComponentProps = {} } = props, rest = __rest(props, ["id", "eventId", "event", "className", "template", "hideInProgress", "hideEventParticipants", "hideEventPlanner", "actions", "EventParticipantsButtonComponentProps", "EventSkeletonComponentProps"]);
+    const { id = `event_object_${props.eventId ? props.eventId : props.event ? props.event.id : ''}`, eventId = null, event = null, className = null, template = SCEventTemplateType.SNIPPET, hideInProgress = false, hideEventParticipants = false, hideEventPlanner = false, actions, EventParticipantsButtonComponentProps = {}, EventSkeletonComponentProps = {}, cacheStrategy } = props, rest = __rest(props, ["id", "eventId", "event", "className", "template", "hideInProgress", "hideEventParticipants", "hideEventPlanner", "actions", "EventParticipantsButtonComponentProps", "EventSkeletonComponentProps", "cacheStrategy"]);
     // STATE
-    const { scEvent } = useSCFetchEvent({ id: eventId, event, autoSubscribe: false });
+    const { scEvent } = useSCFetchEvent(Object.assign({ id: eventId, event, autoSubscribe: false }, (cacheStrategy && { cacheStrategy })));
     const inProgress = useMemo(() => scEvent && scEvent.active && scEvent.running, [scEvent]);
     const isEventFinished = useMemo(() => checkEventFinished(scEvent), [scEvent]);
     // CONTEXT

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

@@ -6,8 +6,8 @@ import { useThemeProps } from '@mui/system';
 import { LocalizationProvider, MobileDatePicker, MobileTimePicker } from '@mui/x-date-pickers';
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { EventService, formatHttpErrorCode } from '@selfcommunity/api-services';
-import { SCPreferences, useSCContext, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
-import { SCEventLocationType, SCEventPrivacyType, SCEventRecurrenceType, SCFeatureName } from '@selfcommunity/types';
+import { SCPreferences, UserUtils, useSCContext, useSCPaymentsEnabled, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
+import { SCContentType, SCEventLocationType, SCEventPrivacyType, SCEventRecurrenceType, SCFeatureName } from '@selfcommunity/types';
 import { Logger } from '@selfcommunity/utils';
 import classNames from 'classnames';
 import enLocale from 'date-fns/locale/en-US';
@@ -24,6 +24,8 @@ import UploadEventCover from './UploadEventCover';
 import { combineDateAndTime, getDateAndHours, getLaterDaysDate, getLaterHoursDate, getNewDate } from './utils';
 import { LIVESTREAM_DEFAULT_SETTINGS } from '../LiveStreamForm/constants';
 import CoverPlaceholder from '../../assets/deafultCover';
+import PaywallsConfigurator from '../PaywallsConfigurator';
+import { ContentAccessType } from '../PaywallsConfigurator/constants';
 const messages = defineMessages({
     name: {
         id: 'ui.eventForm.name.placeholder',
@@ -80,7 +82,8 @@ const classes = {
     privacySection: `${PREFIX}-privacy-section`,
     privacySectionInfo: `${PREFIX}-privacy-section-info`,
     error: `${PREFIX}-error`,
-    genericError: `${PREFIX}-generic-error`
+    genericError: `${PREFIX}-generic-error`,
+    paywallsConfiguratorWrap: `${PREFIX}-paywalls-configurator-wrap`
 };
 const Root = styled(Box, {
     name: PREFIX,
@@ -118,7 +121,7 @@ const Root = styled(Box, {
  * @param inProps
  */
 export default function EventForm(inProps) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     //PROPS
     const props = useThemeProps({
         props: inProps,
@@ -130,6 +133,7 @@ export default function EventForm(inProps) {
     const scUserContext = useSCUser();
     // INTL
     const intl = useIntl();
+    const isStaff = useMemo(() => scUserContext.user && UserUtils.isStaff(scUserContext.user), [scUserContext.user]);
     const startDateTime = useMemo(() => getNewDate(event === null || event === void 0 ? void 0 : event.start_date), [event]);
     const endDateTime = useMemo(() => getNewDate(event === null || event === void 0 ? void 0 : event.end_date), [event]);
     const initialFieldState = {
@@ -158,6 +162,8 @@ export default function EventForm(inProps) {
         link: (event === null || event === void 0 ? void 0 : event.link) || '',
         liveStreamSettings: (event === null || event === void 0 ? void 0 : event.live_stream) ? event === null || event === void 0 ? void 0 : event.live_stream.settings : null,
         recurring: (event === null || event === void 0 ? void 0 : event.recurring) || SCEventRecurrenceType.NEVER,
+        products: ((_b = event === null || event === void 0 ? void 0 : event.paywalls) === null || _b === void 0 ? void 0 : _b.map((p) => p.id)) || [],
+        contentAccessType: ((_c = event === null || event === void 0 ? void 0 : event.paywalls) === null || _c === void 0 ? void 0 : _c.length) ? ContentAccessType.PAID : ContentAccessType.FREE,
         isPublic: (event === null || event === void 0 ? void 0 : event.privacy) ? event.privacy === SCEventPrivacyType.PUBLIC : true,
         isSubmitting: false
     };
@@ -172,11 +178,15 @@ export default function EventForm(inProps) {
         scPreferences.features.includes(SCFeatureName.LIVE_STREAM) &&
         SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in scPreferences.preferences &&
         scPreferences.preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value, [scPreferences.preferences, scPreferences.features]);
-    const canCreateLiveStream = useMemo(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream; }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission]);
+    const canCreateLiveStream = useMemo(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream; }, [(_d = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _d === void 0 ? void 0 : _d.permission]);
     const privateEnabled = useMemo(() => scPreferences.preferences[SCPreferences.CONFIGURATIONS_EVENTS_PRIVATE_ENABLED].value, [scPreferences.preferences]);
     const visibilityEnabled = useMemo(() => scPreferences.preferences[SCPreferences.CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED].value, [scPreferences.preferences]);
-    const disablePastStartTime = useMemo(() => field.startDate.getDate() === getNewDate().getDate(), [field]);
-    const disablePastEndTime = useMemo(() => field.endDate.getDate() === getNewDate().getDate(), [field]);
+    const disablePastStartTime = useMemo(() => (event ? false : field.startTime.getDate() === initialFieldState.startTime.getDate()), [event, field]);
+    const disablePastEndTime = useMemo(() => field.endTime.getDate() === getNewDate().getDate(), [field]);
+    const minStartTime = useMemo(() => (event ? (field.startTime.getDate() === initialFieldState.startTime.getDate() ? initialFieldState.startTime : undefined) : undefined), [event, field, initialFieldState]);
+    const minStartDate = useMemo(() => (event ? initialFieldState.startDate : undefined), [event, initialFieldState]);
+    // PAYMENTS
+    const { isPaymentsEnabled } = useSCPaymentsEnabled();
     const _backgroundCover = Object.assign({}, (field.imageOriginal
         ? { background: `url('${field.imageOriginal}') center / cover` }
         : { background: `url('${CoverPlaceholder}') no-repeat 0 0 / 100% 100%` }));
@@ -215,6 +225,7 @@ export default function EventForm(inProps) {
         setField((prev) => (Object.assign(Object.assign({}, prev), { liveStreamSettings: Object.assign(Object.assign({}, prev.liveStreamSettings), data) })));
     }, []);
     const handleSubmit = useCallback(() => {
+        var _a;
         setField((prev) => (Object.assign(Object.assign({}, prev), { ['isSubmitting']: true })));
         setGenericError(null);
         const formData = new FormData();
@@ -252,6 +263,12 @@ export default function EventForm(inProps) {
         if (visibilityEnabled) {
             formData.append('visible', 'true');
         }
+        if (field.products.length && field.contentAccessType === ContentAccessType.PAID && (isStaff || (event && ((_a = event.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
+            formData.append(`products`, JSON.stringify(field.products));
+        }
+        else {
+            formData.append(`products`, '[]');
+        }
         formData.append('description', field.description);
         let eventService;
         if (event) {
@@ -317,25 +334,39 @@ export default function EventForm(inProps) {
         }
         setGenericError(null);
     }, [error, setField, setGenericError]);
-    const shouldDisableDate = useCallback((date) => {
+    /**
+     * Handle change content access tyoe
+     * @param type
+     */
+    const handleChangeContentAccessType = (type) => {
+        setField((prev) => (Object.assign(Object.assign({}, prev), { contentAccessType: type })));
+    };
+    /**
+     * Handle change payment products
+     * @param products
+     */
+    const handleChangePaymentsProducts = (products) => {
+        setField((prev) => (Object.assign(Object.assign({}, prev), { products: products.map((product) => product.id) })));
+    };
+    const shouldDisableDate = useCallback((day) => {
         let disabled = false;
         switch (field.recurring) {
             case SCEventRecurrenceType.DAILY:
-                disabled = date.getTime() > getDateAndHours(getLaterDaysDate(DAILY_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
+                disabled = day.getTime() > getDateAndHours(getLaterDaysDate(DAILY_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
                 break;
             case SCEventRecurrenceType.WEEKLY:
-                disabled = date.getTime() > getDateAndHours(getLaterDaysDate(WEEKLY_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
+                disabled = day.getTime() > getDateAndHours(getLaterDaysDate(WEEKLY_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
                 break;
             case SCEventRecurrenceType.MONTHLY:
-                disabled = date.getTime() > getDateAndHours(getLaterDaysDate(MONTHLY_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
+                disabled = day.getTime() > getDateAndHours(getLaterDaysDate(MONTHLY_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
                 break;
             case SCEventRecurrenceType.NEVER:
             default:
-                disabled = date.getTime() > getDateAndHours(getLaterDaysDate(NEVER_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
+                disabled = day.getTime() > getDateAndHours(getLaterDaysDate(NEVER_LATER_DAYS, field.startDate), 23, 59, 59, 59).getTime();
         }
         return disabled;
     }, [field]);
-    const shouldDisableTime = useCallback((date) => field.startTime.getTime() > date.getTime(), [field]);
+    const shouldDisableTime = useCallback((value) => value.getTime() < field.startTime.getTime(), [field]);
     /**
      * Renders root object
      */
@@ -343,7 +374,7 @@ export default function EventForm(inProps) {
                             endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: EVENT_TITLE_MAX_LENGTH - field.name.length }))
                         }, error: Boolean(field.name.length > EVENT_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > EVENT_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.name.error.maxLength", defaultMessage: "ui.eventForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale, localeText: {
                                 cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelAction)}`
-                            } }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: true, label: field.startDate && _jsx(FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, slots: {
+                            } }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && _jsx(FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, slots: {
                                         textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.startDate)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "CalendarIcon" }) }) }))) }) })))
                                     }, slotProps: {
                                         toolbar: {
@@ -354,7 +385,7 @@ export default function EventForm(inProps) {
                                     }, onChange: (value) => {
                                         handleChangeDateTime(value, 'startDate');
                                         handleChangeDateTime(value, 'startTime');
-                                    } }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, label: field.startTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, slots: {
+                                    } }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, slots: {
                                         textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.startTime)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) }))) }) })))
                                     }, slotProps: {
                                         toolbar: {
@@ -399,7 +430,7 @@ export default function EventForm(inProps) {
                             start_date: field.startDate,
                             location: field.location,
                             geolocation: field.geolocation,
-                            live_stream: Object.assign(Object.assign({ title: field.name || `${intl.formatMessage(messages.name)}` }, (event && ((_c = event.live_stream) === null || _c === void 0 ? void 0 : _c.created_at) && { created_at: field.startDate })), { settings: field.liveStreamSettings })
+                            live_stream: Object.assign(Object.assign({ title: field.name || `${intl.formatMessage(messages.name)}` }, (event && ((_e = event.live_stream) === null || _e === void 0 ? void 0 : _e.created_at) && { created_at: field.startDate })), { settings: field.liveStreamSettings })
                         }) }, EventAddressComponentProps)), privateEnabled && (_jsxs(Box, Object.assign({ className: classes.privacySection }, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [_jsxs(Typography, Object.assign({ className: classNames(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), _jsx(Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: (event === null || event === void 0 ? void 0 : event.privacy) === SCEventPrivacyType.PRIVATE }), _jsxs(Typography, Object.assign({ className: classNames(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), _jsx(Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? (_jsx(FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
                                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
                                         // @ts-ignores
@@ -409,8 +440,8 @@ export default function EventForm(inProps) {
                                         // @ts-ignore
                                         b: (chunks) => _jsx("strong", { children: chunks })
                                     } })) }))] }))), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                            endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) ? EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : EVENT_DESCRIPTION_MAX_LENGTH })))
-                        }, error: Boolean(((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) > EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) > EVENT_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), genericError && (_jsx(Box, Object.assign({ className: classes.genericError }, { children: _jsx(Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
+                            endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) ? EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : EVENT_DESCRIPTION_MAX_LENGTH })))
+                        }, error: Boolean(((_g = field.description) === null || _g === void 0 ? void 0 : _g.length) > EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_h = field.description) === null || _h === void 0 ? void 0 : _h.length) > EVENT_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), isPaymentsEnabled && isStaff && (_jsx(Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: _jsx(PaywallsConfigurator, Object.assign({}, (event && { contentId: event.id }), { contentType: SCContentType.EVENT, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) }))), genericError && (_jsx(Box, Object.assign({ className: classes.genericError }, { children: _jsx(Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
                                 !field.startDate ||
                                 !field.startTime ||
                                 !field.endDate ||

package/lib/esm/components/EventForm/types.d.ts

@@ -1,9 +1,10 @@
 import { SCEventLocationType, SCEventRecurrenceType, SCLiveStreamSettingsType } from '@selfcommunity/types';
-export type Place = {
+import { ContentAccessType } from '../PaywallsConfigurator/constants';
+export declare type Place = {
     description: string;
     id?: string;
 };
-export type Geolocation = {
+export declare type Geolocation = {
     location: SCEventLocationType;
     geolocation?: string;
     lat?: number;
@@ -11,7 +12,7 @@ export type Geolocation = {
     link?: string;
     liveStreamSettings?: SCLiveStreamSettingsType;
 };
-export type InitialFieldState = Geolocation & {
+export declare type InitialFieldState = Geolocation & {
     imageOriginal: string | ArrayBuffer;
     imageOriginalFile: string | Blob;
     startDate: Date | null;
@@ -23,6 +24,8 @@ export type InitialFieldState = Geolocation & {
     description: string;
     isPublic: boolean;
     isSubmitting: boolean;
+    products: number[];
+    contentAccessType: ContentAccessType;
 };
-export type FieldStateKeys = keyof InitialFieldState;
-export type FieldStateValues = InitialFieldState[FieldStateKeys];
+export declare type FieldStateKeys = keyof InitialFieldState;
+export declare type FieldStateValues = InitialFieldState[FieldStateKeys];

package/lib/esm/components/EventFormDialog/EventFormDialog.js

@@ -46,8 +46,14 @@ export default function EventFormDialog(inProps) {
         (_a = EventFormComponentProps.onSuccess) === null || _a === void 0 ? void 0 : _a.call(EventFormComponentProps, event);
         onClose === null || onClose === void 0 ? void 0 : onClose();
     }, [onClose, EventFormComponentProps]);
+    const handleClose = (_event, reason) => {
+        if (reason === 'backdropClick' || reason === 'escapeKeyDown') {
+            return;
+        }
+        onClose === null || onClose === void 0 ? void 0 : onClose();
+    };
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, title: (EventFormComponentProps === null || EventFormComponentProps === void 0 ? void 0 : EventFormComponentProps.event) ? (_jsx(FormattedMessage, { id: "ui.eventForm.title.edit", defaultMessage: "ui.eventForm.title.edit" })) : (_jsx(FormattedMessage, { id: "ui.eventForm.title", defaultMessage: "ui.eventForm.title" })), open: open, onClose: onClose, className: classNames(classes.root, className) }, rest, { children: _jsx(EventForm, Object.assign({}, EventFormComponentProps, { onSuccess: handleSuccess })) })));
+    return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, disableEscapeKeyDown: true, title: (EventFormComponentProps === null || EventFormComponentProps === void 0 ? void 0 : EventFormComponentProps.event) ? (_jsx(FormattedMessage, { id: "ui.eventForm.title.edit", defaultMessage: "ui.eventForm.title.edit" })) : (_jsx(FormattedMessage, { id: "ui.eventForm.title", defaultMessage: "ui.eventForm.title" })), open: open, onClose: handleClose, className: classNames(classes.root, className) }, rest, { children: _jsx(EventForm, Object.assign({}, EventFormComponentProps, { onSuccess: handleSuccess })) })));
 }

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

@@ -2,8 +2,8 @@ import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Box, Chip, Icon, Paper, Typography, useMediaQuery, useTheme, styled } from '@mui/material';
 import { useThemeProps } from '@mui/system';
-import { SCPreferences, useSCFetchEvent, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
-import { SCEventLocationType, SCEventPrivacyType } from '@selfcommunity/types';
+import { SCPreferences, useSCFetchEvent, useSCPaymentsEnabled, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
+import { SCContentType, SCEventLocationType, SCEventPrivacyType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
 import classNames from 'classnames';
 import { useMemo } from 'react';
 import { FormattedMessage, useIntl } from 'react-intl';
@@ -18,6 +18,7 @@ import User from '../User';
 import { PREFIX } from './constants';
 import EventHeaderSkeleton from './Skeleton';
 import { CacheStrategies } from '@selfcommunity/utils';
+import BuyButton from '../BuyButton';
 const classes = {
     root: `${PREFIX}-root`,
     cover: `${PREFIX}-cover`,
@@ -72,6 +73,7 @@ const Root = styled(Box, {
  * @param inProps
  */
 export default function EventHeader(inProps) {
+    var _a;
     // PROPS
     const props = useThemeProps({
         props: inProps,
@@ -79,13 +81,15 @@ export default function EventHeader(inProps) {
     });
     const { id = null, className = null, event, eventId = null, EventSubscribeButtonProps = {}, EventActionsProps = {} } = props, rest = __rest(props, ["id", "className", "event", "eventId", "EventSubscribeButtonProps", "EventActionsProps"]);
     // PREFERENCES
-    const scPreferences = useSCPreferences();
+    const { preferences } = useSCPreferences();
     // CONTEXT
     const scUserContext = useSCUser();
     // HOOKS
     const { scEvent, setSCEvent } = useSCFetchEvent({ id: eventId, event, cacheStrategy: CacheStrategies.NETWORK_ONLY });
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
+    // PAYMENTS
+    const { isPaymentsEnabled } = useSCPaymentsEnabled();
     // INTL
     const intl = useIntl();
     // CONST
@@ -103,7 +107,7 @@ export default function EventHeader(inProps) {
     }
     const _backgroundCover = Object.assign({}, (scEvent.image_bigger
         ? { background: `url('${scEvent.image_bigger}') center / cover` }
-        : { background: `url('${scPreferences.preferences[SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
+        : { background: `url('${preferences.preferences[SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
     return (
     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
     // @ts-ignore
@@ -139,5 +143,10 @@ 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: 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))] })) }) })] }))] })));
+                            } })) })), _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" })) })), isPaymentsEnabled &&
+                                ((_a = scEvent.paywalls) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
+                                (scEvent.privacy === SCEventPrivacyType.PUBLIC ||
+                                    (scEvent.privacy === SCEventPrivacyType.PRIVATE &&
+                                        scEvent.subscription_status &&
+                                        scEvent.subscription_status !== SCEventSubscriptionStatusType.REQUESTED)) && (_jsx(BuyButton, { size: "md", variant: "text", startIcon: _jsx(Icon, { children: "ticket" }), contentType: SCContentType.EVENT, content: scEvent, label: _jsx(FormattedMessage, { id: "ui.eventHeader.paid", defaultMessage: "ui.eventHeader.paid" }) }))] })), _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/EventInfoWidget/EventInfoWidget.js

@@ -2,7 +2,8 @@ import { __rest } from "tslib";
 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 { SCEventLocationType, SCEventPrivacyType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
 import PubSub from 'pubsub-js';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { FormattedMessage } from 'react-intl';
@@ -45,7 +46,7 @@ export default function EventInfoWidget(inProps) {
     const [showButton, setShowButton] = useState(!summaryExpanded);
     const [loading, setLoading] = useState(true);
     // HOOKS
-    const { scEvent, setSCEvent } = useSCFetchEvent({ id: eventId, event });
+    const { scEvent, setSCEvent } = useSCFetchEvent({ id: eventId, event, cacheStrategy: CacheStrategies.NETWORK_ONLY });
     // REFS
     const updatesSubscription = useRef(null);
     useEffect(() => {
@@ -67,9 +68,31 @@ export default function EventInfoWidget(inProps) {
         setExpanded(!expanded);
     }, [expanded]);
     const hasGeolocationOrLink = useMemo(() => Boolean((scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation) || (scEvent === null || scEvent === void 0 ? void 0 : scEvent.link) || (scEvent === null || scEvent === void 0 ? void 0 : scEvent.live_stream)), [scEvent]);
-    const showInfo = useMemo(() => ((scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === SCEventPrivacyType.PUBLIC && hasGeolocationOrLink) ||
-        ([SCEventSubscriptionStatusType.SUBSCRIBED, SCEventSubscriptionStatusType.GOING, SCEventSubscriptionStatusType.NOT_GOING].indexOf(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) > -1 &&
-            hasGeolocationOrLink), [scEvent]);
+    const showInfo = useMemo(() => {
+        var _a, _b, _c, _d;
+        return hasGeolocationOrLink &&
+            (((scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === SCEventPrivacyType.PUBLIC &&
+                (!((_a = scEvent.paywalls) === null || _a === void 0 ? void 0 : _a.length) ||
+                    (((_b = scEvent.paywalls) === null || _b === void 0 ? void 0 : _b.length) &&
+                        ((scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation) === SCEventLocationType.PERSON || (scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) === SCEventSubscriptionStatusType.GOING)))) ||
+                ((scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === SCEventPrivacyType.PRIVATE &&
+                    ((!((_c = scEvent.paywalls) === null || _c === void 0 ? void 0 : _c.length) &&
+                        [
+                            SCEventSubscriptionStatusType.INVITED,
+                            SCEventSubscriptionStatusType.SUBSCRIBED,
+                            SCEventSubscriptionStatusType.GOING,
+                            SCEventSubscriptionStatusType.NOT_GOING
+                        ].indexOf(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) > -1) ||
+                        (((_d = scEvent.paywalls) === null || _d === void 0 ? void 0 : _d.length) &&
+                            (((scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation) === SCEventLocationType.PERSON &&
+                                [
+                                    SCEventSubscriptionStatusType.INVITED,
+                                    SCEventSubscriptionStatusType.SUBSCRIBED,
+                                    SCEventSubscriptionStatusType.GOING,
+                                    SCEventSubscriptionStatusType.NOT_GOING
+                                ].indexOf(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) > -1) ||
+                                (scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) === SCEventSubscriptionStatusType.GOING)))));
+    }, [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

package/lib/esm/components/EventMediaWidget/asUploadButton.d.ts

@@ -1,6 +1,6 @@
 import { UploadButtonProps } from '@rpldy/upload-button';
 import type { ComponentType } from 'react';
-type FileInputProps = {
+declare type FileInputProps = {
     accept: string;
 };
 declare const asUploadButton: (Component: ComponentType<any>, inputProps: FileInputProps) => import("react").ForwardRefExoticComponent<Pick<UploadButtonProps<Element>, "id" | "className" | "text" | "children" | "onClick" | "method" | "headers" | "paramName" | "params" | "forceJsonResponse" | "withCredentials" | "formatGroupParamName" | "sendWithFormData" | "formDataAllowUndefined" | "formatServerResponse" | "isSuccessfulCall" | "destination" | "fileFilter" | "autoUpload" | "clearPendingOnAdd" | "grouped" | "maxGroupSize" | "inputFieldName" | "fastAbortThreshold" | "userData" | "extraProps"> & import("react").RefAttributes<any>>;

package/lib/esm/components/EventMembersWidget/EventMembersWidget.js

@@ -140,6 +140,10 @@ export default function EventMembersWidget(inProps) {
                     _initInvited();
                     setRefresh(null);
                 }
+                else if (refresh === TabContentType.REQUESTS) {
+                    _initRequests();
+                    setRefresh(null);
+                }
                 else {
                     _initParticipants();
                     _initInvited();
@@ -169,8 +173,11 @@ export default function EventMembersWidget(inProps) {
         else if (_tabValue === TabContentType.INVITED) {
             dispatchInvited({ type: actionWidgetTypes.RESET });
         }
+        else if (_tabValue === TabContentType.REQUESTS) {
+            dispatchRequests({ type: actionWidgetTypes.RESET });
+        }
         setRefresh(_tabValue);
-    }, [dispatchParticipants, dispatchInvited, setRefresh]);
+    }, [dispatchParticipants, dispatchInvited, dispatchRequests, setRefresh]);
     if (!scUserContext.user) {
         return _jsx(HiddenPlaceholder, {});
     }
@@ -180,7 +187,9 @@ export default function EventMembersWidget(inProps) {
         (tabValue === TabContentType.PARTICIPANTS && participants.isLoadingNext && !participants.initialized)) {
         return _jsx(Skeleton, {});
     }
-    return (_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Typography, Object.assign({ variant: "h5", className: classes.title }, { children: _jsx(FormattedMessage, { id: title, defaultMessage: title }) })), _jsxs(TabContext, Object.assign({ value: tabValue }, { children: [_jsxs(TabList, Object.assign({ className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth" }, { children: [_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: participantsCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) }))] })), value: TabContentType.PARTICIPANTS }), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: invitedCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) }))] })), value: TabContentType.INVITED })), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: requestsCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) }))] })), value: TabContentType.REQUESTS }))] })), _jsx(TabPanel, Object.assign({ value: TabContentType.PARTICIPANTS, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentType.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) })), hasAllow && (_jsx(TabPanel, Object.assign({ value: TabContentType.INVITED, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentType.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
+    return (_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Typography, Object.assign({ variant: "h5", className: classes.title }, { children: _jsx(FormattedMessage, { id: title, defaultMessage: title }) })), _jsxs(TabContext, Object.assign({ value: tabValue }, { children: [_jsxs(TabList, Object.assign({ className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth" }, { children: [_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: participantsCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) }))] })), value: TabContentType.PARTICIPANTS }), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: invitedCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) }))] })), value: TabContentType.INVITED })), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: requestsCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) }))] })), value: TabContentType.REQUESTS }))] })), _jsx(TabPanel, Object.assign({ value: TabContentType.PARTICIPANTS, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentType.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, actionProps: {
+                                    scEvent
+                                }, handleRefresh: handleRefresh }) })), hasAllow && (_jsx(TabPanel, Object.assign({ value: TabContentType.INVITED, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentType.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent,
                                     setCount: setInvitedCount
                                 }, handleRefresh: handleRefresh }) }))), hasAllow && (_jsx(TabPanel, Object.assign({ value: TabContentType.REQUESTS, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentType.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {

package/lib/esm/components/EventMembersWidget/TabContentComponent.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button, List, ListItem, styled, Typography } from '@mui/material';
 import { Endpoints, http } from '@selfcommunity/api-services';
+import { SCNotificationTopicType, SCNotificationTypologyType } from '@selfcommunity/types';
 import { Logger } from '@selfcommunity/utils';
 import { useSnackbar } from 'notistack';
 import PubSub from 'pubsub-js';
@@ -35,19 +36,22 @@ export default function TabContentComponent(props) {
     // STATE
     const [openDialog, setOpenDialog] = useState(false);
     // REFS
-    const updatesInvited = useRef(null);
     const updatesParticipants = useRef(null);
+    const updatesInvited = useRef(null);
+    const updatesRequested = useRef(null);
     // HOOKS
     const { enqueueSnackbar } = useSnackbar();
     // CONSTS
     const users = useMemo(() => (tabValue === TabContentType.REQUESTS ? actionProps === null || actionProps === void 0 ? void 0 : actionProps.users : state.results), [tabValue, actionProps === null || actionProps === void 0 ? void 0 : actionProps.users, state.results]);
     // EFFECTS
     useEffect(() => {
-        updatesInvited.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.INVITE_MEMBER}`, handleInviteMember);
         updatesParticipants.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.MEMBERS}`, handleToggleMember);
+        updatesInvited.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.INVITE_MEMBER}`, handleInviteMember);
+        updatesRequested.current = PubSub.subscribe(`${SCNotificationTopicType.INTERACTION}.${SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_EVENT}`, handleRequestMember);
         return () => {
-            updatesInvited.current && PubSub.unsubscribe(updatesInvited.current);
             updatesParticipants.current && PubSub.unsubscribe(updatesParticipants.current);
+            updatesInvited.current && PubSub.unsubscribe(updatesInvited.current);
+            updatesRequested.current && PubSub.unsubscribe(updatesRequested.current);
         };
     }, []);
     useEffect(() => {
@@ -82,6 +86,12 @@ export default function TabContentComponent(props) {
     const handleInviteMember = useCallback(() => {
         handleRefresh === null || handleRefresh === void 0 ? void 0 : handleRefresh(TabContentType.INVITED);
     }, [handleRefresh]);
+    const handleRequestMember = useCallback((_msg, response) => {
+        var _a;
+        if (response.data.event === ((_a = actionProps === null || actionProps === void 0 ? void 0 : actionProps.scEvent) === null || _a === void 0 ? void 0 : _a.id)) {
+            handleRefresh === null || handleRefresh === void 0 ? void 0 : handleRefresh(TabContentType.REQUESTS);
+        }
+    }, [handleRefresh, actionProps === null || actionProps === void 0 ? void 0 : actionProps.scEvent]);
     const getActionsComponent = useCallback((userId) => {
         if (tabValue === TabContentType.INVITED && actionProps) {
             const _handleInvitations = (invited) => {
@@ -124,7 +134,7 @@ export default function TabContentComponent(props) {
         const disabled = new Date(date).getTime() < new Date().getTime();
         const handleInvitations = (invited) => {
             if (invited) {
-                handleRefresh === null || handleRefresh === void 0 ? void 0 : handleRefresh(tabValue);
+                handleRefresh === null || handleRefresh === void 0 ? void 0 : handleRefresh(TabContentType.INVITED);
             }
         };
         return (_jsx(EventInviteButton, { event: actionProps.scEvent, className: classes.eventButton, handleInvitations: handleInvitations, disabled: disabled }));