@selfcommunity/react-ui 0.8.0-live.58 → 0.8.0-live.60

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 (66) hide show
  1. package/lib/cjs/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js +8 -7
  2. package/lib/cjs/components/EventForm/EventAddress.js +12 -8
  3. package/lib/cjs/components/EventForm/EventForm.d.ts +6 -1
  4. package/lib/cjs/components/EventForm/EventForm.js +27 -9
  5. package/lib/cjs/components/EventForm/types.d.ts +2 -1
  6. package/lib/cjs/components/LiveStreamForm/LiveStreamForm.js +1 -3
  7. package/lib/cjs/components/LiveStreamForm/LiveStreamFormSettings.d.ts +2 -1
  8. package/lib/cjs/components/LiveStreamForm/LiveStreamFormSettings.js +1 -1
  9. package/lib/cjs/components/LiveStreamForm/constants.d.ts +4 -1
  10. package/lib/cjs/components/LiveStreamForm/constants.js +7 -4
  11. package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.js +12 -7
  12. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamProvider.d.ts +17 -0
  13. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamProvider.js +13 -0
  14. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.d.ts +0 -6
  15. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +11 -3
  16. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantPlaceholder.d.ts +6 -0
  17. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantPlaceholder.js +8 -0
  18. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTile.d.ts +28 -0
  19. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTile.js +65 -0
  20. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileActions.d.ts +26 -0
  21. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileActions.js +204 -0
  22. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileAvatar.d.ts +15 -0
  23. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileAvatar.js +38 -0
  24. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/PreJoin.d.ts +55 -0
  25. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/PreJoin.js +249 -0
  26. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/TrackToggle.d.ts +23 -0
  27. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/TrackToggle.js +31 -0
  28. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.d.ts +4 -3
  29. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.js +5 -4
  30. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/constants.d.ts +1 -0
  31. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/constants.js +2 -1
  32. package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js +1 -1
  33. package/lib/esm/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js +2 -1
  34. package/lib/esm/components/EventForm/EventAddress.js +13 -9
  35. package/lib/esm/components/EventForm/EventForm.d.ts +6 -1
  36. package/lib/esm/components/EventForm/EventForm.js +27 -9
  37. package/lib/esm/components/EventForm/types.d.ts +2 -1
  38. package/lib/esm/components/LiveStreamForm/LiveStreamForm.js +2 -4
  39. package/lib/esm/components/LiveStreamForm/LiveStreamFormSettings.d.ts +2 -1
  40. package/lib/esm/components/LiveStreamForm/LiveStreamFormSettings.js +1 -1
  41. package/lib/esm/components/LiveStreamForm/constants.d.ts +4 -1
  42. package/lib/esm/components/LiveStreamForm/constants.js +7 -4
  43. package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.js +13 -8
  44. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamProvider.d.ts +17 -0
  45. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamProvider.js +9 -0
  46. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.d.ts +0 -6
  47. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +11 -3
  48. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantPlaceholder.d.ts +6 -0
  49. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantPlaceholder.js +6 -0
  50. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTile.d.ts +28 -0
  51. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTile.js +60 -0
  52. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileActions.d.ts +26 -0
  53. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileActions.js +201 -0
  54. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileAvatar.d.ts +15 -0
  55. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/ParticipantTileAvatar.js +35 -0
  56. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/PreJoin.d.ts +55 -0
  57. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/PreJoin.js +243 -0
  58. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/TrackToggle.d.ts +23 -0
  59. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/TrackToggle.js +27 -0
  60. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.d.ts +4 -3
  61. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.js +6 -5
  62. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/constants.d.ts +1 -0
  63. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/constants.js +1 -0
  64. package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js +1 -1
  65. package/lib/umd/react-ui.js +1 -1
  66. package/package.json +7 -7
@@ -6,13 +6,14 @@ const react_1 = tslib_1.__importStar(require("react"));
6
6
  const styles_1 = require("@mui/material/styles");
7
7
  const system_1 = require("@mui/system");
8
8
  const react_core_1 = require("@selfcommunity/react-core");
9
+ const types_1 = require("@selfcommunity/types");
9
10
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
10
11
  const react_intl_1 = require("react-intl");
11
12
  const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
12
13
  const constants_1 = require("./constants");
13
14
  const EventForm_1 = tslib_1.__importDefault(require("../EventForm"));
14
15
  const LiveStreamSelector_1 = tslib_1.__importDefault(require("./LiveStreamSelector/LiveStreamSelector"));
15
- const types_1 = require("./types");
16
+ const types_2 = require("./types");
16
17
  const LiveStreamForm_1 = tslib_1.__importDefault(require("../LiveStreamForm"));
17
18
  const Slide_1 = tslib_1.__importDefault(require("@mui/material/Slide"));
18
19
  const material_1 = require("@mui/material");
@@ -69,25 +70,25 @@ function CreateLiveStreamDialog(inProps) {
69
70
  const canCreateLiveStream = (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; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
70
71
  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]);
71
72
  // STATE
72
- const [step, setStep] = (0, react_1.useState)(canCreateEvent ? types_1.CreateLiveStreamStep.SELECT_TYPE : types_1.CreateLiveStreamStep.CREATE_LIVE);
73
- const [liveType, setLiveType] = (0, react_1.useState)(canCreateEvent ? null : types_1.LiveStreamType.DIRECT_LIVE);
73
+ const [step, setStep] = (0, react_1.useState)(canCreateEvent ? types_2.CreateLiveStreamStep.SELECT_TYPE : types_2.CreateLiveStreamStep.CREATE_LIVE);
74
+ const [liveType, setLiveType] = (0, react_1.useState)(canCreateEvent ? null : types_2.LiveStreamType.DIRECT_LIVE);
74
75
  // HANDLER
75
76
  const handleLiveTypeSelected = (0, react_1.useCallback)((l) => {
76
77
  setLiveType(l);
77
78
  }, []);
78
79
  const handleLiveTypeSelectedNext = (0, react_1.useCallback)((l) => {
79
80
  setLiveType(l);
80
- setStep(types_1.CreateLiveStreamStep.CREATE_LIVE);
81
+ setStep(types_2.CreateLiveStreamStep.CREATE_LIVE);
81
82
  }, []);
