@selfcommunity/react-ui 0.8.0-live.42 → 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 (11) hide show
  1. package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.d.ts +17 -0
  2. package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.js +5 -3
  3. package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +68 -75
  4. package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js +1 -0
  5. package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.d.ts +17 -0
  6. package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.js +6 -4
  7. package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +69 -76
  8. package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js +2 -1
  9. package/lib/umd/react-ui.js +1 -1
  10. package/package.json +7 -7
  11. package/lib/umd/245.js +0 -1
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
  */
package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.js CHANGED
@@ -19,8 +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`,
23
- conference: `${constants_1.PREFIX}-prejoin`,
24
+ endPrejoinContent: `${constants_1.PREFIX}-end-prejoin-content`,
25
+ conference: `${constants_1.PREFIX}-conference`,
24
26
  error: `${constants_1.PREFIX}-error`
25
27
  };
26
28
  const Root = (0, styles_1.styled)(material_1.Box, {
@@ -59,7 +61,7 @@ function LiveStreamRoom(inProps) {
59
61
  props: inProps,
60
62
  name: constants_1.PREFIX
61
63
  });
62
- 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"]);
63
65
  // CONTEXT
64
66
  const scUserContext = (0, react_core_1.useSCUser)();
65
67
  const { preferences, features } = (0, react_core_1.useSCPreferences)();
@@ -123,6 +125,6 @@ function LiveStreamRoom(inProps) {
123
125
  /**
124
126
  * Renders root object
125
127
  */
126
- 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)(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 } }) })))] })) })));
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 } }) }))) })) })));
127
129
  }
128
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
@@ -38,6 +38,7 @@ function NavigationMenuDrawer(inProps) {
38
38
  });
39
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"]);
40
40
  const { preferences, features } = (0, react_core_1.useSCPreferences)();
41
+ const scUserContext = (0, react_core_1.useSCUser)();
41
42
  // TODO
42
43
  const liveStreamEnabled = true;
43
44
  /* const liveStreamEnabled = useMemo(
package/lib/esm/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
  */
package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { __awaiter, __rest } from "tslib";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { Box, CircularProgress } from '@mui/material';
4
4
  import { styled } from '@mui/material/styles';
5
5
  import { useThemeProps } from '@mui/system';
@@ -17,8 +17,10 @@ const classes = {
17
17
  content: `${PREFIX}-content`,
18
18
  title: `${PREFIX}-title`,
19
19
  description: `${PREFIX}-description`,
20
+ startPrejoinContent: `${PREFIX}-start-prejoin-content`,
20
21
  preJoin: `${PREFIX}-prejoin`,
21
- conference: `${PREFIX}-prejoin`,
22
+ endPrejoinContent: `${PREFIX}-end-prejoin-content`,
23
+ conference: `${PREFIX}-conference`,
22
24
  error: `${PREFIX}-error`
23
25
  };
24
26
  const Root = styled(Box, {
@@ -57,7 +59,7 @@ export default function LiveStreamRoom(inProps) {
57
59
  props: inProps,
58
60
  name: PREFIX
59
61
  });
60
- const { className, liveStream = null, connectionDetailsEndpoint } = props, rest = __rest(props, ["className", "liveStream", "connectionDetailsEndpoint"]);
62
+ const { className, liveStream = null, showPrejoinTitle = true, showPrejoinDescription = false, startPrejoinContent, endPrejoinContent, connectionDetailsEndpoint } = props, rest = __rest(props, ["className", "liveStream", "showPrejoinTitle", "showPrejoinDescription", "startPrejoinContent", "endPrejoinContent", "connectionDetailsEndpoint"]);
61
63
  // CONTEXT
62
64
  const scUserContext = useSCUser();
63
65
  const { preferences, features } = useSCPreferences();
@@ -121,5 +123,5 @@ export default function LiveStreamRoom(inProps) {
121
123
  /**
122
124
  * Renders root object
123
125
  */
124
- return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content, "data-lk-theme": "default" }, { children: [_jsx(Box, Object.assign({ className: classes.title }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.title })), _jsx(Box, Object.assign({ className: classes.description }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.description })), connectionDetails === undefined || preJoinChoices === undefined ? (_jsx(Box, Object.assign({ className: classes.preJoin }, { children: _jsx(PreJoin, { persistUserChoices: true, defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) }))) : (_jsx(Box, Object.assign({ className: classes.conference }, { children: _jsx(LiveStreamVideoConference, { connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }) })))] })) })));
126
+ return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsx(Box, Object.assign({ className: classes.content, "data-lk-theme": "default" }, { children: connectionDetails === undefined || preJoinChoices === undefined ? (_jsxs(_Fragment, { children: [startPrejoinContent && _jsx(Box, Object.assign({ className: classes.startPrejoinContent }, { children: startPrejoinContent })), (liveStream === null || liveStream === void 0 ? void 0 : liveStream.title) && _jsx(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) && _jsx(Box, Object.assign({ className: classes.description }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.description })), _jsx(Box, Object.assign({ className: classes.preJoin }, { children: _jsx(PreJoin, { persistUserChoices: true, defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) })), _jsx(Box, Object.assign({ className: classes.endPrejoinContent }, { children: startPrejoinContent }))] })) : (_jsx(Box, Object.assign({ className: classes.conference }, { children: _jsx(LiveStreamVideoConference, { connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }) }))) })) })));
125
127
  }
package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js CHANGED
@@ -1,7 +1,5 @@
1
1
  import { __rest } from "tslib";
2
2
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
4
- // @ts-nocheck
5
3
  import { Box, CircularProgress } from '@mui/material';
6
4
  import { styled } from '@mui/material/styles';
7
5
  import { useThemeProps } from '@mui/system';
@@ -9,9 +7,7 @@ import { useSCPreferences, useSCUser } from '@selfcommunity/react-core';
9
7
  import classNames from 'classnames';
10
8
  import { PREFIX } from './constants';
11
9
  import { ConnectionState, formatChatMessageLinks, LiveKitRoom, VideoConference } from '@livekit/components-react';
12
- import { ExternalE2EEKeyProvider, VideoPresets, Room, DeviceUnsupportedError } from 'livekit-client';
13
- import { useCallback, useEffect, useMemo, useState } from 'react';
14
- import { decodePassphrase } from '../../../utils/liveStream';
10
+ import { useCallback, useMemo, useState } from 'react';
15
11
  import RecordingIndicator from './RecordingIndicator';
16
12
  import { defaultUserChoices } from '@livekit/components-core';
17
13
  import { defaultVideoOptions } from '../constants';
@@ -58,16 +54,15 @@ export default function LiveStreamVideoConference(inProps) {
58
54
  const scUserContext = useSCUser();
59
55
  const { preferences, features } = useSCPreferences();
60
56
  // Passphrase
61
- const e2eePassphrase = typeof window !== 'undefined' && decodePassphrase(location.hash.substring(1));
57
+ // const e2eePassphrase = typeof window !== 'undefined' && decodePassphrase(location.hash.substring(1));
62
58
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
63
59
  // @ts-ignore
64
- const worker = typeof window !== 'undefined' && e2eePassphrase && new Worker(new URL('livekit-client/e2ee-worker', import.meta.url));
65
- const e2eeEnabled = !!(e2eePassphrase && worker);
66
- const keyProvider = new ExternalE2EEKeyProvider();
67
- const [e2eeSetupComplete, setE2eeSetupComplete] = useState(false);
68
- const [liveActive, setLiveActive] = useState(false);
60
+ // const worker = typeof window !== 'undefined' && e2eePassphrase && new Worker(new URL('livekit-client/e2ee-worker', import.meta.url));
61
+ // const e2eeEnabled = !!(e2eePassphrase && worker);
62
+ // const keyProvider = new ExternalE2EEKeyProvider();
63
+ const [e2eeSetupComplete, setE2eeSetupComplete] = useState(true);
64
+ const [liveActive, setLiveActive] = useState(true);
69
65
  const [error, setError] = useState(null);
70
- const liveStreamRoomMaxParticipants = 25;
71
66
  /* const liveStreamRoomMaxParticipants = useMemo(
72
67
  () =>
73
68
  preferences &&
@@ -76,76 +71,74 @@ export default function LiveStreamVideoConference(inProps) {
76
71
  [preferences]
77
72
  ); */
78
73
  // Room options
79
- const roomOptions = useMemo(() => {
80
- var _a, _b;
81
- let videoCodec = options.codec ? options.codec : defaultVideoOptions.codec;
82
- if (e2eeEnabled && (videoCodec === 'av1' || videoCodec === 'vp9')) {
83
- videoCodec = undefined;
84
- }
85
- return {
86
- // emptyTimeout: 3 * 60, // 3 minutes
87
- // maxParticipants: liveStreamRoomMaxParticipants,
88
- videoCaptureDefaults: {
89
- deviceId: (_a = userChoices.videoDeviceId) !== null && _a !== void 0 ? _a : undefined,
90
- resolution: options.hq ? VideoPresets.h2160 : VideoPresets.h720
91
- },
92
- publishDefaults: {
93
- dtx: false,
94
- videoSimulcastLayers: options.hq ? [VideoPresets.h1080, VideoPresets.h720] : [VideoPresets.h540, VideoPresets.h216],
95
- red: !e2eeEnabled,
96
- videoCodec
97
- },
98
- audioCaptureDefaults: {
99
- deviceId: (_b = userChoices.audioDeviceId) !== null && _b !== void 0 ? _b : undefined
100
- },
101
- adaptiveStream: { pixelDensity: 'screen' },
102
- dynacast: true,
103
- e2ee: e2eeEnabled
104
- ? {
105
- keyProvider,
106
- worker
107
- }
108
- : undefined
109
- };
110
- }, [liveStreamRoomMaxParticipants, userChoices, options.hq, options.codec]);
74
+ /* const roomOptions = useMemo((): RoomOptions => {
75
+ let videoCodec: VideoCodec | undefined = options.codec ? options.codec : defaultVideoOptions.codec;
76
+ if (e2eeEnabled && (videoCodec === 'av1' || videoCodec === 'vp9')) {
77
+ videoCodec = undefined;
78
+ }
79
+ return {
80
+ // emptyTimeout: 3 * 60, // 3 minutes
81
+ // maxParticipants: liveStreamRoomMaxParticipants,
82
+ videoCaptureDefaults: {
83
+ deviceId: userChoices.videoDeviceId ?? undefined,
84
+ resolution: options.hq ? VideoPresets.h2160 : VideoPresets.h720
85
+ },
86
+ publishDefaults: {
87
+ dtx: false,
88
+ videoSimulcastLayers: options.hq ? [VideoPresets.h1080, VideoPresets.h720] : [VideoPresets.h540, VideoPresets.h216],
89
+ red: !e2eeEnabled,
90
+ videoCodec
91
+ },
92
+ audioCaptureDefaults: {
93
+ deviceId: userChoices.audioDeviceId ?? undefined
94
+ },
95
+ adaptiveStream: {pixelDensity: 'screen'},
96
+ dynacast: true,
97
+ e2ee: e2eeEnabled
98
+ ? {
99
+ keyProvider,
100
+ worker
101
+ }
102
+ : undefined
103
+ };
104
+ }, [liveStreamRoomMaxParticipants, userChoices, options.hq, options.codec]); */
111
105
  // Create room - only initial
112
- const room = useMemo(() => {
113
- if (liveStreamRoomMaxParticipants) {
114
- return new Room(roomOptions);
115
- }
116
- }, [liveStreamRoomMaxParticipants]);
106
+ /* const room = useMemo(() => {
107
+ const room = new Room();
108
+ return new Room(roomOptions);
109
+ }, [liveStreamRoomMaxParticipants]); */
117
110
  const connectOptions = useMemo(() => {
118
111
  return {
119
112
  autoSubscribe: true
120
113
  };
121
114
  }, []);
122
- useEffect(() => {
123
- if (room) {
124
- if (e2eeEnabled) {
125
- keyProvider
126
- .setKey(decodePassphrase(e2eePassphrase))
127
- .then(() => {
128
- room.setE2EEEnabled(true).catch((e) => {
129
- if (e instanceof DeviceUnsupportedError) {
130
- 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.`);
131
- console.error(e);
132
- }
133
- else {
134
- throw e;
135
- }
136
- });
137
- })
138
- .then(() => {
139
- setE2eeSetupComplete(true);
140
- setLiveActive(true);
141
- });
142
- }
143
- else {
144
- setE2eeSetupComplete(true);
145
- setLiveActive(true);
146
- }
115
+ /* useEffect(() => {
116
+ if (room) {
117
+ if (e2eeEnabled) {
118
+ keyProvider
119
+ .setKey(decodePassphrase(e2eePassphrase))
120
+ .then(() => {
121
+ room.setE2EEEnabled(true).catch((e) => {
122
+ if (e instanceof DeviceUnsupportedError) {
123
+ alert(
124
+ `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.`
125
+ );
126
+ console.error(e);
127
+ } else {
128
+ throw e;
129
+ }
130
+ });
131
+ })
132
+ .then(() => {
133
+ setE2eeSetupComplete(true);
134
+ setLiveActive(true);
135
+ });
136
+ } else {
137
+ setE2eeSetupComplete(true);
138
+ setLiveActive(true);
147
139
  }
148
- }, [e2eeEnabled, room, e2eePassphrase]);
140
+ }
141
+ }, [e2eeEnabled, room, e2eePassphrase]); */
149
142
  // HANDLERS
