@selfcommunity/react-ui 0.9.1 → 0.9.2-alpha.0

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.
Files changed (12) hide show
  1. package/lib/cjs/components/CreateEventButton/CreateEventButton.d.ts +1 -1
  2. package/lib/cjs/components/CreateEventButton/CreateEventButton.js +1 -1
  3. package/lib/cjs/components/Events/Events.js +9 -29
  4. package/lib/cjs/components/Events/PastEventsFilter.js +2 -12
  5. package/lib/cjs/components/SuggestedEventsWidget/Arrow.js +2 -1
  6. package/lib/esm/components/CreateEventButton/CreateEventButton.d.ts +1 -1
  7. package/lib/esm/components/CreateEventButton/CreateEventButton.js +1 -1
  8. package/lib/esm/components/Events/Events.js +8 -28
  9. package/lib/esm/components/Events/PastEventsFilter.js +2 -12
  10. package/lib/esm/components/SuggestedEventsWidget/Arrow.js +2 -1
  11. package/lib/umd/react-ui.js +1 -1
  12. package/package.json +7 -7
package/lib/cjs/components/CreateEventButton/CreateEventButton.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { ButtonProps } from '@mui/material/Button/Button';
1
+ import { ButtonProps } from '@mui/material';
2
2
  import { EventFormDialogProps } from '../EventFormDialog';
3
3
  export interface CreateEventButtonProps extends ButtonProps {
4
4
  /**
package/lib/cjs/components/CreateEventButton/CreateEventButton.js CHANGED
@@ -6,11 +6,11 @@ const material_1 = require("@mui/material");
6
6
  const styles_1 = require("@mui/material/styles");
7
7
  const system_1 = require("@mui/system");
8
8
  const react_core_1 = require("@selfcommunity/react-core");
9
+ const types_1 = require("@selfcommunity/types");
9
10
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
10
11
  const react_1 = tslib_1.__importStar(require("react"));
11
12
  const react_intl_1 = require("react-intl");
12
13
  const EventFormDialog_1 = tslib_1.__importDefault(require("../EventFormDialog"));
13
- const types_1 = require("@selfcommunity/types");
14
14
  const PREFIX = 'SCCreateEventButton';
15
15
  const classes = {
16
16
  root: `${PREFIX}-root`
package/lib/cjs/components/Events/Events.js CHANGED
@@ -4,25 +4,23 @@ exports.EventsChipRoot = void 0;
4
4
  const tslib_1 = require("tslib");
5
5
  const jsx_runtime_1 = require("react/jsx-runtime");
6
6
  const material_1 = require("@mui/material");
7
- const styles_1 = require("@mui/material/styles");
8
- const system_1 = require("@mui/system");
9
7
  const api_services_1 = require("@selfcommunity/api-services");
10
8
  const react_core_1 = require("@selfcommunity/react-core");
11
9
  const types_1 = require("@selfcommunity/types");
12
10
  const utils_1 = require("@selfcommunity/utils");
13
11
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
12
+ const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
14
13
  const react_1 = require("react");
15
14
  const react_intl_1 = require("react-intl");
16
15
  const Errors_1 = require("../../constants/Errors");
17
16
  const Pagination_1 = require("../../constants/Pagination");
17
+ const PubSub_1 = require("../../constants/PubSub");
18
18
  const CreateEventButton_1 = tslib_1.__importDefault(require("../CreateEventButton"));
19
19
  const Event_1 = tslib_1.__importStar(require("../Event"));
20
20
  const Skeleton_1 = tslib_1.__importDefault(require("../Events/Skeleton"));
21
21
  const constants_1 = require("./constants");
22
- const PastEventsFilter_1 = tslib_1.__importDefault(require("./PastEventsFilter"));
23
- const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
24
- const PubSub_1 = require("../../constants/PubSub");
25
22
  const LocationEventsFilter_1 = tslib_1.__importDefault(require("./LocationEventsFilter"));
23
+ const PastEventsFilter_1 = tslib_1.__importDefault(require("./PastEventsFilter"));
26
24
  const classes = {
27
25
  root: `${constants_1.PREFIX}-root`,
28
26
  filters: `${constants_1.PREFIX}-filters`,
@@ -41,11 +39,11 @@ const options = [
41
39
  { value: types_1.SCEventDateFilterType.NEXT_WEEK, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.select.nextWeek", defaultMessage: "ui.events.select.nextWeek" }) },
42
40
  { value: types_1.SCEventDateFilterType.THIS_MONTH, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.select.thisMonth", defaultMessage: "ui.events.select.thisMonth" }) }
43
41
  ];
44
- const Root = (0, styles_1.styled)(material_1.Box, {
42
+ const Root = (0, material_1.styled)(material_1.Box, {
45
43
  name: constants_1.PREFIX,
46
44
  slot: 'Root'
47
45
  })(() => ({}));
48
- exports.EventsChipRoot = (0, styles_1.styled)(material_1.Chip, {
46
+ exports.EventsChipRoot = (0, material_1.styled)(material_1.Chip, {
49
47
  name: constants_1.PREFIX,
50
48
  slot: 'EventsChipRoot',
51
49
  shouldForwardProp: (prop) => prop !== 'showFollowed' && prop !== 'showPastEvents'
@@ -79,7 +77,7 @@ exports.EventsChipRoot = (0, styles_1.styled)(material_1.Chip, {
79
77
  */
80
78
  function Events(inProps) {
81
79
  // PROPS
82
- const props = (0, system_1.useThemeProps)({
80
+ const props = (0, material_1.useThemeProps)({
83
81
  props: inProps,
84
82
  name: constants_1.PREFIX
85
83
  });
@@ -214,35 +212,17 @@ function Events(inProps) {
214
212
  /**
215
213
  * Renders events list
216
214
  */
217
- 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
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
219
- // @ts-ignore
220
- , {
221
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
222
- // @ts-ignore
223
- color: showMyEvents ? 'secondary' : 'default',
224
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
225
- // @ts-ignore
226
- 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),
215
+ 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, { 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),
227
216
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
228
217
  // @ts-ignore
229
- showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, autoHide: !loading && !events.length, 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, autoHide: !loading && !events.length && !showPastEvents, 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, autoHide: !loading && !events.length, disabled: loading || (!events.length && !location), 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 || (!events.length && !query), onKeyUp: (e) => {
218
+ showFollowed: showMyEvents, deleteIcon: showMyEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : 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, autoHide: !loading && !events.length && !showPastEvents, 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, autoHide: !loading && !events.length, disabled: loading || (!events.length && !location), 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 || (!events.length && !query), onKeyUp: (e) => {
230
219
  e.preventDefault();
231
220
  if (e.key === 'Enter') {
232
221
  fetchEvents(true);
233
222
  }
234
223
  }, InputProps: {
235
224
  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(true), disabled: loading || (!events.length && !query) }, { 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(true), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: loading || (!events.length && !query) })) })))