82
83
  const handleBack = (0, react_1.useCallback)((l) => {
83
- setStep(types_1.CreateLiveStreamStep.SELECT_TYPE);
84
+ setStep(types_2.CreateLiveStreamStep.SELECT_TYPE);
84
85
  }, []);
85
86
  const handleSubmit = (0, react_1.useCallback)((e) => {
86
87
  onSuccess && onSuccess(e);
87
88
  }, []);
88
89
  (0, react_1.useEffect)(() => {
89
90
  if (!canCreateEvent) {
90
- setLiveType(types_1.LiveStreamType.DIRECT_LIVE);
91
+ setLiveType(types_2.LiveStreamType.DIRECT_LIVE);
91
92
  }
92
93
  }, [canCreateEvent]);
93
94
  // user must be logged
@@ -97,6 +98,6 @@ function CreateLiveStreamDialog(inProps) {
97
98
  /**
98
99
  * Renders root object
99
100
  */
100
- 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_1.CreateLiveStreamStep.CREATE_LIVE && canCreateEvent) && ((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, scroll: 'paper', 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_1.CreateLiveStreamStep.SELECT_TYPE && ((0, jsx_runtime_1.jsx)(LiveStreamSelector_1.default, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === types_1.CreateLiveStreamStep.CREATE_LIVE && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: liveType === types_1.LiveStreamType.EVENT_LIVE ? (0, jsx_runtime_1.jsx)(EventForm_1.default, { onSuccess: handleSubmit }) : (0, jsx_runtime_1.jsx)(LiveStreamForm_1.default, { onSuccess: handleSubmit }) }))] })) })));
101
+ 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 && canCreateEvent) && ((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, scroll: 'paper', 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, { presetLocation: types_1.SCEventLocationType.LIVESTREAM, onSuccess: handleSubmit }) : (0, jsx_runtime_1.jsx)(LiveStreamForm_1.default, { onSuccess: handleSubmit }) }))] })) })));
101
102
  }
102
103
  exports.default = CreateLiveStreamDialog;
@@ -42,6 +42,7 @@ const Root = (0, styles_1.styled)(material_1.Box, {
42
42
  slot: 'EventAddressRoot'
43
43
  })(() => ({}));
44
44
  function EventAddress(inProps) {
45
+ var _a;
45
46
  //PROPS
46
47
  const props = (0, system_1.useThemeProps)({
47
48
  props: inProps,
@@ -58,23 +59,26 @@ function EventAddress(inProps) {
58
59
  const [suggestions, setSuggestions] = (0, react_1.useState)([]);
59
60
  const [timeoutId, setTimeoutId] = (0, react_1.useState)(null);
60
61
  const liveStream = (0, react_1.useMemo)(() => {
61
- console.log(event);
62
- return {
63
- title: (event === null || event === void 0 ? void 0 : event.name) || `${intl.formatMessage(messages.name)}`,
64
- created_at: (event === null || event === void 0 ? void 0 : event.start_date) || (0, utils_1.getNewDate)(),
65
- settings: /* event?.livestream?.settings || */ constants_2.LIVESTREAM_DEFAULT_SETTINGS
66
- } /* || event.livestream? */;
62
+ return (event.live_stream ||
63
+ {
64
+ title: (event === null || event === void 0 ? void 0 : event.name) || `${intl.formatMessage(messages.name)}`,
65
+ created_at: (event === null || event === void 0 ? void 0 : event.start_date) || (0, utils_1.getNewDate)(),
66
+ settings: constants_2.LIVESTREAM_DEFAULT_SETTINGS
67
+ });
67
68
  }, [event]);
68
69
  // CONTEXT
69
70
  const scContext = (0, react_core_1.useSCContext)();
71
+ const scUserContext = (0, react_core_1.useSCUser)();
70
72
  const geocodingApiKey = (0, react_1.useMemo)(() => scContext.settings.integrations && scContext.settings.integrations.geocoding.apiKey, [scContext.settings.integrations]);
71
73
  const { isLoaded } = (0, api_1.useLoadScript)({
72
74
  googleMapsApiKey: scContext.settings.integrations.geocoding.apiKey,
73
75
  libraries: ['places', 'geocoding']
74
76
  });
77
+ const canViewLiveTab = (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) || event.live_stream; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
75
78
  // HANDLERS
76
79
  const handleChange = (_event, newValue) => {
77
80
  setLocation(newValue);
81
+ forwardGeolocationData({ location: newValue });
78
82
  };
79
83
  const handleSelection = (_event, newValue) => tslib_1.__awaiter(this, void 0, void 0, function* () {
80
84
  if (newValue) {
@@ -134,8 +138,8 @@ function EventAddress(inProps) {
134
138
  if (!geocodingApiKey && !isLoaded) {
135
139
  return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
136
140
  }
137
- return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "add_location_alt" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "play_circle_outline" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "photo_camera" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [location === types_1.SCEventLocationType.PERSON && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === types_1.SCEventLocationType.ONLINE && ((0, jsx_runtime_1.jsx)(UrlTextField_1.default, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
141
+ return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "add_location_alt" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "play_circle_outline" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) }), canViewLiveTab && ((0, jsx_runtime_1.jsx)(material_1.Tab, { value: types_1.SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "photo_camera" }), iconPosition: "start", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [location === types_1.SCEventLocationType.PERSON && ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === types_1.SCEventLocationType.ONLINE && ((0, jsx_runtime_1.jsx)(UrlTextField_1.default, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
138
142
  endAdornment: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "play_circle_outline" })
139
- }, onChange: handleLinkChange })), location === types_1.SCEventLocationType.LIVESTREAM && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(LiveStream_1.default, { template: liveStream_1.SCLiveStreamTemplateType.SNIPPET, liveStream: liveStream, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) }), (0, jsx_runtime_1.jsx)(LiveStreamFormSettings_1.default, { settings: liveStream.settings, onChange: handleLiveStreamSettingsChange })] }))] }))] })));
143
+ }, onChange: handleLinkChange })), canViewLiveTab && location === types_1.SCEventLocationType.LIVESTREAM && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(LiveStream_1.default, { template: liveStream_1.SCLiveStreamTemplateType.SNIPPET, liveStream: liveStream, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) }), (0, jsx_runtime_1.jsx)(LiveStreamFormSettings_1.default, { settings: liveStream.settings, onChange: handleLiveStreamSettingsChange })] }))] }))] })));
140
144
  }
