@selfcommunity/react-ui 0.8.0-live.41 → 0.8.0-live.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/lib/cjs/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js +1 -4
  2. package/lib/cjs/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.js +14 -11
  3. package/lib/cjs/components/LiveStreamForm/LiveStreamForm.js +32 -10
  4. package/lib/cjs/components/LiveStreamForm/types.d.ts +3 -2
  5. package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.d.ts +24 -6
  6. package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.js +16 -9
  7. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +68 -75
  8. package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js +20 -1
  9. package/lib/esm/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js +1 -4
  10. package/lib/esm/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.js +14 -11
  11. package/lib/esm/components/LiveStreamForm/LiveStreamForm.js +33 -11
  12. package/lib/esm/components/LiveStreamForm/types.d.ts +3 -2
  13. package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.d.ts +24 -6
  14. package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.js +17 -10
  15. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +69 -76
  16. package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js +20 -1
  17. package/lib/umd/react-ui.js +1 -1
  18. package/package.json +7 -7
  19. package/lib/umd/245.js +0 -1
package/lib/cjs/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js CHANGED
@@ -78,7 +78,6 @@ function CreateLiveStreamDialog(inProps) {
78
78
  preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value*/ [preferences, features]);
79
79
  const onlyStaffLiveStreamEnabled = (0, react_1.useMemo)(() => true /* preferences[SCPreferences.CONFIGURATIONS_LIVESTREAM_ONLY_STAFF_ENABLED].value */, [preferences]);
80
80
  const canCreateLiveStream = (0, react_1.useMemo)(() => true /* liveStreamEnabled && (scUserContext?.user?.permission?.create_livestream || (onlyStaffLiveStreamEnabled && UserUtils.isStaff(scUserContext.user)))*/, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, onlyStaffLiveStreamEnabled]);
81
- console.log(canCreateLiveStream);
82
81
  const eventsEnabled = (0, react_1.useMemo)(() => preferences &&
83
82
  features &&
84
83
  features.includes(types_1.SCFeatureName.TAGGING) &&
@@ -86,9 +85,7 @@ function CreateLiveStreamDialog(inProps) {
86
85
  preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
87
86
  const onlyStaffEventEnabled = (0, react_1.useMemo)(() => preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED].value, [preferences]);
88
87
  const canCreateEvent = (0, react_1.useMemo)(() => { var _a, _b; return eventsEnabled && (((_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) || true || (onlyStaffEventEnabled && react_core_1.UserUtils.isStaff(scUserContext.user))); }, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, eventsEnabled, onlyStaffEventEnabled]);
89
- console.log(canCreateEvent);
90
88
  const canCreateLiveStreamEvent = (0, react_1.useMemo)(() => Boolean(canCreateLiveStream && canCreateEvent), [canCreateEvent, canCreateLiveStream]);
91
- console.log(canCreateLiveStreamEvent);
92
89
  // STATE
93
90
  const [step, setStep] = (0, react_1.useState)(canCreateLiveStreamEvent ? types_2.CreateLiveStreamStep.SELECT_TYPE : types_2.CreateLiveStreamStep.CREATE_LIVE);
94
91
  const [liveType, setLiveType] = (0, react_1.useState)(canCreateLiveStreamEvent ? null : types_2.LiveStreamType.DIRECT_LIVE);
@@ -118,6 +115,6 @@ function CreateLiveStreamDialog(inProps) {
118
115
  /**
119
116
  * Renders root object
120
117
  */
121
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.title, component: 'span' }, { children: [step === types_2.CreateLiveStreamStep.CREATE_LIVE && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) }, { children: "Back" }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: 'span' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.content }, { children: [step === types_2.CreateLiveStreamStep.SELECT_TYPE && ((0, jsx_runtime_1.jsx)(LiveStreamSelector_1.default, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === types_2.CreateLiveStreamStep.CREATE_LIVE && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: liveType === types_2.LiveStreamType.EVENT_LIVE ? (0, jsx_runtime_1.jsx)(EventForm_1.default, { onSuccess: handleSubmit }) : (0, jsx_runtime_1.jsx)(LiveStreamForm_1.default, { onSuccess: handleSubmit }) }))] })) })));
118
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.title, component: 'span' }, { children: [Boolean(step === types_2.CreateLiveStreamStep.CREATE_LIVE && canCreateLiveStreamEvent) && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) }, { children: "Back" }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: 'span' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.content }, { children: [step === types_2.CreateLiveStreamStep.SELECT_TYPE && ((0, jsx_runtime_1.jsx)(LiveStreamSelector_1.default, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === types_2.CreateLiveStreamStep.CREATE_LIVE && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: liveType === types_2.LiveStreamType.EVENT_LIVE ? (0, jsx_runtime_1.jsx)(EventForm_1.default, { onSuccess: handleSubmit }) : (0, jsx_runtime_1.jsx)(LiveStreamForm_1.default, { onSuccess: handleSubmit }) }))] })) })));
122
119
  }