236
- } }) })), (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: showPastEvents || loading || (!events.length && dateSearch === types_1.SCEventDateFilterType.ANY), 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 || (!events.length && !location), handleOnChange: handleOnChangeLocation }) })), authUserId && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(exports.EventsChipRoot
237
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
238
- // @ts-ignore
239
- , {
240
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
241
- // @ts-ignore
242
- color: showFollowed ? 'secondary' : 'default',
243
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
244
- // @ts-ignore
245
- 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
+ } }) })), (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: showPastEvents || loading || (!events.length && dateSearch === types_1.SCEventDateFilterType.ANY), 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 || (!events.length && !location), 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,
246
226
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
247
227
  // @ts-ignore
248
228
  showFollowed: showFollowed, deleteIcon: showFollowed ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading || (!events.length && !showFollowed) }) }))), (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: dateSearch !== types_1.SCEventDateFilterType.ANY || loading || (!events.length && !showPastEvents) }) }))] })) }))), (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, {}) : 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" }) }))] })) : ((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, {}) : 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.personal", defaultMessage: "ui.events.noEvents.title.personal" }) }))] })) }))) : ((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" }, { 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" }) })))] })) })) })] }));
package/lib/cjs/components/Events/PastEventsFilter.js CHANGED
@@ -4,12 +4,11 @@ const tslib_1 = require("tslib");
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const material_1 = require("@mui/material");
6
6
  const react_intl_1 = require("react-intl");
7
- const system_1 = require("@mui/system");
8
7
  const constants_1 = require("./constants");
9
8
  const Events_1 = require("./Events");