141
145
  exports.default = EventAddress;
@@ -1,5 +1,5 @@
1
1
  import { BoxProps } from '@mui/material';
2
- import { SCEventType } from '@selfcommunity/types';
2
+ import { SCEventLocationType, SCEventType } from '@selfcommunity/types';
3
3
  export interface EventFormProps extends BoxProps {
4
4
  /**
5
5
  * Overrides or extends the styles applied to the component.
@@ -11,6 +11,11 @@ export interface EventFormProps extends BoxProps {
11
11
  * @default null
12
12
  */
13
13
  event?: SCEventType;
14
+ /**
15
+ * Initial location
16
+ * @default SCEventLocationType.PERSON
17
+ */
18
+ presetLocation?: SCEventLocationType;
14
19
  /**
15
20
  * On success callback function
16
21
  * @default null
@@ -120,7 +120,7 @@ function EventForm(inProps) {
120
120
  props: inProps,
121
121
  name: constants_1.PREFIX
122
122
  });
123
- const { className, onSuccess, onError, event = null } = props, rest = tslib_1.__rest(props, ["className", "onSuccess", "onError", "event"]);
123
+ const { className, onSuccess, onError, event, presetLocation = types_1.SCEventLocationType.PERSON } = props, rest = tslib_1.__rest(props, ["className", "onSuccess", "onError", "event", "presetLocation"]);
124
124
  // CONTEXT
125
125
  const scContext = (0, react_core_1.useSCContext)();
126
126
  // INTL
@@ -128,20 +128,25 @@ function EventForm(inProps) {
128
128
  const startDateTime = (0, react_1.useMemo)(() => (0, utils_2.getNewDate)(event === null || event === void 0 ? void 0 : event.start_date), [event]);
129
129
  const endDateTime = (0, react_1.useMemo)(() => (0, utils_2.getNewDate)(event === null || event === void 0 ? void 0 : event.end_date), [event]);
130
130
  const initialFieldState = {
131
+ name: (event === null || event === void 0 ? void 0 : event.name) || '',
132
+ description: event ? event.description : '',
131
133
  imageOriginal: (event === null || event === void 0 ? void 0 : event.image_bigger) || '',
132
134
  imageOriginalFile: '',
133
135
  startDate: event ? startDateTime : (0, utils_2.getNewDate)(),
134
136
  startTime: event ? startDateTime : (0, utils_2.getLaterHoursDate)(1),
135
137
  endDate: (event === null || event === void 0 ? void 0 : event.end_date) ? endDateTime : (0, utils_2.getNewDate)(),
136
138
  endTime: (event === null || event === void 0 ? void 0 : event.end_date) ? endDateTime : (0, utils_2.getLaterHoursDate)(3),
137
- location: (event === null || event === void 0 ? void 0 : event.location) || types_1.SCEventLocationType.PERSON,
139
+ location: (event === null || event === void 0 ? void 0 : event.location)
140
+ ? event.location === types_1.SCEventLocationType.ONLINE && event.live_stream
141
+ ? types_1.SCEventLocationType.LIVESTREAM
142
+ : types_1.SCEventLocationType.ONLINE
143
+ : presetLocation,
138
144
  geolocation: (event === null || event === void 0 ? void 0 : event.geolocation) || '',
139
145
  lat: (event === null || event === void 0 ? void 0 : event.geolocation_lat) || null,
140
146
  lng: (event === null || event === void 0 ? void 0 : event.geolocation_lng) || null,
141
147
  link: (event === null || event === void 0 ? void 0 : event.link) || '',
148
+ liveStreamSettings: (event === null || event === void 0 ? void 0 : event.live_stream) ? event === null || event === void 0 ? void 0 : event.live_stream.settings : null,
142
149
  recurring: (event === null || event === void 0 ? void 0 : event.recurring) || types_1.SCEventRecurrenceType.NEVER,
143
- name: (event === null || event === void 0 ? void 0 : event.name) || '',
144
- description: event ? event.description : '',
145
150
  isPublic: (_a = (event === null || event === void 0 ? void 0 : event.privacy) === types_1.SCEventPrivacyType.PUBLIC) !== null && _a !== void 0 ? _a : true,
146
151
  isSubmitting: false
147
152
  };
@@ -187,7 +192,7 @@ function EventForm(inProps) {
187
192
  setField((prev) => (Object.assign(Object.assign({}, prev), data)));
188
193
  }, []);
189
194
  const handleLiveStreamSettingsData = (0, react_1.useCallback)((data) => {
190
- setField((prev) => (Object.assign(Object.assign({}, prev), data)));
195
+ setField((prev) => (Object.assign(Object.assign({}, prev), { liveStreamSettings: Object.assign(Object.assign({}, prev.liveStreamSettings), data) })));
191
196
  }, []);
192
197
  const handleSubmit = (0, react_1.useCallback)(() => {
193
198
  setField((prev) => (Object.assign(Object.assign({}, prev), { ['isSubmitting']: true })));
@@ -199,14 +204,21 @@ function EventForm(inProps) {
199
204
  formData.append('start_date', (0, utils_2.combineDateAndTime)(field.startDate, field.startTime));
200
205
  formData.append('recurring', field.recurring);
201
206
  formData.append('end_date', (0, utils_2.combineDateAndTime)(field.endDate, field.endTime));
202
- formData.append('location', field.location);
207
+ formData.append('location', field.location === types_1.SCEventLocationType.PERSON ? types_1.SCEventLocationType.PERSON : types_1.SCEventLocationType.ONLINE);
203
208
  if (field.location === types_1.SCEventLocationType.ONLINE) {
204
209
  formData.append('link', field.link);
210
+ formData.append('live_stream_settings', '');
211
+ }
212
+ else if (field.location === types_1.SCEventLocationType.LIVESTREAM) {
213
+ formData.append('link', '');
214
+ formData.append('live_stream_settings', JSON.stringify(field.liveStreamSettings));
205
215
  }
206
216
  else if (field.location === types_1.SCEventLocationType.PERSON) {
207
217
  formData.append('geolocation', field.geolocation);
208
218
  formData.append('geolocation_lat', field.lat.toString());
209
219
  formData.append('geolocation_lng', field.lng.toString());
220
+ formData.append('link', '');
221
+ formData.append('live_stream_settings', '');
210
222
  }
211
223
  if (privateEnabled) {
212
224
  formData.append('privacy', field.isPublic ? types_1.SCEventPrivacyType.PUBLIC : types_1.SCEventPrivacyType.PRIVATE);
@@ -317,11 +329,17 @@ function EventForm(inProps) {
317
329
  var _a;
318
330
  return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) }) }))) }), error: Boolean(error['endDateError']), helperText: ((_a = error['endDateError']) === null || _a === void 0 ? void 0 : _a.error) ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.end.error.invalid", defaultMessage: "ui.eventForm.time.end.error.invalid" })) : null })));
319
331
  }
320
- }, onChange: (value) => handleChangeDateTime(value, 'endTime'), shouldDisableTime: shouldDisabledTime })] })) })), (0, jsx_runtime_1.jsx)(EventAddress_1.default, { forwardGeolocationData: handleGeoData, forwardLivestreamSettingsData: handleLiveStreamSettingsData, event: event !== null && event !== void 0 ? event : {
332
+ }, onChange: (value) => handleChangeDateTime(value, 'endTime'), shouldDisableTime: shouldDisabledTime })] })) })), (0, jsx_runtime_1.jsx)(EventAddress_1.default, { forwardGeolocationData: handleGeoData, forwardLivestreamSettingsData: handleLiveStreamSettingsData, event: Object.assign(Object.assign({}, event), {
321
333
  name: field.name,
322
334
  start_date: field.startDate,
323
- geolocation: field.geolocation
324
- } }), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.privacySection }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), (0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: event && !field.isPublic }), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
335
+ location: field.location,
336
+ geolocation: field.geolocation,
337
+ live_stream: {
338
+ title: field.name || `${intl.formatMessage(messages.name)}`,
339
+ created_at: field.startDate,
340
+ settings: field.liveStreamSettings
341
+ }
342
+ }) }), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.privacySection }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), (0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: event && !field.isPublic }), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
325
343
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
326
344
  // @ts-ignore
327
345
  b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
@@ -1,4 +1,4 @@
1
- import { SCEventLocationType, SCEventRecurrenceType } from '@selfcommunity/types';
1
+ import { SCEventLocationType, SCEventRecurrenceType, SCLiveStreamSettingsType } from '@selfcommunity/types';
2
2
  export type Place = {
3
3
  description: string;
4
4
  id?: string;
@@ -9,6 +9,7 @@ export type Geolocation = {
9
9
  lat?: number;
10
10
  lng?: number;
11
11
  link?: string;
12
+ liveStreamSettings?: SCLiveStreamSettingsType;
12
13
  };
13
14
  export type InitialFieldState = Geolocation & {
14
15
  imageOriginal: string | ArrayBuffer;
@@ -98,8 +98,6 @@ function LiveStreamForm(inProps) {
98
98
  const [error, setError] = (0, react_1.useState)({});
99
99
  // PREFERENCES
100
100
  const scPreferences = (0, react_core_1.useSCPreferences)();
101
- const privateEnabled = (0, react_1.useMemo)(() => scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_PRIVATE_ENABLED].value, [scPreferences.preferences]);
102
- const visibilityEnabled = (0, react_1.useMemo)(() => scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED].value, [scPreferences.preferences]);
103
101
  const _backgroundCover = Object.assign({}, (field.cover
104
102
  ? { background: `url('${field.cover}') center / cover` }
105
103
  : { background: `url('${scPreferences.preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
@@ -153,7 +151,7 @@ function LiveStreamForm(inProps) {
153
151
  utils_1.Logger.error(Errors_1.SCOPE_SC_UI, e);
154
152
  onError === null || onError === void 0 ? void 0 : onError(e);
155
153
  });
156
- }, [field, privateEnabled, visibilityEnabled, onSuccess, onError]);
154
+ }, [field, onSuccess, onError]);
157
155
  const handleChange = (0, react_1.useCallback)((event) => {
158
156
  const { name, value } = event.target;
159
157
  setField((prev) => (Object.assign(Object.assign({}, prev), { [name]: value })));
@@ -1,4 +1,5 @@
1
1
  import { BoxProps } from '@mui/material';
2
+ import { SCLiveStreamSettingsType } from '@selfcommunity/types';
2
3
  export declare const PREFIX = "SCLiveStreamFormSettings";
3
4
  export interface LiveStreamFormSettingsProps extends BoxProps {
4
5
  /**
@@ -10,7 +11,7 @@ export interface LiveStreamFormSettingsProps extends BoxProps {
10
11
  * Event Object
11
12
  * @default null
12
13
  */
13
- settings?: Record<string, any>;
14
+ settings?: SCLiveStreamSettingsType;
14
15
  /**
15
16
  * onChange callback
16
17
  * @param data
@@ -54,7 +54,7 @@ function LiveStreamSettingsForm(inProps) {
54
54
  /**
55
55
  * Renders root object
56
56
  */
57
- 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, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.muteParticipant), onChange: () => onChange(Object.assign(Object.assign({}, settings), { ['muteParticipant']: !(settings === null || settings === void 0 ? void 0 : settings.muteParticipant) })) }), (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.muteParticipant", defaultMessage: "ui.liveStreamForm.muteParticipant" }) }))] })), (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: Boolean(settings === null || settings === void 0 ? void 0 : settings.hideParticipantList), onChange: () => onChange(Object.assign(Object.assign({}, settings), { ['hideParticipantList']: !(settings === null || settings === void 0 ? void 0 : settings.hideParticipantList) })) }), (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.hideParticipantList", defaultMessage: "ui.liveStreamForm.hideParticipantList" }) }))] })), (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: Boolean(settings === null || settings === void 0 ? void 0 : settings.automaticallyNotifyFollowers), onChange: () => onChange(Object.assign(Object.assign({}, 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, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.disableVideo), onChange: () => onChange(Object.assign(Object.assign({}, 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.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: Boolean(settings === null || settings === void 0 ? void 0 : settings.disableChat), onChange: () => onChange(Object.assign(Object.assign({}, 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.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", 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({}, settings), { ['view']: e.target.value })), displayEmpty: true, renderValue: (selected) => {
57
+ 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, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.muteParticipants), onChange: () => onChange(Object.assign(Object.assign({}, 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" }) }))] })), (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: Boolean(settings === null || settings === void 0 ? void 0 : settings.disableVideo), onChange: () => onChange(Object.assign(Object.assign({}, 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.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: Boolean(settings === null || settings === void 0 ? void 0 : settings.disableChat), onChange: () => onChange(Object.assign(Object.assign({}, 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, checked: Boolean(settings === null || settings === void 0 ? void 0 : settings.disableShareScreen), onChange: () => onChange(Object.assign(Object.assign({}, 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.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: Boolean(settings === null || settings === void 0 ? void 0 : settings.hideParticipantList), onChange: () => onChange(Object.assign(Object.assign({}, settings), { ['hideParticipantList']: !(settings === null || settings === void 0 ? void 0 : settings.hideParticipantList) })) }), (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.hideParticipantList", defaultMessage: "ui.liveStreamForm.hideParticipantList" }) }))] })), (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: Boolean(settings === null || settings === void 0 ? void 0 : settings.automaticallyNotifyFollowers), onChange: () => onChange(Object.assign(Object.assign({}, 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.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", 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({}, settings), { ['view']: e.target.value })), displayEmpty: true, renderValue: (selected) => {
58
58
  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}` })] }));
59
59
  } }, { 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, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.liveStreamForm.view.${f}.description`, defaultMessage: `ui.liveStreamForm.view.${f}.description` }) })] }) }), f))) }))] }))] })));