123
120
  exports.default = CreateLiveStreamDialog;
package/lib/cjs/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.js CHANGED
@@ -24,7 +24,10 @@ const Root = (0, styles_1.styled)(material_1.Container, {
24
24
  [`& .${classes.options}`]: {
25
25
  display: 'flex',
26
26
  justifyContent: 'center',
27
- alignItems: 'center'
27
+ alignItems: 'center',
28
+ '& > div': {
29
+ width: '310px'
30
+ }
28
31
  },
29
32
  [`& .${classes.actions}`]: {
30
33
  display: 'flex',
@@ -64,16 +67,16 @@ const OptionCard = (0, styles_1.styled)(material_1.Paper, {
64
67
  }
65
68
  }));
66
69
  const RadioIndicator = (0, styles_1.styled)(material_1.Radio, {
67
- shouldForwardProp: (prop) => prop !== 'selected'
70
+ // shouldForwardProp: (prop) => prop !== 'selected'
68
71
  })(({ theme, selected }) => ({
69
- width: 16,
70
- height: 16,
71
- borderRadius: '50%',
72
- border: `2px solid ${selected ? theme.palette.secondary.main : theme.palette.grey[300]}`,
73
- backgroundColor: selected ? theme.palette.secondary.main : 'transparent',
74
- transition: theme.transitions.create(['border-color', 'background-color'], {
75
- duration: theme.transitions.duration.shortest
76
- })
72
+ /* width: 16,
73
+ height: 16,
74
+ borderRadius: '50%',
75
+ border: `2px solid ${selected ? theme.palette.secondary.main : theme.palette.grey[300]}`,
76
+ backgroundColor: selected ? theme.palette.secondary.main : 'transparent',
77
+ transition: theme.transitions.create(['border-color', 'background-color'], {
78
+ duration: theme.transitions.duration.shortest
79
+ }) */
77
80
  }));
78
81
  const FeatureItem = (0, styles_1.styled)(material_1.Box)(({ theme }) => ({
79
82
  display: 'flex',
@@ -158,7 +161,7 @@ function LiveStreamSelector(inProps) {
158
161
  handleOptionSelect(index);
159
162
  e.preventDefault();
160
163
  }
161
- }, theme: undefined }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", component: "h2", sx: { fontWeight: 500 } }, { children: option.title })), (0, jsx_runtime_1.jsx)(RadioIndicator, { selected: selectedOption === option.type, theme: undefined })] }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "ul" }, { children: option.features.map((feature, featureIndex) => {
164
+ }, theme: undefined }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", component: "h2", sx: { fontWeight: 500 } }, { children: option.title })), (0, jsx_runtime_1.jsx)(material_1.Radio, { checked: selectedOption === option.type })] }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "ul" }, { children: option.features.map((feature, featureIndex) => {
162
165
  const _Icon = option.icons[featureIndex];
163
166
  return ((0, jsx_runtime_1.jsxs)(FeatureItem, Object.assign({ component: "li" }, { children: [_Icon, (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", color: "text.secondary", sx: { flex: 1 } }, { children: feature }))] }), featureIndex));
164
167
  }) }))] }), index))) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ disabled: !selectedOption, variant: "contained", onClick: handleNext, color: "secondary" }, { children: "Next" })) }))] })));
package/lib/cjs/components/LiveStreamForm/LiveStreamForm.js CHANGED
@@ -15,10 +15,12 @@ const react_intl_1 = require("react-intl");
15
15
  const Errors_1 = require("../../constants/Errors");
16
16
  const LiveStream_1 = require("../../constants/LiveStream");
17
17
  const constants_1 = require("./constants");
18
+ const UploadEventCover_1 = tslib_1.__importDefault(require("../EventForm/UploadEventCover"));
18
19
  const classes = {
19
20
  root: `${constants_1.PREFIX}-root`,
20
21
  form: `${constants_1.PREFIX}-form`,
21
22
  title: `${constants_1.PREFIX}-title`,
23
+ cover: `${constants_1.PREFIX}-cover`,
22
24
  slug: `${constants_1.PREFIX}-slug`,
23
25
  description: `${constants_1.PREFIX}-description`,
24
26
  content: `${constants_1.PREFIX}-content`,
@@ -87,7 +89,9 @@ function LiveStreamForm(inProps) {
87
89
  title: (liveStream === null || liveStream === void 0 ? void 0 : liveStream.title) || '',
88
90
  description: (liveStream === null || liveStream === void 0 ? void 0 : liveStream.description) || '',
89
91
  slug: (liveStream === null || liveStream === void 0 ? void 0 : liveStream.slug) || '',
92
+ settings: (liveStream === null || liveStream === void 0 ? void 0 : liveStream.settings) || {},
90
93
  cover: (liveStream === null || liveStream === void 0 ? void 0 : liveStream.cover) || '',
94
+ coverFile: (liveStream === null || liveStream === void 0 ? void 0 : liveStream.cover) || '',
91
95
  isSubmitting: false
92
96
  };
93
97
  // STATE
@@ -97,9 +101,27 @@ function LiveStreamForm(inProps) {
97
101
  const scPreferences = (0, react_core_1.useSCPreferences)();
98
102
  const privateEnabled = (0, react_1.useMemo)(() => scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_PRIVATE_ENABLED].value, [scPreferences.preferences]);
99
103
  const visibilityEnabled = (0, react_1.useMemo)(() => scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED].value, [scPreferences.preferences]);