10
9
  function PastEventsFilter(inProps) {
11
10
  // PROPS
12
- const props = (0, system_1.useThemeProps)({
11
+ const props = (0, material_1.useThemeProps)({
13
12
  props: inProps,
14
13
  name: constants_1.PREFIX
15
14
  });
@@ -17,16 +16,7 @@ function PastEventsFilter(inProps) {
17
16
  if (autoHide) {
18
17
  return null;
19
18
  }
20
- return ((0, jsx_runtime_1.jsx)(Events_1.EventsChipRoot
21
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
22
- // @ts-ignore
23
- , Object.assign({
24
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
25
- // @ts-ignore
26
- color: showPastEvents ? 'secondary' : 'default',
27
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
28
- // @ts-ignore
29
- variant: showPastEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByPastEvents", defaultMessage: "ui.events.filterByPastEvents" }), onClick: handleClick,
19
+ return ((0, jsx_runtime_1.jsx)(Events_1.EventsChipRoot, Object.assign({ color: showPastEvents ? 'secondary' : 'default', variant: showPastEvents ? 'filled' : 'outlined', label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.events.filterByPastEvents", defaultMessage: "ui.events.filterByPastEvents" }), onClick: handleClick,
30
20
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
31
21
  // @ts-ignore
32
22
  showPastEvents: showPastEvents, deleteIcon: showPastEvents ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) : null, onDelete: showPastEvents ? handleDeleteClick : undefined }, rest)));
package/lib/cjs/components/SuggestedEventsWidget/Arrow.js CHANGED
@@ -25,6 +25,7 @@ function Arrow(props) {
25
25
  if (type === 'prev') {
26
26
  return (currentItem > 0 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('prev') }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_left" }) }))));
27
27
  }
28
- return (currentItem < itemsLength - 1 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('next') }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_right" }) }))));
28
+ return (itemsLength > 2 &&
29
+ currentItem < itemsLength - 1 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('next') }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_right" }) }))));
29
30
  }
30
31
  exports.default = Arrow;
package/lib/esm/components/CreateEventButton/CreateEventButton.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { ButtonProps } from '@mui/material/Button/Button';
1
+ import { ButtonProps } from '@mui/material';
2
2
  import { EventFormDialogProps } from '../EventFormDialog';
3
3
  export interface CreateEventButtonProps extends ButtonProps {
4
4
  /**
package/lib/esm/components/CreateEventButton/CreateEventButton.js CHANGED
@@ -4,11 +4,11 @@ import { Button, Icon } from '@mui/material';
4
4
  import { styled } from '@mui/material/styles';
5
5
  import { useThemeProps } from '@mui/system';
6
6
  import { SCPreferences, SCUserContext, useSCPreferences } from '@selfcommunity/react-core';
7
+ import { SCFeatureName } from '@selfcommunity/types';
7
8
  import classNames from 'classnames';
8
9
  import React, { useContext, useMemo } from 'react';
9
10
  import { FormattedMessage } from 'react-intl';
10
11
  import EventFormDialog from '../EventFormDialog';
11
- import { SCFeatureName } from '@selfcommunity/types';
12
12
  const PREFIX = 'SCCreateEventButton';
13
13
  const classes = {
14
14
  root: `${PREFIX}-root`
package/lib/esm/components/Events/Events.js CHANGED
@@ -1,25 +1,23 @@
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, TextField, Typography, useMediaQuery, useTheme } from '@mui/material';
4
- import { styled } from '@mui/material/styles';
5
- import { useThemeProps } from '@mui/system';
3
+ import { Box, Button, Chip, FormControl, Grid, Icon, IconButton, InputAdornment, InputLabel, MenuItem, Radio, Select, styled, TextField, Typography, useMediaQuery, useTheme, useThemeProps } from '@mui/material';
6
4
  import { Endpoints, http } from '@selfcommunity/api-services';
7
5
  import { SCPreferences, SCPreferencesContext, SCUserContext, UserUtils } from '@selfcommunity/react-core';
8
- import { SCEventDateFilterType, SCEventSubscriptionStatusType, SCEventLocationFilterType } from '@selfcommunity/types';
6
+ import { SCEventDateFilterType, SCEventLocationFilterType, SCEventSubscriptionStatusType } from '@selfcommunity/types';
9
7
  import { Logger } from '@selfcommunity/utils';
10
8
  import classNames from 'classnames';
9
+ import PubSub from 'pubsub-js';
11
10
  import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
12
11
  import { FormattedMessage } from 'react-intl';
13
12
  import { SCOPE_SC_UI } from '../../constants/Errors';
14
13
  import { DEFAULT_PAGINATION_OFFSET } from '../../constants/Pagination';
14
+ import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
15
15
  import CreateEventButton from '../CreateEventButton';
16
16
  import Event, { EventSkeleton } from '../Event';
17
17
  import Skeleton from '../Events/Skeleton';
18
18
  import { PREFIX } from './constants';
19
- import PastEventsFilter from './PastEventsFilter';
20
- import PubSub from 'pubsub-js';
21
- import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
22
19
  import LocationEventsFilter from './LocationEventsFilter';
20
+ import PastEventsFilter from './PastEventsFilter';
23
21
  const classes = {
24
22
  root: `${PREFIX}-root`,
25
23
  filters: `${PREFIX}-filters`,
@@ -211,35 +209,17 @@ export default function Events(inProps) {
211
209
  /**
212
210
  * Renders events list
213
211
  */
214
- 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
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
216
- // @ts-ignore
217
- , {
218
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
219
- // @ts-ignore
220
- color: showMyEvents ? 'secondary' : 'default',
221
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
222
- // @ts-ignore
223
- variant: showMyEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents),
212
+ 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, { color: showMyEvents ? 'secondary' : 'default', variant: showMyEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByCreatedByMe", defaultMessage: "ui.events.filterByCreatedByMe" }), onClick: () => setShowMyEvents(!showMyEvents),
224
213
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
225
214
  // @ts-ignore
226
- showFollowed: showMyEvents, deleteIcon: showMyEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, autoHide: !loading && !events.length, disabled: loading }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, autoHide: !loading && !events.length && !showPastEvents, disabled: loading }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, autoHide: !loading && !events.length, disabled: loading || (!events.length && !location), 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 || (!events.length && !query), onKeyUp: (e) => {
215
+ showFollowed: showMyEvents, deleteIcon: showMyEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showMyEvents ? handleDeleteClick : null, disabled: loading }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, autoHide: !loading && !events.length && !showPastEvents, disabled: loading }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, autoHide: !loading && !events.length, disabled: loading || (!events.length && !location), 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 || (!events.length && !query), onKeyUp: (e) => {
227
216
  e.preventDefault();
228
217
  if (e.key === 'Enter') {
229
218
  fetchEvents(true);
230
219
  }
231
220
  }, InputProps: {
232
221
  endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchEvents(true), disabled: loading || (!events.length && !query) }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchEvents(true), endIcon: _jsx(Icon, { children: "search" }), disabled: loading || (!events.length && !query) })) })))
