@stream-io/video-react-sdk 0.0.1-alpha.72 → 0.0.1-alpha.73
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/dist/src/components/CallControls/AcceptCallButton.d.ts +1 -3
- package/dist/src/components/CallControls/AcceptCallButton.js +3 -1
- package/dist/src/components/CallControls/AcceptCallButton.js.map +1 -1
- package/dist/src/components/CallControls/CallControls.d.ts +0 -2
- package/dist/src/components/CallControls/CallControls.js +2 -2
- package/dist/src/components/CallControls/CallControls.js.map +1 -1
- package/dist/src/components/CallControls/CancelCallButton.d.ts +1 -3
- package/dist/src/components/CallControls/CancelCallButton.js +3 -1
- package/dist/src/components/CallControls/CancelCallButton.js.map +1 -1
- package/dist/src/components/CallControls/RecordCallButton.d.ts +1 -3
- package/dist/src/components/CallControls/RecordCallButton.js +10 -5
- package/dist/src/components/CallControls/RecordCallButton.js.map +1 -1
- package/dist/src/components/CallControls/ScreenShareButton.d.ts +1 -3
- package/dist/src/components/CallControls/ScreenShareButton.js +7 -6
- package/dist/src/components/CallControls/ScreenShareButton.js.map +1 -1
- package/dist/src/components/PendingCallPanel/PendingCallControls.js +1 -1
- package/dist/src/components/PendingCallPanel/PendingCallControls.js.map +1 -1
- package/dist/src/core/components/CallLayout/SpeakerLayout.js +2 -2
- package/dist/src/core/components/CallLayout/SpeakerLayout.js.map +1 -1
- package/package.json +5 -5
- package/src/components/CallControls/AcceptCallButton.tsx +2 -4
- package/src/components/CallControls/CallControls.tsx +4 -7
- package/src/components/CallControls/CancelCallButton.tsx +2 -3
- package/src/components/CallControls/RecordCallButton.tsx +8 -5
- package/src/components/CallControls/ScreenShareButton.tsx +6 -7
- package/src/components/PendingCallPanel/PendingCallControls.tsx +2 -2
- package/src/core/components/CallLayout/SpeakerLayout.tsx +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,15 @@
|
|
|
2
2
|
|
|
3
3
|
This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
|
|
4
4
|
|
|
5
|
+
## [0.0.1-alpha.73](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.0.1-alpha.72...@stream-io/video-react-sdk-0.0.1-alpha.73) (2023-05-24)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
* useCall() in CallControl buttons ([#541](https://github.com/GetStream/stream-video-js/issues/541)) ([fd4ee04](https://github.com/GetStream/stream-video-js/commit/fd4ee04cb809eccacbe928cb68309fe932e55d7e))
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
5
14
|
## [0.0.1-alpha.72](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.0.1-alpha.71...@stream-io/video-react-sdk-0.0.1-alpha.72) (2023-05-23)
|
|
6
15
|
|
|
7
16
|
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
import { Call } from '@stream-io/video-client';
|
|
2
1
|
import { MouseEventHandler } from 'react';
|
|
3
2
|
export type AcceptCallButtonProps = {
|
|
4
|
-
call?: Call;
|
|
5
3
|
disabled?: boolean;
|
|
6
4
|
onClick?: MouseEventHandler<HTMLButtonElement>;
|
|
7
5
|
onAccept?: () => void;
|
|
8
6
|
};
|
|
9
|
-
export declare const AcceptCallButton: ({
|
|
7
|
+
export declare const AcceptCallButton: ({ disabled, onAccept, onClick, }: AcceptCallButtonProps) => JSX.Element;
|
|
@@ -10,7 +10,9 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
11
|
import { useCallback } from 'react';
|
|
12
12
|
import { IconButton } from '../Button';
|
|
13
|
-
|
|
13
|
+
import { useCall } from '@stream-io/video-react-bindings';
|
|
14
|
+
export const AcceptCallButton = ({ disabled, onAccept, onClick, }) => {
|
|
15
|
+
const call = useCall();
|
|
14
16
|
const handleClick = useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
15
17
|
if (onClick) {
|
|
16
18
|
onClick(e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AcceptCallButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/AcceptCallButton.tsx"],"names":[],"mappings":";;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"AcceptCallButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/AcceptCallButton.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAqB,WAAW,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,iCAAiC,CAAC;AAQ1D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,QAAQ,EACR,OAAO,GACe,EAAE,EAAE;IAC1B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,WAAW,GAAyC,WAAW,CACnE,CAAO,CAAC,EAAE,EAAE;QACV,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,CAAC,CAAC,CAAC;SACZ;aAAM,IAAI,IAAI,EAAE;YACf,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAC;SACd;IACH,CAAC,CAAA,EACD,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,CAAC,CAC1B,CAAC;IACF,OAAO,CACL,KAAC,UAAU,IACT,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,aAAa,EAClB,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,WAAW,GACpB,CACH,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { CallStatsButton, CancelCallButton, RecordCallButton, ScreenShareButton, ToggleAudioPublishingButton, ToggleVideoPublishingButton, } from './index';
|
|
3
3
|
import { SpeakingWhileMutedNotification } from '../Notification';
|
|
4
4
|
export const CallControls = (props) => {
|
|
5
|
-
const {
|
|
6
|
-
return (_jsxs("div", Object.assign({ className: "str-video__call-controls" }, { children: [_jsx(RecordCallButton, {
|
|
5
|
+
const { onLeave } = props;
|
|
6
|
+
return (_jsxs("div", Object.assign({ className: "str-video__call-controls" }, { children: [_jsx(RecordCallButton, {}), _jsx(CallStatsButton, {}), _jsx(ScreenShareButton, {}), _jsx(SpeakingWhileMutedNotification, { children: _jsx(ToggleAudioPublishingButton, {}) }), _jsx(ToggleVideoPublishingButton, {}), _jsx(CancelCallButton, { onLeave: onLeave })] })));
|
|
7
7
|
};
|
|
8
8
|
//# sourceMappingURL=CallControls.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CallControls.js","sourceRoot":"","sources":["../../../../src/components/CallControls/CallControls.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"CallControls.js","sourceRoot":"","sources":["../../../../src/components/CallControls/CallControls.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,iBAAiB,EACjB,2BAA2B,EAC3B,2BAA2B,GAC5B,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,8BAA8B,EAAE,MAAM,iBAAiB,CAAC;AAMjE,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAE,EAAE;IACvD,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAC1B,OAAO,CACL,6BAAK,SAAS,EAAC,0BAA0B,iBACvC,KAAC,gBAAgB,KAAG,EACpB,KAAC,eAAe,KAAG,EACnB,KAAC,iBAAiB,KAAG,EACrB,KAAC,8BAA8B,cAC7B,KAAC,2BAA2B,KAAG,GACA,EACjC,KAAC,2BAA2B,KAAG,EAC/B,KAAC,gBAAgB,IAAC,OAAO,EAAE,OAAO,GAAI,KAClC,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { MouseEventHandler } from 'react';
|
|
2
|
-
import { Call } from '@stream-io/video-client';
|
|
3
2
|
export type CancelCallButtonProps = {
|
|
4
|
-
call?: Call;
|
|
5
3
|
disabled?: boolean;
|
|
6
4
|
onClick?: MouseEventHandler<HTMLButtonElement>;
|
|
7
5
|
onLeave?: () => void;
|
|
8
6
|
};
|
|
9
|
-
export declare const CancelCallButton: ({
|
|
7
|
+
export declare const CancelCallButton: ({ disabled, onClick, onLeave, }: CancelCallButtonProps) => JSX.Element;
|
|
@@ -10,7 +10,9 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
11
|
import { useCallback } from 'react';
|
|
12
12
|
import { IconButton } from '../Button/';
|
|
13
|
-
|
|
13
|
+
import { useCall } from '@stream-io/video-react-bindings';
|
|
14
|
+
export const CancelCallButton = ({ disabled, onClick, onLeave, }) => {
|
|
15
|
+
const call = useCall();
|
|
14
16
|
const handleClick = useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
15
17
|
if (onClick) {
|
|
16
18
|
onClick(e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CancelCallButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/CancelCallButton.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAqB,WAAW,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CancelCallButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/CancelCallButton.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAqB,WAAW,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,iCAAiC,CAAC;AAQ1D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,OAAO,EACP,OAAO,GACe,EAAE,EAAE;IAC1B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,WAAW,GAAyC,WAAW,CACnE,CAAO,CAAC,EAAE,EAAE;QACV,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,CAAC,CAAC,CAAC;SACZ;aAAM,IAAI,IAAI,EAAE;YACf,MAAM,IAAI,CAAC,KAAK,EAAE,CAAC;YACnB,OAAO,aAAP,OAAO,uBAAP,OAAO,EAAI,CAAC;SACb;IACH,CAAC,CAAA,EACD,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,CACzB,CAAC;IACF,OAAO,CACL,KAAC,UAAU,IACT,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,UAAU,EACf,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,WAAW,GACpB,CACH,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Call } from '@stream-io/video-client';
|
|
3
2
|
export type RecordCallButtonProps = {
|
|
4
|
-
call: Call;
|
|
5
3
|
caption?: string;
|
|
6
4
|
};
|
|
7
|
-
export declare const RecordCallButton: ({
|
|
5
|
+
export declare const RecordCallButton: ({ caption, }: RecordCallButtonProps) => JSX.Element;
|
|
@@ -10,10 +10,11 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
11
|
import { useCallback, useEffect, useState } from 'react';
|
|
12
12
|
import { OwnCapability } from '@stream-io/video-client';
|
|
13
|
-
import { Restricted, useIsCallRecordingInProgress, } from '@stream-io/video-react-bindings';
|
|
13
|
+
import { Restricted, useCall, useIsCallRecordingInProgress, } from '@stream-io/video-react-bindings';
|
|
14
14
|
import { CompositeButton, IconButton } from '../Button/';
|
|
15
15
|
import { LoadingIndicator } from '../LoadingIndicator';
|
|
16
|
-
export const RecordCallButton = ({
|
|
16
|
+
export const RecordCallButton = ({ caption = 'Record', }) => {
|
|
17
|
+
const call = useCall();
|
|
17
18
|
const isCallRecordingInProgress = useIsCallRecordingInProgress();
|
|
18
19
|
const [isAwaitingResponse, setIsAwaitingResponse] = useState(false);
|
|
19
20
|
useEffect(() => {
|
|
@@ -30,10 +31,10 @@ export const RecordCallButton = ({ call, caption = 'Record', }) => {
|
|
|
30
31
|
try {
|
|
31
32
|
setIsAwaitingResponse(true);
|
|
32
33
|
if (isCallRecordingInProgress) {
|
|
33
|
-
yield call.stopRecording();
|
|
34
|
+
yield (call === null || call === void 0 ? void 0 : call.stopRecording());
|
|
34
35
|
}
|
|
35
36
|
else {
|
|
36
|
-
yield call.startRecording();
|
|
37
|
+
yield (call === null || call === void 0 ? void 0 : call.startRecording());
|
|
37
38
|
}
|
|
38
39
|
}
|
|
39
40
|
catch (e) {
|
|
@@ -45,6 +46,10 @@ export const RecordCallButton = ({ call, caption = 'Record', }) => {
|
|
|
45
46
|
OwnCapability.STOP_RECORD_CALL,
|
|
46
47
|
] }, { children: _jsx(CompositeButton, Object.assign({ active: isCallRecordingInProgress, caption: caption }, { children: isAwaitingResponse ? (_jsx(LoadingIndicator, { tooltip: isCallRecordingInProgress
|
|
47
48
|
? 'Waiting for recording to stop... '
|
|
48
|
-
: 'Waiting for recording to start...' })) : (_jsx(IconButton
|
|
49
|
+
: 'Waiting for recording to start...' })) : (_jsx(IconButton
|
|
50
|
+
// FIXME OL: sort out this ambiguity
|
|
51
|
+
, {
|
|
52
|
+
// FIXME OL: sort out this ambiguity
|
|
53
|
+
enabled: !!call, disabled: !call, icon: isCallRecordingInProgress ? 'recording-on' : 'recording-off', title: "Record call", onClick: toggleRecording })) })) })));
|
|
49
54
|
};
|
|
50
55
|
//# sourceMappingURL=RecordCallButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RecordCallButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/RecordCallButton.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,
|
|
1
|
+
{"version":3,"file":"RecordCallButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/RecordCallButton.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EACL,UAAU,EACV,OAAO,EACP,4BAA4B,GAC7B,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAMvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,OAAO,GAAG,QAAQ,GACI,EAAE,EAAE;IAC1B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,yBAAyB,GAAG,4BAA4B,EAAE,CAAC;IACjE,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpE,SAAS,CAAC,GAAG,EAAE;QACb,kEAAkE;QAClE,8CAA8C;QAC9C,yDAAyD;QACzD,qBAAqB,CAAC,CAAC,UAAU,EAAE,EAAE;YACnC,IAAI,UAAU;gBAAE,OAAO,KAAK,CAAC;YAC7B,OAAO,UAAU,CAAC;QACpB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,yBAAyB,CAAC,CAAC,CAAC;IAEhC,MAAM,eAAe,GAAG,WAAW,CAAC,GAAS,EAAE;QAC7C,IAAI;YACF,qBAAqB,CAAC,IAAI,CAAC,CAAC;YAC5B,IAAI,yBAAyB,EAAE;gBAC7B,MAAM,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,aAAa,EAAE,CAAA,CAAC;aAC7B;iBAAM;gBACL,MAAM,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,cAAc,EAAE,CAAA,CAAC;aAC9B;SACF;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,KAAK,CAAC,wBAAwB,EAAE,CAAC,CAAC,CAAC;SAC5C;IACH,CAAC,CAAA,EAAE,CAAC,IAAI,EAAE,yBAAyB,CAAC,CAAC,CAAC;IAEtC,OAAO,CACL,KAAC,UAAU,kBACT,cAAc,EAAE;YACd,aAAa,CAAC,iBAAiB;YAC/B,aAAa,CAAC,gBAAgB;SAC/B,gBAED,KAAC,eAAe,kBAAC,MAAM,EAAE,yBAAyB,EAAE,OAAO,EAAE,OAAO,gBACjE,kBAAkB,CAAC,CAAC,CAAC,CACpB,KAAC,gBAAgB,IACf,OAAO,EACL,yBAAyB;oBACvB,CAAC,CAAC,mCAAmC;oBACrC,CAAC,CAAC,mCAAmC,GAEzC,CACH,CAAC,CAAC,CAAC,CACF,KAAC,UAAU;YACT,oCAAoC;;gBAApC,oCAAoC;gBACpC,OAAO,EAAE,CAAC,CAAC,IAAI,EACf,QAAQ,EAAE,CAAC,IAAI,EACf,IAAI,EAAE,yBAAyB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,EAClE,KAAK,EAAC,aAAa,EACnB,OAAO,EAAE,eAAe,GACxB,CACH,IACe,IACP,CACd,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Call } from '@stream-io/video-client';
|
|
3
2
|
export type ScreenShareButtonProps = {
|
|
4
|
-
call: Call;
|
|
5
3
|
caption?: string;
|
|
6
4
|
};
|
|
7
|
-
export declare const ScreenShareButton: ({
|
|
5
|
+
export declare const ScreenShareButton: ({ caption, }: ScreenShareButtonProps) => JSX.Element;
|
|
@@ -10,10 +10,11 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
11
|
import { useEffect, useState } from 'react';
|
|
12
12
|
import { getScreenShareStream, OwnCapability, SfuModels, } from '@stream-io/video-client';
|
|
13
|
-
import { Restricted, useHasOngoingScreenShare, useHasPermissions, useLocalParticipant, } from '@stream-io/video-react-bindings';
|
|
13
|
+
import { Restricted, useCall, useHasOngoingScreenShare, useHasPermissions, useLocalParticipant, } from '@stream-io/video-react-bindings';
|
|
14
14
|
import { CompositeButton, IconButton } from '../Button/';
|
|
15
15
|
import { PermissionNotification } from '../Notification';
|
|
16
|
-
export const ScreenShareButton = ({
|
|
16
|
+
export const ScreenShareButton = ({ caption = 'Screen Share', }) => {
|
|
17
|
+
const call = useCall();
|
|
17
18
|
const localParticipant = useLocalParticipant();
|
|
18
19
|
const isSomeoneScreenSharing = useHasOngoingScreenShare();
|
|
19
20
|
const isScreenSharing = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.publishedTracks.includes(SfuModels.TrackType.SCREEN_SHARE);
|
|
@@ -24,9 +25,9 @@ export const ScreenShareButton = ({ call, caption = 'Screen Share', }) => {
|
|
|
24
25
|
setIsAwaitingApproval(false);
|
|
25
26
|
}
|
|
26
27
|
}, [hasPermission]);
|
|
27
|
-
return (_jsx(Restricted, Object.assign({ requiredGrants: [OwnCapability.SCREENSHARE] }, { children: _jsx(PermissionNotification, Object.assign({ permission: OwnCapability.SCREENSHARE, isAwaitingApproval: isAwaitingApproval, messageApproved: "You can now share your screen.", messageAwaitingApproval: "Awaiting for an approval to share screen.", messageRevoked: "You can no longer share your screen." }, { children: _jsx(CompositeButton, Object.assign({ active: isSomeoneScreenSharing, caption: caption }, { children: _jsx(IconButton, { icon: isScreenSharing ? 'screen-share-on' : 'screen-share-off', title: "Share screen", disabled: !isScreenSharing && isSomeoneScreenSharing, onClick: () => __awaiter(void 0, void 0, void 0, function* () {
|
|
28
|
+
return (_jsx(Restricted, Object.assign({ requiredGrants: [OwnCapability.SCREENSHARE] }, { children: _jsx(PermissionNotification, Object.assign({ permission: OwnCapability.SCREENSHARE, isAwaitingApproval: isAwaitingApproval, messageApproved: "You can now share your screen.", messageAwaitingApproval: "Awaiting for an approval to share screen.", messageRevoked: "You can no longer share your screen." }, { children: _jsx(CompositeButton, Object.assign({ active: isSomeoneScreenSharing, caption: caption }, { children: _jsx(IconButton, { icon: isScreenSharing ? 'screen-share-on' : 'screen-share-off', title: "Share screen", disabled: (!isScreenSharing && isSomeoneScreenSharing) || !call, onClick: () => __awaiter(void 0, void 0, void 0, function* () {
|
|
28
29
|
if (!hasPermission &&
|
|
29
|
-
call.permissionsContext.canRequest(OwnCapability.SCREENSHARE)) {
|
|
30
|
+
(call === null || call === void 0 ? void 0 : call.permissionsContext.canRequest(OwnCapability.SCREENSHARE))) {
|
|
30
31
|
setIsAwaitingApproval(true);
|
|
31
32
|
yield call
|
|
32
33
|
.requestPermissions({
|
|
@@ -42,11 +43,11 @@ export const ScreenShareButton = ({ call, caption = 'Screen Share', }) => {
|
|
|
42
43
|
console.log(`Can't share screen: ${e}`);
|
|
43
44
|
});
|
|
44
45
|
if (stream) {
|
|
45
|
-
yield call.publishScreenShareStream(stream);
|
|
46
|
+
yield (call === null || call === void 0 ? void 0 : call.publishScreenShareStream(stream));
|
|
46
47
|
}
|
|
47
48
|
}
|
|
48
49
|
else {
|
|
49
|
-
yield call.stopPublish(SfuModels.TrackType.SCREEN_SHARE);
|
|
50
|
+
yield (call === null || call === void 0 ? void 0 : call.stopPublish(SfuModels.TrackType.SCREEN_SHARE));
|
|
50
51
|
}
|
|
51
52
|
}) }) })) })) })));
|
|
52
53
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScreenShareButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/ScreenShareButton.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,
|
|
1
|
+
{"version":3,"file":"ScreenShareButton.js","sourceRoot":"","sources":["../../../../src/components/CallControls/ScreenShareButton.tsx"],"names":[],"mappings":"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"}
|
|
@@ -8,6 +8,6 @@ export const PendingCallControls = () => {
|
|
|
8
8
|
if (!call)
|
|
9
9
|
return null;
|
|
10
10
|
const buttonsDisabled = callCallingState !== CallingState.RINGING;
|
|
11
|
-
return (_jsx("div", Object.assign({ className: "str-video__pending-call-controls" }, { children: call.isCreatedByMe ? (_jsx(CancelCallButton, {
|
|
11
|
+
return (_jsx("div", Object.assign({ className: "str-video__pending-call-controls" }, { children: call.isCreatedByMe ? (_jsx(CancelCallButton, { disabled: buttonsDisabled })) : (_jsxs(_Fragment, { children: [_jsx(AcceptCallButton, { disabled: buttonsDisabled }), _jsx(CancelCallButton, { onClick: () => call.leave({ reject: true }), disabled: buttonsDisabled })] })) })));
|
|
12
12
|
};
|
|
13
13
|
//# sourceMappingURL=PendingCallControls.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PendingCallControls.js","sourceRoot":"","sources":["../../../../src/components/PendingCallPanel/PendingCallControls.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AAE/E,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,EAAE;IACtC,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,gBAAgB,GAAG,mBAAmB,EAAE,CAAC;IAE/C,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,MAAM,eAAe,GAAG,gBAAgB,KAAK,YAAY,CAAC,OAAO,CAAC;IAClE,OAAO,CACL,4BAAK,SAAS,EAAC,kCAAkC,gBAC9C,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACpB,KAAC,gBAAgB,IAAC,
|
|
1
|
+
{"version":3,"file":"PendingCallControls.js","sourceRoot":"","sources":["../../../../src/components/PendingCallPanel/PendingCallControls.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AAE/E,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,EAAE;IACtC,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,gBAAgB,GAAG,mBAAmB,EAAE,CAAC;IAE/C,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,MAAM,eAAe,GAAG,gBAAgB,KAAK,YAAY,CAAC,OAAO,CAAC;IAClE,OAAO,CACL,4BAAK,SAAS,EAAC,kCAAkC,gBAC9C,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACpB,KAAC,gBAAgB,IAAC,QAAQ,EAAE,eAAe,GAAI,CAChD,CAAC,CAAC,CAAC,CACF,8BACE,KAAC,gBAAgB,IAAC,QAAQ,EAAE,eAAe,GAAI,EAC/C,KAAC,gBAAgB,IACf,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAC3C,QAAQ,EAAE,eAAe,GACzB,IACD,CACJ,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { useEffect, useState } from 'react';
|
|
3
3
|
import { CallTypes, combineComparators, defaultSortPreset, screenSharing, SfuModels, speakerLayoutSortPreset, } from '@stream-io/video-client';
|
|
4
4
|
import { useCall, useLocalParticipant, useParticipants, } from '@stream-io/video-react-bindings';
|
|
5
|
-
import {
|
|
5
|
+
import { DefaultParticipantViewUI, ParticipantView, } from '../ParticipantView';
|
|
6
6
|
import { IconButton } from '../../../components';
|
|
7
7
|
import { useHorizontalScrollPosition } from '../../../components/StreamCall/hooks';
|
|
8
8
|
const DefaultParticipantViewUIBar = ({ participant, }) => (_jsx(DefaultParticipantViewUI, { participant: participant, menuPlacement: "top-end" }));
|
|
@@ -47,7 +47,7 @@ export const SpeakerLayout = ({ ParticipantViewUIBar = DefaultParticipantViewUIB
|
|
|
47
47
|
const isSpeakerScreenSharing = hasScreenShare(participantInSpotlight);
|
|
48
48
|
return (_jsx("div", Object.assign({ className: "str-video__speaker-layout__wrapper" }, { children: _jsxs("div", Object.assign({ className: "str-video__speaker-layout" }, { children: [_jsx("div", Object.assign({ className: "str-video__speaker-layout__spotlight" }, { children: participantInSpotlight && (_jsx(ParticipantView, { participant: participantInSpotlight, muteAudio: isSpeakerScreenSharing, videoKind: isSpeakerScreenSharing ? 'screen' : 'video', sinkId: localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.audioOutputDeviceId, ParticipantViewUI: ParticipantViewUISpotlight, VideoPlaceholder: VideoPlaceholder })) })), otherParticipants.length > 0 && (_jsxs("div", Object.assign({ className: "str-video__speaker-layout__participants-bar-buttons-wrapper" }, { children: [scrollPosition && scrollPosition !== 'start' && (_jsx(IconButton, { onClick: scrollStartClickHandler, icon: "caret-left", className: "str-video__speaker-layout__participants-bar--button-left" })), _jsx("div", Object.assign({ className: "str-video__speaker-layout__participants-bar-wrapper", ref: setScrollWrapper }, { children: _jsxs("div", Object.assign({ className: "str-video__speaker-layout__participants-bar" }, { children: [isSpeakerScreenSharing && (_jsx("div", Object.assign({ className: "str-video__speaker-layout__participant-tile" }, { children: _jsx(ParticipantView, { participant: participantInSpotlight, sinkId: localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.audioOutputDeviceId, ParticipantViewUI: ParticipantViewUIBar, VideoPlaceholder: VideoPlaceholder }) }), participantInSpotlight.sessionId)), otherParticipants.map((participant) => (_jsx("div", Object.assign({ className: "str-video__speaker-layout__participant-tile" }, { children: _jsx(ParticipantView, { participant: participant, sinkId: localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.audioOutputDeviceId, ParticipantViewUI: ParticipantViewUIBar, VideoPlaceholder: VideoPlaceholder }) }), participant.sessionId)))] })) })), scrollPosition && scrollPosition !== 'end' && (_jsx(IconButton, { onClick: scrollEndClickHandler, icon: "caret-right", className: "str-video__speaker-layout__participants-bar--button-right" }))] })))] })) })));
|
|
49
49
|
};
|
|
50
|
-
const hasScreenShare = (p) => p.publishedTracks.includes(SfuModels.TrackType.SCREEN_SHARE);
|
|
50
|
+
const hasScreenShare = (p) => !!(p === null || p === void 0 ? void 0 : p.publishedTracks.includes(SfuModels.TrackType.SCREEN_SHARE));
|
|
51
51
|
const loggedIn = (a, b) => {
|
|
52
52
|
if (a.isLoggedInUser)
|
|
53
53
|
return 1;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SpeakerLayout.js","sourceRoot":"","sources":["../../../../../src/core/components/CallLayout/SpeakerLayout.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EACL,SAAS,EACT,kBAAkB,EAElB,iBAAiB,EACjB,aAAa,EACb,SAAS,EACT,uBAAuB,GAExB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,OAAO,EACP,mBAAmB,EACnB,eAAe,GAChB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EACL,
|
|
1
|
+
{"version":3,"file":"SpeakerLayout.js","sourceRoot":"","sources":["../../../../../src/core/components/CallLayout/SpeakerLayout.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -25,9 +25,9 @@
|
|
|
25
25
|
"@floating-ui/react": "^0.22.0",
|
|
26
26
|
"@nivo/core": "^0.80.0",
|
|
27
27
|
"@nivo/line": "^0.80.0",
|
|
28
|
-
"@stream-io/i18n": "^0.0.1-alpha.
|
|
29
|
-
"@stream-io/video-client": "^0.0.1-alpha.
|
|
30
|
-
"@stream-io/video-react-bindings": "^0.0.1-alpha.
|
|
28
|
+
"@stream-io/i18n": "^0.0.1-alpha.55",
|
|
29
|
+
"@stream-io/video-client": "^0.0.1-alpha.179",
|
|
30
|
+
"@stream-io/video-react-bindings": "^0.0.1-alpha.66",
|
|
31
31
|
"clsx": "^1.2.1",
|
|
32
32
|
"rxjs": "~7.8.1"
|
|
33
33
|
},
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"react-dom": "^18.0.0"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@stream-io/video-styling": "^0.0.1-alpha.
|
|
39
|
+
"@stream-io/video-styling": "^0.0.1-alpha.51",
|
|
40
40
|
"@types/rimraf": "^3.0.2",
|
|
41
41
|
"react": "^18.2.0",
|
|
42
42
|
"react-dom": "^18.2.0",
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"typedoc": "^0.24.7",
|
|
46
46
|
"typescript": "^4.9.5"
|
|
47
47
|
},
|
|
48
|
-
"version": "0.0.1-alpha.
|
|
48
|
+
"version": "0.0.1-alpha.73"
|
|
49
49
|
}
|
|
@@ -1,21 +1,19 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { Call } from '@stream-io/video-client';
|
|
3
1
|
import { MouseEventHandler, useCallback } from 'react';
|
|
4
2
|
import { IconButton } from '../Button';
|
|
3
|
+
import { useCall } from '@stream-io/video-react-bindings';
|
|
5
4
|
|
|
6
5
|
export type AcceptCallButtonProps = {
|
|
7
|
-
call?: Call;
|
|
8
6
|
disabled?: boolean;
|
|
9
7
|
onClick?: MouseEventHandler<HTMLButtonElement>;
|
|
10
8
|
onAccept?: () => void;
|
|
11
9
|
};
|
|
12
10
|
|
|
13
11
|
export const AcceptCallButton = ({
|
|
14
|
-
call,
|
|
15
12
|
disabled,
|
|
16
13
|
onAccept,
|
|
17
14
|
onClick,
|
|
18
15
|
}: AcceptCallButtonProps) => {
|
|
16
|
+
const call = useCall();
|
|
19
17
|
const handleClick: MouseEventHandler<HTMLButtonElement> = useCallback(
|
|
20
18
|
async (e) => {
|
|
21
19
|
if (onClick) {
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { Call } from '@stream-io/video-client';
|
|
2
1
|
import {
|
|
3
2
|
CallStatsButton,
|
|
4
3
|
CancelCallButton,
|
|
@@ -10,23 +9,21 @@ import {
|
|
|
10
9
|
import { SpeakingWhileMutedNotification } from '../Notification';
|
|
11
10
|
|
|
12
11
|
export type CallControlsProps = {
|
|
13
|
-
call: Call;
|
|
14
12
|
onLeave?: () => void;
|
|
15
13
|
};
|
|
16
14
|
|
|
17
15
|
export const CallControls = (props: CallControlsProps) => {
|
|
18
|
-
const {
|
|
19
|
-
|
|
16
|
+
const { onLeave } = props;
|
|
20
17
|
return (
|
|
21
18
|
<div className="str-video__call-controls">
|
|
22
|
-
<RecordCallButton
|
|
19
|
+
<RecordCallButton />
|
|
23
20
|
<CallStatsButton />
|
|
24
|
-
<ScreenShareButton
|
|
21
|
+
<ScreenShareButton />
|
|
25
22
|
<SpeakingWhileMutedNotification>
|
|
26
23
|
<ToggleAudioPublishingButton />
|
|
27
24
|
</SpeakingWhileMutedNotification>
|
|
28
25
|
<ToggleVideoPublishingButton />
|
|
29
|
-
<CancelCallButton
|
|
26
|
+
<CancelCallButton onLeave={onLeave} />
|
|
30
27
|
</div>
|
|
31
28
|
);
|
|
32
29
|
};
|
|
@@ -1,20 +1,19 @@
|
|
|
1
1
|
import { MouseEventHandler, useCallback } from 'react';
|
|
2
|
-
import { Call } from '@stream-io/video-client';
|
|
3
2
|
import { IconButton } from '../Button/';
|
|
3
|
+
import { useCall } from '@stream-io/video-react-bindings';
|
|
4
4
|
|
|
5
5
|
export type CancelCallButtonProps = {
|
|
6
|
-
call?: Call;
|
|
7
6
|
disabled?: boolean;
|
|
8
7
|
onClick?: MouseEventHandler<HTMLButtonElement>;
|
|
9
8
|
onLeave?: () => void;
|
|
10
9
|
};
|
|
11
10
|
|
|
12
11
|
export const CancelCallButton = ({
|
|
13
|
-
call,
|
|
14
12
|
disabled,
|
|
15
13
|
onClick,
|
|
16
14
|
onLeave,
|
|
17
15
|
}: CancelCallButtonProps) => {
|
|
16
|
+
const call = useCall();
|
|
18
17
|
const handleClick: MouseEventHandler<HTMLButtonElement> = useCallback(
|
|
19
18
|
async (e) => {
|
|
20
19
|
if (onClick) {
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import { useCallback, useEffect, useState } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { OwnCapability } from '@stream-io/video-client';
|
|
3
3
|
import {
|
|
4
4
|
Restricted,
|
|
5
|
+
useCall,
|
|
5
6
|
useIsCallRecordingInProgress,
|
|
6
7
|
} from '@stream-io/video-react-bindings';
|
|
7
8
|
import { CompositeButton, IconButton } from '../Button/';
|
|
8
9
|
import { LoadingIndicator } from '../LoadingIndicator';
|
|
9
10
|
|
|
10
11
|
export type RecordCallButtonProps = {
|
|
11
|
-
call: Call;
|
|
12
12
|
caption?: string;
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
export const RecordCallButton = ({
|
|
16
|
-
call,
|
|
17
16
|
caption = 'Record',
|
|
18
17
|
}: RecordCallButtonProps) => {
|
|
18
|
+
const call = useCall();
|
|
19
19
|
const isCallRecordingInProgress = useIsCallRecordingInProgress();
|
|
20
20
|
const [isAwaitingResponse, setIsAwaitingResponse] = useState(false);
|
|
21
21
|
useEffect(() => {
|
|
@@ -32,9 +32,9 @@ export const RecordCallButton = ({
|
|
|
32
32
|
try {
|
|
33
33
|
setIsAwaitingResponse(true);
|
|
34
34
|
if (isCallRecordingInProgress) {
|
|
35
|
-
await call
|
|
35
|
+
await call?.stopRecording();
|
|
36
36
|
} else {
|
|
37
|
-
await call
|
|
37
|
+
await call?.startRecording();
|
|
38
38
|
}
|
|
39
39
|
} catch (e) {
|
|
40
40
|
console.error(`Failed start recording`, e);
|
|
@@ -59,6 +59,9 @@ export const RecordCallButton = ({
|
|
|
59
59
|
/>
|
|
60
60
|
) : (
|
|
61
61
|
<IconButton
|
|
62
|
+
// FIXME OL: sort out this ambiguity
|
|
63
|
+
enabled={!!call}
|
|
64
|
+
disabled={!call}
|
|
62
65
|
icon={isCallRecordingInProgress ? 'recording-on' : 'recording-off'}
|
|
63
66
|
title="Record call"
|
|
64
67
|
onClick={toggleRecording}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { useEffect, useState } from 'react';
|
|
2
2
|
import {
|
|
3
|
-
Call,
|
|
4
3
|
getScreenShareStream,
|
|
5
4
|
OwnCapability,
|
|
6
5
|
SfuModels,
|
|
7
6
|
} from '@stream-io/video-client';
|
|
8
7
|
import {
|
|
9
8
|
Restricted,
|
|
9
|
+
useCall,
|
|
10
10
|
useHasOngoingScreenShare,
|
|
11
11
|
useHasPermissions,
|
|
12
12
|
useLocalParticipant,
|
|
@@ -15,14 +15,13 @@ import { CompositeButton, IconButton } from '../Button/';
|
|
|
15
15
|
import { PermissionNotification } from '../Notification';
|
|
16
16
|
|
|
17
17
|
export type ScreenShareButtonProps = {
|
|
18
|
-
call: Call;
|
|
19
18
|
caption?: string;
|
|
20
19
|
};
|
|
21
20
|
|
|
22
21
|
export const ScreenShareButton = ({
|
|
23
|
-
call,
|
|
24
22
|
caption = 'Screen Share',
|
|
25
23
|
}: ScreenShareButtonProps) => {
|
|
24
|
+
const call = useCall();
|
|
26
25
|
const localParticipant = useLocalParticipant();
|
|
27
26
|
const isSomeoneScreenSharing = useHasOngoingScreenShare();
|
|
28
27
|
const isScreenSharing = localParticipant?.publishedTracks.includes(
|
|
@@ -49,11 +48,11 @@ export const ScreenShareButton = ({
|
|
|
49
48
|
<IconButton
|
|
50
49
|
icon={isScreenSharing ? 'screen-share-on' : 'screen-share-off'}
|
|
51
50
|
title="Share screen"
|
|
52
|
-
disabled={!isScreenSharing && isSomeoneScreenSharing}
|
|
51
|
+
disabled={(!isScreenSharing && isSomeoneScreenSharing) || !call}
|
|
53
52
|
onClick={async () => {
|
|
54
53
|
if (
|
|
55
54
|
!hasPermission &&
|
|
56
|
-
call
|
|
55
|
+
call?.permissionsContext.canRequest(OwnCapability.SCREENSHARE)
|
|
57
56
|
) {
|
|
58
57
|
setIsAwaitingApproval(true);
|
|
59
58
|
await call
|
|
@@ -71,10 +70,10 @@ export const ScreenShareButton = ({
|
|
|
71
70
|
console.log(`Can't share screen: ${e}`);
|
|
72
71
|
});
|
|
73
72
|
if (stream) {
|
|
74
|
-
await call
|
|
73
|
+
await call?.publishScreenShareStream(stream);
|
|
75
74
|
}
|
|
76
75
|
} else {
|
|
77
|
-
await call
|
|
76
|
+
await call?.stopPublish(SfuModels.TrackType.SCREEN_SHARE);
|
|
78
77
|
}
|
|
79
78
|
}}
|
|
80
79
|
/>
|
|
@@ -12,10 +12,10 @@ export const PendingCallControls = () => {
|
|
|
12
12
|
return (
|
|
13
13
|
<div className="str-video__pending-call-controls">
|
|
14
14
|
{call.isCreatedByMe ? (
|
|
15
|
-
<CancelCallButton
|
|
15
|
+
<CancelCallButton disabled={buttonsDisabled} />
|
|
16
16
|
) : (
|
|
17
17
|
<>
|
|
18
|
-
<AcceptCallButton
|
|
18
|
+
<AcceptCallButton disabled={buttonsDisabled} />
|
|
19
19
|
<CancelCallButton
|
|
20
20
|
onClick={() => call.leave({ reject: true })}
|
|
21
21
|
disabled={buttonsDisabled}
|
|
@@ -17,8 +17,8 @@ import {
|
|
|
17
17
|
} from '@stream-io/video-react-bindings';
|
|
18
18
|
|
|
19
19
|
import {
|
|
20
|
-
ParticipantView,
|
|
21
20
|
DefaultParticipantViewUI,
|
|
21
|
+
ParticipantView,
|
|
22
22
|
ParticipantViewProps,
|
|
23
23
|
ParticipantViewUIProps,
|
|
24
24
|
} from '../ParticipantView';
|
|
@@ -165,8 +165,8 @@ export const SpeakerLayout = ({
|
|
|
165
165
|
);
|
|
166
166
|
};
|
|
167
167
|
|
|
168
|
-
const hasScreenShare = (p
|
|
169
|
-
p
|
|
168
|
+
const hasScreenShare = (p?: StreamVideoParticipant) =>
|
|
169
|
+
!!p?.publishedTracks.includes(SfuModels.TrackType.SCREEN_SHARE);
|
|
170
170
|
|
|
171
171
|
const loggedIn: Comparator<StreamVideoParticipant> = (a, b) => {
|
|
172
172
|
if (a.isLoggedInUser) return 1;
|