diff --git a/examples/prebuilt-react-integration/package.json b/examples/prebuilt-react-integration/package.json index 643cb76447..0cc5ffc2f6 100644 --- a/examples/prebuilt-react-integration/package.json +++ b/examples/prebuilt-react-integration/package.json @@ -22,6 +22,6 @@ "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.5", - "vite": "^5.0.8" + "vite": "^5.4.11" } } diff --git a/packages/hms-video-store/src/IHMSActions.ts b/packages/hms-video-store/src/IHMSActions.ts index bcfe6dbdbc..9a8d2e9a43 100644 --- a/packages/hms-video-store/src/IHMSActions.ts +++ b/packages/hms-video-store/src/IHMSActions.ts @@ -47,9 +47,9 @@ import { HMSStats } from './webrtc-stats'; * It talks to our 100ms backend and handles error reconnections, state managements * and lots of other things so you don't have to. You can use this gateway with any * sort of UI to make connecting to our backend easier. - * In case you use react, we also provide a HMSProvider class with very powerful hooks - * and out of box components which you can use to setup your website in minutes. Our - * components have in built integration with this interface and you won't have to worry + * In case you use React, we also provide a HMSProvider class with very powerful hooks + * and out of box components which you can use to set up your website in minutes. Our + * components have in built integration with this interface, and you won't have to worry * about passing props if you use them. * * @remarks @@ -59,7 +59,14 @@ import { HMSStats } from './webrtc-stats'; * @category Core */ export interface IHMSActions }> { + /** + * Preview function can be used to preview the camera and microphone before joining the room. + * This function is useful when you want to check and/or modify the camera and microphone settings before joining the Room. + * @param config preview config with camera and microphone devices + * @returns Promise - resolves when the preview is successful + */ preview(config: HMSMidCallPreviewConfig | HMSPreviewConfig): Promise; + /** * join function can be used to join the room, if the room join is successful, * current details of participants and track details are populated in the store. @@ -69,16 +76,20 @@ export interface IHMSActions - resolves when the room is joined */ join(config: HMSConfig): Promise; /** * This function can be used to leave the room, if the call is repeated it's ignored. + * This function also cleans up the store and removes all the tracks and participants. + * @returns Promise - resolves when the room is left */ leave(): Promise; /** * stop tracks fetched during midcall preview and general cleanup + * @returns Promise - resolves when the tracks are stopped */ cancelMidCallPreview(): Promise; @@ -86,8 +97,9 @@ export interface IHMSActions - resolves when the screenshare is enabled */ setScreenShareEnabled(enabled: boolean, config?: HMSScreenShareConfig): Promise; @@ -96,6 +108,7 @@ export interface IHMSActions - resolves when the track is added */ addTrack(track: MediaStreamTrack, type: HMSTrackSource): Promise; @@ -103,6 +116,7 @@ export interface IHMSActions - resolves when the track is removed */ removeTrack(trackId: HMSTrackID): Promise; @@ -118,6 +132,7 @@ export interface IHMSActions - resolves when the message is sent */ sendBroadcastMessage(message: string, type?: string): Promise; /** @@ -125,6 +140,7 @@ export interface IHMSActions - resolves when the message is sent */ sendGroupMessage(message: string, roles: HMSRoleName[], type?: string): Promise; /** @@ -132,6 +148,7 @@ export interface IHMSActions - resolves when the message is sent */ sendDirectMessage(message: string, peerID: HMSPeerID, type?: string): Promise; @@ -150,18 +167,21 @@ export interface IHMSActions - resolves when the audio is enabled */ setLocalAudioEnabled(enabled: boolean): Promise; /** * This function can be used to enable/disable(unmute/mute) local video track * @param enabled boolean - true to unmute, false to mute + * @returns Promise - resolves when the video is enabled */ setLocalVideoEnabled(enabled: boolean): Promise; /** * @param trackId string - ID of the track whose mute status needs to be set * @param enabled boolean - true when we want to unmute the track and false when we want to unmute it + * @returns Promise - resolves when the track is enabled */ setEnabledTrack(trackId: HMSTrackID, enabled: boolean): Promise; @@ -181,6 +201,7 @@ export interface IHMSActions - resolves when the camera is toggled */ switchCamera(): Promise; @@ -191,6 +212,7 @@ export interface IHMSActions - resolves when the video is attached */ attachVideo(localTrackID: HMSTrackID, videoElement: HTMLVideoElement): Promise; @@ -203,13 +225,14 @@ export interface IHMSActions - resolves when the volume is set */ setVolume(value: number, trackId?: HMSTrackID): Promise; /** * Set the audio output(speaker) device * @param deviceId string deviceId of the audio output device + * @returns Promise - resolves when the audio output device is set */ setAudioOutputDevice(deviceId: string): Promise; @@ -217,7 +240,9 @@ export interface IHMSActions - resolves when the layer is set */ setPreferredLayer(trackId: HMSTrackID, layer: HMSPreferredSimulcastLayer): Promise; @@ -293,6 +318,7 @@ export interface IHMSActions - resolves when the role is changed */ changeRoleOfPeer(forPeerId: HMSPeerID, toRole: HMSRoleName, force?: boolean): Promise; @@ -300,12 +326,14 @@ export interface IHMSActions - resolves when the role is changed */ changeRoleOfPeersWithRoles(roles: HMSRoleName[], toRole: HMSRoleName): Promise; /** * Accept the role change request received * @param {HMSRoleChangeRequest} request The original request that was received + * @returns Promise - resolves when the role is accepted */ acceptChangeRole(request: HMSRoleChangeRequest): Promise; @@ -320,12 +348,14 @@ export interface IHMSActions - resolves when the track state is changed */ setRemoteTrackEnabled(forRemoteTrackID: HMSTrackID | HMSTrackID[], enabled: boolean): Promise; /** * Use this to mute/unmute multiple tracks by source, role or type * @param {HMSChangeMultiTrackStateParams} params + * @returns Promise - resolves when the track state is changed */ setRemoteTracksEnabled(params: HMSChangeMultiTrackStateParams): Promise; @@ -334,19 +364,24 @@ export interface IHMSActions - resolves when the autoplay error is resolved */ unblockAudio: () => Promise; /** * If you have the **endRoom** permission, you can end the room. That means everyone will be kicked out. * If lock is passed as true, the room cannot be used further. + * @param lock boolean - true to lock the room + * @param reason string - reason for ending the room + * @returns Promise - resolves when the room is ended */ endRoom: (lock: boolean, reason: string) => Promise; /** * After leave send feedback to backend for call quality purpose. - * @param feedback - * @param eventEndpoint + * @param feedback HMSSessionFeedback - feedback object + * @param eventEndpoint string - endpoint to send feedback + * @returns Promise - resolves when the feedback is submitted */ submitSessionFeedback(feedback: HMSSessionFeedback, eventEndpoint?: string): Promise; @@ -356,6 +391,7 @@ export interface IHMSActions - resolves when the peer is removed */ removePeer(peerID: HMSPeerID, reason: string): Promise; @@ -366,11 +402,13 @@ export interface IHMSActions - resolves when the RTMP streaming and recording is started */ startRTMPOrRecording(params: RTMPRecordingConfig): Promise; /** * If you want to stop both RTMP streaming and recording. + * @returns Promise - resolves when the RTMP streaming and recording is stopped */ stopRTMPAndRecording(): Promise; @@ -379,10 +417,14 @@ export interface IHMSActions - resolves when the HLS streaming is started */ startHLSStreaming(params?: HLSConfig): Promise; /** * If you want to stop HLS streaming. The passed in arguments is not considered at the moment, and everything related to HLS is stopped. + * @param params HLSConfig - HLSConfig object with the required fields + * @returns Promise - resolves when the HLS streaming is stopped */ stopHLSStreaming(params?: HLSConfig): Promise; @@ -399,21 +441,21 @@ export interface IHMSActions; /** - * @alpha * Used to define date range metadata in a media playlist. * This api adds EXT-X-DATERANGE tags to the media playlist. * It is useful for defining timed metadata for interstitial regions such as advertisements, * but can be used to define any timed metadata needed by your stream. - * usage (e.g) + * ```js * const metadataList = `[{ - * payload: "some string 1", - * duration: 2 - * }, - * { - * payload: "some string 2", - * duration: 3 + * payload: "some string 1", + * duration: 2 + * }, + * { + * payload: "some string 2", + * duration: 3 * }]` * sendHLSTimedMetadata(metadataList); + * ``` */ sendHLSTimedMetadata(metadataList: HLSTimedMetadata[]): Promise; @@ -549,13 +591,23 @@ export interface IHMSActions; /** * enable sending audio speaker data to beam - * @alpha + * @returns Promise - resolves when the speaker data is enabled */ enableBeamSpeakerLabelsLogging(): Promise; @@ -567,13 +619,51 @@ export interface IHMSActions; + /** + * interactivityCenter contains all actions that can be performed on the interactivity center + * This will be available after joining the room + */ interactivityCenter: IHMSInteractivityCenter; + /** + * raise hand for local peer + * @returns Promise - resolves when the hand is raised + */ raiseLocalPeerHand(): Promise; + + /** + * lower hand for local peer + * @returns Promise - resolves when the hand is lowered + */ lowerLocalPeerHand(): Promise; + + /** + * raise hand for remote peer + * @param peerId string - ID of the peer + * @returns Promise - resolves when the hand is raised + */ raiseRemotePeerHand(peerId: string): Promise; + + /** + * lower hand for remote peer + * @param peerId string - ID of the peer + * @returns Promise - resolves when the hand is lowered + */ lowerRemotePeerHand(peerId: string): Promise; + + /** + * get the list of peers in the room + * @see https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/large-room + * @param options HMSPeerListIteratorOptions - options for the peer list iterator + * @returns HMSPeerListIterator - iterator for the peer list + */ getPeerListIterator(options?: HMSPeerListIteratorOptions): HMSPeerListIterator; + + /** + * get the peer object by peerId + * @param peerId string - ID of the peer + * @returns Promise - resolves with the peer object + */ getPeer(peerId: string): Promise; findPeerByName(options: FindPeerByNameRequestParams): Promise<{ offset: number; eof?: boolean; peers: HMSPeer[] }>; /** @@ -582,7 +672,11 @@ export interface IHMSActions trackStatsMap ? calculateAverage(Object.values(trackStatsMap), curr => curr.bitrate) : 0, ); - + const audioJitter = getLastElement(this.remoteAudioTrackStatsList)?.jitter || 0; + const videoJitter = getLastElement(this.remoteVideoTrackStatsList)?.jitter || 0; + const jitter = Math.max(audioJitter, videoJitter); const lastLocalAudioTrackStats = getLastElement(this.localAudioTrackStatsList); const lastLocalVideoTrackStats = getLastElement(this.localVideoTrackStatsList); @@ -80,6 +82,7 @@ export class DiagnosticsStatsCollector { bytesReceived: lastSubscribeStats?.bytesReceived || 0, bitrateSent: calculateAverage(this.peerStatsList, curr => curr.publish?.bitrate), bitrateReceived: calculateAverage(this.peerStatsList, curr => curr.subscribe?.bitrate), + jitter: jitter, }, audio: { roundTripTime, @@ -91,6 +94,7 @@ export class DiagnosticsStatsCollector { bytesSent: lastLocalAudioTrackStats ? Object.values(lastLocalAudioTrackStats).reduce((acc, curr) => acc + (curr.bytesSent || 0), 0) : 0, + jitter: audioJitter, }, video: { roundTripTime, @@ -102,6 +106,7 @@ export class DiagnosticsStatsCollector { bytesSent: lastLocalVideoTrackStats ? Object.values(lastLocalVideoTrackStats).reduce((acc, curr) => acc + (curr.bytesSent || 0), 0) : 0, + jitter: videoJitter, }, }; } diff --git a/packages/hms-video-store/src/diagnostics/interfaces.ts b/packages/hms-video-store/src/diagnostics/interfaces.ts index 3a5b1f8dd2..8be0202847 100644 --- a/packages/hms-video-store/src/diagnostics/interfaces.ts +++ b/packages/hms-video-store/src/diagnostics/interfaces.ts @@ -88,4 +88,5 @@ export interface DiagnosticsRTCStats { bitrateSent: number; bitrateReceived: number; roundTripTime: number; + jitter: number; } diff --git a/packages/hms-video-store/src/interfaces/hls-config.ts b/packages/hms-video-store/src/interfaces/hls-config.ts index 9e01885eb8..a4984bc768 100644 --- a/packages/hms-video-store/src/interfaces/hls-config.ts +++ b/packages/hms-video-store/src/interfaces/hls-config.ts @@ -26,8 +26,7 @@ export interface HLSMeetingURLVariant { */ meetingURL: string; /** - * additional metadata for this URL for example - landscape/portrait, the field is not currently supported - * @alpha + * additional metadata for this URL for example - landscape/portrait */ metadata?: string; } diff --git a/packages/hms-video-store/src/interfaces/peer/connection-quality.ts b/packages/hms-video-store/src/interfaces/peer/connection-quality.ts index f51bfaca4e..87cf270922 100644 --- a/packages/hms-video-store/src/interfaces/peer/connection-quality.ts +++ b/packages/hms-video-store/src/interfaces/peer/connection-quality.ts @@ -5,7 +5,6 @@ * experience in the session. * Note that this is not an absolute measure, a bandwidth of 1 MBPs may be good * for a 1:1 call but poor for a large call. - * @alpha */ export interface HMSConnectionQuality { peerID: string; diff --git a/packages/hms-video-store/src/interfaces/room.ts b/packages/hms-video-store/src/interfaces/room.ts index 073851b2f0..37adcfdcea 100644 --- a/packages/hms-video-store/src/interfaces/room.ts +++ b/packages/hms-video-store/src/interfaces/room.ts @@ -80,9 +80,6 @@ export interface HMSHLSRecording { export interface HMSRTMP { running: boolean; - /** - * @alpha - **/ startedAt?: Date; state?: HMSStreamingState; error?: HMSException; diff --git a/packages/hms-video-store/src/interfaces/session-store/interactivity-center.ts b/packages/hms-video-store/src/interfaces/session-store/interactivity-center.ts index a5d413f8f4..7f2d921cdb 100644 --- a/packages/hms-video-store/src/interfaces/session-store/interactivity-center.ts +++ b/packages/hms-video-store/src/interfaces/session-store/interactivity-center.ts @@ -22,6 +22,5 @@ export interface HMSInteractivityCenter { fetchLeaderboard(pollID: string, offset: number, count: number): Promise; getPollResponses(poll: HMSPoll, self: boolean): Promise; getPolls(): Promise; - /** @alpha */ whiteboard: HMSWhiteboardInteractivityCenter; } diff --git a/packages/hms-video-store/src/reactive-store/HMSReactiveStore.ts b/packages/hms-video-store/src/reactive-store/HMSReactiveStore.ts index c6b30175c3..5034df0adc 100644 --- a/packages/hms-video-store/src/reactive-store/HMSReactiveStore.ts +++ b/packages/hms-video-store/src/reactive-store/HMSReactiveStore.ts @@ -72,13 +72,13 @@ export class HMSReactiveStore { if (!this.stats) { this.stats = new HMSStats(this.store as unknown as IHMSStore, this.sdk); diff --git a/packages/hms-video-store/src/schema/schema.ts b/packages/hms-video-store/src/schema/schema.ts index 9e9aa9f664..83786c13d2 100644 --- a/packages/hms-video-store/src/schema/schema.ts +++ b/packages/hms-video-store/src/schema/schema.ts @@ -46,7 +46,6 @@ export interface HMSStore; /** @internal */ hideLocalPeer: boolean; - /** @alpha */ whiteboards: Record; } diff --git a/packages/hms-virtual-background/package.json b/packages/hms-virtual-background/package.json index 0df815ac53..79b754309d 100755 --- a/packages/hms-virtual-background/package.json +++ b/packages/hms-virtual-background/package.json @@ -75,7 +75,7 @@ "@tensorflow/tfjs-core": "^3.19.0", "@webassemblyjs/helper-wasm-bytecode": "1.11.1", "@webassemblyjs/wasm-gen": "1.11.1", - "effects-sdk": "3.2.3", + "effects-sdk": "3.4.3", "gifuct-js": "^2.1.2", "wasm-check": "^2.0.2" }, diff --git a/packages/hms-virtual-background/src/constants.ts b/packages/hms-virtual-background/src/constants.ts index 9c8b8a75da..c81b3a1614 100644 --- a/packages/hms-virtual-background/src/constants.ts +++ b/packages/hms-virtual-background/src/constants.ts @@ -1 +1 @@ -export const EFFECTS_SDK_ASSETS = 'https://assets.100ms.live/effectsdk/3.2.3/'; +export const EFFECTS_SDK_ASSETS = 'https://assets.100ms.live/effectsdk/3.4.3/'; diff --git a/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx b/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx index 4ea61570a0..008d06505f 100644 --- a/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx +++ b/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx @@ -164,6 +164,7 @@ const AudioStats = ({ stats }: { stats: DiagnosticsRTCStats | undefined }) => { + )} @@ -182,6 +183,7 @@ const VideoStats = ({ stats }: { stats: DiagnosticsRTCStats | undefined }) => { + )} diff --git a/packages/roomkit-react/src/Prebuilt/App.tsx b/packages/roomkit-react/src/Prebuilt/App.tsx index 0dc39f3fa6..54754c660f 100644 --- a/packages/roomkit-react/src/Prebuilt/App.tsx +++ b/packages/roomkit-react/src/Prebuilt/App.tsx @@ -1,11 +1,13 @@ import React, { MutableRefObject, useEffect, useRef } from 'react'; -import { HMSStatsStoreWrapper, HMSStoreWrapper, IHMSNotifications } from '@100mslive/hms-video-store'; import { Layout, Logo, Screens, Theme, Typography } from '@100mslive/types-prebuilt'; import { match } from 'ts-pattern'; import { HMSActions, HMSReactiveStore, HMSRoomProvider, + HMSStatsStoreWrapper, + HMSStoreWrapper, + IHMSNotifications, selectIsConnectedToRoom, useHMSActions, useHMSStore, @@ -207,15 +209,15 @@ export const HMSPrebuilt = React.forwardRef