233
- } }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [_jsx(InputLabel, { children: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), _jsx(Select, Object.assign({ disabled: showPastEvents || loading || (!events.length && dateSearch === SCEventDateFilterType.ANY), size: 'small', label: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => (_jsxs(MenuItem, Object.assign({ value: option.value }, { children: [_jsx(Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, disabled: loading || (!events.length && !location), handleOnChange: handleOnChangeLocation }) })), authUserId && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(EventsChipRoot
234
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
235
- // @ts-ignore
236
- , {
237
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
238
- // @ts-ignore
239
- color: showFollowed ? 'secondary' : 'default',
240
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
241
- // @ts-ignore
242
- variant: showFollowed ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick,
222
+ } }) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [_jsx(InputLabel, { children: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }) }), _jsx(Select, Object.assign({ disabled: showPastEvents || loading || (!events.length && dateSearch === SCEventDateFilterType.ANY), size: 'small', label: _jsx(FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, { children: options.map((option) => (_jsxs(MenuItem, Object.assign({ value: option.value }, { children: [_jsx(Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }), option.label] }), option.value))) }))] })) })), _jsx(Grid, Object.assign({ item: true, xs: 12, md: 2 }, { children: _jsx(LocationEventsFilter, { value: location, disabled: loading || (!events.length && !location), 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,
243
223
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
244
224
  // @ts-ignore
245
225
  showFollowed: showFollowed, deleteIcon: showFollowed ? _jsx(Icon, { children: "close" }) : null, onDelete: showFollowed ? handleDeleteClick : null, disabled: loading || (!events.length && !showFollowed) }) }))), _jsx(Grid, Object.assign({ item: true }, { children: _jsx(PastEventsFilter, { showPastEvents: showPastEvents, handleClick: handleChipPastClick, handleDeleteClick: handleDeletePastClick, disabled: dateSearch !== SCEventDateFilterType.ANY || loading || (!events.length && !showPastEvents) }) }))] })) }))), _jsx(_Fragment, { children: loading ? (_jsx(Skeleton, Object.assign({}, EventsSkeletonComponentProps, { EventSkeletonProps: EventSkeletonComponentProps }))) : (_jsx(_Fragment, { children: !events.length ? (_jsx(Box, Object.assign({ className: classes.noResults }, { children: general ? (_jsxs(_Fragment, { children: [_jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (onlyStaffEnabled && UserUtils.isStaff(scUserContext.user)) || !onlyStaffEnabled ? _jsx(CreateEventButton, {}) : null })), _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" }) }))] })) : (_jsxs(_Fragment, { children: [_jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: (onlyStaffEnabled && UserUtils.isStaff(scUserContext.user)) || !onlyStaffEnabled ? _jsx(CreateEventButton, {}) : null })), _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.events.noEvents.title.personal", defaultMessage: "ui.events.noEvents.title.personal" }) }))] })) }))) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ container: true, spacing: { xs: 2 }, className: classes.events }, GridContainerComponentProps, { children: _jsxs(_Fragment, { children: [events.map((event) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.item }, GridItemComponentProps, { children: _jsx(Event, Object.assign({ event: event, eventId: event.id }, EventComponentProps)) }), event.id))), authUserId && events.length % 2 !== 0 && (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, className: classes.itemSkeleton }, GridItemComponentProps, { children: _jsx(EventSkeleton, Object.assign({}, EventSkeletonComponentProps, { skeletonsAnimation: false, actions: _jsx(CreateEventButton, Object.assign({ variant: "outlined", color: "primary", size: "small" }, { children: _jsx(FormattedMessage, { id: "ui.events.skeleton.action.add", defaultMessage: "ui.events.skeleton.action.add" }) })) })) }), 'skeleton-item'))] }) })), Boolean(next) && (_jsx(Button, Object.assign({ color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore }, { children: _jsx(FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }) })))] })) })) })] }));
