@selfcommunity/react-ui 0.8.0-live.80 → 0.8.0-live.85

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

@@ -1,6 +1,6 @@
-import { BaseDialogProps } from '../../shared/BaseDialog';
-import { SCCategoryType } from '@selfcommunity/types';
 import { ButtonProps } from '@mui/material/Button/Button';
+import { SCCategoryType } from '@selfcommunity/types';
+import { BaseDialogProps } from '../../shared/BaseDialog';
 export interface CategoryFollowersButtonProps extends Pick<ButtonProps, Exclude<keyof ButtonProps, 'onClick' | 'disabled'>> {
     /**
      * Category Object

package/lib/esm/components/CategoryFollowersButton/CategoryFollowersButton.js

@@ -1,21 +1,22 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useMemo, useState } from 'react';
-import { styled } from '@mui/material/styles';
 import { Avatar, AvatarGroup, Button, List, ListItem, Typography, useTheme } from '@mui/material';
-import BaseDialog from '../../shared/BaseDialog';
-import { FormattedMessage } from 'react-intl';
-import InfiniteScroll from '../../shared/InfiniteScroll';
-import User, { UserSkeleton } from '../User';
+import { styled } from '@mui/material/styles';
+import useMediaQuery from '@mui/material/useMediaQuery';
+import { useThemeProps } from '@mui/system';
 import { CategoryService, Endpoints, http } from '@selfcommunity/api-services';
 import { useSCFetchCategory } from '@selfcommunity/react-core';
-import AvatarGroupSkeleton from '../Skeleton/AvatarGroupSkeleton';
-import classNames from 'classnames';
-import { useThemeProps } from '@mui/system';
-import useMediaQuery from '@mui/material/useMediaQuery';
 import { Logger } from '@selfcommunity/utils';
-import { SCOPE_SC_UI } from '../../constants/Errors';
+import classNames from 'classnames';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { FormattedMessage } from 'react-intl';
 import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect';
+import { SCOPE_SC_UI } from '../../constants/Errors';
+import BaseDialog from '../../shared/BaseDialog';
+import InfiniteScroll from '../../shared/InfiniteScroll';
+import { numberFormatter } from '../../utils/buttonCounters';
+import AvatarGroupSkeleton from '../Skeleton/AvatarGroupSkeleton';
+import User, { UserSkeleton } from '../User';
 const PREFIX = 'SCCategoryFollowersButton';
 const classes = {
     root: `${PREFIX}-root`,
@@ -25,12 +26,13 @@ const classes = {
 const Root = styled(Button, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    overridesResolver: (_props, styles) => styles.root,
+    shouldForwardProp: (prop) => prop !== 'followers'
 })(() => ({}));
 const DialogRoot = styled(BaseDialog, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.dialogRoot
+    slot: 'DialogRoot',
+    overridesResolver: (_props, styles) => styles.dialogRoot
 })(() => ({}));
 /**
  *> API documentation for the Community-JS Category Followers Button component. Learn about the available props and the CSS API.
@@ -120,8 +122,11 @@ export default function CategoryFollowersButton(inProps) {
     const handleToggleDialogOpen = useMemo(() => () => {
         setOpen((prev) => !prev);
     }, [setOpen]);
+    const renderSurplus = useCallback(() => numberFormatter(scCategory.followers_counter), [scCategory]);
     // RENDER
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCategory || scCategory.followers_counter === 0 }, rest, { children: loading || !scCategory ? (_jsx(AvatarGroupSkeleton, Object.assign({}, rest))) : (_jsx(AvatarGroup, Object.assign({ total: scCategory.followers_counter }, { children: followers.map((c) => (_jsx(Avatar, { alt: c.username, src: c.avatar }, c.id))) }))) })), open && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryFollowersButton.dialogTitle", id: "ui.categoryFollowersButton.dialogTitle", values: { total: scCategory.followers_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: _jsx(UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoryFollowersButton.noOtherFollowers", defaultMessage: "ui.categoryFollowersButton.noOtherFollowers" }) })) }, { children: _jsx(List, { children: followers.map((follower) => (_jsx(ListItem, { children: _jsx(User, { elevation: 0, user: follower }) }, follower.id))) }) })) })))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCategory || scCategory.followers_counter === 0, 
+                // @ts-expect-error this is needed to use followers into SCCategoryFollowersButton
+                followers: scCategory === null || scCategory === void 0 ? void 0 : scCategory.followers_counter }, rest, { children: loading || !scCategory ? (_jsx(AvatarGroupSkeleton, Object.assign({}, rest))) : (_jsx(AvatarGroup, Object.assign({ total: scCategory.followers_counter, renderSurplus: renderSurplus }, { children: followers.map((c) => (_jsx(Avatar, { alt: c.username, src: c.avatar }, c.id))) }))) })), open && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryFollowersButton.dialogTitle", id: "ui.categoryFollowersButton.dialogTitle", values: { total: scCategory.followers_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: _jsx(UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoryFollowersButton.noOtherFollowers", defaultMessage: "ui.categoryFollowersButton.noOtherFollowers" }) })) }, { children: _jsx(List, { children: followers.map((follower) => (_jsx(ListItem, { children: _jsx(User, { elevation: 0, user: follower }) }, follower.id))) }) })) })))] }));
 }

package/lib/esm/components/CommentObject/CommentObject.js

@@ -4,7 +4,7 @@ import React, { useContext, useState } from 'react';
 import { styled } from '@mui/material/styles';
 import Widget from '../Widget';
 import { FormattedMessage } from 'react-intl';
-import { Avatar, Box, Button, CardContent, Typography } from '@mui/material';
+import { Avatar, Box, Button, CardContent, Chip, Icon, IconButton, Typography } from '@mui/material';
 import Bullet from '../../shared/Bullet';
 import classNames from 'classnames';
 import { SCOPE_SC_UI } from '../../constants/Errors';
@@ -14,7 +14,7 @@ import CommentsObject from '../CommentsObject';
 import CommentObjectReply from '../CommentObjectReply';
 import ContributionActionsMenu from '../../shared/ContributionActionsMenu';
 import DateTimeAgo from '../../shared/DateTimeAgo';
-import { getContributionHtml, getContributionType, getRouteData } from '../../utils/contribution';
+import { getCommentContributionHtml, getContributionType, getRouteData } from '../../utils/contribution';
 import { useSnackbar } from 'notistack';
 import { useThemeProps } from '@mui/system';
 import BaseItem from '../../shared/BaseItem';
@@ -42,7 +42,9 @@ const classes = {
     vote: `${PREFIX}-vote`,
     voteAudience: `${PREFIX}-vote-audience`,
     reply: `${PREFIX}-reply`,
-    contentSubSection: `${PREFIX}-comment-sub-section`
+    contentSubSection: `${PREFIX}-comment-sub-section`,
+    collapsed: `${PREFIX}-collapsed`,
+    flagChip: `${PREFIX}-flag-chip`
 };
 const Root = styled(Box, {
     name: PREFIX,
@@ -101,6 +103,7 @@ export default function CommentObject(inProps) {
     const { enqueueSnackbar } = useSnackbar();
     // STATE
     const { obj, setObj } = useSCFetchCommentObject({ id: commentObjectId, commentObject, cacheStrategy });
+    const [collapsed, setCollapsed] = useState(obj === null || obj === void 0 ? void 0 : obj.collapsed);
     const [replyComment, setReplyComment] = useState(commentReply);
     const [isReplying, setIsReplying] = useState(false);
     const [isSavingComment, setIsSavingComment] = useState(false);
@@ -298,8 +301,8 @@ export default function CommentObject(inProps) {
         }
         const summaryHtmlTruncated = 'summary_truncated' in comment ? comment.summary_truncated : false;
         const commentHtml = 'summary_html' in comment && truncateContent && summaryHtmlTruncated ? comment.summary_html : comment.html;
-        const summaryHtml = getContributionHtml(commentHtml, scRoutingContext.url);
-        return (_jsxs(React.Fragment, { children: [editComment && editComment.id === comment.id ? (_jsx(Box, Object.assign({ className: classes.comment }, { children: _jsx(CommentObjectReply, Object.assign({ text: comment.html, autoFocus: true, id: `edit-${comment.id}`, onSave: handleSave, onCancel: handleCancel, editable: !isReplying || !isSavingComment }, CommentObjectReplyProps)) }))) : (_jsx(BaseItem, { elevation: 0, className: classes.comment, image: _jsx(Link, Object.assign({}, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !obj.author.community_badge }, { children: _jsx(Avatar, { alt: obj.author.username, variant: "circular", src: comment.author.avatar, className: classes.avatar }) })) })), disableTypography: true, primary: _jsxs(_Fragment, { children: [_jsxs(Widget, Object.assign({ className: classes.content, elevation: elevation }, rest, { children: [_jsxs(CardContent, Object.assign({ className: classNames({ [classes.deleted]: obj && obj.deleted }) }, { children: [_jsx(Link, Object.assign({ className: classes.author }, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(Typography, Object.assign({ component: "span" }, { children: comment.author.username })) })), _jsx(Typography, { className: classes.textContent, variant: "body2", gutterBottom: true, dangerouslySetInnerHTML: { __html: summaryHtml } }), summaryHtmlTruncated && truncateContent && (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(comment)), className: classes.showMoreContent }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.showMore", defaultMessage: "ui.commentObject.showMore" }) })))] })), scUserContext.user && (_jsx(Box, Object.assign({ className: classes.commentActionsMenu }, { children: _jsx(ContributionActionsMenu, { commentObject: comment, onRestoreContribution: handleRestore, onHideContribution: handleHide, onDeleteContribution: handleDelete, onEditContribution: handleEdit }) })))] })), _jsxs(Box, Object.assign({ component: "span", className: classes.contentSubSection }, { children: [renderTimeAgo(comment), _jsx(Bullet, {}), _jsx(VoteButton, { size: "small", className: classes.vote, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment, onVote: handleVoteSuccess }), _jsx(Bullet, {}), renderActionReply(comment), _jsx(VoteAudienceButton, { size: "small", className: classes.voteAudience, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment })] }))] }) })), comment.comment_count > 0 && _jsx(Box, Object.assign({ className: classes.nestedComments }, { children: renderLatestComment(comment) })), scUserContext.user && replyComment && (replyComment.id === comment.id || replyComment.parent === comment.id) && !comment.parent && (_jsx(Box, Object.assign({ className: classes.nestedComments }, { children: _jsx(CommentObjectReply, Object.assign({ text: `@${replyComment.author.username}, `, autoFocus: true, id: `reply-${replyComment.id}`, onReply: handleReply, editable: !isReplying }, CommentObjectReplyProps), `reply-${replyComment.id}`) })))] }, comment.id));
+        const summaryHtml = getCommentContributionHtml(commentHtml, scRoutingContext.url);
+        return (_jsxs(React.Fragment, { children: [collapsed ? (_jsx(BaseItem, { elevation: 0, className: classes.comment, disableTypography: true, primary: _jsxs(Widget, Object.assign({ className: classNames(classes.content, classes.collapsed), elevation: elevation }, rest, { children: [_jsx(CardContent, Object.assign({ className: classNames({ [classes.deleted]: obj && obj.deleted }) }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.collapsed", defaultMessage: "ui.commentObject.collapsed" }) })), _jsx(Box, Object.assign({ className: classes.commentActionsMenu }, { children: _jsx(IconButton, Object.assign({ onClick: () => setCollapsed(!collapsed) }, { children: _jsx(Icon, { children: "visibility" }) })) }))] })) })) : editComment && editComment.id === comment.id ? (_jsx(Box, Object.assign({ className: classes.comment }, { children: _jsx(CommentObjectReply, Object.assign({ text: comment.html, autoFocus: true, id: `edit-${comment.id}`, onSave: handleSave, onCancel: handleCancel, editable: !isReplying || !isSavingComment }, CommentObjectReplyProps)) }))) : (_jsx(BaseItem, { elevation: 0, className: classes.comment, image: _jsx(Link, Object.assign({}, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !obj.author.community_badge }, { children: _jsx(Avatar, { alt: obj.author.username, variant: "circular", src: comment.author.avatar, className: classes.avatar }) })) })), disableTypography: true, primary: _jsxs(_Fragment, { children: [_jsxs(Widget, Object.assign({ className: classes.content, elevation: elevation }, rest, { children: [_jsxs(CardContent, Object.assign({ className: classNames({ [classes.deleted]: obj && obj.deleted }) }, { children: [_jsx(Link, Object.assign({ className: classes.author }, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(Typography, Object.assign({ component: "span" }, { children: comment.author.username })) })), comment.collapsed && (_jsx(Chip, { className: classes.flagChip, color: "error", size: "small", label: _jsx(FormattedMessage, { id: "ui.commentObject.flag", defaultMessage: "ui.commentObject.flag" }) })), _jsx(Typography, { className: classes.textContent, variant: "body2", gutterBottom: true, dangerouslySetInnerHTML: { __html: summaryHtml } }), summaryHtmlTruncated && truncateContent && (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(comment)), className: classes.showMoreContent }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.showMore", defaultMessage: "ui.commentObject.showMore" }) })))] })), scUserContext.user && (_jsx(Box, Object.assign({ className: classes.commentActionsMenu }, { children: _jsx(ContributionActionsMenu, { commentObject: comment, onRestoreContribution: handleRestore, onHideContribution: handleHide, onDeleteContribution: handleDelete, onEditContribution: handleEdit }) })))] })), _jsxs(Box, Object.assign({ component: "span", className: classes.contentSubSection }, { children: [renderTimeAgo(comment), _jsx(Bullet, {}), _jsx(VoteButton, { size: "small", className: classes.vote, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment, onVote: handleVoteSuccess }), _jsx(Bullet, {}), renderActionReply(comment), _jsx(VoteAudienceButton, { size: "small", className: classes.voteAudience, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment })] }))] }) })), comment.comment_count > 0 && _jsx(Box, Object.assign({ className: classes.nestedComments }, { children: renderLatestComment(comment) })), scUserContext.user && replyComment && (replyComment.id === comment.id || replyComment.parent === comment.id) && !comment.parent && (_jsx(Box, Object.assign({ className: classes.nestedComments }, { children: _jsx(CommentObjectReply, Object.assign({ text: `@${replyComment.author.username}, `, autoFocus: true, id: `reply-${replyComment.id}`, onReply: handleReply, editable: !isReplying }, CommentObjectReplyProps), `reply-${replyComment.id}`) })))] }, comment.id));
     }
     /**
      * Render Latest Comment

package/lib/esm/components/CommentObjectReply/CommentObjectReply.js

@@ -4,7 +4,7 @@ import { useEffect, useMemo, useRef, useState } from 'react';
 import { styled } from '@mui/material/styles';
 import Widget from '../Widget';
 import { FormattedMessage } from 'react-intl';
-import { Avatar, Stack } from '@mui/material';
+import { Avatar, Stack, useMediaQuery, useTheme } from '@mui/material';
 import { useSCUser } from '@selfcommunity/react-core';
 import Editor from '../Editor';
 import classNames from 'classnames';
@@ -67,6 +67,9 @@ export default function CommentObjectReply(inProps) {
     const scUserContext = useSCUser();
     // RETRIEVE OBJECTS
     const [html, setHtml] = useState(text);
+    // HOOKS
+    const theme = useTheme();
+    const isMobile = useMediaQuery(theme.breakpoints.down('md'));
     // REFS
     let editor = useRef();
     /**
@@ -80,7 +83,7 @@ export default function CommentObjectReply(inProps) {
      * Focus on editor
      */
     const handleEditorFocus = () => {
-        if (editor.current) {
+        if (!isMobile && editor.current) {
             editor.current.focus();
         }
     };

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

@@ -1,4 +1,4 @@
-import { ButtonProps } from '@mui/material/Button/Button';
+import { ButtonProps } from '@mui/material';
 import { EventFormDialogProps } from '../EventFormDialog';
 export interface CreateEventButtonProps extends ButtonProps {
     /**

package/lib/esm/components/CreateEventButton/CreateEventButton.js

@@ -4,11 +4,11 @@ import { Button, Icon } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import { useThemeProps } from '@mui/system';
 import { SCPreferences, SCUserContext, useSCPreferences } from '@selfcommunity/react-core';
+import { SCFeatureName } from '@selfcommunity/types';
 import classNames from 'classnames';
 import React, { useContext, useMemo } from 'react';
 import { FormattedMessage } from 'react-intl';
 import EventFormDialog from '../EventFormDialog';
-import { SCFeatureName } from '@selfcommunity/types';
 const PREFIX = 'SCCreateEventButton';
 const classes = {
     root: `${PREFIX}-root`

package/lib/esm/components/EditEventButton/EditEventButton.js

@@ -13,8 +13,8 @@ const classes = {
 const Root = styled(CreateEventButton, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    overridesResolver: (_props, styles) => styles.root
+})(() => ({}));
 /**
  *> API documentation for the Community-JS Create Event Button component. Learn about the available props and the CSS API.
  *

package/lib/esm/components/Editor/plugins/AutoLinkPlugin.js

@@ -2,6 +2,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { AutoLinkPlugin as LexicalAutoLinkPlugin } from '@lexical/react/LexicalAutoLinkPlugin';
 const URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
 const EMAIL_MATCHER = /(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))/;
+const normalizeURL = (url) => {
+    if (!url.startsWith('http://') && !url.startsWith('https://') && !url.startsWith('mailto:')) {
+        return `https://${url}`;
+    }
+    return url;
+};
 const MATCHERS = [
     (text) => {
         const match = URL_MATCHER.exec(text);
@@ -9,7 +15,7 @@ const MATCHERS = [
             index: match.index,
             length: match[0].length,
             text: match[0],
-            url: match[0]
+            url: normalizeURL(match[0])
         });
     },
     (text) => {

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

@@ -49,22 +49,22 @@ const classes = {
 const Root = styled(Widget, {
     name: PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    overridesResolver: (_props, styles) => styles.root
 })(() => ({}));
 const DetailRoot = styled(Box, {
     name: PREFIX,
     slot: 'DetailRoot',
-    overridesResolver: (props, styles) => styles.detailRoot
+    overridesResolver: (_props, styles) => styles.detailRoot
 })(() => ({}));
 const PreviewRoot = styled(Box, {
     name: PREFIX,
     slot: 'PreviewRoot',
-    overridesResolver: (props, styles) => styles.previewRoot
+    overridesResolver: (_props, styles) => styles.previewRoot
 })(() => ({}));
 const SnippetRoot = styled(BaseItem, {
     name: PREFIX,
     slot: 'SnippetRoot',
-    overridesResolver: (props, styles) => styles.snippetRoot
+    overridesResolver: (_props, styles) => styles.snippetRoot
 })(() => ({}));
 /**
  * > API documentation for the Community-JS Event component. Learn about the available props and the CSS API.

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

@@ -1,10 +1,9 @@
 import { __awaiter } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Autocomplete, Box, InputAdornment, Tab, Tabs, TextField } from '@mui/material';
 import Icon from '@mui/material/Icon';
 import { styled } from '@mui/material/styles';
 import { useThemeProps } from '@mui/system';
-import { useLoadScript } from '@react-google-maps/api';
 import { SCPreferences, useSCContext, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
 import { SCCommunitySubscriptionTier, SCEventLocationType } from '@selfcommunity/types';
 import axios from 'axios';
@@ -18,6 +17,7 @@ import LiveStreamFormSettings from '../LiveStreamForm/LiveStreamFormSettings';
 import { SCLiveStreamTemplateType } from '../../types/liveStream';
 import { LIVESTREAM_DEFAULT_SETTINGS } from '../LiveStreamForm/constants';
 import { getNewDate } from './utils';
+import { useSCGoogleApiLoader } from '@selfcommunity/react-core';
 const messages = defineMessages({
     virtualPlaceholder: {
         id: 'ui.eventForm.address.online.placeholder',
@@ -67,11 +67,6 @@ export default function EventAddress(inProps) {
     const scContext = useSCContext();
     const scUserContext = useSCUser();
     const { preferences } = useSCPreferences();
-    const geocodingApiKey = useMemo(() => scContext.settings.integrations && scContext.settings.integrations.geocoding.apiKey, [scContext.settings.integrations]);
-    const { isLoaded } = useLoadScript({
-        googleMapsApiKey: scContext.settings.integrations.geocoding.apiKey,
-        libraries: ['places', 'geocoding']
-    });
     const isFreeTrialTier = useMemo(() => preferences &&
         SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
         preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
@@ -89,6 +84,8 @@ export default function EventAddress(inProps) {
             (!isFreeTrialTier || (isFreeTrialTier && (scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) && (scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user.id) === 1)) &&
             (((_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream) || event.live_stream);
     }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission, event]);
+    // HOOKS
+    const { isLoaded, geocodingApiKey } = useSCGoogleApiLoader();
     // HANDLERS
     const handleChange = (_event, newValue) => {
         setLocation(newValue);
@@ -107,7 +104,7 @@ export default function EventAddress(inProps) {
                 setGeoLocation(newValue);
                 forwardGeolocationData({
                     location,
-                    geolocation: place.formatted_address,
+                    geolocation: newValue.description.split(',')[0] + '. ' + place.formatted_address,
                     lat: place.geometry.location.lat,
                     lng: place.geometry.location.lng
                 });
@@ -155,7 +152,7 @@ export default function EventAddress(inProps) {
     if (!isInPersonTabActive && !isOnlineTabActive && !isLiveTabActive) {
         return null;
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [isInPersonTabActive && (_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) })), isOnlineTabActive && (_jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })), isLiveTabActive && canViewLiveTab && (_jsx(Tab, { value: SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "photo_camera" }), iconPosition: "start", label: _jsx(_Fragment, { children: _jsx(FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) }) }))] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [isInPersonTabActive && location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), isOnlineTabActive && location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [isInPersonTabActive && (_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) })), isOnlineTabActive && (_jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })), isLiveTabActive && canViewLiveTab && (_jsx(Tab, { value: SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "photo_camera" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) }))] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [isInPersonTabActive && location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { disabled: !geocodingApiKey, size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), isOnlineTabActive && location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
                             endAdornment: _jsx(Icon, { children: "play_circle_outline" })
                         }, onChange: handleLinkChange })), isLiveTabActive && canViewLiveTab && location === SCEventLocationType.LIVESTREAM && (_jsxs(_Fragment, { children: [_jsx(LiveStream, { template: SCLiveStreamTemplateType.SNIPPET, liveStream: liveStream, actions: _jsx(_Fragment, {}) }), _jsx(LiveStreamFormSettings, { settings: liveStream.settings || LIVESTREAM_DEFAULT_SETTINGS, onChange: handleLiveStreamSettingsChange })] }))] }))] })));
 }

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

@@ -114,7 +114,7 @@ const Root = styled(Box, {
  * @param inProps
  */
 export default function EventForm(inProps) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d;
     //PROPS
     const props = useThemeProps({
         props: inProps,
@@ -151,7 +151,7 @@ export default function EventForm(inProps) {
         link: (event === null || event === void 0 ? void 0 : event.link) || '',
         liveStreamSettings: (event === null || event === void 0 ? void 0 : event.live_stream) ? event === null || event === void 0 ? void 0 : event.live_stream.settings : null,
         recurring: (event === null || event === void 0 ? void 0 : event.recurring) || SCEventRecurrenceType.NEVER,
-        isPublic: (_b = (event === null || event === void 0 ? void 0 : event.privacy) === SCEventPrivacyType.PUBLIC) !== null && _b !== void 0 ? _b : true,
+        isPublic: (event === null || event === void 0 ? void 0 : event.privacy) === SCEventPrivacyType.PUBLIC || true,
         isSubmitting: false
     };
     // STATE
@@ -248,9 +248,7 @@ export default function EventForm(inProps) {
         })
             .catch((e) => {
             const _error = formatHttpErrorCode(e);
-            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            if (Object.values(_error)[0].error === 'unique') {
+            if (Object.values(_error)[0]['error'] === 'unique') {
                 setError(Object.assign(Object.assign({}, error), { ['nameError']: _jsx(FormattedMessage, { id: "ui.eventForm.name.error.unique", defaultMessage: "ui.eventForm.name.error.unique" }) }));
             }
             else {
@@ -269,7 +267,7 @@ export default function EventForm(inProps) {
             Logger.error(SCOPE_SC_UI, e);
             onError === null || onError === void 0 ? void 0 : onError(e);
         });
-    }, [field, privateEnabled, visibilityEnabled, onSuccess, onError]);
+    }, [field, privateEnabled, visibilityEnabled, onSuccess, onError, notifyChanges]);
     const handleChange = useCallback((event) => {
         const { name, value } = event.target;
         setField((prev) => (Object.assign(Object.assign({}, prev), { [name]: value })));
@@ -278,7 +276,7 @@ export default function EventForm(inProps) {
             setError(error);
         }
         setGenericError(null);
-    }, [error, setGenericError]);
+    }, [error, setField, setGenericError]);
     const handleChangeDateTime = useCallback((value, name) => {
         setField((prev) => (Object.assign(Object.assign({}, prev), { [name]: value })));
         if (error[`${name}Error`]) {
@@ -290,29 +288,26 @@ export default function EventForm(inProps) {
             setError(error);
         }
         setGenericError(null);
-    }, [error, setGenericError]);
-    const shouldDisabledDate = useCallback((date) => {
+    }, [error, setField, setGenericError]);
+    const shouldDisableDate = useCallback((date) => {
         let disabled = false;
         switch (field.recurring) {
             case SCEventRecurrenceType.DAILY:
-                disabled = date.getTime() > getLaterDaysDate(DAILY_LATER_DAYS).getTime();
+                disabled = date.getTime() > getLaterDaysDate(DAILY_LATER_DAYS, field.startDate).getTime();
                 break;
             case SCEventRecurrenceType.WEEKLY:
-                disabled = date.getTime() > getLaterDaysDate(WEEKLY_LATER_DAYS).getTime();
+                disabled = date.getTime() > getLaterDaysDate(WEEKLY_LATER_DAYS, field.startDate).getTime();
                 break;
             case SCEventRecurrenceType.MONTHLY:
-                disabled = date.getTime() > getLaterDaysDate(MONTHLY_LATER_DAYS).getTime();
+                disabled = date.getTime() > getLaterDaysDate(MONTHLY_LATER_DAYS, field.startDate).getTime();
                 break;
             case SCEventRecurrenceType.NEVER:
             default:
-                disabled = date.getTime() > getLaterDaysDate(NEVER_LATER_DAYS).getTime();
-        }
-        if (field.startDate.getDate() > date.getDate()) {
-            disabled = true;
+                disabled = date.getTime() > getLaterDaysDate(NEVER_LATER_DAYS, field.startDate).getTime();
         }
         return disabled;
     }, [field]);
-    const shouldDisabledTime = useCallback((date, _view) => field.startTime.getTime() > date.getTime(), [field]);
+    const shouldDisableTime = useCallback((date) => field.startTime.getTime() > date.getTime(), [field]);
     /**
      * Renders root object
      */
@@ -339,14 +334,26 @@ export default function EventForm(inProps) {
                                         return _jsx("em", { children: `${intl.formatMessage(messages.frequencyPlaceholder)}` });
                                     }
                                     return (_jsx(FormattedMessage, { id: `ui.eventForm.frequency.${selected}.placeholder`, defaultMessage: `ui.eventForm.frequency.${selected}.placeholder` }));
-                                }, startAdornment: _jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "frequency" }) }) })) }, { children: Object.values(SCEventRecurrenceType).map((f) => (_jsx(MenuItem, Object.assign({ value: f }, { children: _jsx(FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }), f))) }))] })), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: true, minDate: field.startDate, label: _jsx(FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, slots: {
+                                }, startAdornment: _jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "frequency" }) }) })) }, { children: Object.values(SCEventRecurrenceType).map((f) => (_jsx(MenuItem, Object.assign({ value: f }, { children: _jsx(FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }), f))) }))] })), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale }, { children: [_jsx(MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: _jsx(FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, slots: {
                                         textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endDate)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "calendar_off" }) }) }))) }) })))