104
+ const _backgroundCover = Object.assign({}, (field.cover
105
+ ? { background: `url('${field.cover}') center / cover` }
106
+ : { background: `url('${scPreferences.preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
107
+ const handleChangeCover = (0, react_1.useCallback)((cover) => {
108
+ setField((prev) => (Object.assign(Object.assign({}, prev), { ['coverFile']: cover })));
109
+ const reader = new FileReader();
110
+ reader.onloadend = () => {
111
+ setField((prev) => (Object.assign(Object.assign({}, prev), { ['cover']: reader.result })));
112
+ };
113
+ reader.readAsDataURL(cover);
114
+ if (error.coverError) {
115
+ delete error.coverError;
116
+ setError(error);
117
+ }
118
+ }, [error]);
100
119
  const handleSubmit = (0, react_1.useCallback)(() => {
101
120
  setField((prev) => (Object.assign(Object.assign({}, prev), { ['isSubmitting']: true })));
102
121
  const formData = new FormData();
122
+ if (field.coverFile) {
123
+ formData.append('cover', field.coverFile);
124
+ }
103
125
  if (visibilityEnabled) {
104
126
  formData.append('visible', 'true');
105
127
  }
@@ -142,15 +164,15 @@ function LiveStreamForm(inProps) {
142
164
  /**
143
165
  * Renders root object
144
166
  */
145
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (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: {
146
- endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH - field.title.length }))
147
- }, 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: {
148
- endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH - field.title.length }))
149
- }, error: Boolean(field.slug.length > LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.title.length > LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.slug.error.maxLength", defaultMessage: "ui.liveStreamForm.slug.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, rows: 4, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
150
- endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH - field.description.length : LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH })))
151
- }, 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)(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 ||
152
- Object.keys(error).length !== 0 ||
153
- field.title.length > LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH ||
154
- field.description.length > LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH, 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" })) })) }))] })) })));
167
+ 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 }) })), (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: {
168
+ endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH - field.title.length }))
169
+ }, 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: {
170
+ endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH - field.title.length }))
171
+ }, error: Boolean(field.slug.length > LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.title.length > LiveStream_1.LIVE_STREAM_SLUG_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamForm.slug.error.maxLength", defaultMessage: "ui.liveStreamForm.slug.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, rows: 4, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
172
+ endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH - field.description.length : LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH })))
173
+ }, 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)(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 ||
174
+ Object.keys(error).length !== 0 ||
175
+ field.title.length > LiveStream_1.LIVE_STREAM_TITLE_MAX_LENGTH ||
176
+ field.description.length > LiveStream_1.LIVE_STREAM_DESCRIPTION_MAX_LENGTH, 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" })) })) }))] }))] })));
155
177
  }
156
178
  exports.default = LiveStreamForm;
package/lib/cjs/components/LiveStreamForm/types.d.ts CHANGED
@@ -1,9 +1,10 @@
1
- export type InitialFieldState = Geolocation & {
1
+ export type InitialFieldState = {
2
2
  title: string;
3
3
  description: string;
4
4
  slug?: string;
5
5
  settings?: Record<string, any>;
6
- cover?: string;
6
+ cover?: string | ArrayBuffer;
7
+ coverFile?: string | Blob;
7
8
  isSubmitting: boolean;
8
9
  };
9
10
  export type FieldStateKeys = keyof InitialFieldState;
package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { BoxProps } from '@mui/material';
2
2
  import { SCLiveStreamType } from '@selfcommunity/types';
3
+ import React from 'react';
3
4
  import '@livekit/components-styles';
4
5
  export interface LiveStreamRoomProps extends BoxProps {
5
6
  /**
@@ -16,6 +17,22 @@ export interface LiveStreamRoomProps extends BoxProps {
16
17
  * Endpoint livestream access
17
18
  */
18
19
  connectionDetailsEndpoint?: string;
20
+ /**
21
+ * Element to be inserted before title
22
+ */
23
+ startPrejoinContent?: React.ReactNode | null;
24
+ /**
25
+ * Element to be inserted after title
26
+ */
27
+ endPrejoinContent?: React.ReactNode | null;
28
+ /**
29
+ * Show title of livestream in prejoin
30
+ */
31
+ showPrejoinTitle?: boolean;
32
+ /**
33
+ * Show description of livestream in prejoin
34
+ */
35
+ showPrejoinDescription?: boolean;
19
36
  /**
20
37
  * Any other properties
21
38
  */
@@ -36,12 +53,13 @@ export interface LiveStreamRoomProps extends BoxProps {
36
53
 
37
54
  |Rule Name|Global class|Description|
38
55
  |---|---|---|
39
- |root|.SCLiveStreamForm-root|Styles applied to the root element.|
40
- |title|.SCLiveStreamForm-title|Styles applied to the title element.|
41
- |description|.SCLiveStreamForm-description|Styles applied to the description element.|
42
- |content|.SCLiveStreamForm-content|Styles applied to the content.|
43
- |prejoin|.SCLiveStreamForm-prejoin|Styles applied to the prejoin.|
44
- |error|.SCLiveStreamForm-error|Styles applied to the error elements.|
56
+ |root|.SCLiveStreamRoom-root|Styles applied to the root element.|
57
+ |title|.SCLiveStreamRoom-title|Styles applied to the title element.|
58
+ |description|.SCLiveStreamRoom-description|Styles applied to the description element.|
59
+ |content|.SCLiveStreamRoom-content|Styles applied to the content.|
60
+ |prejoin|.SCLiveStreamRoom-prejoin|Styles applied to the prejoin.|
61
+ |conference|.SCLiveStreamRoom-conference|Styles applied to the conference.|
62
+ |error|.SCLiveStreamRoom-error|Styles applied to the error elements.|
45
63
 
46
64
  * @param inProps
47
65
  */
package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.js CHANGED
@@ -19,7 +19,10 @@ const classes = {
19
19
  content: `${constants_1.PREFIX}-content`,
20
20
  title: `${constants_1.PREFIX}-title`,
21
21
  description: `${constants_1.PREFIX}-description`,
22
+ startPrejoinContent: `${constants_1.PREFIX}-start-prejoin-content`,
22
23
  preJoin: `${constants_1.PREFIX}-prejoin`,
24
+ endPrejoinContent: `${constants_1.PREFIX}-end-prejoin-content`,
25
+ conference: `${constants_1.PREFIX}-conference`,
23
26
  error: `${constants_1.PREFIX}-error`
24
27
  };
25
28
  const Root = (0, styles_1.styled)(material_1.Box, {
@@ -41,12 +44,13 @@ const Root = (0, styles_1.styled)(material_1.Box, {
41
44
 
42
45
  |Rule Name|Global class|Description|
43
46
  |---|---|---|
44
- |root|.SCLiveStreamForm-root|Styles applied to the root element.|
45
- |title|.SCLiveStreamForm-title|Styles applied to the title element.|
46
- |description|.SCLiveStreamForm-description|Styles applied to the description element.|
47
- |content|.SCLiveStreamForm-content|Styles applied to the content.|
48
- |prejoin|.SCLiveStreamForm-prejoin|Styles applied to the prejoin.|
49
- |error|.SCLiveStreamForm-error|Styles applied to the error elements.|
47
+ |root|.SCLiveStreamRoom-root|Styles applied to the root element.|
48
+ |title|.SCLiveStreamRoom-title|Styles applied to the title element.|
49
+ |description|.SCLiveStreamRoom-description|Styles applied to the description element.|
50
+ |content|.SCLiveStreamRoom-content|Styles applied to the content.|
51
+ |prejoin|.SCLiveStreamRoom-prejoin|Styles applied to the prejoin.|
52
+ |conference|.SCLiveStreamRoom-conference|Styles applied to the conference.|
53
+ |error|.SCLiveStreamRoom-error|Styles applied to the error elements.|
50
54
 
51
55
  * @param inProps
52
56
  */
@@ -57,7 +61,7 @@ function LiveStreamRoom(inProps) {
57
61
  props: inProps,
58
62
  name: constants_1.PREFIX
59
63
  });
60
- const { className, liveStream = null, connectionDetailsEndpoint } = props, rest = tslib_1.__rest(props, ["className", "liveStream", "connectionDetailsEndpoint"]);
64
+ const { className, liveStream = null, showPrejoinTitle = true, showPrejoinDescription = false, startPrejoinContent, endPrejoinContent, connectionDetailsEndpoint } = props, rest = tslib_1.__rest(props, ["className", "liveStream", "showPrejoinTitle", "showPrejoinDescription", "startPrejoinContent", "endPrejoinContent", "connectionDetailsEndpoint"]);
61
65
  // CONTEXT
62
66
  const scUserContext = (0, react_core_1.useSCUser)();
63
67
  const { preferences, features } = (0, react_core_1.useSCPreferences)();
@@ -65,6 +69,7 @@ function LiveStreamRoom(inProps) {
65
69
  const intl = (0, react_intl_1.useIntl)();
66
70
  // STATE
67
71
  const [preJoinChoices, setPreJoinChoices] = (0, react_1.useState)(undefined);
72
+ const [loading, setLoading] = (0, react_1.useState)(false);
68
73
  const preJoinDefaults = (0, react_1.useMemo)(() => {
69
74
  var _a;
70
75
  return {
@@ -93,6 +98,7 @@ function LiveStreamRoom(inProps) {
93
98
  var _b;
94
99
  // eslint-disable-next-line no-constant-condition
95
100
  if ((liveStream || true) && connectionDetailsEndpoint) {
101
+ setLoading(true);
96
102
  setPreJoinChoices(values);
97
103
  const url = new URL(connectionDetailsEndpoint, window.location.origin);
98
104
  url.searchParams.append('roomName', (0, liveStream_1.generateRoomId)());
@@ -103,8 +109,9 @@ function LiveStreamRoom(inProps) {
103
109
  const connectionDetailsResp = yield fetch(url.toString());
104
110
  const connectionDetailsData = yield connectionDetailsResp.json();
105
111
  setConnectionDetails(connectionDetailsData);
112
+ setLoading(false);
106
113
  }
107
- }), []);
114
+ }), [scUserContext.user, connectionDetailsEndpoint, setPreJoinChoices, setConnectionDetails]);
108
115
  /**
109
116
  * Handle PreJoin Error
110
117
  */
@@ -118,6 +125,6 @@ function LiveStreamRoom(inProps) {
118
125
  /**
119
126
  * Renders root object
120
127
  */
121
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.content, "data-lk-theme": "default" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.title }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.title })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.description }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.description })), connectionDetails === undefined || preJoinChoices === undefined ? ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.preJoin }, { children: (0, jsx_runtime_1.jsx)(components_react_1.PreJoin, { persistUserChoices: true, defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) }))) : ((0, jsx_runtime_1.jsx)(LiveStreamVideoConference_1.default, { connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }))] })) })));
128
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.content, "data-lk-theme": "default" }, { children: connectionDetails === undefined || preJoinChoices === undefined ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [startPrejoinContent && (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.startPrejoinContent }, { children: startPrejoinContent })), (liveStream === null || liveStream === void 0 ? void 0 : liveStream.title) && (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.title }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.title })), (liveStream === null || liveStream === void 0 ? void 0 : liveStream.description) && (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.description }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.description })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.preJoin }, { children: (0, jsx_runtime_1.jsx)(components_react_1.PreJoin, { persistUserChoices: true, defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.endPrejoinContent }, { children: startPrejoinContent }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.conference }, { children: (0, jsx_runtime_1.jsx)(LiveStreamVideoConference_1.default, { connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }) }))) })) })));
122
129
  }
123
130
  exports.default = LiveStreamRoom;
package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js CHANGED
@@ -2,8 +2,6 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
6
- // @ts-nocheck
7
5
  const material_1 = require("@mui/material");
8
6
  const styles_1 = require("@mui/material/styles");
9
7
  const system_1 = require("@mui/system");
@@ -11,9 +9,7 @@ const react_core_1 = require("@selfcommunity/react-core");
11
9
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
12
10
  const constants_1 = require("./constants");
13
11
  const components_react_1 = require("@livekit/components-react");
14
- const livekit_client_1 = require("livekit-client");
15
12
  const react_1 = require("react");
16
- const liveStream_1 = require("../../../utils/liveStream");
17
13
  const RecordingIndicator_1 = tslib_1.__importDefault(require("./RecordingIndicator"));
18
14
  const components_core_1 = require("@livekit/components-core");
19
15
  const constants_2 = require("../constants");
@@ -60,16 +56,15 @@ function LiveStreamVideoConference(inProps) {
60
56
  const scUserContext = (0, react_core_1.useSCUser)();
61
57
  const { preferences, features } = (0, react_core_1.useSCPreferences)();
62
58
  // Passphrase
63
- const e2eePassphrase = typeof window !== 'undefined' && (0, liveStream_1.decodePassphrase)(location.hash.substring(1));
59
+ // const e2eePassphrase = typeof window !== 'undefined' && decodePassphrase(location.hash.substring(1));
64
60
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
65
61
  // @ts-ignore
66
- const worker = typeof window !== 'undefined' && e2eePassphrase && new Worker(new URL('livekit-client/e2ee-worker', import.meta.url));
67
- const e2eeEnabled = !!(e2eePassphrase && worker);
68
- const keyProvider = new livekit_client_1.ExternalE2EEKeyProvider();
69
- const [e2eeSetupComplete, setE2eeSetupComplete] = (0, react_1.useState)(false);
70
- const [liveActive, setLiveActive] = (0, react_1.useState)(false);
62
+ // const worker = typeof window !== 'undefined' && e2eePassphrase && new Worker(new URL('livekit-client/e2ee-worker', import.meta.url));
63
+ // const e2eeEnabled = !!(e2eePassphrase && worker);
64
+ // const keyProvider = new ExternalE2EEKeyProvider();
65
+ const [e2eeSetupComplete, setE2eeSetupComplete] = (0, react_1.useState)(true);
66
+ const [liveActive, setLiveActive] = (0, react_1.useState)(true);
71
67
  const [error, setError] = (0, react_1.useState)(null);
72
- const liveStreamRoomMaxParticipants = 25;
73
68
  /* const liveStreamRoomMaxParticipants = useMemo(
74
69
  () =>
75
70
  preferences &&
@@ -78,76 +73,74 @@ function LiveStreamVideoConference(inProps) {
78
73
  [preferences]
79
74
  ); */
80
75
  // Room options
81
- const roomOptions = (0, react_1.useMemo)(() => {
82
- var _a, _b;
83
- let videoCodec = options.codec ? options.codec : constants_2.defaultVideoOptions.codec;
84
- if (e2eeEnabled && (videoCodec === 'av1' || videoCodec === 'vp9')) {
85
- videoCodec = undefined;
86
- }
87
- return {
88
- // emptyTimeout: 3 * 60, // 3 minutes
89
- // maxParticipants: liveStreamRoomMaxParticipants,
90
- videoCaptureDefaults: {
91
- deviceId: (_a = userChoices.videoDeviceId) !== null && _a !== void 0 ? _a : undefined,
92
- resolution: options.hq ? livekit_client_1.VideoPresets.h2160 : livekit_client_1.VideoPresets.h720
93
- },
94
- publishDefaults: {
95
- dtx: false,
96
- videoSimulcastLayers: options.hq ? [livekit_client_1.VideoPresets.h1080, livekit_client_1.VideoPresets.h720] : [livekit_client_1.VideoPresets.h540, livekit_client_1.VideoPresets.h216],
97
- red: !e2eeEnabled,
98
- videoCodec
99
- },
100
- audioCaptureDefaults: {
101
- deviceId: (_b = userChoices.audioDeviceId) !== null && _b !== void 0 ? _b : undefined
102
- },
103
- adaptiveStream: { pixelDensity: 'screen' },
104
- dynacast: true,
105
- e2ee: e2eeEnabled
106
- ? {
107
- keyProvider,
108
- worker
109
- }
110
- : undefined
111
- };
112
- }, [liveStreamRoomMaxParticipants, userChoices, options.hq, options.codec]);
76
+ /* const roomOptions = useMemo((): RoomOptions => {
77
+ let videoCodec: VideoCodec | undefined = options.codec ? options.codec : defaultVideoOptions.codec;
78
+ if (e2eeEnabled && (videoCodec === 'av1' || videoCodec === 'vp9')) {
79
+ videoCodec = undefined;
80
+ }
81
+ return {
82
+ // emptyTimeout: 3 * 60, // 3 minutes
83
+ // maxParticipants: liveStreamRoomMaxParticipants,
84
+ videoCaptureDefaults: {
85
+ deviceId: userChoices.videoDeviceId ?? undefined,
86
+ resolution: options.hq ? VideoPresets.h2160 : VideoPresets.h720
87
+ },
88
+ publishDefaults: {
89
+ dtx: false,
90
+ videoSimulcastLayers: options.hq ? [VideoPresets.h1080, VideoPresets.h720] : [VideoPresets.h540, VideoPresets.h216],
91
+ red: !e2eeEnabled,
92
+ videoCodec
93
+ },
94
+ audioCaptureDefaults: {
95
+ deviceId: userChoices.audioDeviceId ?? undefined
96
+ },
97
+ adaptiveStream: {pixelDensity: 'screen'},
98
+ dynacast: true,
99
+ e2ee: e2eeEnabled
100
+ ? {
101
+ keyProvider,
102
+ worker
103
+ }
104
+ : undefined
105
+ };
106
+ }, [liveStreamRoomMaxParticipants, userChoices, options.hq, options.codec]); */
113
107
  // Create room - only initial
114
- const room = (0, react_1.useMemo)(() => {
115
- if (liveStreamRoomMaxParticipants) {
116
- return new livekit_client_1.Room(roomOptions);
117
- }
118
- }, [liveStreamRoomMaxParticipants]);
108
+ /* const room = useMemo(() => {
109
+ const room = new Room();
110
+ return new Room(roomOptions);
111
+ }, [liveStreamRoomMaxParticipants]); */
119
112
  const connectOptions = (0, react_1.useMemo)(() => {
120
113
  return {
121
114
  autoSubscribe: true
122
115
  };
123
116
  }, []);
124
- (0, react_1.useEffect)(() => {
125
- if (room) {
126
- if (e2eeEnabled) {
127
- keyProvider
128
- .setKey((0, liveStream_1.decodePassphrase)(e2eePassphrase))
129
- .then(() => {
130
- room.setE2EEEnabled(true).catch((e) => {
131
- if (e instanceof livekit_client_1.DeviceUnsupportedError) {
132
- alert(`You're trying to join an encrypted meeting, but your browser does not support it. Please update it to the latest version and try again.`);
133
- console.error(e);
134
- }
135
- else {
136
- throw e;
137
- }
138
- });
139
- })
140
- .then(() => {
141
- setE2eeSetupComplete(true);
142
- setLiveActive(true);
143
- });
144
- }
145
- else {
146
- setE2eeSetupComplete(true);
147
- setLiveActive(true);
148
- }
117
+ /* useEffect(() => {
118
+ if (room) {
119
+ if (e2eeEnabled) {
120
+ keyProvider
121
+ .setKey(decodePassphrase(e2eePassphrase))
122
+ .then(() => {
123
+ room.setE2EEEnabled(true).catch((e) => {
124
+ if (e instanceof DeviceUnsupportedError) {
125
+ alert(
126
+ `You're trying to join an encrypted meeting, but your browser does not support it. Please update it to the latest version and try again.`
127
+ );
128
+ console.error(e);
129
+ } else {
130
+ throw e;
131
+ }
132
+ });
133
+ })
134
+ .then(() => {
135
+ setE2eeSetupComplete(true);
136
+ setLiveActive(true);
137
+ });
138
+ } else {
139
+ setE2eeSetupComplete(true);
140
+ setLiveActive(true);
149
141
  }
150
- }, [e2eeEnabled, room, e2eePassphrase]);
142
+ }
143
+ }, [e2eeEnabled, room, e2eePassphrase]); */
151
144
  // HANDLERS
