@selfcommunity/react-ui 0.9.0-alpha.10 → 0.9.0-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/Event/Event.js +1 -1
- package/lib/cjs/components/EventHeader/EventHeader.js +1 -1
- package/lib/cjs/components/EventMediaWidget/EventMediaWidget.js +34 -37
- package/lib/cjs/components/EventMembersWidget/EventMembersWidget.d.ts +0 -3
- package/lib/cjs/components/EventMembersWidget/EventMembersWidget.js +34 -15
- package/lib/cjs/components/Events/Events.js +3 -2
- package/lib/cjs/shared/EventActionsMenu/index.d.ts +1 -1
- package/lib/cjs/utils/widget.js +1 -11
- package/lib/esm/components/Event/Event.js +1 -1
- package/lib/esm/components/EventHeader/EventHeader.js +1 -1
- package/lib/esm/components/EventMediaWidget/EventMediaWidget.js +34 -37
- package/lib/esm/components/EventMembersWidget/EventMembersWidget.d.ts +0 -3
- package/lib/esm/components/EventMembersWidget/EventMembersWidget.js +34 -15
- package/lib/esm/components/Events/Events.js +3 -2
- package/lib/esm/shared/EventActionsMenu/index.d.ts +1 -1
- package/lib/esm/utils/widget.js +1 -11
- package/lib/umd/react-ui.js +1 -1
- package/package.json +3 -3
|
@@ -108,7 +108,7 @@ function Event(inProps) {
|
|
|
108
108
|
});
|
|
109
109
|
const { id = `event_object_${props.eventId ? props.eventId : props.event ? props.event.id : ''}`, eventId = null, event = null, className = null, template = event_1.SCEventTemplateType.SNIPPET, hideInProgress = false, hideEventParticipants = false, hideEventPlanner = false, actions, EventParticipantsButtonComponentProps = {}, EventSkeletonComponentProps = {} } = props, rest = tslib_1.__rest(props, ["id", "eventId", "event", "className", "template", "hideInProgress", "hideEventParticipants", "hideEventPlanner", "actions", "EventParticipantsButtonComponentProps", "EventSkeletonComponentProps"]);
|
|
110
110
|
// STATE
|
|
111
|
-
const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event
|
|
111
|
+
const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
|
|
112
112
|
const inProgress = (0, react_1.useMemo)(() => scEvent && scEvent.active && scEvent.running, [scEvent]);
|
|
113
113
|
// CONTEXT
|
|
114
114
|
const scRoutingContext = (0, react_core_1.useSCRouting)();
|
|
@@ -176,6 +176,6 @@ function EventHeader(inProps) {
|
|
|
176
176
|
month: 'long'
|
|
177
177
|
}),
|
|
178
178
|
hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
|
|
179
|
-
} })) })), (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, eventId: scEvent.id, 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, eventId: scEvent.id, 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({
|
|
179
|
+
} })) })), (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, eventId: scEvent.id, 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, eventId: scEvent.id, 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))] })) }) })] }))] })));
|
|
180
180
|
}
|
|
181
181
|
exports.default = EventHeader;
|
|
@@ -83,8 +83,8 @@ function EventMediaWidget(inProps) {
|
|
|
83
83
|
cacheStrategy,
|
|
84
84
|
visibleItems: limit
|
|
85
85
|
}, widget_1.stateWidgetInitializer);
|
|
86
|
-
const [medias, setMedias] = (0, react_1.useState)(
|
|
87
|
-
const [mediasCount, setMediasCount] = (0, react_1.useState)(
|
|
86
|
+
const [medias, setMedias] = (0, react_1.useState)([]);
|
|
87
|
+
const [mediasCount, setMediasCount] = (0, react_1.useState)(0);
|
|
88
88
|
const [openDialog, setOpenDialog] = (0, react_1.useState)(false);
|
|
89
89
|
const [openDialogConfirm, setOpenDialogConfirm] = (0, react_1.useState)(false);
|
|
90
90
|
const [mediaId, setMediaId] = (0, react_1.useState)(null);
|
|
@@ -96,6 +96,25 @@ function EventMediaWidget(inProps) {
|
|
|
96
96
|
// CONSTS
|
|
97
97
|
const hasAllow = (0, react_1.useMemo)(() => { var _a; return ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === (scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id); }, [scUserContext, scEvent]);
|
|
98
98
|
const countHiddenMedia = (0, react_1.useMemo)(() => mediasCount - MEDIAS_TO_SHOW, [mediasCount]);
|
|
99
|
+
/**
|
|
100
|
+
* Initialize component
|
|
101
|
+
* Fetch data only if the component is not initialized and it is not loading data
|
|
102
|
+
*/
|
|
103
|
+
const _initComponent = (0, react_1.useCallback)(() => {
|
|
104
|
+
if (!state.initialized && !state.isLoadingNext) {
|
|
105
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
|
|
106
|
+
api_services_1.EventService.getEventPhotoGallery(scEvent.id, Object.assign({}, endpointQueryParams))
|
|
107
|
+
.then((payload) => {
|
|
108
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: Object.assign(Object.assign({}, payload), { initialized: true }) });
|
|
109
|
+
setMedias(payload.results);
|
|
110
|
+
setMediasCount(payload.count);
|
|
111
|
+
})
|
|
112
|
+
.catch((error) => {
|
|
113
|
+
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
114
|
+
utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
}, [state.isLoadingNext, scEvent, dispatch, setMedias, setMediasCount]);
|
|
99
118
|
const _fetchNext = (0, react_1.useCallback)((index) => {
|
|
100
119
|
if (mediasCount > medias.length && index >= 6 && !state.isLoadingNext && state.next) {
|
|
101
120
|
setPreview(index);
|
|
@@ -193,55 +212,33 @@ function EventMediaWidget(inProps) {
|
|
|
193
212
|
// EFFECTS
|
|
194
213
|
(0, react_1.useEffect)(() => {
|
|
195
214
|
let _t;
|
|
196
|
-
if (scUserContext.user &&
|
|
197
|
-
scEvent &&
|
|
198
|
-
!state.initialized &&
|
|
199
|
-
Boolean((eventId !== undefined && scEvent.id === eventId) || (event && scEvent.id === event.id))) {
|
|
215
|
+
if (scUserContext.user && scEvent) {
|
|
200
216
|
_t = setTimeout(_initComponent);
|
|
201
217
|
return () => {
|
|
202
218
|
clearTimeout(_t);
|
|
219
|
+
if (state.initialized) {
|
|
220
|
+
dispatch({
|
|
221
|
+
type: widget_1.actionWidgetTypes.INITIALIZE,
|
|
222
|
+
payload: {
|
|
223
|
+
cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
224
|
+
}
|
|
225
|
+
});
|
|
226
|
+
}
|
|
203
227
|
};
|
|
204
228
|
}
|
|
205
229
|
}, [scUserContext.user, scEvent, state.initialized]);
|
|
206
|
-
(0, react_1.useEffect)(() => {
|
|
207
|
-
if (state.initialized && scEvent && Boolean((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) {
|
|
208
|
-
dispatch({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
|
|
209
|
-
}
|
|
210
|
-
}, [state.initialized, scEvent, eventId, event]);
|
|
211
|
-
/**
|
|
212
|
-
* Initialize component
|
|
213
|
-
* Fetch data only if the component is not initialized and it is not loading data
|
|
214
|
-
*/
|
|
215
|
-
const _initComponent = (0, react_1.useCallback)(() => {
|
|
216
|
-
if (!state.isLoadingNext) {
|
|
217
|
-
dispatch({ type: widget_1.actionWidgetTypes.LOADING_NEXT });
|
|
218
|
-
api_services_1.EventService.getEventPhotoGallery(scEvent.id, Object.assign({}, endpointQueryParams))
|
|
219
|
-
.then((payload) => {
|
|
220
|
-
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: Object.assign(Object.assign({}, payload), { initialized: true }) });
|
|
221
|
-
setMedias(payload.results);
|
|
222
|
-
setMediasCount(payload.count);
|
|
223
|
-
})
|
|
224
|
-
.catch((error) => {
|
|
225
|
-
dispatch({ type: widget_1.actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
226
|
-
utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
|
|
227
|
-
});
|
|
228
|
-
}
|
|
229
|
-
}, [state.isLoadingNext, scEvent, eventId, dispatch, setMedias, setMediasCount]);
|
|
230
230
|
(0, react_1.useEffect)(() => {
|
|
231
231
|
if (isMobile && openDialog && state.next) {
|
|
232
232
|
handleNext();
|
|
233
233
|
}
|
|
234
234
|
}, [isMobile, openDialog, state.next]);
|
|
235
235
|
// RENDER
|
|
236
|
-
if (!scEvent ||
|
|
237
|
-
!state.initialized ||
|
|
238
|
-
(scEvent && ((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) ||
|
|
239
|
-
(state.isLoadingNext && !state.initialized)) {
|
|
240
|
-
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
241
|
-
}
|
|
242
|
-
if (state.initialized && state.count === 0 && !hasAllow) {
|
|
236
|
+
if (!scEvent || (state.initialized && mediasCount === 0 && !hasAllow)) {
|
|
243
237
|
return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
|
|
244
238
|
}
|
|
239
|
+
if (!state.initialized || (state.isLoadingNext && mediasCount === 0)) {
|
|
240
|
+
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
241
|
+
}
|
|
245
242
|
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, rest, { showPadding: hasAllow }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardHeader, { title: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMediaWidget.title", defaultMessage: "ui.eventMediaWidget.title" }) })), hasAllow && mediasCount > 0 && (0, jsx_runtime_1.jsx)(TriggerButton_1.default, { size: "small", onAdd: handleAddMedia })] })), className: classes.header }), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsxs)(system_1.Box, Object.assign({ className: classes.grid }, { children: [showSkeleton === 'widget' && (0, jsx_runtime_1.jsx)(Skeleton_1.EventMediaSkeleton, {}), medias.slice(0, MEDIAS_TO_SHOW).map((media, i, array) => ((0, jsx_runtime_1.jsx)(system_1.Box, Object.assign({ onClick: () => handleOpenLightbox(i), sx: {
|
|
246
243
|
background: `url(${media.image}) no-repeat center`
|
|
247
244
|
}, className: classes.media }, { children: medias.length > array.length && i === array.length - 1 && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(system_1.Box, { className: classes.mediaLayer }), (0, jsx_runtime_1.jsx)(system_1.Box, Object.assign({ className: classes.countHiddenMediaWrapper }, { children: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.countHiddenMedia }, { children: ["+", countHiddenMedia] })) }))] })) }), media.id))), hasAllow && mediasCount === 0 && ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }) }, { children: (0, jsx_runtime_1.jsx)(TriggerButton_1.default, { size: "large", onAdd: handleAddMedia, isSquare: true }) })))] })), preview !== -1 && (0, jsx_runtime_1.jsx)(Lightbox_1.Lightbox, { onClose: handleCloseLightbox, index: preview, medias: medias, onIndexChange: _fetchNext })] })), hasAllow && mediasCount > 0 && ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "caption" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMediaWidget.showAll", defaultMessage: "ui.eventMediaWidget.showAll" }) })) })) }))), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: medias.length, height: isMobile ? '100%' : '515px', next: handleNext, hasMoreNext: Boolean(state.next), className: classes.dialogInfiniteScroll, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMediaWidget.noMoreResults", defaultMessage: "ui.eventMediaWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsxs)(system_1.Box, Object.assign({ className: classes.grid }, { children: [medias.map((media) => ((0, jsx_runtime_1.jsx)(system_1.Box, Object.assign({ sx: {
|
|
@@ -13,6 +13,7 @@ const react_intl_1 = require("react-intl");
|
|
|
13
13
|
require("swiper/css");
|
|
14
14
|
const Errors_1 = require("../../constants/Errors");
|
|
15
15
|
const Pagination_1 = require("../../constants/Pagination");
|
|
16
|
+
const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
|
|
16
17
|
const widget_1 = require("../../utils/widget");
|
|
17
18
|
const Widget_1 = tslib_1.__importDefault(require("../Widget"));
|
|
18
19
|
const constants_1 = require("./constants");
|
|
@@ -61,10 +62,10 @@ function EventMembersWidget(inProps) {
|
|
|
61
62
|
cacheStrategy,
|
|
62
63
|
visibleItems: limit
|
|
63
64
|
}, widget_1.stateWidgetInitializer);
|
|
64
|
-
const [participantsCount, setParticipantsCount] = (0, react_1.useState)(
|
|
65
|
-
const [invitedCount, setInvitedCount] = (0, react_1.useState)(
|
|
66
|
-
const [requestsCount, setRequestsCount] = (0, react_1.useState)(
|
|
67
|
-
const [requestsUsers, setRequestsUsers] = (0, react_1.useState)(
|
|
65
|
+
const [participantsCount, setParticipantsCount] = (0, react_1.useState)(0);
|
|
66
|
+
const [invitedCount, setInvitedCount] = (0, react_1.useState)(0);
|
|
67
|
+
const [requestsCount, setRequestsCount] = (0, react_1.useState)(0);
|
|
68
|
+
const [requestsUsers, setRequestsUsers] = (0, react_1.useState)([]);
|
|
68
69
|
const [tabValue, setTabValue] = (0, react_1.useState)(types_1.TabContentEnum.PARTICIPANTS);
|
|
69
70
|
const [refresh, setRefresh] = (0, react_1.useState)(null);
|
|
70
71
|
// CONTEXT
|
|
@@ -149,16 +150,33 @@ function EventMembersWidget(inProps) {
|
|
|
149
150
|
});
|
|
150
151
|
return () => {
|
|
151
152
|
clearTimeout(_t);
|
|
153
|
+
if (participants.initialized) {
|
|
154
|
+
dispatchParticipants({
|
|
155
|
+
type: widget_1.actionWidgetTypes.INITIALIZE,
|
|
156
|
+
payload: {
|
|
157
|
+
cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.USER_PARTECIPANTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
158
|
+
}
|
|
159
|
+
});
|
|
160
|
+
}
|
|
161
|
+
if (invited.initialized) {
|
|
162
|
+
dispatchParticipants({
|
|
163
|
+
type: widget_1.actionWidgetTypes.INITIALIZE,
|
|
164
|
+
payload: {
|
|
165
|
+
cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.USER_INVITED_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
166
|
+
}
|
|
167
|
+
});
|
|
168
|
+
}
|
|
169
|
+
if (requests.initialized) {
|
|
170
|
+
dispatchParticipants({
|
|
171
|
+
type: widget_1.actionWidgetTypes.INITIALIZE,
|
|
172
|
+
payload: {
|
|
173
|
+
cacheKey: react_core_1.SCCache.getWidgetStateCacheKey(react_core_1.SCCache.USER_REQUESTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
174
|
+
}
|
|
175
|
+
});
|
|
176
|
+
}
|
|
152
177
|
};
|
|
153
178
|
}
|
|
154
179
|
}, [scUserContext.user, scEvent, refresh]);
|
|
155
|
-
(0, react_1.useEffect)(() => {
|
|
156
|
-
if (participants.initialized && scEvent && Boolean((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) {
|
|
157
|
-
dispatchParticipants({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
|
|
158
|
-
dispatchRequests({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
|
|
159
|
-
dispatchInvited({ type: widget_1.actionWidgetTypes.RESET, payload: {} });
|
|
160
|
-
}
|
|
161
|
-
}, [participants.initialized, scEvent, eventId, event]);
|
|
162
180
|
// HANDLERS
|
|
163
181
|
const handleTabChange = (0, react_1.useCallback)((_evt, newTabValue) => {
|
|
164
182
|
setTabValue(newTabValue);
|
|
@@ -172,12 +190,13 @@ function EventMembersWidget(inProps) {
|
|
|
172
190
|
}
|
|
173
191
|
setRefresh(_tabValue);
|
|
174
192
|
}, []);
|
|
175
|
-
if (!scEvent
|
|
176
|
-
!participants.initialized ||
|
|
177
|
-
(scEvent && ((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) ||
|
|
178
|
-
(tabValue === types_1.TabContentEnum.PARTICIPANTS && participants.isLoadingNext && !participants.initialized)) {
|
|
193
|
+
if (!scEvent && !participants.initialized) {
|
|
179
194
|
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
180
195
|
}
|
|
196
|
+
// RENDER
|
|
197
|
+
if (!scEvent) {
|
|
198
|
+
return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
|
|
199
|
+
}
|
|
181
200
|
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.title }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: title, defaultMessage: title }) })), (0, jsx_runtime_1.jsxs)(lab_1.TabContext, Object.assign({ value: tabValue }, { children: [(0, jsx_runtime_1.jsxs)(lab_1.TabList, Object.assign({ className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: participantsCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) }))] })), value: types_1.TabContentEnum.PARTICIPANTS }), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: invitedCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) }))] })), value: types_1.TabContentEnum.INVITED })), hasAllow && ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: requestsCount })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) }))] })), value: types_1.TabContentEnum.REQUESTS }))] })), (0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentEnum.PARTICIPANTS, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) })), hasAllow && ((0, jsx_runtime_1.jsx)(lab_1.TabPanel, Object.assign({ value: types_1.TabContentEnum.INVITED, className: classes.tabPanel }, { children: (0, jsx_runtime_1.jsx)(TabContentComponent_1.default, { tabValue: types_1.TabContentEnum.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
|
|
182
201
|
scEvent,
|
|
183
202
|
setCount: setInvitedCount
|
|
@@ -145,13 +145,13 @@ function Events(inProps) {
|
|
|
145
145
|
* On mount, fetches events list
|
|
146
146
|
*/
|
|
147
147
|
(0, react_1.useEffect)(() => {
|
|
148
|
-
if (!contentAvailability
|
|
148
|
+
if (!contentAvailability) {
|
|
149
149
|
return;
|
|
150
150
|
}
|
|
151
151
|
else {
|
|
152
152
|
query === '' && fetchEvents();
|
|
153
153
|
}
|
|
154
|
-
}, [contentAvailability,
|
|
154
|
+
}, [contentAvailability, dateSearch, location, showFollowed, showPastEvents, showMyEvents, query]);
|
|
155
155
|
/**
|
|
156
156
|
* Subscriber for pubsub callback
|
|
157
157
|
*/
|
|
@@ -214,6 +214,7 @@ function Events(inProps) {
|
|
|
214
214
|
/**
|
|
215
215
|
* Renders events list
|
|
216
216
|
*/
|
|
217
|
+
console.log(location);
|
|
217
218
|
const c = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [showFilters && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, className: classes.filters, gap: 2 }, { children: filters ? (filters) : !general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(events.length !== 0 || (events.length === 0 && showMyEvents)) && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot
|
|
218
219
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
219
220
|
// @ts-ignore
|
package/lib/cjs/utils/widget.js
CHANGED
|
@@ -58,17 +58,7 @@ function dataWidgetReducer(state, action) {
|
|
|
58
58
|
_state = { isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false };
|
|
59
59
|
break;
|
|
60
60
|
case exports.actionWidgetTypes.INITIALIZE:
|
|
61
|
-
_state = {
|
|
62
|
-
cacheKey: action.payload.cacheKey ? action.payload.cacheKey : null,
|
|
63
|
-
count: action.payload.count ? action.payload.count : 0,
|
|
64
|
-
results: action.payload.results ? action.payload.results : [],
|
|
65
|
-
next: action.payload.next ? action.payload.next : null,
|
|
66
|
-
previous: action.payload.previous ? action.payload.previous : null,
|
|
67
|
-
isLoadingNext: action.payload.isLoadingNext ? action.payload.isLoadingNext : false,
|
|
68
|
-
isLoadingPrevious: action.payload.isLoadingPrevious ? action.payload.isLoadingPrevious : false,
|
|
69
|
-
visibleItems: action.payload.visibleItems ? action.payload.visibleItems : null,
|
|
70
|
-
initialized: false
|
|
71
|
-
};
|
|
61
|
+
_state = Object.assign({ isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false }, action.payload);
|
|
72
62
|
break;
|
|
73
63
|
}
|
|
74
64
|
utils_1.LRUCache.set(_state.cacheKey, _state);
|
|
@@ -106,7 +106,7 @@ export default function Event(inProps) {
|
|
|
106
106
|
});
|
|
107
107
|
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"]);
|
|
108
108
|
// STATE
|
|
109
|
-
const { scEvent } = useSCFetchEvent({ id: eventId, event
|
|
109
|
+
const { scEvent } = useSCFetchEvent({ id: eventId, event });
|
|
110
110
|
const inProgress = useMemo(() => scEvent && scEvent.active && scEvent.running, [scEvent]);
|
|
111
111
|
// CONTEXT
|
|
112
112
|
const scRoutingContext = useSCRouting();
|
|
@@ -174,5 +174,5 @@ export default function EventHeader(inProps) {
|
|
|
174
174
|
month: 'long'
|
|
175
175
|
}),
|
|
176
176
|
hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
|
|
177
|
-
} })) })), _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({
|
|
177
|
+
} })) })), _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))] })) }) })] }))] })));
|
|
178
178
|
}
|
|
@@ -81,8 +81,8 @@ export default function EventMediaWidget(inProps) {
|
|
|
81
81
|
cacheStrategy,
|
|
82
82
|
visibleItems: limit
|
|
83
83
|
}, stateWidgetInitializer);
|
|
84
|
-
const [medias, setMedias] = useState(
|
|
85
|
-
const [mediasCount, setMediasCount] = useState(
|
|
84
|
+
const [medias, setMedias] = useState([]);
|
|
85
|
+
const [mediasCount, setMediasCount] = useState(0);
|
|
86
86
|
const [openDialog, setOpenDialog] = useState(false);
|
|
87
87
|
const [openDialogConfirm, setOpenDialogConfirm] = useState(false);
|
|
88
88
|
const [mediaId, setMediaId] = useState(null);
|
|
@@ -94,6 +94,25 @@ export default function EventMediaWidget(inProps) {
|
|
|
94
94
|
// CONSTS
|
|
95
95
|
const hasAllow = useMemo(() => { var _a; return ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === (scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id); }, [scUserContext, scEvent]);
|
|
96
96
|
const countHiddenMedia = useMemo(() => mediasCount - MEDIAS_TO_SHOW, [mediasCount]);
|
|
97
|
+
/**
|
|
98
|
+
* Initialize component
|
|
99
|
+
* Fetch data only if the component is not initialized and it is not loading data
|
|
100
|
+
*/
|
|
101
|
+
const _initComponent = useCallback(() => {
|
|
102
|
+
if (!state.initialized && !state.isLoadingNext) {
|
|
103
|
+
dispatch({ type: actionWidgetTypes.LOADING_NEXT });
|
|
104
|
+
EventService.getEventPhotoGallery(scEvent.id, Object.assign({}, endpointQueryParams))
|
|
105
|
+
.then((payload) => {
|
|
106
|
+
dispatch({ type: actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: Object.assign(Object.assign({}, payload), { initialized: true }) });
|
|
107
|
+
setMedias(payload.results);
|
|
108
|
+
setMediasCount(payload.count);
|
|
109
|
+
})
|
|
110
|
+
.catch((error) => {
|
|
111
|
+
dispatch({ type: actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
112
|
+
Logger.error(SCOPE_SC_UI, error);
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
}, [state.isLoadingNext, scEvent, dispatch, setMedias, setMediasCount]);
|
|
97
116
|
const _fetchNext = useCallback((index) => {
|
|
98
117
|
if (mediasCount > medias.length && index >= 6 && !state.isLoadingNext && state.next) {
|
|
99
118
|
setPreview(index);
|
|
@@ -191,55 +210,33 @@ export default function EventMediaWidget(inProps) {
|
|
|
191
210
|
// EFFECTS
|
|
192
211
|
useEffect(() => {
|
|
193
212
|
let _t;
|
|
194
|
-
if (scUserContext.user &&
|
|
195
|
-
scEvent &&
|
|
196
|
-
!state.initialized &&
|
|
197
|
-
Boolean((eventId !== undefined && scEvent.id === eventId) || (event && scEvent.id === event.id))) {
|
|
213
|
+
if (scUserContext.user && scEvent) {
|
|
198
214
|
_t = setTimeout(_initComponent);
|
|
199
215
|
return () => {
|
|
200
216
|
clearTimeout(_t);
|
|
217
|
+
if (state.initialized) {
|
|
218
|
+
dispatch({
|
|
219
|
+
type: actionWidgetTypes.INITIALIZE,
|
|
220
|
+
payload: {
|
|
221
|
+
cacheKey: SCCache.getWidgetStateCacheKey(SCCache.EVENT_MEDIA_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
222
|
+
}
|
|
223
|
+
});
|
|
224
|
+
}
|
|
201
225
|
};
|
|
202
226
|
}
|
|
203
227
|
}, [scUserContext.user, scEvent, state.initialized]);
|
|
204
|
-
useEffect(() => {
|
|
205
|
-
if (state.initialized && scEvent && Boolean((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) {
|
|
206
|
-
dispatch({ type: actionWidgetTypes.RESET, payload: {} });
|
|
207
|
-
}
|
|
208
|
-
}, [state.initialized, scEvent, eventId, event]);
|
|
209
|
-
/**
|
|
210
|
-
* Initialize component
|
|
211
|
-
* Fetch data only if the component is not initialized and it is not loading data
|
|
212
|
-
*/
|
|
213
|
-
const _initComponent = useCallback(() => {
|
|
214
|
-
if (!state.isLoadingNext) {
|
|
215
|
-
dispatch({ type: actionWidgetTypes.LOADING_NEXT });
|
|
216
|
-
EventService.getEventPhotoGallery(scEvent.id, Object.assign({}, endpointQueryParams))
|
|
217
|
-
.then((payload) => {
|
|
218
|
-
dispatch({ type: actionWidgetTypes.LOAD_NEXT_SUCCESS, payload: Object.assign(Object.assign({}, payload), { initialized: true }) });
|
|
219
|
-
setMedias(payload.results);
|
|
220
|
-
setMediasCount(payload.count);
|
|
221
|
-
})
|
|
222
|
-
.catch((error) => {
|
|
223
|
-
dispatch({ type: actionWidgetTypes.LOAD_NEXT_FAILURE, payload: { errorLoadNext: error } });
|
|
224
|
-
Logger.error(SCOPE_SC_UI, error);
|
|
225
|
-
});
|
|
226
|
-
}
|
|
227
|
-
}, [state.isLoadingNext, scEvent, eventId, dispatch, setMedias, setMediasCount]);
|
|
228
228
|
useEffect(() => {
|
|
229
229
|
if (isMobile && openDialog && state.next) {
|
|
230
230
|
handleNext();
|
|
231
231
|
}
|
|
232
232
|
}, [isMobile, openDialog, state.next]);
|
|
233
233
|
// RENDER
|
|
234
|
-
if (!scEvent ||
|
|
235
|
-
!state.initialized ||
|
|
236
|
-
(scEvent && ((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) ||
|
|
237
|
-
(state.isLoadingNext && !state.initialized)) {
|
|
238
|
-
return _jsx(SkeletonComponent, {});
|
|
239
|
-
}
|
|
240
|
-
if (state.initialized && state.count === 0 && !hasAllow) {
|
|
234
|
+
if (!scEvent || (state.initialized && mediasCount === 0 && !hasAllow)) {
|
|
241
235
|
return _jsx(HiddenPlaceholder, {});
|
|
242
236
|
}
|
|
237
|
+
if (!state.initialized || (state.isLoadingNext && mediasCount === 0)) {
|
|
238
|
+
return _jsx(SkeletonComponent, {});
|
|
239
|
+
}
|
|
243
240
|
return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { showPadding: hasAllow }, { children: [_jsx(CardHeader, { title: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center" }, { children: [_jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.title", defaultMessage: "ui.eventMediaWidget.title" }) })), hasAllow && mediasCount > 0 && _jsx(TriggerButton, { size: "small", onAdd: handleAddMedia })] })), className: classes.header }), _jsx(Divider, {}), _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsxs(Box, Object.assign({ className: classes.grid }, { children: [showSkeleton === 'widget' && _jsx(EventMediaSkeleton, {}), medias.slice(0, MEDIAS_TO_SHOW).map((media, i, array) => (_jsx(Box, Object.assign({ onClick: () => handleOpenLightbox(i), sx: {
|
|
244
241
|
background: `url(${media.image}) no-repeat center`
|
|
245
242
|
}, className: classes.media }, { children: medias.length > array.length && i === array.length - 1 && (_jsxs(Fragment, { children: [_jsx(Box, { className: classes.mediaLayer }), _jsx(Box, Object.assign({ className: classes.countHiddenMediaWrapper }, { children: _jsxs(Typography, Object.assign({ className: classes.countHiddenMedia }, { children: ["+", countHiddenMedia] })) }))] })) }), media.id))), hasAllow && mediasCount === 0 && (_jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }) }, { children: _jsx(TriggerButton, { size: "large", onAdd: handleAddMedia, isSquare: true }) })))] })), preview !== -1 && _jsx(Lightbox, { onClose: handleCloseLightbox, index: preview, medias: medias, onIndexChange: _fetchNext })] })), hasAllow && mediasCount > 0 && (_jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Button, Object.assign({ onClick: handleToggleDialogOpen }, { children: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.showAll", defaultMessage: "ui.eventMediaWidget.showAll" }) })) })) }))), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: medias.length, height: isMobile ? '100%' : '515px', next: handleNext, hasMoreNext: Boolean(state.next), className: classes.dialogInfiniteScroll, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.noMoreResults", defaultMessage: "ui.eventMediaWidget.noMoreResults" }) })) }, { children: _jsxs(Box, Object.assign({ className: classes.grid }, { children: [medias.map((media) => (_jsx(Box, Object.assign({ sx: {
|
|
@@ -11,6 +11,7 @@ import { FormattedMessage } from 'react-intl';
|
|
|
11
11
|
import 'swiper/css';
|
|
12
12
|
import { SCOPE_SC_UI } from '../../constants/Errors';
|
|
13
13
|
import { DEFAULT_PAGINATION_OFFSET } from '../../constants/Pagination';
|
|
14
|
+
import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
|
|
14
15
|
import { actionWidgetTypes, dataWidgetReducer, stateWidgetInitializer } from '../../utils/widget';
|
|
15
16
|
import Widget from '../Widget';
|
|
16
17
|
import { PREFIX } from './constants';
|
|
@@ -59,10 +60,10 @@ export default function EventMembersWidget(inProps) {
|
|
|
59
60
|
cacheStrategy,
|
|
60
61
|
visibleItems: limit
|
|
61
62
|
}, stateWidgetInitializer);
|
|
62
|
-
const [participantsCount, setParticipantsCount] = useState(
|
|
63
|
-
const [invitedCount, setInvitedCount] = useState(
|
|
64
|
-
const [requestsCount, setRequestsCount] = useState(
|
|
65
|
-
const [requestsUsers, setRequestsUsers] = useState(
|
|
63
|
+
const [participantsCount, setParticipantsCount] = useState(0);
|
|
64
|
+
const [invitedCount, setInvitedCount] = useState(0);
|
|
65
|
+
const [requestsCount, setRequestsCount] = useState(0);
|
|
66
|
+
const [requestsUsers, setRequestsUsers] = useState([]);
|
|
66
67
|
const [tabValue, setTabValue] = useState(TabContentEnum.PARTICIPANTS);
|
|
67
68
|
const [refresh, setRefresh] = useState(null);
|
|
68
69
|
// CONTEXT
|
|
@@ -147,16 +148,33 @@ export default function EventMembersWidget(inProps) {
|
|
|
147
148
|
});
|
|
148
149
|
return () => {
|
|
149
150
|
clearTimeout(_t);
|
|
151
|
+
if (participants.initialized) {
|
|
152
|
+
dispatchParticipants({
|
|
153
|
+
type: actionWidgetTypes.INITIALIZE,
|
|
154
|
+
payload: {
|
|
155
|
+
cacheKey: SCCache.getWidgetStateCacheKey(SCCache.USER_PARTECIPANTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
156
|
+
}
|
|
157
|
+
});
|
|
158
|
+
}
|
|
159
|
+
if (invited.initialized) {
|
|
160
|
+
dispatchParticipants({
|
|
161
|
+
type: actionWidgetTypes.INITIALIZE,
|
|
162
|
+
payload: {
|
|
163
|
+
cacheKey: SCCache.getWidgetStateCacheKey(SCCache.USER_INVITED_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
164
|
+
}
|
|
165
|
+
});
|
|
166
|
+
}
|
|
167
|
+
if (requests.initialized) {
|
|
168
|
+
dispatchParticipants({
|
|
169
|
+
type: actionWidgetTypes.INITIALIZE,
|
|
170
|
+
payload: {
|
|
171
|
+
cacheKey: SCCache.getWidgetStateCacheKey(SCCache.USER_REQUESTS_EVENTS_STATE_CACHE_PREFIX_KEY, scEvent.id)
|
|
172
|
+
}
|
|
173
|
+
});
|
|
174
|
+
}
|
|
150
175
|
};
|
|
151
176
|
}
|
|
152
177
|
}, [scUserContext.user, scEvent, refresh]);
|
|
153
|
-
useEffect(() => {
|
|
154
|
-
if (participants.initialized && scEvent && Boolean((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) {
|
|
155
|
-
dispatchParticipants({ type: actionWidgetTypes.RESET, payload: {} });
|
|
156
|
-
dispatchRequests({ type: actionWidgetTypes.RESET, payload: {} });
|
|
157
|
-
dispatchInvited({ type: actionWidgetTypes.RESET, payload: {} });
|
|
158
|
-
}
|
|
159
|
-
}, [participants.initialized, scEvent, eventId, event]);
|
|
160
178
|
// HANDLERS
|
|
161
179
|
const handleTabChange = useCallback((_evt, newTabValue) => {
|
|
162
180
|
setTabValue(newTabValue);
|
|
@@ -170,12 +188,13 @@ export default function EventMembersWidget(inProps) {
|
|
|
170
188
|
}
|
|
171
189
|
setRefresh(_tabValue);
|
|
172
190
|
}, []);
|
|
173
|
-
if (!scEvent
|
|
174
|
-
!participants.initialized ||
|
|
175
|
-
(scEvent && ((eventId !== undefined && scEvent.id !== eventId) || (event && scEvent.id !== event.id))) ||
|
|
176
|
-
(tabValue === TabContentEnum.PARTICIPANTS && participants.isLoadingNext && !participants.initialized)) {
|
|
191
|
+
if (!scEvent && !participants.initialized) {
|
|
177
192
|
return _jsx(Skeleton, {});
|
|
178
193
|
}
|
|
194
|
+
// RENDER
|
|
195
|
+
if (!scEvent) {
|
|
196
|
+
return _jsx(HiddenPlaceholder, {});
|
|
197
|
+
}
|
|
179
198
|
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: TabContentEnum.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: TabContentEnum.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: TabContentEnum.REQUESTS }))] })), _jsx(TabPanel, Object.assign({ value: TabContentEnum.PARTICIPANTS, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentEnum.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) })), hasAllow && (_jsx(TabPanel, Object.assign({ value: TabContentEnum.INVITED, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentEnum.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
|
|
180
199
|
scEvent,
|
|
181
200
|
setCount: setInvitedCount
|
|
@@ -142,13 +142,13 @@ export default function Events(inProps) {
|
|
|
142
142
|
* On mount, fetches events list
|
|
143
143
|
*/
|
|
144
144
|
useEffect(() => {
|
|
145
|
-
if (!contentAvailability
|
|
145
|
+
if (!contentAvailability) {
|
|
146
146
|
return;
|
|
147
147
|
}
|
|
148
148
|
else {
|
|
149
149
|
query === '' && fetchEvents();
|
|
150
150
|
}
|
|
151
|
-
}, [contentAvailability,
|
|
151
|
+
}, [contentAvailability, dateSearch, location, showFollowed, showPastEvents, showMyEvents, query]);
|
|
152
152
|
/**
|
|
153
153
|
* Subscriber for pubsub callback
|
|
154
154
|
*/
|
|
@@ -211,6 +211,7 @@ export default function Events(inProps) {
|
|
|
211
211
|
/**
|
|
212
212
|
* Renders events list
|
|
213
213
|
*/
|
|
214
|
+
console.log(location);
|
|
214
215
|
const c = (_jsxs(_Fragment, { children: [showFilters && (_jsx(Grid, Object.assign({ container: true, className: classes.filters, gap: 2 }, { children: filters ? (filters) : !general ? (_jsxs(_Fragment, { children: [(events.length !== 0 || (events.length === 0 && showMyEvents)) && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(EventsChipRoot
|
|
215
216
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
216
217
|
// @ts-ignore
|
package/lib/esm/utils/widget.js
CHANGED
|
@@ -55,17 +55,7 @@ export function dataWidgetReducer(state, action) {
|
|
|
55
55
|
_state = { isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false };
|
|
56
56
|
break;
|
|
57
57
|
case actionWidgetTypes.INITIALIZE:
|
|
58
|
-
_state = {
|
|
59
|
-
cacheKey: action.payload.cacheKey ? action.payload.cacheKey : null,
|
|
60
|
-
count: action.payload.count ? action.payload.count : 0,
|
|
61
|
-
results: action.payload.results ? action.payload.results : [],
|
|
62
|
-
next: action.payload.next ? action.payload.next : null,
|
|
63
|
-
previous: action.payload.previous ? action.payload.previous : null,
|
|
64
|
-
isLoadingNext: action.payload.isLoadingNext ? action.payload.isLoadingNext : false,
|
|
65
|
-
isLoadingPrevious: action.payload.isLoadingPrevious ? action.payload.isLoadingPrevious : false,
|
|
66
|
-
visibleItems: action.payload.visibleItems ? action.payload.visibleItems : null,
|
|
67
|
-
initialized: false
|
|
68
|
-
};
|
|
58
|
+
_state = Object.assign({ isLoadingNext: false, next: null, results: [], count: 0, errorLoadNext: null, initialized: false }, action.payload);
|
|
69
59
|
break;
|
|
70
60
|
}
|
|
71
61
|
LRUCache.set(_state.cacheKey, _state);
|