60
60
  }
@@ -1,8 +1,11 @@
1
+ import { SCLiveStreamViewType } from '@selfcommunity/types';
1
2
  export declare const PREFIX = "SCLiveStreamForm";
2
3
  export declare const LIVESTREAM_DEFAULT_SETTINGS: {
3
- muteParticipant: boolean;
4
+ muteParticipants: boolean;
4
5
  hideParticipantList: boolean;
5
6
  automaticallyNotifyFollowers: boolean;
6
7
  disableVideo: boolean;
7
8
  disableChat: boolean;
9
+ disableShareScreen: boolean;
10
+ view: SCLiveStreamViewType;
8
11
  };
@@ -1,11 +1,14 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.LIVESTREAM_DEFAULT_SETTINGS = exports.PREFIX = void 0;
4
+ const types_1 = require("@selfcommunity/types");
4
5
  exports.PREFIX = 'SCLiveStreamForm';
5
6
  exports.LIVESTREAM_DEFAULT_SETTINGS = {
6
- muteParticipant: true,
7
- hideParticipantList: true,
8
- automaticallyNotifyFollowers: true,
7
+ muteParticipants: true,
8
+ hideParticipantList: false,
9
+ automaticallyNotifyFollowers: false,
9
10
  disableVideo: true,
10
- disableChat: false
11
+ disableChat: false,
12
+ disableShareScreen: true,
13
+ view: types_1.SCLiveStreamViewType.SPEAKER
11
14
  };