package/lib/esm/components/Events/PastEventsFilter.js CHANGED
@@ -1,8 +1,7 @@
1
1
  import { __rest } from "tslib";
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
- import { Icon } from '@mui/material';
3
+ import { Icon, useThemeProps } from '@mui/material';
4
4
  import { FormattedMessage } from 'react-intl';
5
- import { useThemeProps } from '@mui/system';
6
5
  import { PREFIX } from './constants';
7
6
  import { EventsChipRoot } from './Events';
8
7
  export default function PastEventsFilter(inProps) {
@@ -15,16 +14,7 @@ export default function PastEventsFilter(inProps) {
15
14
  if (autoHide) {
16
15
  return null;
17
16
  }
18
- return (_jsx(EventsChipRoot
19
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
20
- // @ts-ignore
21
- , Object.assign({
22
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
23
- // @ts-ignore
24
- color: showPastEvents ? 'secondary' : 'default',
25
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
26
- // @ts-ignore
27
- variant: showPastEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByPastEvents", defaultMessage: "ui.events.filterByPastEvents" }), onClick: handleClick,
17
+ return (_jsx(EventsChipRoot, Object.assign({ color: showPastEvents ? 'secondary' : 'default', variant: showPastEvents ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.events.filterByPastEvents", defaultMessage: "ui.events.filterByPastEvents" }), onClick: handleClick,
28
18
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
29
19
  // @ts-ignore
30
20
  showPastEvents: showPastEvents, deleteIcon: showPastEvents ? _jsx(Icon, { children: "close" }) : null, onDelete: showPastEvents ? handleDeleteClick : undefined }, rest)));
package/lib/esm/components/SuggestedEventsWidget/Arrow.js CHANGED
@@ -23,5 +23,6 @@ export default function Arrow(props) {
23
23
  if (type === 'prev') {
24
24
  return (currentItem > 0 && (_jsx(Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('prev') }, { children: _jsx(Icon, { children: "chevron_left" }) }))));
25
25
  }
26
- return (currentItem < itemsLength - 1 && (_jsx(Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('next') }, { children: _jsx(Icon, { children: "chevron_right" }) }))));
26
+ return (itemsLength > 2 &&
27
+ currentItem < itemsLength - 1 && (_jsx(Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('next') }, { children: _jsx(Icon, { children: "chevron_right" }) }))));
27
28
  }