-                                    }, onChange: (value) => handleChangeDateTime(value, 'endDate'), shouldDisableDate: shouldDisabledDate }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, slots: {
+                                    }, slotProps: {
+                                        toolbar: {
+                                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
+                                            // @ts-ignore
+                                            toolbarTitle: _jsx(FormattedMessage, { id: "ui.eventForm.date.title", defaultMessage: "ui.eventForm.date.title" })
+                                        }
+                                    }, onChange: (value) => handleChangeDateTime(value, 'endDate'), shouldDisableDate: shouldDisableDate }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, slots: {
                                         textField: (params) => {
                                             var _a;
                                             return (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) }))) }), error: Boolean(error['endDateError']), helperText: ((_a = error['endDateError']) === null || _a === void 0 ? void 0 : _a.error) ? (_jsx(FormattedMessage, { id: "ui.eventForm.time.end.error.invalid", defaultMessage: "ui.eventForm.time.end.error.invalid" })) : null })));
                                         }
-                                    }, onChange: (value) => handleChangeDateTime(value, 'endTime'), shouldDisableTime: shouldDisabledTime })] })) })), _jsx(EventAddress, Object.assign({ forwardGeolocationData: handleGeoData, forwardLivestreamSettingsData: handleLiveStreamSettingsData, event: Object.assign(Object.assign({}, event), {
+                                    }, slotProps: {
+                                        toolbar: {
+                                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
+                                            // @ts-ignore
+                                            toolbarTitle: _jsx(FormattedMessage, { id: "ui.eventForm.time.title", defaultMessage: "ui.eventForm.time.title" })
+                                        }
+                                    }, onChange: (value) => handleChangeDateTime(value, 'endTime'), shouldDisableTime: shouldDisableTime })] })) })), _jsx(EventAddress, Object.assign({ forwardGeolocationData: handleGeoData, forwardLivestreamSettingsData: handleLiveStreamSettingsData, event: Object.assign(Object.assign({}, event), {
                             name: field.name,
                             start_date: field.startDate,
                             location: field.location,
@@ -357,16 +364,16 @@ export default function EventForm(inProps) {
                                 settings: field.liveStreamSettings
                             }
                         }) }, EventAddressComponentProps)), privateEnabled && (_jsxs(Box, Object.assign({ className: classes.privacySection }, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [_jsxs(Typography, Object.assign({ className: classNames(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), _jsx(Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: event && !field.isPublic }), _jsxs(Typography, Object.assign({ className: classNames(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), _jsx(Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? (_jsx(FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                        // @ts-ignore
+                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
+                                        // @ts-ignores
                                         b: (chunks) => _jsx("strong", { children: chunks })
                                     } })) : (_jsx(FormattedMessage, { id: "ui.eventForm.privacy.private.info", defaultMessage: "ui.eventForm.private.public.info", values: {
-                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
                                         // @ts-ignore
                                         b: (chunks) => _jsx("strong", { children: chunks })
                                     } })) }))] }))), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                            endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) ? EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : EVENT_DESCRIPTION_MAX_LENGTH })))