@@ -10,13 +10,14 @@ const types_1 = require("@selfcommunity/types");
10
10
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
11
11
  const react_intl_1 = require("react-intl");
12
12
  const constants_1 = require("./constants");
13
- const components_react_1 = require("@livekit/components-react");
14
13
  const react_1 = require("react");
15
14
  const LiveStreamVideoConference_1 = tslib_1.__importDefault(require("./LiveStreamVideoConference"));
16
15
  require("@livekit/components-styles");
17
16
  const api_services_1 = require("@selfcommunity/api-services");
18
17
  const utils_1 = require("@selfcommunity/utils");
19
18
  const Errors_1 = require("../../constants/Errors");
19
+ const PreJoin_1 = require("./LiveStreamVideoConference/PreJoin");
20
+ const LiveStreamProvider_1 = require("./LiveStreamVideoConference/LiveStreamProvider");
20
21
  const classes = {
21
22
  root: `${constants_1.PREFIX}-root`,
22
23
  content: `${constants_1.PREFIX}-content`,
@@ -60,12 +61,13 @@ const Root = (0, styles_1.styled)(material_1.Box, {
60
61
  * @param inProps
61
62
  */
62
63
  function LiveStreamRoom(inProps) {
64
+ var _a, _b, _c, _d;
63
65
  //PROPS
64
66
  const props = (0, system_1.useThemeProps)({
65
67
  props: inProps,
66
68
  name: constants_1.PREFIX
67
69
  });
68
- const { id = `live_stream_room_object_${props.liveStreamId ? props.liveStreamId : props.liveStream ? props.liveStream.id : ''}`, liveStreamId = null, liveStream = null, className, showPrejoinTitle = true, showPrejoinDescription = false, startPrejoinContent, endPrejoinContent, presetConnectionDetails, presetPreJoinChoices, LiveStreamVideoConferenceComponentProps = {} } = props, rest = tslib_1.__rest(props, ["id", "liveStreamId", "liveStream", "className", "showPrejoinTitle", "showPrejoinDescription", "startPrejoinContent", "endPrejoinContent", "presetConnectionDetails", "presetPreJoinChoices", "LiveStreamVideoConferenceComponentProps"]);
70
+ const { id = `live_stream_room_object_${props.liveStreamId ? props.liveStreamId : props.liveStream ? props.liveStream.id : ''}`, liveStreamId = null, liveStream = null, className, showPrejoinTitle = true, showPrejoinDescription = false, startPrejoinContent, endPrejoinContent, presetConnectionDetails, presetPreJoinChoices, LiveStreamVideoConferenceComponentProps = { options: { codec: 'vp8', hq: false } } } = props, rest = tslib_1.__rest(props, ["id", "liveStreamId", "liveStream", "className", "showPrejoinTitle", "showPrejoinDescription", "startPrejoinContent", "endPrejoinContent", "presetConnectionDetails", "presetPreJoinChoices", "LiveStreamVideoConferenceComponentProps"]);
69
71
  // CONTEXT
70
72
  const scUserContext = (0, react_core_1.useSCUser)();
71
73
  const { preferences, features } = (0, react_core_1.useSCPreferences)();
@@ -74,11 +76,11 @@ function LiveStreamRoom(inProps) {
74
76
  const [preJoinChoices, setPreJoinChoices] = (0, react_1.useState)(presetPreJoinChoices);
75
77
  const [loading, setLoading] = (0, react_1.useState)(false);
76
78
  const preJoinDefaults = (0, react_1.useMemo)(() => {
77
- var _a, _b, _c, _d, _e;
79
+ var _a, _b, _c;
78
80
  return {
79
81
  username: ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) || '',
80
- videoEnabled: (_c = (_b = scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.settings) === null || _b === void 0 ? void 0 : _b.disableVideo) !== null && _c !== void 0 ? _c : true,
81
- audioEnabled: (_e = (_d = scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.settings) === null || _d === void 0 ? void 0 : _d.muteParticipant) !== null && _e !== void 0 ? _e : true
82
+ videoEnabled: ((_b = scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.settings) === null || _b === void 0 ? void 0 : _b.disableVideo) === false,
83
+ audioEnabled: ((_c = scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.settings) === null || _c === void 0 ? void 0 : _c.muteParticipants) === false
82
84
  };
83
85
  }, [scUserContext.user, scLiveStream]);
84
86
  const [connectionDetails, setConnectionDetails] = (0, react_1.useState)(presetConnectionDetails);
@@ -125,12 +127,15 @@ function LiveStreamRoom(inProps) {
125
127
  /**
126
128
  * User must be authenticated
127
129
  */
128
- if ((!scLiveStream && !scUserContext.user) || !liveStreamEnabled) {
130
+ if (!scLiveStream || !scUserContext.user || !liveStreamEnabled) {
129
131
  return (0, jsx_runtime_1.jsx)(material_1.CircularProgress, {});
130
132
  }
131
133
  /**
132
134
  * Renders root object
133
135
  */
134
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, 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 })), (scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.title) && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div', variant: "h5", className: classes.title }, { children: scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.title }))), (scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.description) && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div', variant: "body1", className: classes.description }, { children: scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.description }))), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.preJoin, { [classes.preJoinLoading]: loading }) }, { children: [(0, jsx_runtime_1.jsx)(components_react_1.PreJoin, { defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }), loading && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.prejoinLoader }, { children: [(0, jsx_runtime_1.jsx)(material_1.CircularProgress, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div', variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamRoom.connecting", defaultMessage: "ui.liveStreamRoom.connecting" }) }))] })))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.endPrejoinContent }, { children: endPrejoinContent }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.conference }, { children: (0, jsx_runtime_1.jsx)(LiveStreamVideoConference_1.default, Object.assign({ connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }, LiveStreamVideoConferenceComponentProps)) }))) })) })));
136
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, 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 })), (scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.title) && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div', variant: "h5", className: classes.title }, { children: scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.title }))), (scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.description) && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div', variant: "body1", className: classes.description }, { children: scLiveStream === null || scLiveStream === void 0 ? void 0 : scLiveStream.description }))), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.preJoin, { [classes.preJoinLoading]: loading }) }, { children: [(0, jsx_runtime_1.jsx)(LiveStreamProvider_1.LiveStreamContext.Provider, Object.assign({ value: { liveStream: scLiveStream } }, { children: (0, jsx_runtime_1.jsx)(PreJoin_1.PreJoin, { defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) })), loading && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.prejoinLoader }, { children: [(0, jsx_runtime_1.jsx)(material_1.CircularProgress, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: 'div', variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamRoom.connecting", defaultMessage: "ui.liveStreamRoom.connecting" }) }))] })))] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.endPrejoinContent }, { children: [Boolean(scUserContext.user &&
137
+ scUserContext.user.id !== scLiveStream.host.id &&
138
+ scLiveStream &&
139
+ (((_a = scLiveStream.settings) === null || _a === void 0 ? void 0 : _a.muteParticipants) || (scLiveStream && ((_b = scLiveStream.settings) === null || _b === void 0 ? void 0 : _b.disableVideo)))) && ((0, jsx_runtime_1.jsxs)(material_1.Alert, Object.assign({ variant: "filled", severity: "error" }, { children: [scLiveStream && ((_c = scLiveStream.settings) === null || _c === void 0 ? void 0 : _c.muteParticipants) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["The host of the live set your microphone as off", (0, jsx_runtime_1.jsx)("br", {})] })), scLiveStream && ((_d = scLiveStream.settings) === null || _d === void 0 ? void 0 : _d.disableVideo) && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "The host of the live set your camera as off" })] }))), endPrejoinContent] }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.conference }, { children: (0, jsx_runtime_1.jsx)(LiveStreamProvider_1.LiveStreamContext.Provider, Object.assign({ value: { liveStream: scLiveStream } }, { children: (0, jsx_runtime_1.jsx)(LiveStreamVideoConference_1.default, Object.assign({ connectionDetails: connectionDetails, userChoices: preJoinChoices }, LiveStreamVideoConferenceComponentProps)) })) }))) })) })));
135
140
  }
