@selfcommunity/react-ui 0.7.50-events.66 → 0.7.50-events.67

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 (8) hide show
  1. package/lib/cjs/components/Event/Skeleton.js +5 -5
  2. package/lib/cjs/components/EventParticipantsButton/EventParticipantsButton.js +8 -1
  3. package/lib/cjs/components/SuggestedEventsWidget/Arrow.js +1 -1
  4. package/lib/esm/components/Event/Skeleton.js +5 -5
  5. package/lib/esm/components/EventParticipantsButton/EventParticipantsButton.js +9 -2
  6. package/lib/esm/components/SuggestedEventsWidget/Arrow.js +1 -1
  7. package/lib/umd/react-ui.js +1 -1
  8. package/package.json +7 -7
package/lib/cjs/components/Event/Skeleton.js CHANGED
@@ -3,14 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const material_1 = require("@mui/material");
6
- const styles_1 = require("@mui/material/styles");
7
6
  const Skeleton_1 = tslib_1.__importDefault(require("@mui/material/Skeleton"));
8
- const constants_1 = require("./constants");
7
+ const styles_1 = require("@mui/material/styles");
8
+ const system_1 = require("@mui/system");
9
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
9
10
  const BaseItem_1 = tslib_1.__importDefault(require("../../shared/BaseItem"));
10
11
  const event_1 = require("../../types/event");
11
12
  const Widget_1 = tslib_1.__importDefault(require("../Widget"));
12
- const system_1 = require("@mui/system");
13
- const classnames_1 = tslib_1.__importDefault(require("classnames"));
13
+ const constants_1 = require("./constants");
14
14
  const classes = {
15
15
  root: `${constants_1.PREFIX}-skeleton-root`,
16
16
  skeletonDetailRoot: `${constants_1.PREFIX}-skeleton-detail-root`,
@@ -78,7 +78,7 @@ function EventSkeleton(inProps) {
78
78
  contentObj = ((0, jsx_runtime_1.jsxs)(SkeletonDetailRoot, Object.assign({ className: classes.skeletonDetailRoot }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ position: "relative" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "170px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { className: classes.skeletonDetailCalendar, variant: "rounded", animation: skeletonsAnimation, width: "60px", height: "60px" })] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.skeletonDetailContent }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "36%", height: "40px" }), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "50%", height: "20px" })] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "35%", height: "20px" })] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "14px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "27%", height: "20px" })] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", gap: "8px", className: classes.skeletonDetailUser }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "36px", height: "36px" }), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ gap: "1px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "75px", height: "15px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "86px", height: "16px" })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, { className: classes.skeletonDetailFirstDivider }), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "68px", height: "20px" }), (0, jsx_runtime_1.jsxs)(material_1.AvatarGroup, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" })] })] })), (0, jsx_runtime_1.jsx)(material_1.Divider, { className: classes.skeletonDetailSecondDivider })] }))] })));
79
79
  }
80
80
  else if (template === event_1.SCEventTemplateType.PREVIEW) {
81
- contentObj = ((0, jsx_runtime_1.jsxs)(SkeletonPreviewRoot, Object.assign({ className: classes.skeletonPreviewRoot }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ position: "relative" }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "80px" }) })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.skeletonPreviewContent }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "30%", height: "16px" })] })), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "46%", height: "20px" }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "14px" }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "27%", height: "16px" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.AvatarGroup, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" })] }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "10%", height: "20px" })] }))] }))] })));
81
+ contentObj = ((0, jsx_runtime_1.jsxs)(SkeletonPreviewRoot, Object.assign({ className: classes.skeletonPreviewRoot }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ position: "relative" }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "80px" }) })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.skeletonPreviewContent }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "30%", height: "16px" })] })), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "46%", height: "20px" }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "2px" }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "27%", height: "16px" }) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: (0, jsx_runtime_1.jsxs)(material_1.AvatarGroup, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "28px", height: "28px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "28px", height: "28px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "circular", width: "28px", height: "28px" })] }) }))] }))] })));
82
82
  }