152
145
  /**
153
146
  * Handle on leave
@@ -181,6 +174,6 @@ function LiveStreamVideoConference(inProps) {
181
174
  /**
182
175
  * Renders root object
183
176
  */
184
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: room && liveActive && !error ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_react_1.LiveKitRoom, Object.assign({ connect: Boolean(e2eeSetupComplete && liveActive && room), room: room, token: connectionDetails['participantToken'], serverUrl: connectionDetails['serverUrl'], connectOptions: connectOptions, video: userChoices.videoEnabled, audio: userChoices.audioEnabled, onDisconnected: handleOnLeave, onEncryptionError: handleEncryptionError, onError: handleError }, LiveKitRoomComponentsProps, { children: [(0, jsx_runtime_1.jsx)(components_react_1.VideoConference, { chatMessageFormatter: components_react_1.formatChatMessageLinks }), (0, jsx_runtime_1.jsx)(RecordingIndicator_1.default, {}), (0, jsx_runtime_1.jsx)(components_react_1.ConnectionState, {})] })) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: error ? error : liveActive === false ? (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "Grazie!" }) : (0, jsx_runtime_1.jsx)(material_1.CircularProgress, {}) })) })));
177
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: liveActive && !error ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_react_1.LiveKitRoom, Object.assign({ connect: Boolean(e2eeSetupComplete && liveActive), token: connectionDetails['participantToken'], serverUrl: connectionDetails['serverUrl'], connectOptions: connectOptions, video: userChoices.videoEnabled, audio: userChoices.audioEnabled, onDisconnected: handleOnLeave, onEncryptionError: handleEncryptionError, onError: handleError }, LiveKitRoomComponentsProps, { children: [(0, jsx_runtime_1.jsx)(components_react_1.VideoConference, { chatMessageFormatter: components_react_1.formatChatMessageLinks }), (0, jsx_runtime_1.jsx)(RecordingIndicator_1.default, {}), (0, jsx_runtime_1.jsx)(components_react_1.ConnectionState, {})] })) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: error ? error : liveActive === false ? (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "Grazie!" }) : (0, jsx_runtime_1.jsx)(material_1.CircularProgress, {}) })) })));
185
178
  }