136
141
  exports.default = LiveStreamRoom;
@@ -0,0 +1,17 @@
1
+ /// <reference types="react" />
2
+ import { SCLiveStreamType } from '@selfcommunity/types';
3
+ /**
4
+ * Interface LiveStreamContextType
5
+ */
6
+ export interface LiveStreamContextType {
7
+ /**
8
+ * Options
9
+ */
10
+ liveStream: SCLiveStreamType;
11
+ }
12
+ export declare const LiveStreamContext: import("react").Context<LiveStreamContextType>;
13
+ /**
14
+ * Let's only export the `useLiveStream` hook instead of the context.
15
+ * We only want to use the hook directly and never the context component.
16
+ */
17
+ export declare function useLiveStream(): LiveStreamContextType;
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useLiveStream = exports.LiveStreamContext = void 0;
4
+ const react_1 = require("react");
5
+ exports.LiveStreamContext = (0, react_1.createContext)({});
6
+ /**
7
+ * Let's only export the `useLiveStream` hook instead of the context.
8
+ * We only want to use the hook directly and never the context component.
9
+ */
10
+ function useLiveStream() {
11
+ return (0, react_1.useContext)(exports.LiveStreamContext);
12
+ }
13
+ exports.useLiveStream = useLiveStream;
@@ -1,5 +1,4 @@
1
1
  import { BoxProps } from '@mui/material';