83
83
  else {
84
84
  contentObj = ((0, jsx_runtime_1.jsx)(SkeletonSnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.skeletonSnippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.skeletonSnippetImage }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", width: 100, height: 60 }), " ", (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "large" }, { children: "CalendarIcon" }))] })), primary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "40%", style: { marginBottom: 12 } }), secondary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "60%", style: { marginBottom: 10, marginRight: 5 } }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "35%" })] }), actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) }))) }) }));
package/lib/cjs/components/EventParticipantsButton/EventParticipantsButton.js CHANGED
@@ -7,6 +7,7 @@ const styles_1 = require("@mui/material/styles");
7
7
  const system_1 = require("@mui/system");
8
8
  const api_services_1 = require("@selfcommunity/api-services");
9
9
  const react_core_1 = require("@selfcommunity/react-core");
10
+ const types_1 = require("@selfcommunity/types");
10
11
  const utils_1 = require("@selfcommunity/utils");
11
12
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
12
13
  const react_1 = require("react");
@@ -72,12 +73,18 @@ function EventParticipantsButton(inProps) {
72
73
  const [open, setOpen] = (0, react_1.useState)(false);
73
74
  // HOOKS
74
75
  const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
76
+ const scUserContext = (0, react_core_1.useSCUser)();
77
+ const scEventsManager = scUserContext.managers.events;
75
78
  // FETCH FIRST FOLLOWERS
76
79
  (0, use_deep_compare_effect_1.useDeepCompareEffectNoCheck)(() => {
77
80
  if (!scEvent) {
78
81
  return;
79
82
  }
80
- if (followers.length === 0) {
83
+ const status = scEventsManager === null || scEventsManager === void 0 ? void 0 : scEventsManager.subscriptionStatus(scEvent);
84
+ if ((status === types_1.SCEventSubscriptionStatusType.GOING ||
85
+ status === types_1.SCEventSubscriptionStatusType.NOT_GOING ||
86
+ status === types_1.SCEventSubscriptionStatusType.SUBSCRIBED) &&
87
+ followers.length === 0) {
81
88
  api_services_1.EventService.getUsersGoingToEvent(scEvent.id, { limit: 3 }).then((res) => {
82
89
  setFollowers([...res.results]);
83
90
  setOffset(4);
package/lib/cjs/components/SuggestedEventsWidget/Arrow.js CHANGED
@@ -12,7 +12,7 @@ function Arrow(props) {
12
12
  const swiper = (0, react_2.useSwiper)();
13
13
  (0, react_1.useEffect)(() => {
14
14
  setItemsLength(swiper.slides.length);
15
- }, []);
15
+ }, [currentItem]);
16
16
  const handleChange = (0, react_1.useCallback)((type) => {
17
17
  if (type === 'prev') {
18
18
  swiper.slidePrev();
package/lib/esm/components/Event/Skeleton.js CHANGED
@@ -1,14 +1,14 @@
1
1
  import { __rest } from "tslib";
2
2
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
3
  import { AvatarGroup, Box, Button, CardContent, Divider, Icon, Stack } from '@mui/material';
4
- import { styled } from '@mui/material/styles';
5
4
  import Skeleton from '@mui/material/Skeleton';
6
- import { PREFIX } from './constants';
5
+ import { styled } from '@mui/material/styles';
6
+ import { useThemeProps } from '@mui/system';
7
+ import classNames from 'classnames';
7
8
  import BaseItem from '../../shared/BaseItem';
8
9
  import { SCEventTemplateType } from '../../types/event';
9
10
  import Widget from '../Widget';
10
- import { useThemeProps } from '@mui/system';
11
- import classNames from 'classnames';
11
+ import { PREFIX } from './constants';
12
12
  const classes = {
13
13
  root: `${PREFIX}-skeleton-root`,
14
14
  skeletonDetailRoot: `${PREFIX}-skeleton-detail-root`,
@@ -76,7 +76,7 @@ export default function EventSkeleton(inProps) {
76
76
  contentObj = (_jsxs(SkeletonDetailRoot, Object.assign({ className: classes.skeletonDetailRoot }, { children: [_jsxs(Box, Object.assign({ position: "relative" }, { children: [_jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "170px" }), _jsx(Skeleton, { className: classes.skeletonDetailCalendar, variant: "rounded", animation: skeletonsAnimation, width: "60px", height: "60px" })] })), _jsxs(CardContent, Object.assign({ className: classes.skeletonDetailContent }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "36%", height: "40px" }), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "50%", height: "20px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "35%", height: "20px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "14px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "20px" })] })), _jsxs(Stack, Object.assign({ direction: "row", gap: "8px", className: classes.skeletonDetailUser }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "36px", height: "36px" }), _jsxs(Stack, Object.assign({ gap: "1px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "75px", height: "15px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "86px", height: "16px" })] }))] })), _jsx(Divider, { className: classes.skeletonDetailFirstDivider }), _jsxs(Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "68px", height: "20px" }), _jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" })] })] })), _jsx(Divider, { className: classes.skeletonDetailSecondDivider })] }))] })));
77
77
  }