186
179
  exports.default = LiveStreamVideoConference;
package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js CHANGED
@@ -2,6 +2,7 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
5
6
  const styles_1 = require("@mui/material/styles");
6
7
  const material_1 = require("@mui/material");
7
8
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
@@ -10,6 +11,7 @@ const ScrollContainer_1 = tslib_1.__importDefault(require("../../shared/ScrollCo
10
11
  const DefaultDrawerContent_1 = tslib_1.__importDefault(require("./DefaultDrawerContent"));
11
12
  const DefaultHeaderContent_1 = tslib_1.__importDefault(require("./DefaultHeaderContent"));
12
13
  const CreateLiveStreamButton_1 = tslib_1.__importDefault(require("../CreateLiveStreamButton"));
14
+ const react_core_1 = require("@selfcommunity/react-core");
13
15
  const PREFIX = 'SCNavigationMenuDrawer';
14
16
  const classes = {
15
17
  root: `${PREFIX}-root`,
@@ -28,12 +30,29 @@ const Root = (0, styles_1.styled)(material_1.Drawer, {
28
30
  overridesResolver: (props, styles) => styles.root
29
31
  })(({ theme }) => ({}));
30
32
  function NavigationMenuDrawer(inProps) {
33
+ var _a;
31
34
  // PROPS
32
35
  const props = (0, system_1.useThemeProps)({
33
36
  props: inProps,
34
37
  name: PREFIX
35
38
  });
36
39
  const { className = null, showDrawerHeader = true, drawerHeaderContent = (0, jsx_runtime_1.jsx)(DefaultHeaderContent_1.default, {}), drawerContent = (0, jsx_runtime_1.jsx)(DefaultDrawerContent_1.default, {}), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = {}, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "showDrawerHeader", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
37
- return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooter }, { children: drawerFooterContent ? (drawerFooterContent) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) }))] }))] })));
40
+ const { preferences, features } = (0, react_core_1.useSCPreferences)();
41
+ const scUserContext = (0, react_core_1.useSCUser)();
42
+ // TODO
43
+ const liveStreamEnabled = true;
44
+ /* const liveStreamEnabled = useMemo(
45
+ () =>
46
+ preferences &&
47
+ features &&
48
+ features.includes(SCFeatureName.LIVE_STREAM) &&
49
+ SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in preferences &&
50
+ preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value,
51
+ [preferences, features]
52
+ ); */
53
+ // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
54
+ // @ts-ignore
55
+ const canCreateLiveStream = (0, react_1.useMemo)(() => true /* scUserContext?.user?.permission?.create_livestream */, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
56
+ return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [Boolean(drawerContent || (liveStreamEnabled && canCreateLiveStream)) && (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooter }, { children: drawerFooterContent ? (drawerFooterContent) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) }))] }))] })));
38
57
  }