2
- import { SCLiveStreamType } from '@selfcommunity/types/src/index';
3
2
  import { LiveKitRoomProps, LocalUserChoices, VideoConferenceProps } from '@livekit/components-react';
4
3
  import { VideoCodec } from 'livekit-client';
5
4
  import React from 'react';
@@ -10,11 +9,6 @@ export interface LiveStreamVideoConferenceProps extends BoxProps {
10
9
  * @default null
11
10
  */
12
11
  className?: string;
13
- /**
14
- * Livestream Object
15
- * @default null
16
- */
17
- liveStream?: SCLiveStreamType;
18
12
  /**
19
13
  * User choices
20
14
  */
@@ -6,6 +6,7 @@ const material_1 = require("@mui/material");
6
6
  const styles_1 = require("@mui/material/styles");
7
7
  const system_1 = require("@mui/system");
8
8
  const react_core_1 = require("@selfcommunity/react-core");
9
+ const types_1 = require("@selfcommunity/types");
9
10
  const classnames_1 = tslib_1.__importDefault(require("classnames"));
10
11
  const constants_1 = require("./constants");
11
12
  const components_react_1 = require("@livekit/components-react");
@@ -14,6 +15,7 @@ const components_core_1 = require("@livekit/components-core");
14
15
  const constants_2 = require("../constants");
15
16
  const react_intl_1 = require("react-intl");
16
17
  const VideoConference_1 = require("./VideoConference");
18
+ const LiveStreamProvider_1 = require("./LiveStreamProvider");
17
19
  const classes = {
18
20
  root: `${constants_1.PREFIX}-root`,
19
21
  title: `${constants_1.PREFIX}-title`,
@@ -52,13 +54,14 @@ function LiveStreamVideoConference(inProps) {
52
54
  props: inProps,
53
55
  name: constants_1.PREFIX
54
56
  });
55
- const { className, liveStream, handleOnLeaveRoom, userChoices = components_core_1.defaultUserChoices, connectionDetails = {}, LiveKitRoomComponentProps = {
57
+ const { className, handleOnLeaveRoom, userChoices = components_core_1.defaultUserChoices, connectionDetails = {}, LiveKitRoomComponentProps = {
56
58
  /* simulateParticipants: true */
57
- }, VideoConferenceComponentProps = {}, startConferenceEndContent, endConferenceEndContent, options = constants_2.defaultVideoOptions } = props, rest = tslib_1.__rest(props, ["className", "liveStream", "handleOnLeaveRoom", "userChoices", "connectionDetails", "LiveKitRoomComponentProps", "VideoConferenceComponentProps", "startConferenceEndContent", "endConferenceEndContent", "options"]);
59
+ }, VideoConferenceComponentProps = {}, startConferenceEndContent, endConferenceEndContent, options = constants_2.defaultVideoOptions } = props, rest = tslib_1.__rest(props, ["className", "handleOnLeaveRoom", "userChoices", "connectionDetails", "LiveKitRoomComponentProps", "VideoConferenceComponentProps", "startConferenceEndContent", "endConferenceEndContent", "options"]);
58
60
  // CONTEXT
59
61
  const scUserContext = (0, react_core_1.useSCUser)();
60
62
  const scRoutingContext = (0, react_core_1.useSCRouting)();
61
63
  const { preferences, features } = (0, react_core_1.useSCPreferences)();
64
+ const { liveStream } = (0, LiveStreamProvider_1.useLiveStream)();
62
65
  // Passphrase
63
66
  // const e2eePassphrase = typeof window !== 'undefined' && decodePassphrase(location.hash.substring(1));
64
67
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -69,6 +72,11 @@ function LiveStreamVideoConference(inProps) {
69
72
  const [e2eeSetupComplete, setE2eeSetupComplete] = (0, react_1.useState)(true);
70
73
  const [liveActive, setLiveActive] = (0, react_1.useState)(true);
71
74
  const [error, setError] = (0, react_1.useState)(null);
75
+ const canUseAudio = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && liveStream && (liveStream.host.id === scUserContext.user.id || (liveStream && !((_a = liveStream === null || liveStream === void 0 ? void 0 : liveStream.settings) === null || _a === void 0 ? void 0 : _a.muteParticipants))); }, [scUserContext, liveStream]);
76
+ const canUseVideo = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && liveStream && (liveStream.host.id === scUserContext.user.id || (liveStream && !((_a = liveStream === null || liveStream === void 0 ? void 0 : liveStream.settings) === null || _a === void 0 ? void 0 : _a.disableVideo))); }, [scUserContext, liveStream]);
77
+ const canUseChat = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && liveStream && (liveStream.host.id === scUserContext.user.id || (liveStream && !((_a = liveStream === null || liveStream === void 0 ? void 0 : liveStream.settings) === null || _a === void 0 ? void 0 : _a.disableChat))); }, [scUserContext, liveStream]);
78
+ const canUseShareScreen = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && liveStream && (liveStream.host.id === scUserContext.user.id || (liveStream && !((_a = liveStream === null || liveStream === void 0 ? void 0 : liveStream.settings) === null || _a === void 0 ? void 0 : _a.disableShareScreen))); }, [scUserContext, liveStream]);
79
+ const speakerFocused = (0, react_1.useMemo)(() => (scUserContext.user && liveStream && liveStream.settings.view === types_1.SCLiveStreamViewType.SPEAKER ? liveStream.host : null), [scUserContext, liveStream]);
72
80
  /* const liveStreamRoomMaxParticipants = useMemo(
73
81
  () =>
74
82
  preferences &&
@@ -178,6 +186,6 @@ function LiveStreamVideoConference(inProps) {
178
186
  /**
179
187
  * Renders root object
180
188
  */