150
143
  /**
151
144
  * Handle on leave
@@ -179,5 +172,5 @@ export default function LiveStreamVideoConference(inProps) {
179
172
  /**
180
173
  * Renders root object
181
174
  */
182
- return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: room && liveActive && !error ? (_jsx(_Fragment, { children: _jsxs(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: [_jsx(VideoConference, { chatMessageFormatter: formatChatMessageLinks }), _jsx(RecordingIndicator, {}), _jsx(ConnectionState, {})] })) })) : (_jsx(_Fragment, { children: error ? error : liveActive === false ? _jsx(_Fragment, { children: "Grazie!" }) : _jsx(CircularProgress, {}) })) })));
175
+ return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: liveActive && !error ? (_jsx(_Fragment, { children: _jsxs(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: [_jsx(VideoConference, { chatMessageFormatter: formatChatMessageLinks }), _jsx(RecordingIndicator, {}), _jsx(ConnectionState, {})] })) })) : (_jsx(_Fragment, { children: error ? error : liveActive === false ? _jsx(_Fragment, { children: "Grazie!" }) : _jsx(CircularProgress, {}) })) })));
183
176
  }
package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js CHANGED
@@ -9,7 +9,7 @@ import ScrollContainer from '../../shared/ScrollContainer';
9
9
  import DefaultDrawerContent from './DefaultDrawerContent';
10
10
  import DefaultHeaderContent from './DefaultHeaderContent';
11
11
  import CreateLiveStreamButton from '../CreateLiveStreamButton';
12
- import { useSCPreferences } from '@selfcommunity/react-core';
12
+ import { useSCPreferences, useSCUser } from '@selfcommunity/react-core';
13
13
  const PREFIX = 'SCNavigationMenuDrawer';
14
14
  const classes = {
15
15
  root: `${PREFIX}-root`,
@@ -36,6 +36,7 @@ export default function NavigationMenuDrawer(inProps) {
36
36
  });
37
37
  const { className = null, showDrawerHeader = true, drawerHeaderContent = _jsx(DefaultHeaderContent, {}), drawerContent = _jsx(DefaultDrawerContent, {}), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = {}, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = __rest(props, ["className", "showDrawerHeader", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
38
38
  const { preferences, features } = useSCPreferences();
39
+ const scUserContext = useSCUser();
39
40
  // TODO
40
41
  const liveStreamEnabled = true;
41
42
  /* const liveStreamEnabled = useMemo(