39
58
  exports.default = NavigationMenuDrawer;
package/lib/esm/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js CHANGED
@@ -76,7 +76,6 @@ export default function CreateLiveStreamDialog(inProps) {
76
76
  preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value*/ [preferences, features]);
77
77
  const onlyStaffLiveStreamEnabled = useMemo(() => true /* preferences[SCPreferences.CONFIGURATIONS_LIVESTREAM_ONLY_STAFF_ENABLED].value */, [preferences]);
78
78
  const canCreateLiveStream = useMemo(() => true /* liveStreamEnabled && (scUserContext?.user?.permission?.create_livestream || (onlyStaffLiveStreamEnabled && UserUtils.isStaff(scUserContext.user)))*/, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, onlyStaffLiveStreamEnabled]);
79
- console.log(canCreateLiveStream);
80
79
  const eventsEnabled = useMemo(() => preferences &&
81
80
  features &&
82
81
  features.includes(SCFeatureName.TAGGING) &&
@@ -84,9 +83,7 @@ export default function CreateLiveStreamDialog(inProps) {
84
83
  preferences[SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
85
84
  const onlyStaffEventEnabled = useMemo(() => preferences[SCPreferences.CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED].value, [preferences]);
86
85
  const canCreateEvent = useMemo(() => { var _a, _b; return eventsEnabled && (((_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) || true || (onlyStaffEventEnabled && UserUtils.isStaff(scUserContext.user))); }, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, eventsEnabled, onlyStaffEventEnabled]);
87
- console.log(canCreateEvent);
88
86
  const canCreateLiveStreamEvent = useMemo(() => Boolean(canCreateLiveStream && canCreateEvent), [canCreateEvent, canCreateLiveStream]);
89
- console.log(canCreateLiveStreamEvent);
90
87
  // STATE
91
88
  const [step, setStep] = useState(canCreateLiveStreamEvent ? CreateLiveStreamStep.SELECT_TYPE : CreateLiveStreamStep.CREATE_LIVE);
92
89
  const [liveType, setLiveType] = useState(canCreateLiveStreamEvent ? null : LiveStreamType.DIRECT_LIVE);
@@ -116,5 +113,5 @@ export default function CreateLiveStreamDialog(inProps) {
116
113
  /**
117
114
  * Renders root object
118
115
  */
119
- return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: _jsxs(Box, Object.assign({ className: classes.title, component: 'span' }, { children: [step === CreateLiveStreamStep.CREATE_LIVE && (_jsx(Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: _jsx(Icon, { children: "arrow_back" }) }, { children: "Back" }))), _jsx(Box, Object.assign({ component: 'span' }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, onClose: onClose, className: classNames(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content }, { children: [step === CreateLiveStreamStep.SELECT_TYPE && (_jsx(LiveStreamSelector, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === CreateLiveStreamStep.CREATE_LIVE && (_jsx(_Fragment, { children: liveType === LiveStreamType.EVENT_LIVE ? _jsx(EventForm, { onSuccess: handleSubmit }) : _jsx(LiveStreamForm, { onSuccess: handleSubmit }) }))] })) })));
116
+ return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: _jsxs(Box, Object.assign({ className: classes.title, component: 'span' }, { children: [Boolean(step === CreateLiveStreamStep.CREATE_LIVE && canCreateLiveStreamEvent) && (_jsx(Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: _jsx(Icon, { children: "arrow_back" }) }, { children: "Back" }))), _jsx(Box, Object.assign({ component: 'span' }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, onClose: onClose, className: classNames(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content }, { children: [step === CreateLiveStreamStep.SELECT_TYPE && (_jsx(LiveStreamSelector, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === CreateLiveStreamStep.CREATE_LIVE && (_jsx(_Fragment, { children: liveType === LiveStreamType.EVENT_LIVE ? _jsx(EventForm, { onSuccess: handleSubmit }) : _jsx(LiveStreamForm, { onSuccess: handleSubmit }) }))] })) })));
120
117
  }