181
- 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.jsx)(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 }, LiveKitRoomComponentProps, { children: (0, jsx_runtime_1.jsxs)(components_react_1.LayoutContextProvider, { children: [(0, jsx_runtime_1.jsx)(VideoConference_1.VideoConference, Object.assign({ chatMessageFormatter: components_react_1.formatChatMessageLinks }, VideoConferenceComponentProps)), (0, jsx_runtime_1.jsx)(components_react_1.ConnectionState, {})] }) })) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: error ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.endConferenceWrap }, { children: [startConferenceEndContent, error, endConferenceEndContent] }))) : liveActive === false ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.endConferenceWrap }, { children: [startConferenceEndContent, (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamRoom.conference.end", defaultMessage: "ui.liveStreamRoom.conference.end" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", color: "secondary", component: react_core_1.Link, to: '/', className: classes.btnBackHome }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamRoom.button.backHome", defaultMessage: "ui.liveStreamRoom.button.backHome" }) })), endConferenceEndContent] }))) : ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, {})) })) })));
189
+ 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.jsx)(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 }, LiveKitRoomComponentProps, { children: (0, jsx_runtime_1.jsxs)(components_react_1.LayoutContextProvider, { children: [(0, jsx_runtime_1.jsx)(VideoConference_1.VideoConference, Object.assign({ chatMessageFormatter: components_react_1.formatChatMessageLinks }, (speakerFocused && { speakerFocused: liveStream.host }), VideoConferenceComponentProps, { disableMicrophone: !canUseAudio, disableCamera: !canUseVideo, disableChat: !canUseChat, disableShareScreen: !canUseShareScreen })), (0, jsx_runtime_1.jsx)(components_react_1.ConnectionState, {})] }) })) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: error ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.endConferenceWrap }, { children: [startConferenceEndContent, error, endConferenceEndContent] }))) : liveActive === false ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.endConferenceWrap }, { children: [startConferenceEndContent, (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamRoom.conference.end", defaultMessage: "ui.liveStreamRoom.conference.end" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", color: "secondary", component: react_core_1.Link, to: '/', className: classes.btnBackHome }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.liveStreamRoom.button.backHome", defaultMessage: "ui.liveStreamRoom.button.backHome" }) })), endConferenceEndContent] }))) : ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, {})) })) })));
182
190
  }
183
191
  exports.default = LiveStreamVideoConference;
@@ -0,0 +1,6 @@
1
+ import type { SVGProps } from 'react';
2
+ /**
3
+ * @internal
4
+ */
5
+ declare const SvgParticipantPlaceholder: (props: SVGProps<SVGSVGElement>) => JSX.Element;
6
+ export default SvgParticipantPlaceholder;
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const jsx_runtime_1 = require("react/jsx-runtime");
4
+ /**
5
+ * @internal
6
+ */
7
+ const SvgParticipantPlaceholder = (props) => ((0, jsx_runtime_1.jsxs)("svg", Object.assign({ width: 320, height: 320, viewBox: "0 0 320 320", preserveAspectRatio: "xMidYMid meet", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M160 180C204.182 180 240 144.183 240 100C240 55.8172 204.182 20 160 20C115.817 20 79.9997 55.8172 79.9997 100C79.9997 144.183 115.817 180 160 180Z", fill: "white", fillOpacity: 0.25 }), (0, jsx_runtime_1.jsx)("path", { d: "M97.6542 194.614C103.267 191.818 109.841 192.481 115.519 195.141C129.025 201.466 144.1 205 159.999 205C175.899 205 190.973 201.466 204.48 195.141C210.158 192.481 216.732 191.818 222.345 194.614C262.703 214.719 291.985 253.736 298.591 300.062C300.15 310.997 291.045 320 280 320H39.9997C28.954 320 19.8495 310.997 21.4087 300.062C28.014 253.736 57.2966 214.72 97.6542 194.614Z", fill: "white", fillOpacity: 0.25 })] })));
8
+ exports.default = SvgParticipantPlaceholder;
@@ -0,0 +1,28 @@
1
+ import * as React from 'react';
2
+ import type { Participant } from 'livekit-client';
3
+ import type { ParticipantClickEvent, TrackReferenceOrPlaceholder } from '@livekit/components-core';
4
+ /**
5
+ * The `ParticipantContextIfNeeded` component only creates a `ParticipantContext`
6
+ * if there is no `ParticipantContext` already.
7
+ */
8
+ export declare function ParticipantContextIfNeeded(props: React.PropsWithChildren<{
9
+ participant?: Participant;
10
+ }>): JSX.Element;
11
+ /**
12
+ * Only create a `TrackRefContext` if there is no `TrackRefContext` already.
13
+ */
14
+ export declare function TrackRefContextIfNeeded(props: React.PropsWithChildren<{
15
+ trackRef?: TrackReferenceOrPlaceholder;
16
+ }>): JSX.Element;
17
+ export interface ParticipantTileProps extends React.HTMLAttributes<HTMLDivElement> {
18
+ /** The track reference to display. */
19
+ trackRef?: TrackReferenceOrPlaceholder;
20
+ disableSpeakingIndicator?: boolean;
21
+ disableTileActions?: boolean;
22
+ onParticipantClick?: (event: ParticipantClickEvent) => void;
23
+ }
24
+ /**
25
+ * The `ParticipantTile` component is the base utility wrapper for displaying a visual representation of a participant.
26
+ * This component can be used as a child of the `TrackLoop` component or by passing a track reference as property.
27
+ */
28
+ export declare const ParticipantTile: (props: ParticipantTileProps & React.RefAttributes<HTMLDivElement>) => React.ReactNode;