78
78
  else if (template === SCEventTemplateType.PREVIEW) {
79
- contentObj = (_jsxs(SkeletonPreviewRoot, Object.assign({ className: classes.skeletonPreviewRoot }, { children: [_jsx(Box, Object.assign({ position: "relative" }, { children: _jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "80px" }) })), _jsxs(CardContent, Object.assign({ className: classes.skeletonPreviewContent }, { children: [_jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "30%", height: "16px" })] })), _jsx(Skeleton, { animation: skeletonsAnimation, width: "46%", height: "20px" }), _jsx(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "14px" }, { children: _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "16px" }) })), _jsxs(Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: [_jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" })] }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "10%", height: "20px" })] }))] }))] })));
79
+ contentObj = (_jsxs(SkeletonPreviewRoot, Object.assign({ className: classes.skeletonPreviewRoot }, { children: [_jsx(Box, Object.assign({ position: "relative" }, { children: _jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "80px" }) })), _jsxs(CardContent, Object.assign({ className: classes.skeletonPreviewContent }, { children: [_jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "30%", height: "16px" })] })), _jsx(Skeleton, { animation: skeletonsAnimation, width: "46%", height: "20px" }), _jsx(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "2px" }, { children: _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "16px" }) })), _jsx(Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: _jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "28px", height: "28px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "28px", height: "28px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "28px", height: "28px" })] }) }))] }))] })));
80
80
  }
81
81
  else {
82
82
  contentObj = (_jsx(SkeletonSnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.skeletonSnippetRoot, image: _jsxs(Box, Object.assign({ className: classes.skeletonSnippetImage }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", width: 100, height: 60 }), " ", _jsx(Icon, Object.assign({ fontSize: "large" }, { children: "CalendarIcon" }))] })), primary: _jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "40%", style: { marginBottom: 12 } }), secondary: _jsxs(_Fragment, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "60%", style: { marginBottom: 10, marginRight: 5 } }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "35%" })] }), actions: _jsx(_Fragment, { children: actions !== null && actions !== void 0 ? actions : (_jsx(Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: _jsx(Skeleton, { animation: skeletonsAnimation, height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) }))) }) }));
package/lib/esm/components/EventParticipantsButton/EventParticipantsButton.js CHANGED
@@ -4,7 +4,8 @@ import { Avatar, AvatarGroup, Button, List, ListItem, Typography } from '@mui/ma
4
4
  import { styled } from '@mui/material/styles';
5
5
  import { useThemeProps } from '@mui/system';
6
6
  import { Endpoints, EventService, http } from '@selfcommunity/api-services';
7
- import { useSCFetchEvent } from '@selfcommunity/react-core';
7
+ import { useSCFetchEvent, useSCUser } from '@selfcommunity/react-core';
8
+ import { SCEventSubscriptionStatusType } from '@selfcommunity/types';
8
9
  import { Logger } from '@selfcommunity/utils';
9
10
  import classNames from 'classnames';
10
11
  import { useCallback, useEffect, useState } from 'react';
@@ -70,12 +71,18 @@ export default function EventParticipantsButton(inProps) {
70
71
  const [open, setOpen] = useState(false);
71
72
  // HOOKS
72
73
  const { scEvent } = useSCFetchEvent({ id: eventId, event });
74
+ const scUserContext = useSCUser();
75
+ const scEventsManager = scUserContext.managers.events;
73
76
  // FETCH FIRST FOLLOWERS
74
77
  useDeepCompareEffectNoCheck(() => {
75
78
  if (!scEvent) {
76
79
  return;
77
80
  }
78
- if (followers.length === 0) {
81
+ const status = scEventsManager === null || scEventsManager === void 0 ? void 0 : scEventsManager.subscriptionStatus(scEvent);
82
+ if ((status === SCEventSubscriptionStatusType.GOING ||
83
+ status === SCEventSubscriptionStatusType.NOT_GOING ||
84
+ status === SCEventSubscriptionStatusType.SUBSCRIBED) &&
85
+ followers.length === 0) {
79
86
  EventService.getUsersGoingToEvent(scEvent.id, { limit: 3 }).then((res) => {
80
87
  setFollowers([...res.results]);
81
88
  setOffset(4);
package/lib/esm/components/SuggestedEventsWidget/Arrow.js CHANGED
@@ -10,7 +10,7 @@ export default function Arrow(props) {
10
10
  const swiper = useSwiper();
11
11
  useEffect(() => {
12
12
  setItemsLength(swiper.slides.length);
13
- }, []);
13
+ }, [currentItem]);
14
14
  const handleChange = useCallback((type) => {
15
15
  if (type === 'prev') {
16
16
  swiper.slidePrev();