@selfcommunity/react-ui 0.11.0-alpha.15 → 0.11.0-alpha.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/ComposerIconButton/ComposerIconButton.js +9 -1
- package/lib/cjs/components/LiveStreamForm/LiveStreamForm.js +53 -3
- package/lib/cjs/components/LiveStreamForm/LiveStreamFormSettings.js +1 -1
- package/lib/cjs/shared/UpScalingTierBadge/index.js +9 -0
- package/lib/esm/components/ComposerIconButton/ComposerIconButton.js +10 -2
- package/lib/esm/components/LiveStreamForm/LiveStreamForm.js +55 -5
- package/lib/esm/components/LiveStreamForm/LiveStreamFormSettings.js +1 -1
- package/lib/esm/shared/UpScalingTierBadge/index.js +9 -0
- package/lib/umd/react-ui.js +1 -1
- package/package.json +5 -5
|
@@ -13,6 +13,7 @@ const EventFormDialog_1 = tslib_1.__importDefault(require("../EventFormDialog"))
|
|
|
13
13
|
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
14
14
|
const GroupForm_1 = tslib_1.__importDefault(require("../GroupForm"));
|
|
15
15
|
const CreateLiveStreamDialog_1 = tslib_1.__importDefault(require("../CreateLiveStreamDialog"));
|
|
16
|
+
const types_1 = require("@selfcommunity/types");
|
|
16
17
|
const PREFIX = 'SCComposerIconButton';
|
|
17
18
|
const classes = {
|
|
18
19
|
root: `${PREFIX}-root`,
|
|
@@ -83,10 +84,17 @@ exports.default = react_1.default.forwardRef(function ComposerIconButton(inProps
|
|
|
83
84
|
// HOOKS
|
|
84
85
|
const theme = (0, material_1.useTheme)();
|
|
85
86
|
const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
|
|
87
|
+
const { preferences } = (0, react_core_1.useSCPreferences)();
|
|
86
88
|
// MEMOS
|
|
87
89
|
const canCreateGroup = (0, react_1.useMemo)(() => { var _a, _b; return (_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_group; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
88
90
|
const canCreateEvent = (0, react_1.useMemo)(() => { var _a, _b; return (_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_event; }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission]);
|
|
89
|
-
const
|
|
91
|
+
const canCreateLive = (0, react_1.useMemo)(() => { var _a, _b; return (_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; }, [(_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.permission]);
|
|
92
|
+
const isCommunityOwner = (0, react_1.useMemo)(() => { var _a; return ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === 1; }, [scUserContext.user]);
|
|
93
|
+
const isFreeTrialTier = (0, react_1.useMemo)(() => preferences &&
|
|
94
|
+
react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
|
|
95
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
|
|
96
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value === types_1.SCCommunitySubscriptionTier.FREE_TRIAL, [preferences]);
|
|
97
|
+
const canCreateLiveStream = (0, react_1.useMemo)(() => (isFreeTrialTier && isCommunityOwner && canCreateLive) || (!isFreeTrialTier && canCreateLive), [isFreeTrialTier, isCommunityOwner, canCreateLive]);
|
|
90
98
|
const renderContent = (0, react_1.useMemo)(() => {
|
|
91
99
|
return ((0, jsx_runtime_1.jsx)(material_1.MenuList, { children: listItem.map((item, i) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ onClick: item.onClick }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: item.icon })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: item.text, defaultMessage: item.text }) })) })] }), i))) }));
|
|
92
100
|
}, [listItem]);
|
|
@@ -6,6 +6,7 @@ const lab_1 = require("@mui/lab");
|
|
|
6
6
|
const material_1 = require("@mui/material");
|
|
7
7
|
const styles_1 = require("@mui/material/styles");
|
|
8
8
|
const system_1 = require("@mui/system");
|
|
9
|
+
const types_1 = require("@selfcommunity/types");
|
|
9
10
|
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
10
11
|
const react_1 = require("react");
|
|
11
12
|
const react_intl_1 = require("react-intl");
|
|
@@ -17,8 +18,12 @@ const api_services_1 = require("@selfcommunity/api-services");
|
|
|
17
18
|
const Errors_1 = require("../../constants/Errors");
|
|
18
19
|
const utils_1 = require("@selfcommunity/utils");
|
|
19
20
|
const deafultCover_1 = tslib_1.__importDefault(require("../../assets/deafultCover"));
|
|
21
|
+
const react_core_1 = require("@selfcommunity/react-core");
|
|
22
|
+
const constants_2 = require("../PlatformWidget/constants");
|
|
23
|
+
const constants_3 = require("../LiveStreamRoom/constants");
|
|
20
24
|
const classes = {
|
|
21
25
|
root: `${constants_1.PREFIX}-root`,
|
|
26
|
+
warning: `${constants_1.PREFIX}-warning`,
|
|
22
27
|
form: `${constants_1.PREFIX}-form`,
|
|
23
28
|
title: `${constants_1.PREFIX}-title`,
|
|
24
29
|
cover: `${constants_1.PREFIX}-cover`,
|
|
@@ -81,7 +86,15 @@ function LiveStreamForm(inProps) {
|
|
|
81
86
|
name: constants_1.PREFIX
|
|
82
87
|
});
|
|
83
88
|
const { className, onSuccess, onError, liveStream = null } = props, rest = tslib_1.__rest(props, ["className", "onSuccess", "onError", "liveStream"]);
|
|
84
|
-
//
|
|
89
|
+
// HOOKS
|
|
90
|
+
const scContext = (0, react_core_1.useSCContext)();
|
|
91
|
+
const scUserContext = (0, react_core_1.useSCUser)();
|
|
92
|
+
const { preferences } = (0, react_core_1.useSCPreferences)();
|
|
93
|
+
const isCommunityOwner = (0, react_1.useMemo)(() => { var _a; return ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === 1; }, [scUserContext.user]);
|
|
94
|
+
const isFreeTrialTier = (0, react_1.useMemo)(() => preferences &&
|
|
95
|
+
react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
|
|
96
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
|
|
97
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value === types_1.SCCommunitySubscriptionTier.FREE_TRIAL, [preferences]);
|
|
85
98
|
const intl = (0, react_intl_1.useIntl)();
|
|
86
99
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
87
100
|
// @ts-ignore
|
|
@@ -98,6 +111,7 @@ function LiveStreamForm(inProps) {
|
|
|
98
111
|
const [field, setField] = (0, react_1.useState)(initialFieldState);
|
|
99
112
|
const [error, setError] = (0, react_1.useState)({});
|
|
100
113
|
const [genericError, setGenericError] = (0, react_1.useState)(null);
|
|
114
|
+
const [timeRemaining, setTimeRemaining] = (0, react_1.useState)(null);
|
|
101
115
|
const _backgroundCover = Object.assign({}, (field.cover ? { background: `url('${field.cover}') center / cover` } : { background: `url('${deafultCover_1.default}') no-repeat 0 0 / 100% 100%` }));
|
|
102
116
|
const handleChangeCover = (0, react_1.useCallback)((cover) => {
|
|
103
117
|
setField((prev) => (Object.assign(Object.assign({}, prev), { ['coverFile']: cover })));
|
|
@@ -175,10 +189,44 @@ function LiveStreamForm(inProps) {
|
|
|
175
189
|
const handleChangeSettings = (0, react_1.useCallback)((data) => {
|
|
176
190
|
setField((prev) => (Object.assign(Object.assign({}, prev), { settings: data })));
|
|
177
191
|
}, [setField]);
|
|
192
|
+
const warning = (0, react_1.useMemo)(() => {
|
|
193
|
+
let _message;
|
|
194
|
+
if (isFreeTrialTier && isCommunityOwner) {
|
|
195
|
+
_message = ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.selector.warningSubscriptionRequired", defaultMessage: "ui.liveStreamForm.selector.warningSubscriptionRequired", values: {
|
|
196
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
197
|
+
// @ts-ignore
|
|
198
|
+
link: (...chunks) => (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: constants_2.SELFCOMMUNITY_PRICING[scContext.settings.locale.default] }, { children: chunks }))
|
|
199
|
+
} }));
|
|
200
|
+
}
|
|
201
|
+
else if (timeRemaining !== null && timeRemaining <= constants_3.WARNING_THRESHOLD_EXPIRING_SOON) {
|
|
202
|
+
if (timeRemaining <= 1) {
|
|
203
|
+
_message = ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.selector.warningMinutesExausted", defaultMessage: "ui.liveStreamForm.selector.warningMinutesExausted" }));
|
|
204
|
+
}
|
|
205
|
+
else if (timeRemaining <= constants_3.WARNING_THRESHOLD_EXPIRING_SOON) {
|
|
206
|
+
_message = ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.selector.warningRemainingMinutes", defaultMessage: "ui.liveStreamForm.selector.warningRemainingMinutes", values: { minutes: timeRemaining } }));
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
if (_message) {
|
|
210
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.warning }, { children: (0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ variant: "filled", severity: "warning" }, { children: _message })) })));
|
|
211
|
+
}
|
|
212
|
+
return null;
|
|
213
|
+
}, [isFreeTrialTier, isCommunityOwner, timeRemaining]);
|
|
214
|
+
const fetchLivestreamStatus = () => {
|
|
215
|
+
api_services_1.LiveStreamApiClient.getMonthlyDuration()
|
|
216
|
+
.then((r) => {
|
|
217
|
+
setTimeRemaining(r.remaining_minutes);
|
|
218
|
+
})
|
|
219
|
+
.catch((error) => {
|
|
220
|
+
console.error('Error fetching live status:', error);
|
|
221
|
+
});
|
|
222
|
+
};
|
|
223
|
+
(0, react_1.useEffect)(() => {
|
|
224
|
+
fetchLivestreamStatus();
|
|
225
|
+
}, []);
|
|
178
226
|
/**
|
|
179
227
|
* Renders root object
|
|
180
228
|
*/
|
|
181
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadEventCover_1.default, { isCreationMode: true, onChange: handleChangeCover }) })), Boolean(error['coverError']) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "error" }, { children: error['coverError'] })), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.title, placeholder: `${intl.formatMessage(messages.title)}`, margin: "normal", value: field.title, name: "title", onChange: handleChange, InputProps: {
|
|
229
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [warning, (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadEventCover_1.default, { isCreationMode: true, onChange: handleChangeCover }) })), Boolean(error['coverError']) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "error" }, { children: error['coverError'] })), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.title, placeholder: `${intl.formatMessage(messages.title)}`, margin: "normal", value: field.title, name: "title", onChange: handleChange, InputProps: {
|
|
182
230
|
endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH - field.title.length }))
|
|
183
231
|
}, error: Boolean(field.title.length > LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH) || Boolean(error['titleError']), helperText: field.title.length > LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.title.error.maxLength", defaultMessage: "ui.liveStreamForm.title.error.maxLength" })) : error['titleError'] ? (error['titleError']) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.slug, placeholder: `${intl.formatMessage(messages.slug)}`, margin: "normal", value: field.slug, name: "slug", onChange: handleChange, InputProps: {
|
|
184
232
|
endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH - field.slug.length }))
|
|
@@ -187,6 +235,8 @@ function LiveStreamForm(inProps) {
|
|
|
187
235
|
}, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.description.error.maxLength", defaultMessage: "ui.liveStreamForm.description.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(LiveStreamFormSettings_1.default, { settings: field.settings, onChange: handleChangeSettings }), genericError && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.genericError }, { children: (0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.title ||
|
|
188
236
|
field.isSubmitting ||
|
|
189
237
|
field.title.length > LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH ||
|
|
190
|
-
field.description.length > LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH
|
|
238
|
+
field.description.length > LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH ||
|
|
239
|
+
isFreeTrialTier ||
|
|
240
|
+
timeRemaining <= constants_3.WARNING_THRESHOLD_EXPIRING_SOON, variant: "contained", onClick: handleSubmit, color: "secondary" }, { children: liveStream ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.button.edit", defaultMessage: "ui.liveStreamForm.button.edit" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.button.create", defaultMessage: "ui.liveStreamForm.button.create" })) })) }))] }))] })));
|
|
191
241
|
}
|
|
192
242
|
exports.default = LiveStreamForm;
|
|
@@ -73,7 +73,7 @@ function LiveStreamSettingsForm(inProps) {
|
|
|
73
73
|
/**
|
|
74
74
|
* Renders root object
|
|
75
75
|
*/
|
|
76
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked:
|
|
76
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: !(settings === null || settings === void 0 ? void 0 : settings.muteParticipants), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['muteParticipants']: !(settings === null || settings === void 0 ? void 0 : settings.muteParticipants) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.muteParticipants", defaultMessage: "ui.liveStreamForm.muteParticipants" }) }))] })), isEnterpriseFeaturesVisible && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, checked: !(settings === null || settings === void 0 ? void 0 : settings.disableVideo), disabled: !isEnterpriseTier || !liveStreamEnabled, onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['disableVideo']: !(settings === null || settings === void 0 ? void 0 : settings.disableVideo) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.disableVideo", defaultMessage: "ui.liveStreamForm.disableVideo" }) })), (0, jsx_runtime_1.jsx)(UpScalingTierBadge_1.default, { desiredTier: types_1.SCCommunitySubscriptionTier.ENTERPRISE })] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, checked: !(settings === null || settings === void 0 ? void 0 : settings.disableShareScreen), disabled: !isEnterpriseTier || !liveStreamEnabled, onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['disableShareScreen']: !(settings === null || settings === void 0 ? void 0 : settings.disableShareScreen) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.disableShareScreen", defaultMessage: "ui.liveStreamForm.disableShareScreen" }) })), (0, jsx_runtime_1.jsx)(UpScalingTierBadge_1.default, { desiredTier: types_1.SCCommunitySubscriptionTier.ENTERPRISE })] }))] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: !(settings === null || settings === void 0 ? void 0 : settings.disableChat), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['disableChat']: !(settings === null || settings === void 0 ? void 0 : settings.disableChat) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.disableChat", defaultMessage: "ui.liveStreamForm.disableChat" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.hideParticipantsList), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['hideParticipantsList']: !(settings === null || settings === void 0 ? void 0 : settings.hideParticipantsList) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.hideParticipantsList", defaultMessage: "ui.liveStreamForm.hideParticipantsList" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.automaticallyNotifyFollowers), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['automaticallyNotifyFollowers']: !(settings === null || settings === void 0 ? void 0 : settings.automaticallyNotifyFollowers) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.automaticallyNotifyFollowers", defaultMessage: "ui.liveStreamForm.automaticallyNotifyFollowers" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.showInProfile), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['showInProfile']: !(settings === null || settings === void 0 ? void 0 : settings.showInProfile) })) }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.switchLabel }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.showInProfile", defaultMessage: "ui.liveStreamForm.showInProfile" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ className: classes.accessView }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, Object.assign({ id: "viewLabel" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.view.label", defaultMessage: "ui.liveStreamForm.view.label" }) })), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ name: "view", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.view.label", defaultMessage: "ui.liveStreamForm.view.label" }), labelId: "viewLabel", disabled: !liveStreamEnabled, fullWidth: true, value: (_a = settings === null || settings === void 0 ? void 0 : settings.view) !== null && _a !== void 0 ? _a : types_1.SCLiveStreamViewType.SPEAKER, onChange: (e) => onChange(Object.assign(Object.assign(Object.assign({}, constants_1.LIVESTREAM_DEFAULT_SETTINGS), settings), { ['view']: e.target.value })), displayEmpty: true, renderValue: (selected) => {
|
|
77
77
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.accessViewIcon }, { children: selected === types_1.SCLiveStreamViewType.SPEAKER ? 'upload' : 'category' })), "\u00A0", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.liveStreamForm.view.${selected}`, defaultMessage: `ui.liveStreamForm.view.${selected}` })] }));
|
|
78
78
|
} }, { children: Object.values(types_1.SCLiveStreamViewType).map((f) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: f }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsxs)("b", { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.accessViewIcon }, { children: f === types_1.SCLiveStreamViewType.SPEAKER ? 'upload' : 'category' })), "\u00A0", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.liveStreamForm.view.${f}`, defaultMessage: `ui.liveStreamForm.view.${f}` })] }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ sx: { textWrap: 'auto' } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.liveStreamForm.view.${f}.description`, defaultMessage: `ui.liveStreamForm.view.${f}.description` }) }))] }) }), f))) }))] }))] })));
|
|
79
79
|
}
|
|
@@ -5,6 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const styles_1 = require("@mui/material/styles");
|
|
6
6
|
const system_1 = require("@mui/system");
|
|
7
7
|
const react_intl_1 = require("react-intl");
|
|
8
|
+
const react_core_1 = require("@selfcommunity/react-core");
|
|
8
9
|
const material_1 = require("@mui/material");
|
|
9
10
|
const react_1 = require("react");
|
|
10
11
|
const types_1 = require("@selfcommunity/types");
|
|
@@ -30,6 +31,11 @@ function UpScalingTierBadge(inProps) {
|
|
|
30
31
|
name: PREFIX
|
|
31
32
|
});
|
|
32
33
|
const { className, desiredTier = types_1.SCCommunitySubscriptionTier.GO } = props, rest = tslib_1.__rest(props, ["className", "desiredTier"]);
|
|
34
|
+
const { preferences } = (0, react_core_1.useSCPreferences)();
|
|
35
|
+
const isEnterpriseTier = (0, react_1.useMemo)(() => preferences &&
|
|
36
|
+
react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
|
|
37
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
|
|
38
|
+
preferences[react_core_1.SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value === types_1.SCCommunitySubscriptionTier.ENTERPRISE, [preferences]);
|
|
33
39
|
const tooltipMsg = (0, react_1.useMemo)(() => {
|
|
34
40
|
let _msg = (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.upScalingTierBadge.goFeature", defaultMessage: "ui.upScalingTierBadge.goFeature" });
|
|
35
41
|
switch (desiredTier) {
|
|
@@ -58,6 +64,9 @@ function UpScalingTierBadge(inProps) {
|
|
|
58
64
|
}
|
|
59
65
|
return _label;
|
|
60
66
|
}, [desiredTier]);
|
|
67
|
+
if (desiredTier === types_1.SCCommunitySubscriptionTier.ENTERPRISE && isEnterpriseTier) {
|
|
68
|
+
return null;
|
|
69
|
+
}
|
|
61
70
|
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ classes: { root: (0, classnames_1.default)(className, classes.root) }, title: tooltipMsg, placement: "top" }, rest, { children: (0, jsx_runtime_1.jsx)(Badge, { color: "secondary", size: "small", label: badgeLabel, className: classes.badge }) })));
|
|
62
71
|
}
|
|
63
72
|
exports.default = UpScalingTierBadge;
|
|
@@ -2,7 +2,7 @@ import { __rest } from "tslib";
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
4
4
|
import { Icon, IconButton, useMediaQuery, styled, useTheme, SwipeableDrawer, MenuList, MenuItem, ListItemIcon, ListItemText, Typography, useThemeProps, Menu } from '@mui/material';
|
|
5
|
-
import { Link, SCRoutes, UserUtils, useSCContext, useSCRouting, useSCUser } from '@selfcommunity/react-core';
|
|
5
|
+
import { Link, SCPreferences, SCRoutes, UserUtils, useSCContext, useSCPreferences, useSCRouting, useSCUser } from '@selfcommunity/react-core';
|
|
6
6
|
import { FormattedMessage } from 'react-intl';
|
|
7
7
|
import Composer from '../Composer';
|
|
8
8
|
import { useSnackbar } from 'notistack';
|
|
@@ -11,6 +11,7 @@ import EventFormDialog from '../EventFormDialog';
|
|
|
11
11
|
import classNames from 'classnames';
|
|
12
12
|
import GroupForm from '../GroupForm';
|
|
13
13
|
import CreateLiveStreamDialog from '../CreateLiveStreamDialog';
|
|
14
|
+
import { SCCommunitySubscriptionTier } from '@selfcommunity/types';
|
|
14
15
|
const PREFIX = 'SCComposerIconButton';
|
|
15
16
|
const classes = {
|
|
16
17
|
root: `${PREFIX}-root`,
|
|
@@ -81,10 +82,17 @@ export default React.forwardRef(function ComposerIconButton(inProps, ref) {
|
|
|
81
82
|
// HOOKS
|
|
82
83
|
const theme = useTheme();
|
|
83
84
|
const isMobile = useMediaQuery(theme.breakpoints.down('md'));
|
|
85
|
+
const { preferences } = useSCPreferences();
|
|
84
86
|
// MEMOS
|
|
85
87
|
const canCreateGroup = useMemo(() => { var _a, _b; return (_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_group; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
86
88
|
const canCreateEvent = useMemo(() => { var _a, _b; return (_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_event; }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission]);
|
|
87
|
-
const
|
|
89
|
+
const canCreateLive = useMemo(() => { var _a, _b; return (_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; }, [(_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.permission]);
|
|
90
|
+
const isCommunityOwner = useMemo(() => { var _a; return ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === 1; }, [scUserContext.user]);
|
|
91
|
+
const isFreeTrialTier = useMemo(() => preferences &&
|
|
92
|
+
SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
|
|
93
|
+
preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
|
|
94
|
+
preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value === SCCommunitySubscriptionTier.FREE_TRIAL, [preferences]);
|
|
95
|
+
const canCreateLiveStream = useMemo(() => (isFreeTrialTier && isCommunityOwner && canCreateLive) || (!isFreeTrialTier && canCreateLive), [isFreeTrialTier, isCommunityOwner, canCreateLive]);
|
|
88
96
|
const renderContent = useMemo(() => {
|
|
89
97
|
return (_jsx(MenuList, { children: listItem.map((item, i) => (_jsxs(MenuItem, Object.assign({ onClick: item.onClick }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, Object.assign({ fontSize: "small" }, { children: item.icon })) }), _jsx(ListItemText, { primary: _jsx(Typography, Object.assign({ variant: "h6" }, { children: _jsx(FormattedMessage, { id: item.text, defaultMessage: item.text }) })) })] }), i))) }));
|
|
90
98
|
}, [listItem]);
|
|
@@ -4,19 +4,24 @@ import { LoadingButton } from '@mui/lab';
|
|
|
4
4
|
import { Alert, Box, FormGroup, Paper, TextField, Typography } from '@mui/material';
|
|
5
5
|
import { styled } from '@mui/material/styles';
|
|
6
6
|
import { useThemeProps } from '@mui/system';
|
|
7
|
+
import { SCCommunitySubscriptionTier } from '@selfcommunity/types';
|
|
7
8
|
import classNames from 'classnames';
|
|
8
|
-
import { useCallback, useState } from 'react';
|
|
9
|
+
import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
9
10
|
import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
|
|
10
11
|
import { LIVE_STREAM_DESCRIPTION_MAX_LENGTH, LIVE_STREAM_TITLE_MAX_LENGTH, LIVE_STREAM_SLUG_MAX_LENGTH } from '../../constants/LiveStream';
|
|
11
12
|
import { LIVESTREAM_DEFAULT_SETTINGS, PREFIX } from './constants';
|
|
12
13
|
import UploadEventCover from '../EventForm/UploadEventCover';
|
|
13
14
|
import LiveStreamSettingsForm from './LiveStreamFormSettings';
|
|
14
|
-
import { formatHttpErrorCode, LiveStreamService } from '@selfcommunity/api-services';
|
|
15
|
+
import { formatHttpErrorCode, LiveStreamApiClient, LiveStreamService } from '@selfcommunity/api-services';
|
|
15
16
|
import { SCOPE_SC_UI } from '../../constants/Errors';
|
|
16
17
|
import { Logger } from '@selfcommunity/utils';
|
|
17
18
|
import CoverPlaceholder from '../../assets/deafultCover';
|
|
19
|
+
import { Link, SCPreferences, useSCContext, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
|
|
20
|
+
import { SELFCOMMUNITY_PRICING } from '../PlatformWidget/constants';
|
|
21
|
+
import { WARNING_THRESHOLD_EXPIRING_SOON } from '../LiveStreamRoom/constants';
|
|
18
22
|
const classes = {
|
|
19
23
|
root: `${PREFIX}-root`,
|
|
24
|
+
warning: `${PREFIX}-warning`,
|
|
20
25
|
form: `${PREFIX}-form`,
|
|
21
26
|
title: `${PREFIX}-title`,
|
|
22
27
|
cover: `${PREFIX}-cover`,
|
|
@@ -79,7 +84,15 @@ export default function LiveStreamForm(inProps) {
|
|
|
79
84
|
name: PREFIX
|
|
80
85
|
});
|
|
81
86
|
const { className, onSuccess, onError, liveStream = null } = props, rest = __rest(props, ["className", "onSuccess", "onError", "liveStream"]);
|
|
82
|
-
//
|
|
87
|
+
// HOOKS
|
|
88
|
+
const scContext = useSCContext();
|
|
89
|
+
const scUserContext = useSCUser();
|
|
90
|
+
const { preferences } = useSCPreferences();
|
|
91
|
+
const isCommunityOwner = useMemo(() => { var _a; return ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) === 1; }, [scUserContext.user]);
|
|
92
|
+
const isFreeTrialTier = useMemo(() => preferences &&
|
|
93
|
+
SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
|
|
94
|
+
preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
|
|
95
|
+
preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value === SCCommunitySubscriptionTier.FREE_TRIAL, [preferences]);
|
|
83
96
|
const intl = useIntl();
|
|
84
97
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
85
98
|
// @ts-ignore
|
|
@@ -96,6 +109,7 @@ export default function LiveStreamForm(inProps) {
|
|
|
96
109
|
const [field, setField] = useState(initialFieldState);
|
|
97
110
|
const [error, setError] = useState({});
|
|
98
111
|
const [genericError, setGenericError] = useState(null);
|
|
112
|
+
const [timeRemaining, setTimeRemaining] = useState(null);
|
|
99
113
|
const _backgroundCover = Object.assign({}, (field.cover ? { background: `url('${field.cover}') center / cover` } : { background: `url('${CoverPlaceholder}') no-repeat 0 0 / 100% 100%` }));
|
|
100
114
|
const handleChangeCover = useCallback((cover) => {
|
|
101
115
|
setField((prev) => (Object.assign(Object.assign({}, prev), { ['coverFile']: cover })));
|
|
@@ -173,10 +187,44 @@ export default function LiveStreamForm(inProps) {
|
|
|
173
187
|
const handleChangeSettings = useCallback((data) => {
|
|
174
188
|
setField((prev) => (Object.assign(Object.assign({}, prev), { settings: data })));
|
|
175
189
|
}, [setField]);
|
|
190
|
+
const warning = useMemo(() => {
|
|
191
|
+
let _message;
|
|
192
|
+
if (isFreeTrialTier && isCommunityOwner) {
|
|
193
|
+
_message = (_jsx(FormattedMessage, { id: "ui.liveStreamForm.selector.warningSubscriptionRequired", defaultMessage: "ui.liveStreamForm.selector.warningSubscriptionRequired", values: {
|
|
194
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
195
|
+
// @ts-ignore
|
|
196
|
+
link: (...chunks) => _jsx(Link, Object.assign({ to: SELFCOMMUNITY_PRICING[scContext.settings.locale.default] }, { children: chunks }))
|
|
197
|
+
} }));
|
|
198
|
+
}
|
|
199
|
+
else if (timeRemaining !== null && timeRemaining <= WARNING_THRESHOLD_EXPIRING_SOON) {
|
|
200
|
+
if (timeRemaining <= 1) {
|
|
201
|
+
_message = (_jsx(FormattedMessage, { id: "ui.liveStreamForm.selector.warningMinutesExausted", defaultMessage: "ui.liveStreamForm.selector.warningMinutesExausted" }));
|
|
202
|
+
}
|
|
203
|
+
else if (timeRemaining <= WARNING_THRESHOLD_EXPIRING_SOON) {
|
|
204
|
+
_message = (_jsx(FormattedMessage, { id: "ui.liveStreamForm.selector.warningRemainingMinutes", defaultMessage: "ui.liveStreamForm.selector.warningRemainingMinutes", values: { minutes: timeRemaining } }));
|
|
205
|
+
}
|
|
206
|
+
}
|
|
207
|
+
if (_message) {
|
|
208
|
+
return (_jsx(Box, Object.assign({ className: classes.warning }, { children: _jsx(Alert, Object.assign({ variant: "filled", severity: "warning" }, { children: _message })) })));
|
|
209
|
+
}
|
|
210
|
+
return null;
|
|
211
|
+
}, [isFreeTrialTier, isCommunityOwner, timeRemaining]);
|
|
212
|
+
const fetchLivestreamStatus = () => {
|
|
213
|
+
LiveStreamApiClient.getMonthlyDuration()
|
|
214
|
+
.then((r) => {
|
|
215
|
+
setTimeRemaining(r.remaining_minutes);
|
|
216
|
+
})
|
|
217
|
+
.catch((error) => {
|
|
218
|
+
console.error('Error fetching live status:', error);
|
|
219
|
+
});
|
|
220
|
+
};
|
|
221
|
+
useEffect(() => {
|
|
222
|
+
fetchLivestreamStatus();
|
|
223
|
+
}, []);
|
|
176
224
|
/**
|
|
177
225
|
* Renders root object
|
|
178
226
|
*/
|
|
179
|
-
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadEventCover, { isCreationMode: true, onChange: handleChangeCover }) })), Boolean(error['coverError']) && _jsx(Typography, Object.assign({ color: "error" }, { children: error['coverError'] })), _jsxs(FormGroup, Object.assign({ className: classes.form }, { children: [_jsx(TextField, { required: true, className: classes.title, placeholder: `${intl.formatMessage(messages.title)}`, margin: "normal", value: field.title, name: "title", onChange: handleChange, InputProps: {
|
|
227
|
+
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [warning, _jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadEventCover, { isCreationMode: true, onChange: handleChangeCover }) })), Boolean(error['coverError']) && _jsx(Typography, Object.assign({ color: "error" }, { children: error['coverError'] })), _jsxs(FormGroup, Object.assign({ className: classes.form }, { children: [_jsx(TextField, { required: true, className: classes.title, placeholder: `${intl.formatMessage(messages.title)}`, margin: "normal", value: field.title, name: "title", onChange: handleChange, InputProps: {
|
|
180
228
|
endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: LIVE_STREAM_TITLE_MAX_LENGTH - field.title.length }))
|
|
181
229
|
}, error: Boolean(field.title.length > LIVE_STREAM_TITLE_MAX_LENGTH) || Boolean(error['titleError']), helperText: field.title.length > LIVE_STREAM_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.title.error.maxLength", defaultMessage: "ui.liveStreamForm.title.error.maxLength" })) : error['titleError'] ? (error['titleError']) : null }), _jsx(TextField, { required: true, className: classes.slug, placeholder: `${intl.formatMessage(messages.slug)}`, margin: "normal", value: field.slug, name: "slug", onChange: handleChange, InputProps: {
|
|
182
230
|
endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: LIVE_STREAM_SLUG_MAX_LENGTH - field.slug.length }))
|
|
@@ -185,5 +233,7 @@ export default function LiveStreamForm(inProps) {
|
|
|
185
233
|
}, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > LIVE_STREAM_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > LIVE_STREAM_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.description.error.maxLength", defaultMessage: "ui.liveStreamForm.description.error.maxLength" })) : null }), _jsx(LiveStreamSettingsForm, { settings: field.settings, onChange: handleChangeSettings }), 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.title ||
|
|
186
234
|
field.isSubmitting ||
|
|
187
235
|
field.title.length > LIVE_STREAM_TITLE_MAX_LENGTH ||
|
|
188
|
-
field.description.length > LIVE_STREAM_DESCRIPTION_MAX_LENGTH
|
|
236
|
+
field.description.length > LIVE_STREAM_DESCRIPTION_MAX_LENGTH ||
|
|
237
|
+
isFreeTrialTier ||
|
|
238
|
+
timeRemaining <= WARNING_THRESHOLD_EXPIRING_SOON, variant: "contained", onClick: handleSubmit, color: "secondary" }, { children: liveStream ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.button.edit", defaultMessage: "ui.liveStreamForm.button.edit" })) : (_jsx(FormattedMessage, { id: "ui.liveStreamForm.button.create", defaultMessage: "ui.liveStreamForm.button.create" })) })) }))] }))] })));
|
|
189
239
|
}
|
|
@@ -70,7 +70,7 @@ export default function LiveStreamSettingsForm(inProps) {
|
|
|
70
70
|
/**
|
|
71
71
|
* Renders root object
|
|
72
72
|
*/
|
|
73
|
-
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked:
|
|
73
|
+
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: !(settings === null || settings === void 0 ? void 0 : settings.muteParticipants), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['muteParticipants']: !(settings === null || settings === void 0 ? void 0 : settings.muteParticipants) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.muteParticipants", defaultMessage: "ui.liveStreamForm.muteParticipants" }) }))] })), isEnterpriseFeaturesVisible && (_jsxs(_Fragment, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, checked: !(settings === null || settings === void 0 ? void 0 : settings.disableVideo), disabled: !isEnterpriseTier || !liveStreamEnabled, onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['disableVideo']: !(settings === null || settings === void 0 ? void 0 : settings.disableVideo) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.disableVideo", defaultMessage: "ui.liveStreamForm.disableVideo" }) })), _jsx(UpScalingTierBadge, { desiredTier: SCCommunitySubscriptionTier.ENTERPRISE })] })), _jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, checked: !(settings === null || settings === void 0 ? void 0 : settings.disableShareScreen), disabled: !isEnterpriseTier || !liveStreamEnabled, onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['disableShareScreen']: !(settings === null || settings === void 0 ? void 0 : settings.disableShareScreen) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.disableShareScreen", defaultMessage: "ui.liveStreamForm.disableShareScreen" }) })), _jsx(UpScalingTierBadge, { desiredTier: SCCommunitySubscriptionTier.ENTERPRISE })] }))] })), _jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: !(settings === null || settings === void 0 ? void 0 : settings.disableChat), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['disableChat']: !(settings === null || settings === void 0 ? void 0 : settings.disableChat) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.disableChat", defaultMessage: "ui.liveStreamForm.disableChat" }) }))] })), _jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.hideParticipantsList), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['hideParticipantsList']: !(settings === null || settings === void 0 ? void 0 : settings.hideParticipantsList) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.hideParticipantsList", defaultMessage: "ui.liveStreamForm.hideParticipantsList" }) }))] })), _jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.automaticallyNotifyFollowers), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['automaticallyNotifyFollowers']: !(settings === null || settings === void 0 ? void 0 : settings.automaticallyNotifyFollowers) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.automaticallyNotifyFollowers", defaultMessage: "ui.liveStreamForm.automaticallyNotifyFollowers" }) }))] })), _jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx(Switch, { className: classes.switch, disabled: !liveStreamEnabled, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.showInProfile), onChange: () => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['showInProfile']: !(settings === null || settings === void 0 ? void 0 : settings.showInProfile) })) }), _jsx(Typography, Object.assign({ className: classes.switchLabel }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.showInProfile", defaultMessage: "ui.liveStreamForm.showInProfile" }) }))] })), _jsxs(FormControl, Object.assign({ className: classes.accessView }, { children: [_jsx(InputLabel, Object.assign({ id: "viewLabel" }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.view.label", defaultMessage: "ui.liveStreamForm.view.label" }) })), _jsx(Select, Object.assign({ name: "view", label: _jsx(FormattedMessage, { id: "ui.liveStreamForm.view.label", defaultMessage: "ui.liveStreamForm.view.label" }), labelId: "viewLabel", disabled: !liveStreamEnabled, fullWidth: true, value: (_a = settings === null || settings === void 0 ? void 0 : settings.view) !== null && _a !== void 0 ? _a : SCLiveStreamViewType.SPEAKER, onChange: (e) => onChange(Object.assign(Object.assign(Object.assign({}, LIVESTREAM_DEFAULT_SETTINGS), settings), { ['view']: e.target.value })), displayEmpty: true, renderValue: (selected) => {
|
|
74
74
|
return (_jsxs(_Fragment, { children: [_jsx(Icon, Object.assign({ className: classes.accessViewIcon }, { children: selected === SCLiveStreamViewType.SPEAKER ? 'upload' : 'category' })), "\u00A0", _jsx(FormattedMessage, { id: `ui.liveStreamForm.view.${selected}`, defaultMessage: `ui.liveStreamForm.view.${selected}` })] }));
|
|
75
75
|
} }, { children: Object.values(SCLiveStreamViewType).map((f) => (_jsx(MenuItem, Object.assign({ value: f }, { children: _jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsxs("b", { children: [_jsx(Icon, Object.assign({ className: classes.accessViewIcon }, { children: f === SCLiveStreamViewType.SPEAKER ? 'upload' : 'category' })), "\u00A0", _jsx(FormattedMessage, { id: `ui.liveStreamForm.view.${f}`, defaultMessage: `ui.liveStreamForm.view.${f}` })] }) })), _jsx(Typography, Object.assign({ sx: { textWrap: 'auto' } }, { children: _jsx(FormattedMessage, { id: `ui.liveStreamForm.view.${f}.description`, defaultMessage: `ui.liveStreamForm.view.${f}.description` }) }))] }) }), f))) }))] }))] })));
|
|
76
76
|
}
|
|
@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { styled } from '@mui/material/styles';
|
|
4
4
|
import { useThemeProps } from '@mui/system';
|
|
5
5
|
import { FormattedMessage } from 'react-intl';
|
|
6
|
+
import { SCPreferences, useSCPreferences } from '@selfcommunity/react-core';
|
|
6
7
|
import { Chip, Tooltip } from '@mui/material';
|
|
7
8
|
import { useMemo } from 'react';
|
|
8
9
|
import { SCCommunitySubscriptionTier } from '@selfcommunity/types';
|
|
@@ -28,6 +29,11 @@ export default function UpScalingTierBadge(inProps) {
|
|
|
28
29
|
name: PREFIX
|
|
29
30
|
});
|
|
30
31
|
const { className, desiredTier = SCCommunitySubscriptionTier.GO } = props, rest = __rest(props, ["className", "desiredTier"]);
|
|
32
|
+
const { preferences } = useSCPreferences();
|
|
33
|
+
const isEnterpriseTier = useMemo(() => preferences &&
|
|
34
|
+
SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER in preferences &&
|
|
35
|
+
preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value &&
|
|
36
|
+
preferences[SCPreferences.CONFIGURATIONS_SUBSCRIPTION_TIER].value === SCCommunitySubscriptionTier.ENTERPRISE, [preferences]);
|
|
31
37
|
const tooltipMsg = useMemo(() => {
|
|
32
38
|
let _msg = _jsx(FormattedMessage, { id: "ui.upScalingTierBadge.goFeature", defaultMessage: "ui.upScalingTierBadge.goFeature" });
|
|
33
39
|
switch (desiredTier) {
|
|
@@ -56,5 +62,8 @@ export default function UpScalingTierBadge(inProps) {
|
|
|
56
62
|
}
|
|
57
63
|
return _label;
|
|
58
64
|
}, [desiredTier]);
|
|
65
|
+
if (desiredTier === SCCommunitySubscriptionTier.ENTERPRISE && isEnterpriseTier) {
|
|
66
|
+
return null;
|
|
67
|
+
}
|
|
59
68
|
return (_jsx(Root, Object.assign({ classes: { root: classNames(className, classes.root) }, title: tooltipMsg, placement: "top" }, rest, { children: _jsx(Badge, { color: "secondary", size: "small", label: badgeLabel, className: classes.badge }) })));
|
|
60
69
|
}
|