-                        }, error: Boolean(((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) > EVENT_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), genericError && (_jsx(Box, Object.assign({ className: classes.genericError }, { children: _jsx(Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
+                            endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) ? EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : EVENT_DESCRIPTION_MAX_LENGTH })))
+                        }, error: Boolean(((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > EVENT_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), genericError && (_jsx(Box, Object.assign({ className: classes.genericError }, { children: _jsx(Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
                                 !field.startDate ||
                                 !field.startTime ||
                                 !field.endDate ||

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

@@ -1,5 +1,5 @@
 export declare const PREFIX = "SCEventForm";
-export declare const NEVER_LATER_DAYS = 14;
-export declare const DAILY_LATER_DAYS = 60;
-export declare const WEEKLY_LATER_DAYS = 360;
-export declare const MONTHLY_LATER_DAYS = 730;
+export declare const NEVER_LATER_DAYS = 13;
+export declare const DAILY_LATER_DAYS = 59;
+export declare const WEEKLY_LATER_DAYS = 359;
+export declare const MONTHLY_LATER_DAYS = 729;

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

@@ -1,5 +1,5 @@
 export const PREFIX = 'SCEventForm';
-export const NEVER_LATER_DAYS = 14;
-export const DAILY_LATER_DAYS = 60;
-export const WEEKLY_LATER_DAYS = 360;
-export const MONTHLY_LATER_DAYS = 730;
+export const NEVER_LATER_DAYS = 13; // 2 weeks less 1 day
+export const DAILY_LATER_DAYS = 59; // 60 days less 1 day
+export const WEEKLY_LATER_DAYS = 359; // 360 days less 1 day
+export const MONTHLY_LATER_DAYS = 729; // 2 years less 1 day

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

@@ -1,4 +1,4 @@
-export declare function getNewDate(date?: string): Date;
-export declare function getLaterHoursDate(h: number): Date;
-export declare function getLaterDaysDate(d: number): Date;
+export declare function getNewDate(date?: string | Date): Date;
+export declare function getLaterHoursDate(hours: number, date?: Date): Date;
+export declare function getLaterDaysDate(days: number, date?: Date): Date;
 export declare const combineDateAndTime: (date: Date, time: Date) => string;

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

@@ -1,15 +1,18 @@
 import { addDays, addHours } from 'date-fns';
 export function getNewDate(date) {
     if (date) {
-        return new Date(date);
+        if (typeof date === 'string') {
+            return new Date(date);
+        }
+        return date;
     }
     return new Date();
 }
-export function getLaterHoursDate(h) {
-    return addHours(getNewDate(), h);
+export function getLaterHoursDate(hours, date) {
+    return addHours(getNewDate(date), hours);
 }
-export function getLaterDaysDate(d) {
-    return addDays(getNewDate(), d);
+export function getLaterDaysDate(days, date) {
+    return addDays(getNewDate(date), days);
 }
 export const combineDateAndTime = (date, time) => {
     const combined = date;

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

@@ -6,10 +6,8 @@ import { useThemeProps } from '@mui/system';
 import { SCPreferences, useSCFetchEvent, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
 import { SCEventLocationType, SCEventPrivacyType } from '@selfcommunity/types';
 import classNames from 'classnames';
-import PubSub from 'pubsub-js';
-import { useCallback, useEffect, useMemo, useRef } from 'react';
+import { useMemo } from 'react';
 import { FormattedMessage, useIntl } from 'react-intl';
-import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 import Bullet from '../../shared/Bullet';
 import Calendar from '../../shared/Calendar';
 import EventActionsMenu from '../../shared/EventActionsMenu';
@@ -90,44 +88,15 @@ export default function EventHeader(inProps) {
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
     // INTL
     const intl = useIntl();
-    // REFS
-    const updatesSubscription = useRef(null);
     // CONST
-    const isEventAdmin = useMemo(() => scUserContext.user && (scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id) === scUserContext.user.id, [scUserContext.user, scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id]);
+    const isEventAdmin = useMemo(() => scUserContext.user && scEvent && (scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by.id) === scUserContext.user.id, [scUserContext.user, scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by]);
     const isEventFinished = useMemo(() => checkEventFinished(scEvent), [scEvent]);
-    /**
-     * Subscriber for pubsub callback
-     */
-    const onChangeEventMembersHandler = useCallback((msg, data) => {
-        var _a;
-        if (data && ((_a = data === null || data === void 0 ? void 0 : data.event) === null || _a === void 0 ? void 0 : _a.id) === (scEvent === null || scEvent === void 0 ? void 0 : scEvent.id)) {
-            let _event = Object.assign({}, scEvent);
-            if (msg === `${SCTopicType.GROUP}.${SCGroupEventType.ADD_MEMBER}`) {
-                _event.subscribers_counter = _event.subscribers_counter + 1;
-            }
-            else if (msg === `${SCTopicType.GROUP}.${SCGroupEventType.REMOVE_MEMBER}`) {
-                _event.subscribers_counter = Math.max(_event.subscribers_counter - 1, 0);
-            }
-            setSCEvent(_event);
-        }
-    }, [scEvent, setSCEvent]);
     /**
      * Handles callback subscribe/unsubscribe event
      */
-    const handleSubscribe = (_event, status) => {
-        setSCEvent(Object.assign({}, scEvent, { subscription_status: status }));
+    const handleSubscribe = (event) => {
+        setSCEvent(event);
     };
-    /**
-     * On mount, subscribe to receive events updates (only edit)
-     */
-    useEffect(() => {
-        if (scEvent) {
-            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.EVENT}.${SCGroupEventType.MEMBERS}`, onChangeEventMembersHandler);
-        }
-        return () => {
-            updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);
-        };
-    }, [scEvent]);
     // RENDER
     if (!scEvent) {
         return _jsx(EventHeaderSkeleton, {});
@@ -170,5 +139,5 @@ export default function EventHeader(inProps) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), _jsxs(Box, Object.assign({ className: classes.visibility }, { children: [_jsx(_Fragment, { children: scEvent.privacy === SCEventPrivacyType.PUBLIC ? (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), _jsx(Bullet, {}), _jsx(Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : (_jsx(FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), _jsx(User, { className: classes.planner, userId: scEvent.managed_by.id, secondary: _jsx(FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: _jsx(_Fragment, { children: isEventAdmin ? (_jsxs(Box, Object.assign({ className: classes.multiActions }, { children: [_jsx(EventInviteButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : (_jsxs(_Fragment, { children: [_jsx(EventSubscribeButton, Object.assign({ eventId: scEvent.id, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })) }) })] }))] })));
+                            } })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), _jsxs(Box, Object.assign({ className: classes.visibility }, { children: [_jsx(_Fragment, { children: scEvent.privacy === SCEventPrivacyType.PUBLIC ? (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), _jsx(Bullet, {}), _jsx(Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : (_jsx(FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), _jsx(User, { className: classes.planner, userId: scEvent.managed_by.id, secondary: _jsx(FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: _jsx(_Fragment, { children: isEventAdmin ? (_jsxs(Box, Object.assign({ className: classes.multiActions }, { children: [_jsx(EventInviteButton, { size: isMobile ? 'small' : 'medium', event: scEvent, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, onEditSuccess: setSCEvent, disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : (_jsxs(_Fragment, { children: [_jsx(EventSubscribeButton, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: setSCEvent }, EventActionsProps))] })) }) })] }))] })));
 }