@selfcommunity/react-ui 0.11.0-alpha.37 → 0.11.0-alpha.38
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 +6 -3
- package/lib/cjs/components/EventParticipantsButton/EventParticipantsButton.js +1 -1
- package/lib/cjs/components/Events/Events.d.ts +5 -0
- package/lib/cjs/components/Events/Events.js +21 -10
- package/lib/cjs/components/Events/OngoingEventsFilter.d.ts +8 -0
- package/lib/cjs/components/Events/OngoingEventsFilter.js +24 -0
- package/lib/esm/components/Event/Event.js +6 -3
- package/lib/esm/components/EventParticipantsButton/EventParticipantsButton.js +1 -1
- package/lib/esm/components/Events/Events.d.ts +5 -0
- package/lib/esm/components/Events/Events.js +22 -11
- package/lib/esm/components/Events/OngoingEventsFilter.d.ts +8 -0
- package/lib/esm/components/Events/OngoingEventsFilter.js +21 -0
- package/lib/umd/react-ui.js +1 -1
- package/package.json +7 -7
|
@@ -19,6 +19,7 @@ const User_1 = tslib_1.__importDefault(require("../User"));
|
|
|
19
19
|
const Widget_1 = tslib_1.__importDefault(require("../Widget"));
|
|
20
20
|
const constants_1 = require("./constants");
|
|
21
21
|
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
|
|
22
|
+
const events_1 = require("../../utils/events");
|
|
22
23
|
const classes = {
|
|
23
24
|
root: `${constants_1.PREFIX}-root`,
|
|
24
25
|
detailRoot: `${constants_1.PREFIX}-detail-root`,
|
|
@@ -46,7 +47,8 @@ const classes = {
|
|
|
46
47
|
snippetInProgress: `${constants_1.PREFIX}-snippet-in-progress`,
|
|
47
48
|
snippetPrimary: `${constants_1.PREFIX}-snippet-primary`,
|
|
48
49
|
snippetSecondary: `${constants_1.PREFIX}-snippet-secondary`,
|
|
49
|
-
snippetActions: `${constants_1.PREFIX}-snippet-actions
|
|
50
|
+
snippetActions: `${constants_1.PREFIX}-snippet-actions`,
|
|
51
|
+
finishedChip: `${constants_1.PREFIX}-finished-chip`
|
|
50
52
|
};
|
|
51
53
|
const Root = (0, styles_1.styled)(Widget_1.default, {
|
|
52
54
|
name: constants_1.PREFIX,
|
|
@@ -110,6 +112,7 @@ function Event(inProps) {
|
|
|
110
112
|
// STATE
|
|
111
113
|
const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event, autoSubscribe: false });
|
|
112
114
|
const inProgress = (0, react_1.useMemo)(() => scEvent && scEvent.active && scEvent.running, [scEvent]);
|
|
115
|
+
const isEventFinished = (0, react_1.useMemo)(() => (0, events_1.checkEventFinished)(scEvent), [scEvent]);
|
|
113
116
|
// CONTEXT
|
|
114
117
|
const scRoutingContext = (0, react_core_1.useSCRouting)();
|
|
115
118
|
// HOOKS
|
|
@@ -128,10 +131,10 @@ function Event(inProps) {
|
|
|
128
131
|
contentObj = ((0, jsx_runtime_1.jsxs)(DetailRoot, Object.assign({ className: classes.detailRoot }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.detailImageWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.detailImage }), !hideInProgress && inProgress && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.detailInProgress })), (0, jsx_runtime_1.jsx)(Calendar_1.default, { day: new Date(scEvent.start_date).getDate() })] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.detailContent }, { children: [scEvent.active ? ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.detailNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3", className: classes.detailName }, { children: scEvent.name })) }))) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.detailNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3", className: classes.detailName }, { children: scEvent.name })) }))), (0, jsx_runtime_1.jsx)(EventInfoDetails_1.default, { event: scEvent }), !hideEventPlanner && ((0, jsx_runtime_1.jsx)(User_1.default, { user: scEvent.managed_by, elevation: 0, secondary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "caption" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.myEventsWidget.planner", defaultMessage: "ui.myEventsWidget.planner" }) })), actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}), className: classes.detailUser })), !hideEventParticipants && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { className: classes.detailFirstDivider }), (0, jsx_runtime_1.jsx)(EventParticipantsButton_1.default, Object.assign({ event: scEvent }, EventParticipantsButtonComponentProps))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, { className: classes.detailSecondDivider })] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.detailActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
|
|
129
132
|
}
|
|
130
133
|
else if (template === event_1.SCEventTemplateType.PREVIEW) {
|
|
131
|
-
contentObj = ((0, jsx_runtime_1.jsxs)(PreviewRoot, Object.assign({ className: classes.previewRoot }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ position: "relative", className: classes.previewImageWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.previewImage }), !hideInProgress && inProgress && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.previewInProgress }))] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.previewContent }, { children: [(0, jsx_runtime_1.jsx)(EventInfoDetails_1.default, { event: scEvent, hidePrivacyIcon: true, hasLocationInfo: false, beforePrivacyInfo: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.previewNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.previewName }, { children: scEvent.name })) })) }), !hideEventParticipants && (0, jsx_runtime_1.jsx)(EventParticipantsButton_1.default, Object.assign({ event: scEvent, hideCaption: true }, EventParticipantsButtonComponentProps))] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.previewActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
|
|
134
|
+
contentObj = ((0, jsx_runtime_1.jsxs)(PreviewRoot, Object.assign({ className: classes.previewRoot }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ position: "relative", className: classes.previewImageWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.previewImage }), !hideInProgress && inProgress && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.previewInProgress })), isEventFinished && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.finished", defaultMessage: "ui.event.finished" }), className: classes.finishedChip }))] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.previewContent }, { children: [(0, jsx_runtime_1.jsx)(EventInfoDetails_1.default, { event: scEvent, hidePrivacyIcon: true, hasLocationInfo: false, beforePrivacyInfo: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.previewNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.previewName }, { children: scEvent.name })) })) }), !hideEventParticipants && (0, jsx_runtime_1.jsx)(EventParticipantsButton_1.default, Object.assign({ event: scEvent, hideCaption: true }, EventParticipantsButtonComponentProps))] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.previewActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
|
|
132
135
|
}
|
|
133
136
|
else {
|
|
134
|
-
contentObj = ((0, jsx_runtime_1.jsx)(SnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.snippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippetImage }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "square", alt: scEvent.name, src: scEvent.image_medium, className: classes.snippetAvatar }), ' ', !hideInProgress && inProgress && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.snippetInProgress }))] })), primary: (0, jsx_runtime_1.jsxs)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.snippetPrimary }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: `${intl.formatDate(scEvent.start_date, {
|
|
137
|
+
contentObj = ((0, jsx_runtime_1.jsx)(SnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.snippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippetImage }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "square", alt: scEvent.name, src: scEvent.image_medium, className: classes.snippetAvatar }), ' ', !hideInProgress && inProgress && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.snippetInProgress })), isEventFinished && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.event.finished", defaultMessage: "ui.event.finished" }), className: classes.finishedChip }))] })), primary: (0, jsx_runtime_1.jsxs)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.snippetPrimary }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: `${intl.formatDate(scEvent.start_date, {
|
|
135
138
|
weekday: 'long',
|
|
136
139
|
month: 'long',
|
|
137
140
|
day: 'numeric'
|
|
@@ -82,7 +82,7 @@ function EventParticipantsButton(inProps) {
|
|
|
82
82
|
}, [scEvent]);
|
|
83
83
|
// FETCH FIRST FOLLOWERS
|
|
84
84
|
(0, use_deep_compare_effect_1.useDeepCompareEffectNoCheck)(() => {
|
|
85
|
-
if (!scEvent) {
|
|
85
|
+
if (!scEvent || !participantsAvailable) {
|
|
86
86
|
return;
|
|
87
87
|
}
|
|
88
88
|
if (!followers.length && participantsAvailable) {
|
|
@@ -21,10 +21,13 @@ const Skeleton_1 = tslib_1.__importDefault(require("../Events/Skeleton"));
|
|
|
21
21
|
const constants_1 = require("./constants");
|
|
22
22
|
const LocationEventsFilter_1 = tslib_1.__importDefault(require("./LocationEventsFilter"));
|
|
23
23
|
const PastEventsFilter_1 = tslib_1.__importDefault(require("./PastEventsFilter"));
|
|
24
|
+
const OngoingEventsFilter_1 = tslib_1.__importDefault(require("./OngoingEventsFilter"));
|
|
24
25
|
const classes = {
|
|
25
26
|
root: `${constants_1.PREFIX}-root`,
|
|
26
27
|
filters: `${constants_1.PREFIX}-filters`,
|
|
27
28
|
events: `${constants_1.PREFIX}-events`,
|
|
29
|
+
sectionTitle: `${constants_1.PREFIX}-section-title`,
|
|
30
|
+
divider: `${constants_1.PREFIX}-divider`,
|
|
28
31
|
item: `${constants_1.PREFIX}-item`,
|
|
29
32
|
itemSkeleton: `${constants_1.PREFIX}-item-skeleton`,
|
|
30
33
|
noResults: `${constants_1.PREFIX}-no-results`,
|
|
@@ -32,7 +35,7 @@ const classes = {
|
|
|
32
35
|
search: `${constants_1.PREFIX}-search`
|
|
33
36
|
};
|
|
34
37
|
const options = [
|
|
35
|
-
{ value: types_1.SCEventDateFilterType.
|
|
38
|
+
{ value: types_1.SCEventDateFilterType.ALL, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.select.any", defaultMessage: "ui.events.select.any" }) },
|
|
36
39
|
{ value: types_1.SCEventDateFilterType.TODAY, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.select.today", defaultMessage: "ui.events.select.today" }) },
|
|
37
40
|
{ value: types_1.SCEventDateFilterType.TOMORROW, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.select.tomorrow", defaultMessage: "ui.events.select.tomorrow" }) },
|
|
38
41
|
{ value: types_1.SCEventDateFilterType.THIS_WEEK, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.select.thisWeek", defaultMessage: "ui.events.select.thisWeek" }) },
|
|
@@ -46,7 +49,7 @@ const Root = (0, material_1.styled)(material_1.Box, {
|
|
|
46
49
|
exports.EventsChipRoot = (0, material_1.styled)(material_1.Chip, {
|
|
47
50
|
name: constants_1.PREFIX,
|
|
48
51
|
slot: 'EventsChipRoot',
|
|
49
|
-
shouldForwardProp: (prop) => prop !== 'showFollowed' && prop !== 'showPastEvents'
|
|
52
|
+
shouldForwardProp: (prop) => prop !== 'showFollowed' && prop !== 'showPastEvents' && prop !== 'showOngoingEvents'
|
|
50
53
|
})(() => ({}));
|
|
51
54
|
/**
|
|
52
55
|
* > API documentation for the Community-JS Events component. Learn about the available props and the CSS API.
|
|
@@ -81,7 +84,7 @@ function Events(inProps) {
|
|
|
81
84
|
props: inProps,
|
|
82
85
|
name: constants_1.PREFIX
|
|
83
86
|
});
|
|
84
|
-
const { endpoint = api_services_1.Endpoints.SearchEvents, endpointQueryParams = { limit: 8, offset: Pagination_1.DEFAULT_PAGINATION_OFFSET }, className, EventComponentProps = { elevation: 0, square: true }, EventsSkeletonComponentProps = {}, EventSkeletonComponentProps = { elevation: 0, square: true }, GridContainerComponentProps = {}, GridItemComponentProps = {}, CreateEventButtonProps = {}, showFilters = false, filters, general = true } = props, rest = tslib_1.__rest(props, ["endpoint", "endpointQueryParams", "className", "EventComponentProps", "EventsSkeletonComponentProps", "EventSkeletonComponentProps", "GridContainerComponentProps", "GridItemComponentProps", "CreateEventButtonProps", "showFilters", "filters", "general"]);
|
|
87
|
+
const { endpoint = api_services_1.Endpoints.SearchEvents, endpointQueryParams = { limit: 8, offset: Pagination_1.DEFAULT_PAGINATION_OFFSET }, className, EventComponentProps = { elevation: 0, square: true }, EventsSkeletonComponentProps = {}, EventSkeletonComponentProps = { elevation: 0, square: true }, GridContainerComponentProps = {}, GridItemComponentProps = {}, CreateEventButtonProps = {}, showFilters = false, filters, general = true, hideTitle = false } = props, rest = tslib_1.__rest(props, ["endpoint", "endpointQueryParams", "className", "EventComponentProps", "EventsSkeletonComponentProps", "EventSkeletonComponentProps", "GridContainerComponentProps", "GridItemComponentProps", "CreateEventButtonProps", "showFilters", "filters", "general", "hideTitle"]);
|
|
85
88
|
// STATE
|
|
86
89
|
const [events, setEvents] = (0, react_1.useState)([]);
|
|
87
90
|
const [loading, setLoading] = (0, react_1.useState)(true);
|
|
@@ -91,7 +94,9 @@ function Events(inProps) {
|
|
|
91
94
|
const [location, setLocation] = (0, react_1.useState)(types_1.SCEventLocationFilterType.ANY);
|
|
92
95
|
const [showFollowed, setShowFollowed] = (0, react_1.useState)(false);
|
|
93
96
|
const [showPastEvents, setShowPastEvents] = (0, react_1.useState)(false);
|
|
97
|
+
const [showOngoingEvents, setShowOngoingEvents] = (0, react_1.useState)(false);
|
|
94
98
|
const [showMyEvents, setShowMyEvents] = (0, react_1.useState)(false);
|
|
99
|
+
const showUserEvents = !general && (events.length || (!events.length && (showPastEvents || showMyEvents || location !== types_1.SCEventLocationFilterType.ANY)));
|
|
95
100
|
// CONTEXT
|
|
96
101
|
const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
|
|
97
102
|
const scPreferencesContext = (0, react_1.useContext)(react_core_1.SCPreferencesContext);
|
|
@@ -118,6 +123,12 @@ function Events(inProps) {
|
|
|
118
123
|
const handleDeletePastClick = () => {
|
|
119
124
|
setShowPastEvents(false);
|
|
120
125
|
};
|
|
126
|
+
const handleChipOngoingClick = () => {
|
|
127
|
+
setShowOngoingEvents(!showOngoingEvents);
|
|
128
|
+
};
|
|
129
|
+
const handleDeleteOngoingClick = () => {
|
|
130
|
+
setShowOngoingEvents(false);
|
|
131
|
+
};
|
|
121
132
|
/**
|
|
122
133
|
* Fetches events list
|
|
123
134
|
*/
|
|
@@ -128,7 +139,7 @@ function Events(inProps) {
|
|
|
128
139
|
url: endpoint.url({}),
|
|
129
140
|
method: endpoint.method,
|
|
130
141
|
params: Object.assign(Object.assign({}, endpointQueryParams), (general
|
|
131
|
-
? Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (query && { search: query })), (dateSearch !== types_1.SCEventDateFilterType.
|
|
142
|
+
? Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (query && { search: query })), (dateSearch !== types_1.SCEventDateFilterType.ALL && { date_filter: dateSearch })), (location !== types_1.SCEventLocationFilterType.ANY && { location })), (showFollowed && { follows: showFollowed })), (showOngoingEvents && { date_filter: types_1.SCEventDateFilterType.NOT_PAST })) : Object.assign(Object.assign(Object.assign({ subscription_status: types_1.SCEventSubscriptionStatusType.GOING }, (location !== types_1.SCEventLocationFilterType.ANY && { location })), (showPastEvents && { past: showPastEvents })), (showMyEvents && { created_by: authUserId }))))
|
|
132
143
|
})
|
|
133
144
|
.then((res) => {
|
|
134
145
|
setEvents(res.data.results);
|
|
@@ -149,7 +160,7 @@ function Events(inProps) {
|
|
|
149
160
|
else {
|
|
150
161
|
fetchEvents();
|
|
151
162
|
}
|
|
152
|
-
}, [contentAvailability, authUserId, dateSearch, location, showFollowed, showPastEvents, showMyEvents]);
|
|
163
|
+
}, [contentAvailability, authUserId, dateSearch, location, showFollowed, showPastEvents, showMyEvents, showOngoingEvents]);
|
|
153
164
|
/**
|
|
154
165
|
* Subscriber for pubsub callback
|
|
155
166
|
*/
|
|
@@ -212,24 +223,24 @@ function Events(inProps) {
|
|
|
212
223
|
/**
|
|
213
224
|
* Renders events list
|
|
214
225
|
*/
|
|
215
|
-
const
|
|
226
|
+
const content = ((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) : showUserEvents ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot, { color: showMyEvents ? 'secondary' : 'default', variant: showMyEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents),
|
|
216
227
|
// @ts-expect-error this is needed to use showFollowed into SCEvents
|
|
217
|
-
showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? () => setShowMyEvents(false) : null, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 3 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
|
|
228
|
+
showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? () => setShowMyEvents(false) : null, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(PastEventsFilter_1.default, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: loading }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) }))] })) : general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 3 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
|
|
218
229
|
e.preventDefault();
|
|
219
230
|
if (e.key === 'Enter') {
|
|
220
231
|
fetchEvents();
|
|
221
232
|
}
|
|
222
233
|
}, InputProps: {
|
|
223
234
|
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => fetchEvents(), disabled: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading })) })))
|
|
224
|
-
} }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled:
|
|
235
|
+
} }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ disabled: showOngoingEvents || loading, size: 'small', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: option.value }, { children: [(0, jsx_runtime_1.jsx)(material_1.Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: (0, jsx_runtime_1.jsx)(LocationEventsFilter_1.default, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) })), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot, { color: showFollowed ? 'secondary' : 'default', variant: showFollowed ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick,
|
|
225
236
|
// @ts-expect-error this is needed to use showFollowed into SCEvents
|
|
226
|
-
showFollowed: showFollowed, deleteIcon: showFollowed ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(
|
|
237
|
+
showFollowed: showFollowed, deleteIcon: showFollowed ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(OngoingEventsFilter_1.default, { showOngoingEvents: showOngoingEvents, handleClick: handleChipOngoingClick, handleDeleteClick: handleDeleteOngoingClick, disabled: dateSearch !== types_1.SCEventDateFilterType.ALL || loading }) }))] })) : null }))), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: loading ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !events.length ? ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.noResults }, { children: general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (onlyStaffEnabled && react_core_1.UserUtils.isStaff(scUserContext.user)) || !onlyStaffEnabled ? ((0, jsx_runtime_1.jsx)(CreateEventButton_1.default, Object.assign({}, CreateEventButtonProps))) : null })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) }))] })) : showUserEvents ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title.personal", defaultMessage: "ui.events.noEvents.title.personal" }) })) })) : null }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true, spacing: { xs: 2 }, className: classes.events }, GridContainerComponentProps, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [events.map((event) => ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.item }, GridItemComponentProps, { children: (0, jsx_runtime_1.jsx)(Event_1.default, Object.assign({ event: event, eventId: event.id }, EventComponentProps)) }), event.id))), authUserId && events.length % 2 !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.itemSkeleton }, GridItemComponentProps, { children: (0, jsx_runtime_1.jsx)(Event_1.EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (0, jsx_runtime_1.jsx)(CreateEventButton_1.default, Object.assign({ variant: "outlined", color: "primary", size: "small" }, CreateEventButtonProps, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.skeleton.action.add", defaultMessage: "ui.events.skeleton.action.add" }) })) })) }), 'skeleton-item'))] }) })), Boolean(next) && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }) })))] })) })) })] }));
|
|
227
238
|
/**
|
|
228
239
|
* Renders root object (if content availability community option is false and user is anonymous, component is hidden)
|
|
229
240
|
*/
|
|
230
241
|
if (!contentAvailability && !scUserContext.user) {
|
|
231
242
|
return null;
|
|
232
243
|
}
|
|
233
|
-
return ((0, jsx_runtime_1.
|
|
244
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: showUserEvents && !hideTitle ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.myEvents.title", defaultMessage: "ui.events.myEvents.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Divider, { className: classes.divider })] })) : general ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.sectionTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.allEvents.title", defaultMessage: "ui.events.allEvents.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Divider, { className: classes.divider })] })) : null }), content] })));
|
|
234
245
|
}
|
|
235
246
|
exports.default = Events;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ChipProps } from '@mui/material';
|
|
2
|
+
export interface OngoingEventsFilterProps extends ChipProps {
|
|
3
|
+
autoHide?: boolean;
|
|
4
|
+
showOngoingEvents: boolean;
|
|
5
|
+
handleClick: () => void;
|
|
6
|
+
handleDeleteClick?: () => void;
|
|
7
|
+
}
|
|
8
|
+
export default function OngoingEventsFilter(inProps: OngoingEventsFilterProps): JSX.Element;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const material_1 = require("@mui/material");
|
|
6
|
+
const react_intl_1 = require("react-intl");
|
|
7
|
+
const constants_1 = require("./constants");
|
|
8
|
+
const Events_1 = require("./Events");
|
|
9
|
+
function OngoingEventsFilter(inProps) {
|
|
10
|
+
// PROPS
|
|
11
|
+
const props = (0, material_1.useThemeProps)({
|
|
12
|
+
props: inProps,
|
|
13
|
+
name: constants_1.PREFIX
|
|
14
|
+
});
|
|
15
|
+
const { autoHide = false, showOngoingEvents, handleClick, handleDeleteClick } = props, rest = tslib_1.__rest(props, ["autoHide", "showOngoingEvents", "handleClick", "handleDeleteClick"]);
|
|
16
|
+
if (autoHide) {
|
|
17
|
+
return null;
|
|
18
|
+
}
|
|
19
|
+
return ((0, jsx_runtime_1.jsx)(Events_1.EventsChipRoot, Object.assign({ color: showOngoingEvents ? 'secondary' : 'default', variant: showOngoingEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByOngoingEvents", defaultMessage: "ui.events.filterByOngoingEvents" }), onClick: handleClick,
|
|
20
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
21
|
+
// @ts-ignore
|
|
22
|
+
showOngoingEvents: showOngoingEvents, deleteIcon: showOngoingEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showOngoingEvents ? handleDeleteClick : undefined }, rest)));
|
|
23
|
+
}
|
|
24
|
+
exports.default = OngoingEventsFilter;
|
|
@@ -17,6 +17,7 @@ import User from '../User';
|
|
|
17
17
|
import Widget from '../Widget';
|
|
18
18
|
import { PREFIX } from './constants';
|
|
19
19
|
import EventSkeleton from './Skeleton';
|
|
20
|
+
import { checkEventFinished } from '../../utils/events';
|
|
20
21
|
const classes = {
|
|
21
22
|
root: `${PREFIX}-root`,
|
|
22
23
|
detailRoot: `${PREFIX}-detail-root`,
|
|
@@ -44,7 +45,8 @@ const classes = {
|
|
|
44
45
|
snippetInProgress: `${PREFIX}-snippet-in-progress`,
|
|
45
46
|
snippetPrimary: `${PREFIX}-snippet-primary`,
|
|
46
47
|
snippetSecondary: `${PREFIX}-snippet-secondary`,
|
|
47
|
-
snippetActions: `${PREFIX}-snippet-actions
|
|
48
|
+
snippetActions: `${PREFIX}-snippet-actions`,
|
|
49
|
+
finishedChip: `${PREFIX}-finished-chip`
|
|
48
50
|
};
|
|
49
51
|
const Root = styled(Widget, {
|
|
50
52
|
name: PREFIX,
|
|
@@ -108,6 +110,7 @@ export default function Event(inProps) {
|
|
|
108
110
|
// STATE
|
|
109
111
|
const { scEvent } = useSCFetchEvent({ id: eventId, event, autoSubscribe: false });
|
|
110
112
|
const inProgress = useMemo(() => scEvent && scEvent.active && scEvent.running, [scEvent]);
|
|
113
|
+
const isEventFinished = useMemo(() => checkEventFinished(scEvent), [scEvent]);
|
|
111
114
|
// CONTEXT
|
|
112
115
|
const scRoutingContext = useSCRouting();
|
|
113
116
|
// HOOKS
|
|
@@ -126,10 +129,10 @@ export default function Event(inProps) {
|
|
|
126
129
|
contentObj = (_jsxs(DetailRoot, Object.assign({ className: classes.detailRoot }, { children: [_jsxs(Box, Object.assign({ className: classes.detailImageWrapper }, { children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.detailImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.detailInProgress })), _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() })] })), _jsxs(CardContent, Object.assign({ className: classes.detailContent }, { children: [scEvent.active ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.detailNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h3", className: classes.detailName }, { children: scEvent.name })) }))) : (_jsx(Box, Object.assign({ className: classes.detailNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h3", className: classes.detailName }, { children: scEvent.name })) }))), _jsx(EventInfoDetails, { event: scEvent }), !hideEventPlanner && (_jsx(User, { user: scEvent.managed_by, elevation: 0, secondary: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.planner", defaultMessage: "ui.myEventsWidget.planner" }) })), actions: _jsx(_Fragment, {}), className: classes.detailUser })), !hideEventParticipants && (_jsxs(_Fragment, { children: [_jsx(Divider, { className: classes.detailFirstDivider }), _jsx(EventParticipantsButton, Object.assign({ event: scEvent }, EventParticipantsButtonComponentProps))] })), _jsx(Divider, { className: classes.detailSecondDivider })] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.detailActions }, { children: _jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
|
|
127
130
|
}
|
|
128
131
|
else if (template === SCEventTemplateType.PREVIEW) {
|
|
129
|
-
contentObj = (_jsxs(PreviewRoot, Object.assign({ className: classes.previewRoot }, { children: [_jsxs(Box, Object.assign({ position: "relative", className: classes.previewImageWrapper }, { children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.previewImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.previewInProgress }))] })), _jsxs(CardContent, Object.assign({ className: classes.previewContent }, { children: [_jsx(EventInfoDetails, { event: scEvent, hidePrivacyIcon: true, hasLocationInfo: false, beforePrivacyInfo: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.previewNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h5", className: classes.previewName }, { children: scEvent.name })) })) }), !hideEventParticipants && _jsx(EventParticipantsButton, Object.assign({ event: scEvent, hideCaption: true }, EventParticipantsButtonComponentProps))] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.previewActions }, { children: _jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
|
|
132
|
+
contentObj = (_jsxs(PreviewRoot, Object.assign({ className: classes.previewRoot }, { children: [_jsxs(Box, Object.assign({ position: "relative", className: classes.previewImageWrapper }, { children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.previewImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.previewInProgress })), isEventFinished && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.finished", defaultMessage: "ui.event.finished" }), className: classes.finishedChip }))] })), _jsxs(CardContent, Object.assign({ className: classes.previewContent }, { children: [_jsx(EventInfoDetails, { event: scEvent, hidePrivacyIcon: true, hasLocationInfo: false, beforePrivacyInfo: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.previewNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h5", className: classes.previewName }, { children: scEvent.name })) })) }), !hideEventParticipants && _jsx(EventParticipantsButton, Object.assign({ event: scEvent, hideCaption: true }, EventParticipantsButtonComponentProps))] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.previewActions }, { children: _jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
|
|
130
133
|
}
|
|
131
134
|
else {
|
|
132
|
-
contentObj = (_jsx(SnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.snippetRoot, image: _jsxs(Box, Object.assign({ className: classes.snippetImage }, { children: [_jsx(Avatar, { variant: "square", alt: scEvent.name, src: scEvent.image_medium, className: classes.snippetAvatar }), ' ', !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.snippetInProgress }))] })), primary: _jsxs(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.snippetPrimary }, { children: [_jsx(Typography, Object.assign({ component: "span" }, { children: `${intl.formatDate(scEvent.start_date, {
|
|
135
|
+
contentObj = (_jsx(SnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.snippetRoot, image: _jsxs(Box, Object.assign({ className: classes.snippetImage }, { children: [_jsx(Avatar, { variant: "square", alt: scEvent.name, src: scEvent.image_medium, className: classes.snippetAvatar }), ' ', !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.snippetInProgress })), isEventFinished && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.finished", defaultMessage: "ui.event.finished" }), className: classes.finishedChip }))] })), primary: _jsxs(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.snippetPrimary }, { children: [_jsx(Typography, Object.assign({ component: "span" }, { children: `${intl.formatDate(scEvent.start_date, {
|
|
133
136
|
weekday: 'long',
|
|
134
137
|
month: 'long',
|
|
135
138
|
day: 'numeric'
|
|
@@ -80,7 +80,7 @@ export default function EventParticipantsButton(inProps) {
|
|
|
80
80
|
}, [scEvent]);
|
|
81
81
|
// FETCH FIRST FOLLOWERS
|
|
82
82
|
useDeepCompareEffectNoCheck(() => {
|
|
83
|
-
if (!scEvent) {
|
|
83
|
+
if (!scEvent || !participantsAvailable) {
|
|
84
84
|
return;
|
|
85
85
|
}
|
|
86
86
|
if (!followers.length && participantsAvailable) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __rest } from "tslib";
|
|
2
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { Box, Button, Chip, FormControl, Grid, Icon, IconButton, InputAdornment, InputLabel, MenuItem, Radio, Select, styled, TextField, Typography, useMediaQuery, useTheme, useThemeProps } from '@mui/material';
|
|
3
|
+
import { Box, Button, Chip, Divider, FormControl, Grid, Icon, IconButton, InputAdornment, InputLabel, MenuItem, Radio, Select, styled, TextField, Typography, useMediaQuery, useTheme, useThemeProps } from '@mui/material';
|
|
4
4
|
import { Endpoints, http } from '@selfcommunity/api-services';
|
|
5
5
|
import { SCPreferences, SCPreferencesContext, SCUserContext, UserUtils } from '@selfcommunity/react-core';
|
|
6
6
|
import { SCEventDateFilterType, SCEventLocationFilterType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
|
|
@@ -18,10 +18,13 @@ import Skeleton from '../Events/Skeleton';
|
|
|
18
18
|
import { PREFIX } from './constants';
|
|
19
19
|
import LocationEventsFilter from './LocationEventsFilter';
|
|
20
20
|
import PastEventsFilter from './PastEventsFilter';
|
|
21
|
+
import OngoingEventsFilter from './OngoingEventsFilter';
|
|
21
22
|
const classes = {
|
|
22
23
|
root: `${PREFIX}-root`,
|
|
23
24
|
filters: `${PREFIX}-filters`,
|
|
24
25
|
events: `${PREFIX}-events`,
|
|
26
|
+
sectionTitle: `${PREFIX}-section-title`,
|
|
27
|
+
divider: `${PREFIX}-divider`,
|
|
25
28
|
item: `${PREFIX}-item`,
|
|
26
29
|
itemSkeleton: `${PREFIX}-item-skeleton`,
|
|
27
30
|
noResults: `${PREFIX}-no-results`,
|
|
@@ -29,7 +32,7 @@ const classes = {
|
|
|
29
32
|
search: `${PREFIX}-search`
|
|
30
33
|
};
|
|
31
34
|
const options = [
|
|
32
|
-
{ value: SCEventDateFilterType.
|
|
35
|
+
{ value: SCEventDateFilterType.ALL, label: _jsx(FormattedMessage, { id: "ui.events.select.any", defaultMessage: "ui.events.select.any" }) },
|
|
33
36
|
{ value: SCEventDateFilterType.TODAY, label: _jsx(FormattedMessage, { id: "ui.events.select.today", defaultMessage: "ui.events.select.today" }) },
|
|
34
37
|
{ value: SCEventDateFilterType.TOMORROW, label: _jsx(FormattedMessage, { id: "ui.events.select.tomorrow", defaultMessage: "ui.events.select.tomorrow" }) },
|
|
35
38
|
{ value: SCEventDateFilterType.THIS_WEEK, label: _jsx(FormattedMessage, { id: "ui.events.select.thisWeek", defaultMessage: "ui.events.select.thisWeek" }) },
|
|
@@ -43,7 +46,7 @@ const Root = styled(Box, {
|
|
|
43
46
|
export const EventsChipRoot = styled(Chip, {
|
|
44
47
|
name: PREFIX,
|
|
45
48
|
slot: 'EventsChipRoot',
|
|
46
|
-
shouldForwardProp: (prop) => prop !== 'showFollowed' && prop !== 'showPastEvents'
|
|
49
|
+
shouldForwardProp: (prop) => prop !== 'showFollowed' && prop !== 'showPastEvents' && prop !== 'showOngoingEvents'
|
|
47
50
|
})(() => ({}));
|
|
48
51
|
/**
|
|
49
52
|
* > API documentation for the Community-JS Events component. Learn about the available props and the CSS API.
|
|
@@ -78,7 +81,7 @@ export default function Events(inProps) {
|
|
|
78
81
|
props: inProps,
|
|
79
82
|
name: PREFIX
|
|
80
83
|
});
|
|
81
|
-
const { endpoint = Endpoints.SearchEvents, endpointQueryParams = { limit: 8, offset: DEFAULT_PAGINATION_OFFSET }, className, EventComponentProps = { elevation: 0, square: true }, EventsSkeletonComponentProps = {}, EventSkeletonComponentProps = { elevation: 0, square: true }, GridContainerComponentProps = {}, GridItemComponentProps = {}, CreateEventButtonProps = {}, showFilters = false, filters, general = true } = props, rest = __rest(props, ["endpoint", "endpointQueryParams", "className", "EventComponentProps", "EventsSkeletonComponentProps", "EventSkeletonComponentProps", "GridContainerComponentProps", "GridItemComponentProps", "CreateEventButtonProps", "showFilters", "filters", "general"]);
|
|
84
|
+
const { endpoint = Endpoints.SearchEvents, endpointQueryParams = { limit: 8, offset: DEFAULT_PAGINATION_OFFSET }, className, EventComponentProps = { elevation: 0, square: true }, EventsSkeletonComponentProps = {}, EventSkeletonComponentProps = { elevation: 0, square: true }, GridContainerComponentProps = {}, GridItemComponentProps = {}, CreateEventButtonProps = {}, showFilters = false, filters, general = true, hideTitle = false } = props, rest = __rest(props, ["endpoint", "endpointQueryParams", "className", "EventComponentProps", "EventsSkeletonComponentProps", "EventSkeletonComponentProps", "GridContainerComponentProps", "GridItemComponentProps", "CreateEventButtonProps", "showFilters", "filters", "general", "hideTitle"]);
|
|
82
85
|
// STATE
|
|
83
86
|
const [events, setEvents] = useState([]);
|
|
84
87
|
const [loading, setLoading] = useState(true);
|
|
@@ -88,7 +91,9 @@ export default function Events(inProps) {
|
|
|
88
91
|
const [location, setLocation] = useState(SCEventLocationFilterType.ANY);
|
|
89
92
|
const [showFollowed, setShowFollowed] = useState(false);
|
|
90
93
|
const [showPastEvents, setShowPastEvents] = useState(false);
|
|
94
|
+
const [showOngoingEvents, setShowOngoingEvents] = useState(false);
|
|
91
95
|
const [showMyEvents, setShowMyEvents] = useState(false);
|
|
96
|
+
const showUserEvents = !general && (events.length || (!events.length && (showPastEvents || showMyEvents || location !== SCEventLocationFilterType.ANY)));
|
|
92
97
|
// CONTEXT
|
|
93
98
|
const scUserContext = useContext(SCUserContext);
|
|
94
99
|
const scPreferencesContext = useContext(SCPreferencesContext);
|
|
@@ -115,6 +120,12 @@ export default function Events(inProps) {
|
|
|
115
120
|
const handleDeletePastClick = () => {
|
|
116
121
|
setShowPastEvents(false);
|
|
117
122
|
};
|
|
123
|
+
const handleChipOngoingClick = () => {
|
|
124
|
+
setShowOngoingEvents(!showOngoingEvents);
|
|
125
|
+
};
|
|
126
|
+
const handleDeleteOngoingClick = () => {
|
|
127
|
+
setShowOngoingEvents(false);
|
|
128
|
+
};
|
|
118
129
|
/**
|
|
119
130
|
* Fetches events list
|
|
120
131
|
*/
|
|
@@ -125,7 +136,7 @@ export default function Events(inProps) {
|
|
|
125
136
|
url: endpoint.url({}),
|
|
126
137
|
method: endpoint.method,
|
|
127
138
|
params: Object.assign(Object.assign({}, endpointQueryParams), (general
|
|
128
|
-
? Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (query && { search: query })), (dateSearch !== SCEventDateFilterType.
|
|
139
|
+
? Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (query && { search: query })), (dateSearch !== SCEventDateFilterType.ALL && { date_filter: dateSearch })), (location !== SCEventLocationFilterType.ANY && { location })), (showFollowed && { follows: showFollowed })), (showOngoingEvents && { date_filter: SCEventDateFilterType.NOT_PAST })) : Object.assign(Object.assign(Object.assign({ subscription_status: SCEventSubscriptionStatusType.GOING }, (location !== SCEventLocationFilterType.ANY && { location })), (showPastEvents && { past: showPastEvents })), (showMyEvents && { created_by: authUserId }))))
|
|
129
140
|
})
|
|
130
141
|
.then((res) => {
|
|
131
142
|
setEvents(res.data.results);
|
|
@@ -146,7 +157,7 @@ export default function Events(inProps) {
|
|
|
146
157
|
else {
|
|
147
158
|
fetchEvents();
|
|
148
159
|
}
|
|
149
|
-
}, [contentAvailability, authUserId, dateSearch, location, showFollowed, showPastEvents, showMyEvents]);
|
|
160
|
+
}, [contentAvailability, authUserId, dateSearch, location, showFollowed, showPastEvents, showMyEvents, showOngoingEvents]);
|
|
150
161
|
/**
|
|
151
162
|
* Subscriber for pubsub callback
|
|
152
163
|
*/
|
|
@@ -209,23 +220,23 @@ export default function Events(inProps) {
|
|
|
209
220
|
/**
|
|
210
221
|
* Renders events list
|
|
211
222
|
*/
|
|
212
|
-
const
|
|
223
|
+
const content = (_jsxs(_Fragment, { children: [showFilters && (_jsx(Grid, Object.assign({ container: true, className: classes.filters, gap: 2 }, { children: filters ? (filters) : showUserEvents ? (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ item: true }, { children: _jsx(EventsChipRoot, { color: showMyEvents ? 'secondary' : 'default', variant: showMyEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents),
|
|
213
224
|
// @ts-expect-error this is needed to use showFollowed into SCEvents
|
|
214
|
-
showFollowed: showMyEvents, deleteIcon: showMyEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyEvents ? () => setShowMyEvents(false) : null, disabled: loading }) })), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: loading }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) }))] })) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ item: true, xs: 12, md: 3 }, { children: _jsx(TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: _jsx(FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
|
|
225
|
+
showFollowed: showMyEvents, deleteIcon: showMyEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyEvents ? () => setShowMyEvents(false) : null, disabled: loading }) })), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: loading }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) }))] })) : general ? (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ item: true, xs: 12, md: 3 }, { children: _jsx(TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: _jsx(FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
|
|
215
226
|
e.preventDefault();
|
|
216
227
|
if (e.key === 'Enter') {
|
|
217
228
|
fetchEvents();
|
|
218
229
|
}
|
|
219
230
|
}, InputProps: {
|
|
220
231
|
endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchEvents(), disabled: loading }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(), endIcon: _jsx(Icon, { children: "search" }), disabled: loading })) })))
|
|
221
|
-
} }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [_jsx(InputLabel, { children: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), _jsx(Select, Object.assign({ disabled:
|
|
232
|
+
} }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [_jsx(InputLabel, { children: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), _jsx(Select, Object.assign({ disabled: showOngoingEvents || loading, size: 'small', label: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => (_jsxs(MenuItem, Object.assign({ value: option.value }, { children: [_jsx(Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, disabled: loading, handleOnChange: handleOnChangeLocation }) })), authUserId && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(EventsChipRoot, { color: showFollowed ? 'secondary' : 'default', variant: showFollowed ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick,
|
|
222
233
|
// @ts-expect-error this is needed to use showFollowed into SCEvents
|
|
223
|
-
showFollowed: showFollowed, deleteIcon: showFollowed ? _jsx(Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(
|
|
234
|
+
showFollowed: showFollowed, deleteIcon: showFollowed ? _jsx(Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(OngoingEventsFilter, { showOngoingEvents: showOngoingEvents, handleClick: handleChipOngoingClick, handleDeleteClick: handleDeleteOngoingClick, disabled: dateSearch !== SCEventDateFilterType.ALL || loading }) }))] })) : null }))), _jsx(_Fragment, { children: loading ? (_jsx(Skeleton, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : (_jsx(_Fragment, { children: !events.length ? (_jsx(Box, Object.assign({ className: classes.noResults }, { children: general ? (_jsxs(_Fragment, { children: [_jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (onlyStaffEnabled && UserUtils.isStaff(scUserContext.user)) || !onlyStaffEnabled ? (_jsx(CreateEventButton, Object.assign({}, CreateEventButtonProps))) : null })), _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) }))] })) : showUserEvents ? (_jsx(_Fragment, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.events.noEvents.title.personal", defaultMessage: "ui.events.noEvents.title.personal" }) })) })) : null }))) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ container: true, spacing: { xs: 2 }, className: classes.events }, GridContainerComponentProps, { children: _jsxs(_Fragment, { children: [events.map((event) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.item }, GridItemComponentProps, { children: _jsx(Event, Object.assign({ event: event, eventId: event.id }, EventComponentProps)) }), event.id))), authUserId && events.length % 2 !== 0 && (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.itemSkeleton }, GridItemComponentProps, { children: _jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: _jsx(CreateEventButton, Object.assign({ variant: "outlined", color: "primary", size: "small" }, CreateEventButtonProps, { children: _jsx(FormattedMessage, { id: "ui.events.skeleton.action.add", defaultMessage: "ui.events.skeleton.action.add" }) })) })) }), 'skeleton-item'))] }) })), Boolean(next) && (_jsx(Button, Object.assign({ color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore }, { children: _jsx(FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }) })))] })) })) })] }));
|
|
224
235
|
/**
|
|
225
236
|
* Renders root object (if content availability community option is false and user is anonymous, component is hidden)
|
|
226
237
|
*/
|
|
227
238
|
if (!contentAvailability && !scUserContext.user) {
|
|
228
239
|
return null;
|
|
229
240
|
}
|
|
230
|
-
return (
|
|
241
|
+
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(_Fragment, { children: showUserEvents && !hideTitle ? (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "ui.events.myEvents.title", defaultMessage: "ui.events.myEvents.title" }) })), _jsx(Divider, { className: classes.divider })] })) : general ? (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.sectionTitle }, { children: _jsx(FormattedMessage, { id: "ui.events.allEvents.title", defaultMessage: "ui.events.allEvents.title" }) })), _jsx(Divider, { className: classes.divider })] })) : null }), content] })));
|
|
231
242
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ChipProps } from '@mui/material';
|
|
2
|
+
export interface OngoingEventsFilterProps extends ChipProps {
|
|
3
|
+
autoHide?: boolean;
|
|
4
|
+
showOngoingEvents: boolean;
|
|
5
|
+
handleClick: () => void;
|
|
6
|
+
handleDeleteClick?: () => void;
|
|
7
|
+
}
|
|
8
|
+
export default function OngoingEventsFilter(inProps: OngoingEventsFilterProps): JSX.Element;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { __rest } from "tslib";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Icon, useThemeProps } from '@mui/material';
|
|
4
|
+
import { FormattedMessage } from 'react-intl';
|
|
5
|
+
import { PREFIX } from './constants';
|
|
6
|
+
import { EventsChipRoot } from './Events';
|
|
7
|
+
export default function OngoingEventsFilter(inProps) {
|
|
8
|
+
// PROPS
|
|
9
|
+
const props = useThemeProps({
|
|
10
|
+
props: inProps,
|
|
11
|
+
name: PREFIX
|
|
12
|
+
});
|
|
13
|
+
const { autoHide = false, showOngoingEvents, handleClick, handleDeleteClick } = props, rest = __rest(props, ["autoHide", "showOngoingEvents", "handleClick", "handleDeleteClick"]);
|
|
14
|
+
if (autoHide) {
|
|
15
|
+
return null;
|
|
16
|
+
}
|
|
17
|
+
return (_jsx(EventsChipRoot, Object.assign({ color: showOngoingEvents ? 'secondary' : 'default', variant: showOngoingEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByOngoingEvents", defaultMessage: "ui.events.filterByOngoingEvents" }), onClick: handleClick,
|
|
18
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
19
|
+
// @ts-ignore
|
|
20
|
+
showOngoingEvents: showOngoingEvents, deleteIcon: showOngoingEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showOngoingEvents ? handleDeleteClick : undefined }, rest)));
|
|
21
|
+
}
|