From 5206ac9df5c461070839be53f896e3fa2ea42652 Mon Sep 17 00:00:00 2001 From: Amar Bathwal <110378139+amar-1995@users.noreply.github.com> Date: Tue, 10 Sep 2024 12:54:01 +0530 Subject: [PATCH 01/19] fix: update info message for single peer in a room --- .../Prebuilt/components/VideoLayouts/EqualProminence.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx b/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx index f1a7360395..b492c368e7 100644 --- a/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx @@ -1,5 +1,6 @@ import React, { useEffect, useState } from 'react'; import { useMedia } from 'react-use'; +import { selectPeerCount, useHMSStore } from '@100mslive/react-sdk'; import { PeopleAddIcon } from '@100mslive/react-icons'; import { Flex } from '../../../Layout'; import { config as cssConfig } from '../../../Theme'; @@ -17,6 +18,7 @@ export function EqualProminence({ isInsetEnabled = false, peers, onPageChange, o const isMobile = useMedia(cssConfig.media.md); let maxTileCount = useUISettings(UI_SETTINGS.maxTileCount); maxTileCount = isMobile ? Math.min(maxTileCount, 6) : maxTileCount; + const peerCount = useHMSStore(selectPeerCount); const pageList = usePagesWithTiles({ peers, maxTileCount, @@ -51,8 +53,8 @@ export function EqualProminence({ isInsetEnabled = false, peers, onPageChange, o )} {pageList.length === 0 ? ( } /> ) : null} From 736f30c4c6845d75a97a937b0e71533201a2ebf6 Mon Sep 17 00:00:00 2001 From: "Eswar Prasad Clinton. A" <64120992+eswarclynn@users.noreply.github.com> Date: Tue, 10 Sep 2024 13:22:25 +0530 Subject: [PATCH 02/19] feat: mweb enhancements (#3229) --- .../src/media/tracks/HMSLocalAudioTrack.ts | 4 +-- .../Notifications/TrackUnmuteModal.tsx | 2 +- .../Prebuilt/components/ScreenshareTile.tsx | 4 +-- .../components/Settings/SettingsModal.jsx | 3 +-- .../Prebuilt/components/TileMenu/TileMenu.tsx | 13 ++++----- .../components/TileMenu/TileMenuContent.tsx | 6 ++--- .../src/Prebuilt/components/VideoTile.tsx | 4 +-- .../{peerTileUtils.jsx => peerTileUtils.tsx} | 27 ++++++++++++++----- 8 files changed, 39 insertions(+), 24 deletions(-) rename packages/roomkit-react/src/Prebuilt/components/{peerTileUtils.jsx => peerTileUtils.tsx} (53%) diff --git a/packages/hms-video-store/src/media/tracks/HMSLocalAudioTrack.ts b/packages/hms-video-store/src/media/tracks/HMSLocalAudioTrack.ts index 6446ab825b..b97efa49cd 100644 --- a/packages/hms-video-store/src/media/tracks/HMSLocalAudioTrack.ts +++ b/packages/hms-video-store/src/media/tracks/HMSLocalAudioTrack.ts @@ -184,8 +184,8 @@ export class HMSLocalAudioTrack extends HMSAudioTrack { return; } - // Replace silent empty track with an actual audio track, if enabled. - if (value && isEmptyTrack(this.nativeTrack)) { + // Replace silent empty track or muted track(happens when microphone is disabled from address bar in iOS) with an actual audio track, if enabled. + if (value && (isEmptyTrack(this.nativeTrack) || this.nativeTrack.muted)) { await this.replaceTrackWith(this.settings); } await super.setEnabled(value); diff --git a/packages/roomkit-react/src/Prebuilt/components/Notifications/TrackUnmuteModal.tsx b/packages/roomkit-react/src/Prebuilt/components/Notifications/TrackUnmuteModal.tsx index f43d2bd1c6..3b0cce23bd 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Notifications/TrackUnmuteModal.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/Notifications/TrackUnmuteModal.tsx @@ -44,7 +44,7 @@ export const TrackUnmuteModal = () => { !value && setMuteNotification(null)} - body={`${peer?.name}is requesting you to unmute your ${track?.type}.`} + body={`${peer?.name} is requesting you to unmute your ${track?.type}.`} onAction={() => { hmsActions.setEnabledTrack(track.id, enabled); setMuteNotification(null); diff --git a/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx b/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx index 7638300a91..3364c8a3f7 100644 --- a/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx @@ -16,7 +16,6 @@ import { config as cssConfig, useTheme } from '../../Theme'; import { Video } from '../../Video'; import { StyledVideoTile } from '../../VideoTile'; import { LayoutModeSelector } from './LayoutModeSelector'; -// @ts-ignore: No implicit Any import { getVideoTileLabel } from './peerTileUtils'; import { ScreenshareDisplay } from './ScreenshareDisplay'; // @ts-ignore: No implicit Any @@ -62,7 +61,8 @@ const Tile = ({ peerId, width = '100%', height = '100%' }: { peerId: string; wid const label = getVideoTileLabel({ peerName: peer?.name, isLocal: false, - track, + videoTrack: track, + audioTrack, }); return ( diff --git a/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx b/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx index bfe340da22..76d0abd72f 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/Settings/SettingsModal.jsx @@ -140,7 +140,6 @@ const MobileSettingModal = ({ setShowNameChangeModal(true); const openRoleChangeModal = () => setShowRoleChangeModal(true); - const props = { + const props: React.ComponentPropsWithoutRef = { isLocal, isScreenshare, audioTrackID, videoTrackID, peerID, - isPrimaryVideoTrack, showSpotlight, showPinAction, canMinimise, @@ -111,8 +113,7 @@ const TileMenu = ({ > - {peer?.name} - {isLocal ? ` (You)` : null} + {getVideoTileLabel({ peerName: peer?.name, isLocal, audioTrack, videoTrack: track })} {peer?.roleName ? ( diff --git a/packages/roomkit-react/src/Prebuilt/components/TileMenu/TileMenuContent.tsx b/packages/roomkit-react/src/Prebuilt/components/TileMenu/TileMenuContent.tsx index f61282bfd0..987280ddf4 100644 --- a/packages/roomkit-react/src/Prebuilt/components/TileMenu/TileMenuContent.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/TileMenu/TileMenuContent.tsx @@ -41,7 +41,7 @@ import { useSetAppDataByKey } from '../AppData/useUISettings'; // @ts-ignore import { useDropdownSelection } from '../hooks/useDropdownSelection'; import { getDragClassName } from './utils'; -import { APP_DATA, REMOTE_STOP_SCREENSHARE_TYPE, SESSION_STORE_KEY } from '../../common/constants'; +import { APP_DATA, isIOS, REMOTE_STOP_SCREENSHARE_TYPE, SESSION_STORE_KEY } from '../../common/constants'; export const isSameTile = ({ trackId, @@ -317,7 +317,7 @@ export const TileMenuContent = ({ ) : null} - {canChangeRole && roles.length > 1 ? ( + {!isScreenshare && canChangeRole && roles.length > 1 ? ( ) : null} - {audioTrackID ? ( + {!isIOS && audioTrackID ? ( diff --git a/packages/roomkit-react/src/Prebuilt/components/VideoTile.tsx b/packages/roomkit-react/src/Prebuilt/components/VideoTile.tsx index 1cfbc16d10..850dd4fed1 100644 --- a/packages/roomkit-react/src/Prebuilt/components/VideoTile.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/VideoTile.tsx @@ -20,7 +20,6 @@ import { VideoTileStats } from '../../Stats'; import { CSS } from '../../Theme'; import { Video } from '../../Video'; import { StyledVideoTile } from '../../VideoTile'; -// @ts-ignore: No implicit Any import { getVideoTileLabel } from './peerTileUtils'; // @ts-ignore: No implicit Any import { useSetAppDataByKey, useUISettings } from './AppData/useUISettings'; @@ -101,8 +100,9 @@ const Tile = ({ }); const label = getVideoTileLabel({ peerName, - track, isLocal, + videoTrack: track, + audioTrack, }); const onHoverHandler = useCallback((event: React.MouseEvent) => { setIsMouseHovered(event.type === 'mouseenter'); diff --git a/packages/roomkit-react/src/Prebuilt/components/peerTileUtils.jsx b/packages/roomkit-react/src/Prebuilt/components/peerTileUtils.tsx similarity index 53% rename from packages/roomkit-react/src/Prebuilt/components/peerTileUtils.jsx rename to packages/roomkit-react/src/Prebuilt/components/peerTileUtils.tsx index 456f25bb62..e5cc9cf715 100644 --- a/packages/roomkit-react/src/Prebuilt/components/peerTileUtils.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/peerTileUtils.tsx @@ -1,4 +1,8 @@ +import { HMSAudioTrack, HMSVideoTrack } from '@100mslive/react-sdk'; + const PEER_NAME_PLACEHOLDER = 'peerName'; + +// Map [isLocal, videoSource] to the label to be displayed. const labelMap = new Map([ [[true, 'screen'].toString(), 'Your Screen'], [[true, 'regular'].toString(), `You (${PEER_NAME_PLACEHOLDER})`], @@ -8,19 +12,30 @@ const labelMap = new Map([ [[false, undefined].toString(), `${PEER_NAME_PLACEHOLDER}`], ]); -export const getVideoTileLabel = ({ peerName, isLocal, track }) => { +export const getVideoTileLabel = ({ + peerName, + isLocal, + videoTrack, + audioTrack, +}: { + isLocal: boolean; + peerName?: string; + videoTrack?: HMSVideoTrack | null; + audioTrack?: HMSAudioTrack | null; +}) => { const isPeerPresent = peerName !== undefined; - if (!isPeerPresent || !track) { + if (!isPeerPresent || !videoTrack) { // for peers with only audio track - return isPeerPresent ? labelMap.get([isLocal, undefined].toString()).replace(PEER_NAME_PLACEHOLDER, peerName) : ''; + const label = labelMap.get([isLocal, undefined].toString()); + return isPeerPresent && label ? label.replace(PEER_NAME_PLACEHOLDER, peerName) : ''; } - const isLocallyMuted = track.volume === 0; + const isLocallyMuted = audioTrack?.volume === 0; // Map [isLocal, videoSource] to the label to be displayed. - let label = labelMap.get([isLocal, track.source].toString()); + let label = labelMap.get([isLocal, videoTrack.source].toString()); if (label) { label = label.replace(PEER_NAME_PLACEHOLDER, peerName); } else { - label = `${peerName} ${track.source}`; + label = `${peerName} ${videoTrack.source}`; } // label = `${label}${track.degraded ? '(Degraded)' : ''}`; return `${label}${isLocallyMuted ? ' (Muted for you)' : ''}`; From ce02ca1122536acfa5f7975b8e7a8b62e35b52ef Mon Sep 17 00:00:00 2001 From: Kaustubh Kumar Date: Fri, 13 Sep 2024 14:22:16 +0530 Subject: [PATCH 03/19] fix: change name UI for mweb (#3261) --- .../MoreSettings/ChangeNameContent.tsx | 16 +++++++++++++--- .../components/MoreSettings/ChangeNameModal.tsx | 2 +- 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameContent.tsx b/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameContent.tsx index 51a7c03b40..c775e08a69 100644 --- a/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameContent.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameContent.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useEffect, useRef } from 'react'; import { ChevronLeftIcon, CrossIcon } from '@100mslive/react-icons'; import { Button } from '../../../Button'; import { Input } from '../../../Input'; @@ -22,6 +22,16 @@ export const ChangeNameContent = ({ onExit: () => void; onBackClick: () => void; }) => { + const inputRef = useRef(null); + + useEffect(() => { + if (isMobile) { + setTimeout(() => { + inputRef.current?.focus(); + }, 200); + } + }, [isMobile]); + return (
{ @@ -53,10 +63,10 @@ export const ChangeNameContent = ({ { setCurrentName(e.target.value); }} diff --git a/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameModal.tsx b/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameModal.tsx index bf5b7c5538..e094252369 100644 --- a/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameModal.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/MoreSettings/ChangeNameModal.tsx @@ -58,7 +58,7 @@ export const ChangeNameModal = ({ if (isMobile) { return ( - + e.preventDefault()}> From 18bd80791cedd2f39788012fa05ab1293b4c4a14 Mon Sep 17 00:00:00 2001 From: Kaustubh Kumar Date: Fri, 13 Sep 2024 14:22:30 +0530 Subject: [PATCH 04/19] fix: use forked roomkit-react as a dependency (#3240) --- README.md | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/README.md b/README.md index e02d38ae5a..c7c247dcd9 100644 --- a/README.md +++ b/README.md @@ -113,6 +113,34 @@ Once the app has been deployed, you can append the room code at the end of the d
+### Maintaining A Forked Version + +Tthe following command will build the roomkit-react package and generate a .tgz file: + +``` +yarn && yarn build; +cd packages/roomkit-react; +yarn pack +``` + +Push your changes and the .tgz file to the forked repository and in the package.json of the app you are building, use the following link for the roomkit-react package: + +``` +"@100mslive/roomkit-react":"https://github.com//web-sdks/raw/main/packages/roomkit-react/.tgz", +``` + +Re-install the dependencies after updating the package.json and build using the following command: + +``` +yarn && yarn build +``` + +You can now import the HMSPrebuilt component in the same way as before: + +``` +import { HMSPrebuilt } from '@100mslive/roomkit-react'; +``` + ## Contributing We welcome external contributors or anyone excited to help improve 100ms SDKs. If you'd like to get involved, check out our [contribution guide](./DEVELOPER.MD), and get started exploring the codebase. From 62491d41f8e3c2b8f79d1c55071c1b4d5f8f279e Mon Sep 17 00:00:00 2001 From: Amar Bathwal <110378139+amar-1995@users.noreply.github.com> Date: Fri, 13 Sep 2024 16:32:11 +0530 Subject: [PATCH 05/19] fix: added prod event endpoint --- packages/roomkit-react/src/Prebuilt/App.tsx | 10 +++++----- packages/roomkit-react/src/Prebuilt/AppContext.tsx | 2 +- .../src/Prebuilt/components/AuthToken.tsx | 2 +- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/roomkit-react/src/Prebuilt/App.tsx b/packages/roomkit-react/src/Prebuilt/App.tsx index 94379b53c8..8010a58115 100644 --- a/packages/roomkit-react/src/Prebuilt/App.tsx +++ b/packages/roomkit-react/src/Prebuilt/App.tsx @@ -143,10 +143,10 @@ export const HMSPrebuilt = React.forwardRef = { logo, @@ -288,7 +288,7 @@ function AppRoutes({ authTokenByRoomCodeEndpoint, defaultAuthToken, }: { - authTokenByRoomCodeEndpoint: string; + authTokenByRoomCodeEndpoint?: string; defaultAuthToken?: string; }) { const roomLayout = useRoomLayout(); diff --git a/packages/roomkit-react/src/Prebuilt/AppContext.tsx b/packages/roomkit-react/src/Prebuilt/AppContext.tsx index 0f8a093fae..8405d2a776 100644 --- a/packages/roomkit-react/src/Prebuilt/AppContext.tsx +++ b/packages/roomkit-react/src/Prebuilt/AppContext.tsx @@ -7,7 +7,7 @@ type HMSPrebuiltContextType = { userName?: string; userId?: string; containerSelector: string; - endpoints?: Record; + endpoints?: Record; onLeave?: () => void; onJoin?: () => void; }; diff --git a/packages/roomkit-react/src/Prebuilt/components/AuthToken.tsx b/packages/roomkit-react/src/Prebuilt/components/AuthToken.tsx index 7243fe1b59..ed83c3a51b 100644 --- a/packages/roomkit-react/src/Prebuilt/components/AuthToken.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/AuthToken.tsx @@ -25,7 +25,7 @@ import { APP_DATA } from '../common/constants'; * ui_mode=activespeaker => lands in active speaker mode after joining the room */ const AuthToken = React.memo<{ - authTokenByRoomCodeEndpoint: string; + authTokenByRoomCodeEndpoint?: string; defaultAuthToken?: string; activeState?: PrebuiltStates; }>(({ authTokenByRoomCodeEndpoint, defaultAuthToken, activeState }) => { From 3af74400c19818fb60404e519e1d9d597e2c13af Mon Sep 17 00:00:00 2001 From: Amar Bathwal <110378139+amar-1995@users.noreply.github.com> Date: Fri, 13 Sep 2024 16:58:01 +0530 Subject: [PATCH 06/19] fix: make hls player take more space when in fullscreen --- .../src/controllers/HMSHLSPlayer.ts | 2 +- .../Prebuilt/components/HMSVideo/HMSVideo.jsx | 28 ++++++++++++++++--- .../src/Prebuilt/layouts/HLSView.jsx | 7 ++--- 3 files changed, 27 insertions(+), 10 deletions(-) diff --git a/packages/hls-player/src/controllers/HMSHLSPlayer.ts b/packages/hls-player/src/controllers/HMSHLSPlayer.ts index 40cf97b806..18a24f4bdb 100644 --- a/packages/hls-player/src/controllers/HMSHLSPlayer.ts +++ b/packages/hls-player/src/controllers/HMSHLSPlayer.ts @@ -236,7 +236,7 @@ export class HMSHLSPlayer implements IHMSHLSPlayer, IHMSHLSPlayerEventEmitter { }); }; private volumeEventHandler = () => { - this._volume = this._videoEl.volume; + this._volume = Math.round(this._videoEl.volume * 100); }; private reConnectToStream = () => { diff --git a/packages/roomkit-react/src/Prebuilt/components/HMSVideo/HMSVideo.jsx b/packages/roomkit-react/src/Prebuilt/components/HMSVideo/HMSVideo.jsx index 89b123df0d..5ba399c1d4 100644 --- a/packages/roomkit-react/src/Prebuilt/components/HMSVideo/HMSVideo.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/HMSVideo/HMSVideo.jsx @@ -1,7 +1,28 @@ -import React, { forwardRef } from 'react'; +import React, { forwardRef, useEffect, useState } from 'react'; import { Flex } from '../../../Layout'; export const HMSVideo = forwardRef(({ children, ...props }, videoRef) => { + const [width, setWidth] = useState('auto'); + + useEffect(() => { + const updatingVideoWidth = () => { + const videoEl = videoRef.current; + if (!videoEl) { + return; + } + if (videoEl.videoWidth > videoEl.videoHeight && width !== '100%') { + setWidth('100%'); + } + }; + const videoEl = videoRef.current; + if (!videoEl) { + return; + } + videoEl.addEventListener('loadedmetadata', updatingVideoWidth); + return () => { + videoEl.removeEventListener('loadedmetadata', updatingVideoWidth); + }; + }, []); return ( { justifyContent: 'center', transition: 'all 0.3s ease-in-out', '@md': { - height: 'auto', '& video': { - height: '$60 !important', + height: props.isFullScreen ? '' : '$60 !important', }, }, '& video::cue': { @@ -41,7 +61,7 @@ export const HMSVideo = forwardRef(({ children, ...props }, videoRef) => { style={{ margin: '0 auto', objectFit: 'contain', - width: 'auto', + width: width, height: '100%', maxWidth: '100%', }} diff --git a/packages/roomkit-react/src/Prebuilt/layouts/HLSView.jsx b/packages/roomkit-react/src/Prebuilt/layouts/HLSView.jsx index f24ad67b48..a90071082d 100644 --- a/packages/roomkit-react/src/Prebuilt/layouts/HLSView.jsx +++ b/packages/roomkit-react/src/Prebuilt/layouts/HLSView.jsx @@ -485,11 +485,6 @@ const HLSView = () => { css={{ flex: isLandscape ? '2 1 0' : '1 1 0', transition: 'all 0.3s ease-in-out', - '&:fullscreen': { - '& video': { - height: 'unset !important', - }, - }, }} > {hlsViewRef.current && (isMobile || isLandscape) && ( @@ -541,6 +536,7 @@ const HLSView = () => { onMouseMove={onHoverHandler} onMouseLeave={onHoverHandler} onClick={onClickHandler} + isFullScreen={isFullScreen} onDoubleClick={e => { onDoubleClickHandler(e); }} @@ -728,6 +724,7 @@ const HLSView = () => { selection={currentSelectedQuality} onQualityChange={handleQuality} isAuto={isUserSelectedAuto} + containerRef={hlsViewRef.current} /> ) : null} {isFullScreenSupported ? ( From 50cc43edd34a4b139f9d5cce67c97779f13fa467 Mon Sep 17 00:00:00 2001 From: "Eswar Prasad Clinton. A" <64120992+eswarclynn@users.noreply.github.com> Date: Fri, 13 Sep 2024 17:57:28 +0530 Subject: [PATCH 07/19] fix: avatar when coming from background (#3263) Co-authored-by: Ravi theja --- .../src/media/tracks/HMSLocalVideoTrack.ts | 13 ++----------- 1 file changed, 2 insertions(+), 11 deletions(-) diff --git a/packages/hms-video-store/src/media/tracks/HMSLocalVideoTrack.ts b/packages/hms-video-store/src/media/tracks/HMSLocalVideoTrack.ts index de0b4043fa..5e5090ecd8 100644 --- a/packages/hms-video-store/src/media/tracks/HMSLocalVideoTrack.ts +++ b/packages/hms-video-store/src/media/tracks/HMSLocalVideoTrack.ts @@ -566,12 +566,7 @@ export class HMSLocalVideoTrack extends HMSVideoTrack { if (document.visibilityState === 'hidden') { this.enabledStateBeforeBackground = this.enabled; if (this.enabled) { - const track = await this.replaceTrackWithBlank(); - await this.replaceSender(track, this.enabled); - this.nativeTrack?.stop(); - this.nativeTrack = track; - } else { - await this.replaceSender(this.nativeTrack, false); + await this.setEnabled(false); } // started interruption event this.eventBus.analytics.publish( @@ -581,12 +576,9 @@ export class HMSLocalVideoTrack extends HMSVideoTrack { }), ); } else { - HMSLogger.d(this.TAG, 'visibility visibile, restoring track state', this.enabledStateBeforeBackground); + HMSLogger.d(this.TAG, 'visibility visible, restoring track state', this.enabledStateBeforeBackground); if (this.enabledStateBeforeBackground) { await this.setEnabled(true); - } else { - this.nativeTrack.enabled = this.enabledStateBeforeBackground; - await this.replaceSender(this.nativeTrack, this.enabledStateBeforeBackground); } // ended interruption event this.eventBus.analytics.publish( @@ -596,6 +588,5 @@ export class HMSLocalVideoTrack extends HMSVideoTrack { }), ); } - this.eventBus.localVideoEnabled.publish({ enabled: this.nativeTrack.enabled, track: this }); }; } From ab8423a3d2d42fbe7dd454e19b59e6f2a59ccf6b Mon Sep 17 00:00:00 2001 From: Kaustubh Kumar Date: Fri, 13 Sep 2024 18:03:49 +0530 Subject: [PATCH 08/19] fix: disallow requests for none layer (#3260) --- .../subscribe/subscribeConnection.ts | 7 ++- .../hms-video-store/src/interfaces/room.ts | 1 + .../src/media/tracks/HMSRemoteVideoTrack.ts | 9 ++- .../src/media/tracks/RemoteVideoTrack.test.ts | 62 ++++++++++++++++++- .../managers/onDemandTrackManager.ts | 7 ++- .../src/reactive-store/adapter.ts | 1 + packages/hms-video-store/src/schema/room.ts | 1 + .../hms-video-store/src/sdk/models/HMSRoom.ts | 1 + .../hms-video-store/src/signal/init/models.ts | 1 + .../hms-video-store/src/transport/index.ts | 1 + 10 files changed, 85 insertions(+), 6 deletions(-) diff --git a/packages/hms-video-store/src/connection/subscribe/subscribeConnection.ts b/packages/hms-video-store/src/connection/subscribe/subscribeConnection.ts index 3f95f886b2..9120824a24 100644 --- a/packages/hms-video-store/src/connection/subscribe/subscribeConnection.ts +++ b/packages/hms-video-store/src/connection/subscribe/subscribeConnection.ts @@ -98,8 +98,11 @@ export default class HMSSubscribeConnection extends HMSConnection { }); const remote = this.remoteStreams.get(streamId)!; - const TrackCls = e.track.kind === 'audio' ? HMSRemoteAudioTrack : HMSRemoteVideoTrack; - const track = new TrackCls(remote, e.track); + const isAudioTrack = e.track.kind === 'audio'; + const TrackCls = isAudioTrack ? HMSRemoteAudioTrack : HMSRemoteVideoTrack; + const track = isAudioTrack + ? new TrackCls(remote, e.track) + : new TrackCls(remote, e.track, undefined, this.isFlagEnabled(InitFlags.FLAG_DISABLE_NONE_LAYER_REQUEST)); // reset the simulcast layer to none when new video tracks are added, UI will subscribe when required if (e.track.kind === 'video') { remote.setVideoLayerLocally(HMSSimulcastLayer.NONE, 'addTrack', 'subscribeConnection'); diff --git a/packages/hms-video-store/src/interfaces/room.ts b/packages/hms-video-store/src/interfaces/room.ts index aa7ecafefb..073851b2f0 100644 --- a/packages/hms-video-store/src/interfaces/room.ts +++ b/packages/hms-video-store/src/interfaces/room.ts @@ -34,6 +34,7 @@ export interface HMSRoom { max_size?: number; large_room_optimization?: boolean; isEffectsEnabled?: boolean; + disableNoneLayerRequest?: boolean; isVBEnabled?: boolean; effectsKey?: string; isHipaaEnabled?: boolean; diff --git a/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts b/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts index 61581a2c7c..841f4fc378 100644 --- a/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts +++ b/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts @@ -18,9 +18,11 @@ export class HMSRemoteVideoTrack extends HMSVideoTrack { private history = new TrackHistory(); private preferredLayer: HMSPreferredSimulcastLayer = HMSSimulcastLayer.HIGH; private bizTrackId!: string; + private disableNoneLayerRequest = false; - constructor(stream: HMSRemoteStream, track: MediaStreamTrack, source?: string) { + constructor(stream: HMSRemoteStream, track: MediaStreamTrack, source?: string, disableNoneLayerRequest?: boolean) { super(stream, track, source); + this.disableNoneLayerRequest = !!disableNoneLayerRequest; this.setVideoHandler(new VideoElementManager(this)); } @@ -170,7 +172,10 @@ export class HMSRemoteVideoTrack extends HMSVideoTrack { } private async updateLayer(source: string) { - const newLayer = this.degraded || !this.enabled || !this.hasSinks() ? HMSSimulcastLayer.NONE : this.preferredLayer; + const newLayer = + (this.degraded || !this.enabled || !this.hasSinks()) && !this.disableNoneLayerRequest + ? HMSSimulcastLayer.NONE + : this.preferredLayer; if (!this.shouldSendVideoLayer(newLayer, source)) { return; } diff --git a/packages/hms-video-store/src/media/tracks/RemoteVideoTrack.test.ts b/packages/hms-video-store/src/media/tracks/RemoteVideoTrack.test.ts index 33729c1c3b..70fde7a17f 100644 --- a/packages/hms-video-store/src/media/tracks/RemoteVideoTrack.test.ts +++ b/packages/hms-video-store/src/media/tracks/RemoteVideoTrack.test.ts @@ -19,7 +19,7 @@ describe('remoteVideoTrack', () => { const connection = { sendOverApiDataChannelWithResponse } as unknown as HMSSubscribeConnection; stream = new HMSRemoteStream(nativeStream, connection); nativeTrack = { id: trackId, kind: 'video', enabled: true } as MediaStreamTrack; - track = new HMSRemoteVideoTrack(stream, nativeTrack, 'regular'); + track = new HMSRemoteVideoTrack(stream, nativeTrack, 'regular', false); window.MediaStream = jest.fn().mockImplementation(() => ({ addTrack: jest.fn(), // Add any method you want to mock @@ -156,3 +156,63 @@ describe('remoteVideoTrack', () => { expectLayersSent([HMSSimulcastLayer.HIGH, HMSSimulcastLayer.NONE]); }); }); + +describe('HMSRemoteVideoTrack with disableNoneLayerRequest', () => { + let stream: HMSRemoteStream; + let sendOverApiDataChannelWithResponse: jest.Mock; + let track: HMSRemoteVideoTrack; + let nativeTrack: MediaStreamTrack; + let videoElement: HTMLVideoElement; + const trackId = 'test-track-id'; + + beforeEach(() => { + videoElement = document.createElement('video'); + sendOverApiDataChannelWithResponse = jest.fn(); + const connection = { sendOverApiDataChannelWithResponse } as unknown as HMSSubscribeConnection; + const nativeStream = new MediaStream(); + stream = new HMSRemoteStream(nativeStream, connection); + nativeTrack = { id: trackId, kind: 'video', enabled: true } as MediaStreamTrack; + track = new HMSRemoteVideoTrack(stream, nativeTrack, 'regular', true); // disableNoneLayerRequest flag is set + track.setTrackId(trackId); + + window.MediaStream = jest.fn().mockImplementation(() => ({ + addTrack: jest.fn(), + })); + }); + + const expectLayersSent = (layers: HMSSimulcastLayer[]) => { + const allCalls = sendOverApiDataChannelWithResponse.mock.calls; + expect(allCalls.length).toBe(layers.length); + for (let i = 0; i < allCalls.length; i++) { + const data = allCalls[i][0]; + expect(data.params.max_spatial_layer).toBe(layers[i]); + } + }; + + const sfuDegrades = () => { + track.setLayerFromServer({ + subscriber_degraded: true, + expected_layer: HMSSimulcastLayer.HIGH, + current_layer: HMSSimulcastLayer.NONE, + publisher_degraded: false, + track_id: trackId, + }); + }; + + test('disableNoneLayerRequest - degradation', async () => { + await track.addSink(videoElement); + expectLayersSent([HMSSimulcastLayer.HIGH]); + + sfuDegrades(); + expectLayersSent([HMSSimulcastLayer.HIGH]); + }); + + test('disableNoneLayerRequest - mute and removeSink', async () => { + await track.addSink(videoElement); + track.setEnabled(false); + expectLayersSent([HMSSimulcastLayer.HIGH]); + + await track.removeSink(videoElement); + expectLayersSent([HMSSimulcastLayer.HIGH]); + }); +}); diff --git a/packages/hms-video-store/src/notification-manager/managers/onDemandTrackManager.ts b/packages/hms-video-store/src/notification-manager/managers/onDemandTrackManager.ts index 5995d5ca21..d501201a53 100644 --- a/packages/hms-video-store/src/notification-manager/managers/onDemandTrackManager.ts +++ b/packages/hms-video-store/src/notification-manager/managers/onDemandTrackManager.ts @@ -67,7 +67,12 @@ export class OnDemandTrackManager extends TrackManager { const remoteStream = new HMSRemoteStream(new MediaStream(), this.transport.getSubscribeConnection()!); const emptyTrack = LocalTrackManager.getEmptyVideoTrack(); emptyTrack.enabled = !trackInfo.mute; - const track = new HMSRemoteVideoTrack(remoteStream, emptyTrack, trackInfo.source); + const track = new HMSRemoteVideoTrack( + remoteStream, + emptyTrack, + trackInfo.source, + this.store.getRoom()?.disableNoneLayerRequest, + ); track.setTrackId(trackInfo.track_id); track.peerId = hmsPeer.peerId; track.logIdentifier = hmsPeer.name; diff --git a/packages/hms-video-store/src/reactive-store/adapter.ts b/packages/hms-video-store/src/reactive-store/adapter.ts index 245df38a35..c765a4c8b3 100644 --- a/packages/hms-video-store/src/reactive-store/adapter.ts +++ b/packages/hms-video-store/src/reactive-store/adapter.ts @@ -159,6 +159,7 @@ export class SDKToHMS { peerCount: sdkRoom.peerCount, isLargeRoom: sdkRoom.large_room_optimization, isEffectsEnabled: sdkRoom.isEffectsEnabled, + disableNoneLayerRequest: sdkRoom.disableNoneLayerRequest, isVBEnabled: sdkRoom.isVBEnabled, effectsKey: sdkRoom.effectsKey, isHipaaEnabled: sdkRoom.isHipaaEnabled, diff --git a/packages/hms-video-store/src/schema/room.ts b/packages/hms-video-store/src/schema/room.ts index 92a32a78b3..b14b2dacf5 100644 --- a/packages/hms-video-store/src/schema/room.ts +++ b/packages/hms-video-store/src/schema/room.ts @@ -40,6 +40,7 @@ export interface HMSRoom { peerCount?: number; isLargeRoom?: boolean; isEffectsEnabled?: boolean; + disableNoneLayerRequest?: boolean; isVBEnabled?: boolean; effectsKey?: string; isHipaaEnabled?: boolean; diff --git a/packages/hms-video-store/src/sdk/models/HMSRoom.ts b/packages/hms-video-store/src/sdk/models/HMSRoom.ts index 3438b97867..c23b03e0a9 100644 --- a/packages/hms-video-store/src/sdk/models/HMSRoom.ts +++ b/packages/hms-video-store/src/sdk/models/HMSRoom.ts @@ -16,6 +16,7 @@ export default class Room implements HMSRoom { large_room_optimization?: boolean; transcriptions?: HMSTranscriptionInfo[] = []; isEffectsEnabled?: boolean; + disableNoneLayerRequest?: boolean; isVBEnabled?: boolean; effectsKey?: string; isHipaaEnabled?: boolean; diff --git a/packages/hms-video-store/src/signal/init/models.ts b/packages/hms-video-store/src/signal/init/models.ts index a4a8ca7db5..918c4f80e1 100644 --- a/packages/hms-video-store/src/signal/init/models.ts +++ b/packages/hms-video-store/src/signal/init/models.ts @@ -62,4 +62,5 @@ export enum InitFlags { FLAG_HIPAA_ENABLED = 'hipaa', FLAG_NOISE_CANCELLATION = 'noiseCancellation', FLAG_SCALE_SCREENSHARE_BASED_ON_PIXELS = 'scaleScreenshareBasedOnPixels', + FLAG_DISABLE_NONE_LAYER_REQUEST = 'disableNoneLayerRequest', } diff --git a/packages/hms-video-store/src/transport/index.ts b/packages/hms-video-store/src/transport/index.ts index ade2759a0d..e244dc88b6 100644 --- a/packages/hms-video-store/src/transport/index.ts +++ b/packages/hms-video-store/src/transport/index.ts @@ -1109,6 +1109,7 @@ export default class HMSTransport { if (room) { room.effectsKey = this.initConfig.config.vb?.effectsKey; room.isEffectsEnabled = this.isFlagEnabled(InitFlags.FLAG_EFFECTS_SDK_ENABLED); + room.disableNoneLayerRequest = this.isFlagEnabled(InitFlags.FLAG_DISABLE_NONE_LAYER_REQUEST); room.isVBEnabled = this.isFlagEnabled(InitFlags.FLAG_VB_ENABLED); room.isHipaaEnabled = this.isFlagEnabled(InitFlags.FLAG_HIPAA_ENABLED); room.isNoiseCancellationEnabled = this.isFlagEnabled(InitFlags.FLAG_NOISE_CANCELLATION); From 06d9ae9293dda15e9c2da92aab06f130ac5f732e Mon Sep 17 00:00:00 2001 From: Kaustubh Kumar Date: Fri, 13 Sep 2024 18:46:58 +0530 Subject: [PATCH 09/19] fix: blur support check (#3266) --- .../components/VirtualBackground/VBHandler.tsx | 14 +++++++++++++- .../components/VirtualBackground/VBPicker.tsx | 5 +++-- 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBHandler.tsx b/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBHandler.tsx index 77cd5ccb0c..182f922198 100644 --- a/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBHandler.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBHandler.tsx @@ -2,7 +2,7 @@ // eslint-disable-next-line import { HMSVBPlugin, HMSVirtualBackgroundTypes } from '@100mslive/hms-virtual-background/hmsvbplugin'; import { parsedUserAgent } from '@100mslive/react-sdk'; -import { isSafari } from '../../common/constants'; +import { isIOS, isSafari } from '../../common/constants'; export class VBPlugin { private hmsPlugin?: HMSVBPlugin; private effectsPlugin?: any; @@ -103,6 +103,18 @@ export class VBPlugin { this.hmsPlugin = undefined; }; + isBlurSupported = () => { + if ((isSafari || isIOS) && this.hmsPlugin) { + return false; + } + + if (this.effectsPlugin) { + return true; + } + + return false; + }; + isEffectsSupported = () => { if (!isSafari) { return true; diff --git a/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBPicker.tsx b/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBPicker.tsx index da598f83d6..30a1dc70ad 100644 --- a/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBPicker.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/VirtualBackground/VBPicker.tsx @@ -57,6 +57,7 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac const background = useHMSStore(selectAppData(APP_DATA.background)); const mediaList = backgroundMedia.map((media: VirtualBackgroundMedia) => media.url || ''); const pluginLoadingRef = useRef(false); + const isBlurSupported = VBHandler?.isBlurSupported(); const inPreview = roomState === HMSRoomState.Preview; // Hidden in preview as the effect will be visible in the preview tile @@ -190,7 +191,7 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac await VBHandler?.setBlur(blurAmount); hmsActions.setAppData(APP_DATA.background, HMSVirtualBackgroundTypes.BLUR); }, - supported: isEffectsSupported && isEffectsEnabled, + supported: isBlurSupported, }, ]} activeBackground={background} @@ -198,7 +199,7 @@ export const VBPicker = ({ backgroundMedia = [] }: { backgroundMedia: VirtualBac {/* Slider */} - {background === HMSVirtualBackgroundTypes.BLUR && isEffectsEnabled && effectsKey ? ( + {background === HMSVirtualBackgroundTypes.BLUR && isBlurSupported ? ( Blur intensity From a630529492a8e9ee12a94c0560625edfaeff16e3 Mon Sep 17 00:00:00 2001 From: "Eswar Prasad Clinton. A" <64120992+eswarclynn@users.noreply.github.com> Date: Wed, 18 Sep 2024 12:07:40 +0530 Subject: [PATCH 10/19] fix: retry timeout of 60s for reconnection --- .../src/transport/RetryScheduler.ts | 45 ++++++++++--------- .../hms-video-store/src/transport/index.ts | 4 -- .../hms-video-store/src/utils/constants.ts | 5 +-- 3 files changed, 26 insertions(+), 28 deletions(-) diff --git a/packages/hms-video-store/src/transport/RetryScheduler.ts b/packages/hms-video-store/src/transport/RetryScheduler.ts index 8695e5a577..0feaf8c006 100644 --- a/packages/hms-video-store/src/transport/RetryScheduler.ts +++ b/packages/hms-video-store/src/transport/RetryScheduler.ts @@ -1,7 +1,7 @@ import { Dependencies as TFCDependencies, TransportFailureCategory as TFC } from './models/TransportFailureCategory'; import { TransportState } from './models/TransportState'; import { HMSException } from '../error/HMSException'; -import { MAX_TRANSPORT_RETRIES, MAX_TRANSPORT_RETRY_DELAY } from '../utils/constants'; +import { MAX_TRANSPORT_RETRY_TIME } from '../utils/constants'; import HMSLogger from '../utils/logger'; import { PromiseWithCallbacks } from '../utils/promise'; @@ -23,7 +23,7 @@ interface ScheduleTaskParams { error: HMSException; task: RetryTask; originalState: TransportState; - maxFailedRetries?: number; + maxRetryTime?: number; changeState?: boolean; } @@ -42,10 +42,10 @@ export class RetryScheduler { error, task, originalState, - maxFailedRetries = MAX_TRANSPORT_RETRIES, + maxRetryTime = MAX_TRANSPORT_RETRY_TIME, changeState = true, }: ScheduleTaskParams) { - await this.scheduleTask({ category, error, changeState, task, originalState, maxFailedRetries }); + await this.scheduleTask({ category, error, changeState, task, originalState, maxRetryTime, failedAt: Date.now() }); } reset() { @@ -65,9 +65,10 @@ export class RetryScheduler { changeState, task, originalState, - maxFailedRetries = MAX_TRANSPORT_RETRIES, + failedAt, + maxRetryTime = MAX_TRANSPORT_RETRY_TIME, failedRetryCount = 0, - }: ScheduleTaskParams & { failedRetryCount?: number }): Promise { + }: ScheduleTaskParams & { failedAt: number; failedRetryCount?: number }): Promise { HMSLogger.d(this.TAG, 'schedule: ', { category: TFC[category], error }); // First schedule call @@ -113,8 +114,9 @@ export class RetryScheduler { } } - if (failedRetryCount >= maxFailedRetries || hasFailedDependency) { - error.description += `. [${TFC[category]}] Could not recover after ${failedRetryCount} tries`; + const timeElapsedSinceError = Date.now() - failedAt; + if (timeElapsedSinceError >= maxRetryTime || hasFailedDependency) { + error.description += `. [${TFC[category]}] Could not recover after ${timeElapsedSinceError} milliseconds`; if (hasFailedDependency) { error.description += ` Could not recover all of it's required dependencies - [${(dependencies as Array) @@ -144,7 +146,7 @@ export class RetryScheduler { this.onStateChange(TransportState.Reconnecting, error); } - const delay = this.getDelayForRetryCount(category, failedRetryCount); + const delay = this.getDelayForRetryCount(category); HMSLogger.d( this.TAG, @@ -171,7 +173,10 @@ export class RetryScheduler { if (changeState && this.inProgress.size === 0) { this.onStateChange(originalState); } - HMSLogger.d(this.TAG, `schedule: [${TFC[category]}] [failedRetryCount=${failedRetryCount}] Recovered ♻️`); + HMSLogger.d( + this.TAG, + `schedule: [${TFC[category]}] [failedRetryCount=${failedRetryCount}] Recovered ♻️ after ${timeElapsedSinceError}ms`, + ); } else { await this.scheduleTask({ category, @@ -179,25 +184,23 @@ export class RetryScheduler { changeState, task, originalState, - maxFailedRetries, + maxRetryTime, + failedAt, failedRetryCount: failedRetryCount + 1, }); } } - private getBaseDelayForTask(category: TFC, n: number) { + private getDelayForRetryCount(category: TFC) { + const jitter = category === TFC.JoinWSMessageFailed ? Math.random() * 2 : Math.random(); + let delaySeconds = 0; if (category === TFC.JoinWSMessageFailed) { // linear backoff(2 + jitter for every retry) - return 2; + delaySeconds = 2 + jitter; + } else if (category === TFC.SignalDisconnect) { + delaySeconds = 1; } - // exponential backoff - return Math.pow(2, n); - } - - private getDelayForRetryCount(category: TFC, n: number) { - const delay = this.getBaseDelayForTask(category, n); - const jitter = category === TFC.JoinWSMessageFailed ? Math.random() * 2 : Math.random(); - return Math.round(Math.min(delay + jitter, MAX_TRANSPORT_RETRY_DELAY) * 1000); + return delaySeconds * 1000; } private async setTimeoutPromise(task: () => Promise, delay: number): Promise { diff --git a/packages/hms-video-store/src/transport/index.ts b/packages/hms-video-store/src/transport/index.ts index e244dc88b6..11b418a416 100644 --- a/packages/hms-video-store/src/transport/index.ts +++ b/packages/hms-video-store/src/transport/index.ts @@ -36,7 +36,6 @@ import { ISignalEventsObserver } from '../signal/ISignalEventsObserver'; import JsonRpcSignal from '../signal/jsonrpc'; import { ICE_DISCONNECTION_TIMEOUT, - MAX_TRANSPORT_RETRIES, PROTOCOL_SPEC, PROTOCOL_VERSION, PUBLISH_STATS_PUSH_INTERVAL, @@ -352,7 +351,6 @@ export default class HMSTransport { error, task, originalState: this.state, - maxFailedRetries: MAX_TRANSPORT_RETRIES, changeState: false, }); } else { @@ -923,7 +921,6 @@ export default class HMSTransport { error: hmsError, task, originalState: TransportState.Joined, - maxFailedRetries: 3, changeState: false, }); } else { @@ -1087,7 +1084,6 @@ export default class HMSTransport { error, task: this.retrySubscribeIceFailedTask, originalState: TransportState.Joined, - maxFailedRetries: 1, }); } } diff --git a/packages/hms-video-store/src/utils/constants.ts b/packages/hms-video-store/src/utils/constants.ts index 4e9632bc96..5f237a85d3 100644 --- a/packages/hms-video-store/src/utils/constants.ts +++ b/packages/hms-video-store/src/utils/constants.ts @@ -3,13 +3,12 @@ export const API_DATA_CHANNEL = 'ion-sfu'; export const ANALYTICS_BUFFER_SIZE = 100; /** - * Maximum number of retries that transport-layer will try + * Maximum time that transport-layer will try * before giving up on the connection and returning a failure * * Refer https://100ms.atlassian.net/browse/HMS-2369 */ -export const MAX_TRANSPORT_RETRIES = 5; -export const MAX_TRANSPORT_RETRY_DELAY = 60; +export const MAX_TRANSPORT_RETRY_TIME = 60_000; export const DEFAULT_SIGNAL_PING_TIMEOUT = 12_000; export const DEFAULT_SIGNAL_PING_INTERVAL = 3_000; From fabc234e709aeccc9a8ee5dddcf893ed651c9940 Mon Sep 17 00:00:00 2001 From: Ravi theja Date: Wed, 18 Sep 2024 12:10:36 +0530 Subject: [PATCH 11/19] feat: apply policy settings tracks added via addTrack --- packages/hms-video-store/src/sdk/index.ts | 46 ++++++++++++++++++- .../hms-video-store/src/utils/validations.ts | 12 +++++ 2 files changed, 56 insertions(+), 2 deletions(-) diff --git a/packages/hms-video-store/src/sdk/index.ts b/packages/hms-video-store/src/sdk/index.ts index 4bfda90f5e..e0a015a817 100644 --- a/packages/hms-video-store/src/sdk/index.ts +++ b/packages/hms-video-store/src/sdk/index.ts @@ -24,6 +24,7 @@ import { HMSAction } from '../error/HMSAction'; import { HMSException } from '../error/HMSException'; import { EventBus } from '../events/EventBus'; import { + HMSAudioCodec, HMSChangeMultiTrackStateParams, HMSConfig, HMSConnectionQualityListener, @@ -37,6 +38,7 @@ import { HMSRole, HMSRoleChangeRequest, HMSScreenShareConfig, + HMSVideoCodec, TokenRequest, TokenRequestOptions, } from '../interfaces'; @@ -51,6 +53,7 @@ import { RTMPRecordingConfig } from '../interfaces/rtmp-recording-config'; import InitialSettings from '../interfaces/settings'; import { HMSAudioListener, HMSPeerUpdate, HMSTrackUpdate, HMSUpdateListener } from '../interfaces/update-listener'; import { PlaylistManager, TranscriptionConfig } from '../internal'; +import { HMSAudioTrackSettingsBuilder, HMSVideoTrackSettingsBuilder } from '../media/settings'; import { HMSLocalStream } from '../media/streams/HMSLocalStream'; import { HMSLocalAudioTrack, @@ -95,7 +98,7 @@ import HMSLogger, { HMSLogLevel } from '../utils/logger'; import { HMSAudioContextHandler } from '../utils/media'; import { isNode } from '../utils/support'; import { workerSleep } from '../utils/timer-utils'; -import { validateMediaDevicesExistence, validateRTCPeerConnection } from '../utils/validations'; +import { validateMediaDevicesExistence, validatePublishParams, validateRTCPeerConnection } from '../utils/validations'; const INITIAL_STATE = { published: false, @@ -954,7 +957,8 @@ export class HMSSdk implements HMSInterface { const TrackKlass = type === 'audio' ? HMSLocalAudioTrack : HMSLocalVideoTrack; const hmsTrack = new TrackKlass(stream, track, source, this.eventBus); - this.setPlaylistSettings({ + await this.applySettings(hmsTrack); + await this.setPlaylistSettings({ track, hmsTrack, source, @@ -1603,4 +1607,42 @@ export class HMSSdk implements HMSInterface { this.playlistManager.stop(HMSPlaylistType.video); } } + + // eslint-disable-next-line complexity + private async applySettings(track: HMSLocalTrack) { + validatePublishParams(this.store); + const publishParams = this.store.getPublishParams(); + // this is not needed but added for avoiding ? later + if (!publishParams) { + return; + } + if (track instanceof HMSLocalVideoTrack) { + const publishKey = track.source === 'regular' ? 'video' : track.source === 'screen' ? 'screen' : ''; + if (!publishKey || !publishParams.allowed.includes(publishKey)) { + return; + } + const video = publishParams[publishKey]; + if (!video) { + return; + } + const settings = new HMSVideoTrackSettingsBuilder() + .codec(video.codec as HMSVideoCodec) + .maxBitrate(video.bitRate) + .maxFramerate(video.frameRate) + .setWidth(video.width) + .setHeight(video.height) + .build(); + + await track.setSettings(settings); + } else if (track instanceof HMSLocalAudioTrack) { + if (!publishParams.allowed.includes('audio')) { + return; + } + const settings = new HMSAudioTrackSettingsBuilder() + .codec(publishParams.audio.codec as HMSAudioCodec) + .maxBitrate(publishParams.audio.bitRate) + .build(); + await track.setSettings(settings); + } + } } diff --git a/packages/hms-video-store/src/utils/validations.ts b/packages/hms-video-store/src/utils/validations.ts index fc75902e44..a1a1824c16 100644 --- a/packages/hms-video-store/src/utils/validations.ts +++ b/packages/hms-video-store/src/utils/validations.ts @@ -1,5 +1,7 @@ import HMSLogger from './logger'; import { ErrorFactory } from '../error/ErrorFactory'; +import { HMSAction } from '../error/HMSAction'; +import { Store } from '../sdk/store'; const TAG = `[VALIDATIONS]`; @@ -32,3 +34,13 @@ export const validateMediaDevicesExistence = () => { throw error; } }; + +export const validatePublishParams = (store: Store) => { + const publishParams = store.getPublishParams(); + if (!publishParams) { + throw ErrorFactory.GenericErrors.NotConnected( + HMSAction.VALIDATION, + 'call addTrack after preview or join is successful', + ); + } +}; From 8c79ee46e16f9d90b100953ae0989848015cc5cc Mon Sep 17 00:00:00 2001 From: Ravi theja Date: Thu, 19 Sep 2024 12:20:39 +0530 Subject: [PATCH 12/19] Merge main to dev --- examples/prebuilt-react-integration/README.md | 2 +- .../prebuilt-react-integration/package.json | 2 +- packages/hls-player/package.json | 4 +-- packages/hls-stats/package.json | 2 +- packages/hms-video-store/package.json | 2 +- packages/hms-virtual-background/package.json | 6 ++-- packages/hms-whiteboard/package.json | 2 +- packages/react-icons/package.json | 2 +- packages/react-sdk/package.json | 4 +-- packages/roomkit-react/package.json | 12 +++---- packages/roomkit-web/package.json | 4 +-- yarn.lock | 31 ++----------------- 12 files changed, 24 insertions(+), 49 deletions(-) diff --git a/examples/prebuilt-react-integration/README.md b/examples/prebuilt-react-integration/README.md index a4ee892a36..c0ba926c6d 100644 --- a/examples/prebuilt-react-integration/README.md +++ b/examples/prebuilt-react-integration/README.md @@ -4,7 +4,7 @@ ### How to run locally? -- Run `yarn build` at the root level of the repo. +- Run `yarn && yarn build` at the root level of the repo (./web-sdks) - Then, navigate to this folder and run `yarn dev` ### Facing a problem? diff --git a/examples/prebuilt-react-integration/package.json b/examples/prebuilt-react-integration/package.json index ed6de5ef5c..d42595fd1b 100644 --- a/examples/prebuilt-react-integration/package.json +++ b/examples/prebuilt-react-integration/package.json @@ -10,7 +10,7 @@ "preview": "vite preview" }, "dependencies": { - "@100mslive/roomkit-react": "0.3.19", + "@100mslive/roomkit-react": "0.3.20", "react": "^18.2.0", "react-dom": "^18.2.0" }, diff --git a/packages/hls-player/package.json b/packages/hls-player/package.json index aef1341044..31993c800e 100644 --- a/packages/hls-player/package.json +++ b/packages/hls-player/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/hls-player", - "version": "0.3.19", + "version": "0.3.20", "description": "HLS client library which uses HTML5 Video element and Media Source Extension for playback", "main": "dist/index.cjs.js", "module": "dist/index.js", @@ -36,7 +36,7 @@ "author": "100ms", "license": "MIT", "dependencies": { - "@100mslive/hls-stats": "0.4.19", + "@100mslive/hls-stats": "0.4.20", "eventemitter2": "^6.4.9", "hls.js": "1.4.12" } diff --git a/packages/hls-stats/package.json b/packages/hls-stats/package.json index 22693113c2..43a02194e3 100644 --- a/packages/hls-stats/package.json +++ b/packages/hls-stats/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/hls-stats", - "version": "0.4.19", + "version": "0.4.20", "description": "A simple library that provides stats for your hls stream", "main": "dist/index.cjs.js", "module": "dist/index.js", diff --git a/packages/hms-video-store/package.json b/packages/hms-video-store/package.json index 4de8b79e14..5feeb58a55 100644 --- a/packages/hms-video-store/package.json +++ b/packages/hms-video-store/package.json @@ -1,5 +1,5 @@ { - "version": "0.12.19", + "version": "0.12.20", "license": "MIT", "repository": { "type": "git", diff --git a/packages/hms-virtual-background/package.json b/packages/hms-virtual-background/package.json index db95e6229e..7e4aef1d06 100755 --- a/packages/hms-virtual-background/package.json +++ b/packages/hms-virtual-background/package.json @@ -1,5 +1,5 @@ { - "version": "1.13.19", + "version": "1.13.20", "license": "MIT", "name": "@100mslive/hms-virtual-background", "author": "100ms", @@ -62,10 +62,10 @@ "format": "prettier --write src/**/*.ts" }, "peerDependencies": { - "@100mslive/hms-video-store": "0.12.19" + "@100mslive/hms-video-store": "0.12.20" }, "devDependencies": { - "@100mslive/hms-video-store": "0.12.19" + "@100mslive/hms-video-store": "0.12.20" }, "dependencies": { "@mediapipe/selfie_segmentation": "^0.1.1632777926", diff --git a/packages/hms-whiteboard/package.json b/packages/hms-whiteboard/package.json index 16cefb5a0b..1d28822d5d 100644 --- a/packages/hms-whiteboard/package.json +++ b/packages/hms-whiteboard/package.json @@ -2,7 +2,7 @@ "name": "@100mslive/hms-whiteboard", "author": "100ms", "license": "MIT", - "version": "0.0.9", + "version": "0.0.10", "main": "dist/index.cjs.js", "module": "dist/index.js", "types": "dist/index.d.ts", diff --git a/packages/react-icons/package.json b/packages/react-icons/package.json index 36b2f3f81d..5e92a12522 100644 --- a/packages/react-icons/package.json +++ b/packages/react-icons/package.json @@ -4,7 +4,7 @@ "main": "dist/index.cjs.js", "module": "dist/index.js", "typings": "dist/index.d.ts", - "version": "0.10.19", + "version": "0.10.20", "author": "100ms", "license": "MIT", "repository": { diff --git a/packages/react-sdk/package.json b/packages/react-sdk/package.json index d11b5e48e4..36dccbbf5f 100644 --- a/packages/react-sdk/package.json +++ b/packages/react-sdk/package.json @@ -4,7 +4,7 @@ "main": "dist/index.cjs.js", "module": "dist/index.js", "typings": "dist/index.d.ts", - "version": "0.10.19", + "version": "0.10.20", "author": "100ms", "license": "MIT", "repository": { @@ -48,7 +48,7 @@ "react": ">=16.8 <19.0.0" }, "dependencies": { - "@100mslive/hms-video-store": "0.12.19", + "@100mslive/hms-video-store": "0.12.20", "react-resize-detector": "^7.0.0", "zustand": "^3.6.2" } diff --git a/packages/roomkit-react/package.json b/packages/roomkit-react/package.json index 6088afa43c..64143afab3 100644 --- a/packages/roomkit-react/package.json +++ b/packages/roomkit-react/package.json @@ -10,7 +10,7 @@ "prebuilt", "roomkit" ], - "version": "0.3.19", + "version": "0.3.20", "author": "100ms", "license": "MIT", "repository": { @@ -75,12 +75,12 @@ "react": ">=17.0.2 <19.0.0" }, "dependencies": { - "@100mslive/hls-player": "0.3.19", + "@100mslive/hls-player": "0.3.20", "@100mslive/hms-noise-cancellation": "0.0.1", - "@100mslive/hms-virtual-background": "1.13.19", - "@100mslive/hms-whiteboard": "0.0.9", - "@100mslive/react-icons": "0.10.19", - "@100mslive/react-sdk": "0.10.19", + "@100mslive/hms-virtual-background": "1.13.20", + "@100mslive/hms-whiteboard": "0.0.10", + "@100mslive/react-icons": "0.10.20", + "@100mslive/react-sdk": "0.10.20", "@100mslive/types-prebuilt": "0.12.12", "@emoji-mart/data": "^1.0.6", "@emoji-mart/react": "^1.0.1", diff --git a/packages/roomkit-web/package.json b/packages/roomkit-web/package.json index 59220be296..a505315d10 100644 --- a/packages/roomkit-web/package.json +++ b/packages/roomkit-web/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/roomkit-web", - "version": "0.2.19", + "version": "0.2.20", "description": "A web component implementation of 100ms Prebuilt component", "keywords": [ "web-components", @@ -33,7 +33,7 @@ "build": "rm -rf dist && node ../../scripts/build-webapp" }, "dependencies": { - "@100mslive/roomkit-react": "0.3.19", + "@100mslive/roomkit-react": "0.3.20", "@r2wc/react-to-web-component": "2.0.2" } } diff --git a/yarn.lock b/yarn.lock index 091e434c67..8cb23dcb50 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16534,16 +16534,7 @@ string-natural-compare@^3.0.1: resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4" integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw== -"string-width-cjs@npm:string-width@^4.2.0": - version "4.2.3" - resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" - integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== - dependencies: - emoji-regex "^8.0.0" - is-fullwidth-code-point "^3.0.0" - strip-ansi "^6.0.1" - -"string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0", "string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -16648,14 +16639,7 @@ string_decoder@~1.1.1: dependencies: safe-buffer "~5.1.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1": - version "6.0.1" - resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" - integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== - dependencies: - ansi-regex "^5.0.1" - -strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -18008,7 +17992,7 @@ worker-timers@^7.0.40: worker-timers-broker "^6.0.95" worker-timers-worker "^7.0.59" -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -18026,15 +18010,6 @@ wrap-ansi@^6.0.1, wrap-ansi@^6.2.0: string-width "^4.1.0" strip-ansi "^6.0.0" -wrap-ansi@^7.0.0: - version "7.0.0" - resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" - integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== - dependencies: - ansi-styles "^4.0.0" - string-width "^4.1.0" - strip-ansi "^6.0.0" - wrap-ansi@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214" From 0766552704731855783ed73df642b1c803d8c0cf Mon Sep 17 00:00:00 2001 From: "Eswar Prasad Clinton. A" <64120992+eswarclynn@users.noreply.github.com> Date: Thu, 19 Sep 2024 16:53:00 +0530 Subject: [PATCH 13/19] fix: device label categorisation on prebuilt --- .../src/device-manager/DeviceManager.ts | 12 ++++++------ packages/hms-video-store/src/index.ts | 1 + packages/hms-video-store/src/utils/media.ts | 14 ++++++++++++++ .../src/Prebuilt/components/Header/common.jsx | 8 +++++--- 4 files changed, 26 insertions(+), 9 deletions(-) diff --git a/packages/hms-video-store/src/device-manager/DeviceManager.ts b/packages/hms-video-store/src/device-manager/DeviceManager.ts index 7e3eb32be3..629dd36bc5 100644 --- a/packages/hms-video-store/src/device-manager/DeviceManager.ts +++ b/packages/hms-video-store/src/device-manager/DeviceManager.ts @@ -4,7 +4,7 @@ import { ErrorFactory } from '../error/ErrorFactory'; import { HMSException } from '../error/HMSException'; import { EventBus } from '../events/EventBus'; import { DeviceMap, HMSDeviceChangeEvent, SelectedDevices } from '../interfaces'; -import { isIOS } from '../internal'; +import { getAudioDeviceCategory, isIOS } from '../internal'; import { HMSAudioTrackSettingsBuilder, HMSVideoTrackSettingsBuilder } from '../media/settings'; import { HMSLocalAudioTrack, HMSLocalTrack, HMSLocalVideoTrack } from '../media/tracks'; import { Store } from '../sdk/store'; @@ -443,14 +443,14 @@ export class DeviceManager implements HMSDeviceManager { let earpiece: InputDeviceInfo | null = null; for (const device of this.audioInput) { - const label = device.label.toLowerCase(); - if (label.includes('speakerphone')) { + const deviceCategory = getAudioDeviceCategory(device.label); + if (deviceCategory === 'speakerphone') { speakerPhone = device; - } else if (label.includes('wired')) { + } else if (deviceCategory === 'wired') { wired = device; - } else if (/airpods|buds|wireless|bluetooth/gi.test(label)) { + } else if (deviceCategory === 'bluetooth') { bluetoothDevice = device; - } else if (label.includes('earpiece')) { + } else if (deviceCategory === 'speakerhone') { earpiece = device; } } diff --git a/packages/hms-video-store/src/index.ts b/packages/hms-video-store/src/index.ts index d09d847909..aa36a66403 100644 --- a/packages/hms-video-store/src/index.ts +++ b/packages/hms-video-store/src/index.ts @@ -20,6 +20,7 @@ export { simulcastMapping, DeviceType, HMSPeerType, + getAudioDeviceCategory, } from './internal'; export type { diff --git a/packages/hms-video-store/src/utils/media.ts b/packages/hms-video-store/src/utils/media.ts index 9e669e61aa..c9740bcc0a 100644 --- a/packages/hms-video-store/src/utils/media.ts +++ b/packages/hms-video-store/src/utils/media.ts @@ -63,3 +63,17 @@ export const HMSAudioContextHandler: HMSAudioContext = { } }, }; + +export const getAudioDeviceCategory = (deviceLabel: string) => { + const label = deviceLabel.toLowerCase(); + if (label.includes('speakerphone')) { + return 'speakerhone'; + } else if (label.includes('wired')) { + return 'wired'; + } else if (/airpods|buds|wireless|bluetooth/gi.test(label)) { + return 'bluetooth'; + } else if (label.includes('earpiece')) { + return 'earpiece'; + } + return 'speakerphone'; +}; diff --git a/packages/roomkit-react/src/Prebuilt/components/Header/common.jsx b/packages/roomkit-react/src/Prebuilt/components/Header/common.jsx index 60a7627521..3a36c01ad8 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Header/common.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/Header/common.jsx @@ -1,6 +1,7 @@ import React from 'react'; import { DeviceType, + getAudioDeviceCategory, selectIsLocalVideoEnabled, selectLocalVideoTrackID, selectVideoTrackByID, @@ -78,12 +79,13 @@ export const AudioActions = () => { if (!audioFiltered) { return null; } + const deviceCategory = getAudioDeviceCategory(currentSelection.label); let AudioIcon = ; - if (currentSelection && currentSelection.label.toLowerCase().includes('bluetooth')) { + if (deviceCategory === 'bluetooth') { AudioIcon = ; - } else if (currentSelection && currentSelection.label.toLowerCase().includes('wired')) { + } else if (deviceCategory === 'wired') { AudioIcon = ; - } else if (currentSelection && currentSelection.label.toLowerCase().includes('earpiece')) { + } else if (deviceCategory === 'earpiece') { AudioIcon = ; } return ( From 8ef183aac1b46ae3e5a09ab224cd73d1992d1211 Mon Sep 17 00:00:00 2001 From: ygit Date: Thu, 19 Sep 2024 19:32:26 +0530 Subject: [PATCH 14/19] chore: fix paths specified in Readme --- packages/hms-video-store/README.md | 4 ++-- packages/hms-video-store/src/IHMSActions.ts | 5 +++-- packages/roomkit-react/README.md | 12 ++++++------ packages/roomkit-web/README.md | 2 +- 4 files changed, 12 insertions(+), 11 deletions(-) diff --git a/packages/hms-video-store/README.md b/packages/hms-video-store/README.md index b3f3f333f1..8c37e598cd 100644 --- a/packages/hms-video-store/README.md +++ b/packages/hms-video-store/README.md @@ -34,10 +34,10 @@ you want to do - passed in selector such that whenever the portion changes, the passed in callback is notified. 2. Actions - The actions interface for dispatching actions which in turn may reach out to server and update the store. Check the interface with detailed doc - [here](src/core/IHMSActions.ts). + [here](./src/IHMSActions.ts). We also provide optimized and efficient selectors for most common use cases. These are -available in [this folder](src/core/selectors). +available in [this folder](./src/selectors). Important Note: The data received from either getState or Subscribe is immutable, the object received is frozen, and it is not allowed to mutate it. You'll get an error diff --git a/packages/hms-video-store/src/IHMSActions.ts b/packages/hms-video-store/src/IHMSActions.ts index f53083faf5..d1ab46e0ff 100644 --- a/packages/hms-video-store/src/IHMSActions.ts +++ b/packages/hms-video-store/src/IHMSActions.ts @@ -232,16 +232,16 @@ export interface IHMSActions; /** * Remove video plugins to the local peer video stream. Eg. Virtual Background, Face Filters etc. * Video plugins can be added/removed at any time after the video track is available. - * @param plugin HMSMediaStreamPlugin * @see HMSMediaStreamPlugin + * @param plugins */ removePluginsFromVideoStream(plugins: HMSMediaStreamPlugin[]): Promise; @@ -344,6 +344,7 @@ export interface IHMSActions; diff --git a/packages/roomkit-react/README.md b/packages/roomkit-react/README.md index ebf9faad42..92bff98b9c 100644 --- a/packages/roomkit-react/README.md +++ b/packages/roomkit-react/README.md @@ -43,10 +43,10 @@ export default App() { For additional props, refer the [docs](https://www.100ms.live/docs/javascript/v2/quickstart/prebuilt-quickstart#props-for-hmsprebuilt) -## Cutomization +## Customisation While we offer [a no-code way to customize Prebuilt](https://www.100ms.live/docs/get-started/v2/get-started/prebuilt/overview#customize-prebuilt), you can fork your copy of the Prebuilt component and make changes to the code to allow for more fine-tuning. -Prebuilt customisations are available on [100ms dashboard](https://dashboard.100ms.live) +Prebuilt customisations are available on [100ms Dashboard](https://dashboard.100ms.live). ### Understanding the Structure @@ -58,7 +58,7 @@ The `Prebuilt` folder contains the full Prebuilt implementation. | Component | Description | |--|--| -| [RoomLayoutProvider](src/Prebuilt/provider/roomLayoutProvider/index.tsx) | This is a context that contains the configuration from the dashboard [customiser](dashboard.100ms.live). Whatever changes are made in the dashboard customiser are available the next time you join.| +| [RoomLayoutProvider](src/Prebuilt/provider/roomLayoutProvider/index.tsx) | This is a context that contains the configuration from the dashboard [customiser](https://dashboard.100ms.live/). Whatever changes are made in the dashboard customiser are available the next time you join.| |[AppStateContext](src/Prebuilt/AppStateContext.tsx) | Contains the logic to switch between different screens, for example, Preview to Meeting, Meeting to Leave. These transitions are based on the roomState that is available from the reactive store (`useHMSStore(selectHMSRoomState)`). | | [PreviewScreen](src/Prebuilt/components/Preview/PreviewScreen.tsx) | Contains the Preview implementation. Contains the Video tile, video, audio toggles and Virtual background and settings along with the name input.| | [ConferenceScreen](src/Prebuilt/components/ConferenceScreen.tsx) | This contains the screen once you finish Preview and enter the meeting. This contains the header and footer and the main content.| @@ -68,11 +68,11 @@ The `Prebuilt` folder contains the full Prebuilt implementation. ### Customising the Styles -[Base Config](/src/Theme/base.config.ts) has all the variables that you can use. Any changes you want for the theme can be made here. Most likely no additional changes will be required unless you want to introduce new variables. +[Base Config](./src/Theme/base.config.ts) has all the variables that you can use. Any changes you want for the theme can be made here. Most likely no additional changes will be required unless you want to introduce new variables. -When [`HMSThemeProvider`](src/Theme/ThemeProvider.tsx) is used at the top level, all the variables will be available for all the children under this component tree. +When [`HMSThemeProvider`](./src/Theme/ThemeProvider.tsx) is used at the top level, all the variables will be available for all the children under this component tree. -For components created using the base components like `Box`, `Flex`, `Button` etc, css Prop is available to modify the styles. Within the css prop, you can access the variables from the [base config](/src/Theme/base.config.ts). +For components created using the base components like `Box`, `Flex`, `Button` etc, css Prop is available to modify the styles. Within the css prop, you can access the variables from the [base config](./src/Theme/base.config.ts). ## Contributing diff --git a/packages/roomkit-web/README.md b/packages/roomkit-web/README.md index 7390104cbe..1808c515d4 100644 --- a/packages/roomkit-web/README.md +++ b/packages/roomkit-web/README.md @@ -30,7 +30,7 @@ import '@100mslive/roomkit-web'; - An image URL as a string which is displayed in the preview screen and header. `auth-token` (optional) -- This token is room and role specific. It can be copied from the join room modal on the [dashboard](https://dashboard.100ms.live). Read more about it [here](/get-started/v2/get-started/security-and-tokens#auth-token-for-client-sdks). +- This token is room and role specific. It can be copied from the join room modal on the [dashboard](https://dashboard.100ms.live). Read more about it [here](https://www.100ms.live/docs/get-started/v2/get-started/security-and-tokens#auth-token-for-client-sdks). `room-id` (optional unless room-code is not being used) - The room ID of the room you want to join. You can get the room ID from the [dashboard](https://dashboard.100ms.live). It should be specified with the role prop if the room-code is not being provided. From 53b73703a3a32612b218c0277059159642ec4f24 Mon Sep 17 00:00:00 2001 From: Ravi theja Date: Mon, 23 Sep 2024 16:11:55 +0530 Subject: [PATCH 15/19] fix: don't send none layer request for degradation (#3285) --- .../src/media/tracks/HMSRemoteVideoTrack.ts | 24 ++++++++++++------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts b/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts index 841f4fc378..abff98bb41 100644 --- a/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts +++ b/packages/hms-video-store/src/media/tracks/HMSRemoteVideoTrack.ts @@ -148,10 +148,7 @@ export class HMSRemoteVideoTrack extends HMSVideoTrack { * @returns {boolean} isDegraded - returns true if degraded * */ setLayerFromServer(layerUpdate: VideoTrackLayerUpdate) { - this._degraded = - this.enabled && - (layerUpdate.publisher_degraded || layerUpdate.subscriber_degraded) && - layerUpdate.current_layer === HMSSimulcastLayer.NONE; + this._degraded = this.getDegradationValue(layerUpdate); this._degradedAt = this._degraded ? new Date() : this._degradedAt; const currentLayer = layerUpdate.current_layer; HMSLogger.d( @@ -171,11 +168,22 @@ export class HMSRemoteVideoTrack extends HMSVideoTrack { return this._degraded; } + private getDegradationValue(layerUpdate: VideoTrackLayerUpdate) { + return ( + this.enabled && + (layerUpdate.publisher_degraded || layerUpdate.subscriber_degraded) && + layerUpdate.current_layer === HMSSimulcastLayer.NONE + ); + } + private async updateLayer(source: string) { - const newLayer = - (this.degraded || !this.enabled || !this.hasSinks()) && !this.disableNoneLayerRequest - ? HMSSimulcastLayer.NONE - : this.preferredLayer; + let newLayer: HMSSimulcastLayer = this.preferredLayer; + if (this.enabled && this.hasSinks()) { + newLayer = this.preferredLayer; + // send none only when the flag is not set + } else if (!this.disableNoneLayerRequest) { + newLayer = HMSSimulcastLayer.NONE; + } if (!this.shouldSendVideoLayer(newLayer, source)) { return; } From 1bd22cb183d39227e06bec958aa2315d32b2df19 Mon Sep 17 00:00:00 2001 From: ygit Date: Tue, 24 Sep 2024 13:53:36 +0530 Subject: [PATCH 16/19] ci: added github actions workflow to mark stale PRs & issues (#3284) --- .github/workflows/stale.yml | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 .github/workflows/stale.yml diff --git a/.github/workflows/stale.yml b/.github/workflows/stale.yml new file mode 100644 index 0000000000..246d2fb95b --- /dev/null +++ b/.github/workflows/stale.yml @@ -0,0 +1,20 @@ +name: Close stale issues and PRs +on: + workflow_dispatch: {} + schedule: + - cron: "30 1 * * *" + +jobs: + stale: + runs-on: ubuntu-latest + steps: + - uses: actions/stale@v8 + with: + stale-issue-message: "This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days." + stale-pr-message: "This PR is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 10 days." + close-issue-message: "This issue was closed because it has been stalled for 5 days with no activity." + close-pr-message: "This PR was closed because it has been stalled for 10 days with no activity." + days-before-issue-stale: 30 + days-before-pr-stale: 45 + days-before-issue-close: 5 + days-before-pr-close: 10 From d9837564f57949b6a8aed721e4e0d2fc6493ddc2 Mon Sep 17 00:00:00 2001 From: Ravi theja Date: Wed, 25 Sep 2024 16:10:30 +0530 Subject: [PATCH 17/19] revert: message update when no tiles --- .../Prebuilt/components/VideoLayouts/EqualProminence.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx b/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx index b492c368e7..c3f010b67d 100644 --- a/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/VideoLayouts/EqualProminence.tsx @@ -1,6 +1,5 @@ import React, { useEffect, useState } from 'react'; import { useMedia } from 'react-use'; -import { selectPeerCount, useHMSStore } from '@100mslive/react-sdk'; import { PeopleAddIcon } from '@100mslive/react-icons'; import { Flex } from '../../../Layout'; import { config as cssConfig } from '../../../Theme'; @@ -18,7 +17,6 @@ export function EqualProminence({ isInsetEnabled = false, peers, onPageChange, o const isMobile = useMedia(cssConfig.media.md); let maxTileCount = useUISettings(UI_SETTINGS.maxTileCount); maxTileCount = isMobile ? Math.min(maxTileCount, 6) : maxTileCount; - const peerCount = useHMSStore(selectPeerCount); const pageList = usePagesWithTiles({ peers, maxTileCount, @@ -53,8 +51,8 @@ export function EqualProminence({ isInsetEnabled = false, peers, onPageChange, o )} {pageList.length === 0 ? ( } /> ) : null} From 5382d8e74d304e0cd1cb034e92372127f575eb10 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Mon, 30 Sep 2024 16:17:34 +0530 Subject: [PATCH 18/19] ci: update versions for release (#3293) Co-authored-by: raviteja83 --- .../prebuilt-react-integration/package.json | 2 +- packages/hls-player/package.json | 4 +-- packages/hls-stats/package.json | 2 +- packages/hms-video-store/package.json | 2 +- packages/hms-virtual-background/package.json | 6 ++-- packages/hms-whiteboard/package.json | 2 +- packages/react-icons/package.json | 2 +- packages/react-sdk/package.json | 4 +-- packages/roomkit-react/package.json | 12 +++---- packages/roomkit-web/package.json | 4 +-- yarn.lock | 31 +++++++++++++++++-- 11 files changed, 48 insertions(+), 23 deletions(-) diff --git a/examples/prebuilt-react-integration/package.json b/examples/prebuilt-react-integration/package.json index d42595fd1b..59126e6832 100644 --- a/examples/prebuilt-react-integration/package.json +++ b/examples/prebuilt-react-integration/package.json @@ -10,7 +10,7 @@ "preview": "vite preview" }, "dependencies": { - "@100mslive/roomkit-react": "0.3.20", + "@100mslive/roomkit-react": "0.3.21", "react": "^18.2.0", "react-dom": "^18.2.0" }, diff --git a/packages/hls-player/package.json b/packages/hls-player/package.json index 31993c800e..eb5ae37e98 100644 --- a/packages/hls-player/package.json +++ b/packages/hls-player/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/hls-player", - "version": "0.3.20", + "version": "0.3.21", "description": "HLS client library which uses HTML5 Video element and Media Source Extension for playback", "main": "dist/index.cjs.js", "module": "dist/index.js", @@ -36,7 +36,7 @@ "author": "100ms", "license": "MIT", "dependencies": { - "@100mslive/hls-stats": "0.4.20", + "@100mslive/hls-stats": "0.4.21", "eventemitter2": "^6.4.9", "hls.js": "1.4.12" } diff --git a/packages/hls-stats/package.json b/packages/hls-stats/package.json index 43a02194e3..b078a76ac8 100644 --- a/packages/hls-stats/package.json +++ b/packages/hls-stats/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/hls-stats", - "version": "0.4.20", + "version": "0.4.21", "description": "A simple library that provides stats for your hls stream", "main": "dist/index.cjs.js", "module": "dist/index.js", diff --git a/packages/hms-video-store/package.json b/packages/hms-video-store/package.json index 5feeb58a55..ccc9423223 100644 --- a/packages/hms-video-store/package.json +++ b/packages/hms-video-store/package.json @@ -1,5 +1,5 @@ { - "version": "0.12.20", + "version": "0.12.21", "license": "MIT", "repository": { "type": "git", diff --git a/packages/hms-virtual-background/package.json b/packages/hms-virtual-background/package.json index 7e4aef1d06..8aadb05854 100755 --- a/packages/hms-virtual-background/package.json +++ b/packages/hms-virtual-background/package.json @@ -1,5 +1,5 @@ { - "version": "1.13.20", + "version": "1.13.21", "license": "MIT", "name": "@100mslive/hms-virtual-background", "author": "100ms", @@ -62,10 +62,10 @@ "format": "prettier --write src/**/*.ts" }, "peerDependencies": { - "@100mslive/hms-video-store": "0.12.20" + "@100mslive/hms-video-store": "0.12.21" }, "devDependencies": { - "@100mslive/hms-video-store": "0.12.20" + "@100mslive/hms-video-store": "0.12.21" }, "dependencies": { "@mediapipe/selfie_segmentation": "^0.1.1632777926", diff --git a/packages/hms-whiteboard/package.json b/packages/hms-whiteboard/package.json index 1d28822d5d..b311a63ce3 100644 --- a/packages/hms-whiteboard/package.json +++ b/packages/hms-whiteboard/package.json @@ -2,7 +2,7 @@ "name": "@100mslive/hms-whiteboard", "author": "100ms", "license": "MIT", - "version": "0.0.10", + "version": "0.0.11", "main": "dist/index.cjs.js", "module": "dist/index.js", "types": "dist/index.d.ts", diff --git a/packages/react-icons/package.json b/packages/react-icons/package.json index 5e92a12522..3e2cbbbf78 100644 --- a/packages/react-icons/package.json +++ b/packages/react-icons/package.json @@ -4,7 +4,7 @@ "main": "dist/index.cjs.js", "module": "dist/index.js", "typings": "dist/index.d.ts", - "version": "0.10.20", + "version": "0.10.21", "author": "100ms", "license": "MIT", "repository": { diff --git a/packages/react-sdk/package.json b/packages/react-sdk/package.json index 36dccbbf5f..8311a52f08 100644 --- a/packages/react-sdk/package.json +++ b/packages/react-sdk/package.json @@ -4,7 +4,7 @@ "main": "dist/index.cjs.js", "module": "dist/index.js", "typings": "dist/index.d.ts", - "version": "0.10.20", + "version": "0.10.21", "author": "100ms", "license": "MIT", "repository": { @@ -48,7 +48,7 @@ "react": ">=16.8 <19.0.0" }, "dependencies": { - "@100mslive/hms-video-store": "0.12.20", + "@100mslive/hms-video-store": "0.12.21", "react-resize-detector": "^7.0.0", "zustand": "^3.6.2" } diff --git a/packages/roomkit-react/package.json b/packages/roomkit-react/package.json index 64143afab3..ec97436310 100644 --- a/packages/roomkit-react/package.json +++ b/packages/roomkit-react/package.json @@ -10,7 +10,7 @@ "prebuilt", "roomkit" ], - "version": "0.3.20", + "version": "0.3.21", "author": "100ms", "license": "MIT", "repository": { @@ -75,12 +75,12 @@ "react": ">=17.0.2 <19.0.0" }, "dependencies": { - "@100mslive/hls-player": "0.3.20", + "@100mslive/hls-player": "0.3.21", "@100mslive/hms-noise-cancellation": "0.0.1", - "@100mslive/hms-virtual-background": "1.13.20", - "@100mslive/hms-whiteboard": "0.0.10", - "@100mslive/react-icons": "0.10.20", - "@100mslive/react-sdk": "0.10.20", + "@100mslive/hms-virtual-background": "1.13.21", + "@100mslive/hms-whiteboard": "0.0.11", + "@100mslive/react-icons": "0.10.21", + "@100mslive/react-sdk": "0.10.21", "@100mslive/types-prebuilt": "0.12.12", "@emoji-mart/data": "^1.0.6", "@emoji-mart/react": "^1.0.1", diff --git a/packages/roomkit-web/package.json b/packages/roomkit-web/package.json index a505315d10..104abb13e5 100644 --- a/packages/roomkit-web/package.json +++ b/packages/roomkit-web/package.json @@ -1,6 +1,6 @@ { "name": "@100mslive/roomkit-web", - "version": "0.2.20", + "version": "0.2.21", "description": "A web component implementation of 100ms Prebuilt component", "keywords": [ "web-components", @@ -33,7 +33,7 @@ "build": "rm -rf dist && node ../../scripts/build-webapp" }, "dependencies": { - "@100mslive/roomkit-react": "0.3.20", + "@100mslive/roomkit-react": "0.3.21", "@r2wc/react-to-web-component": "2.0.2" } } diff --git a/yarn.lock b/yarn.lock index 8cb23dcb50..091e434c67 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16534,7 +16534,16 @@ string-natural-compare@^3.0.1: resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4" integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw== -"string-width-cjs@npm:string-width@^4.2.0", "string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0": + version "4.2.3" + resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" + integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== + dependencies: + emoji-regex "^8.0.0" + is-fullwidth-code-point "^3.0.0" + strip-ansi "^6.0.1" + +"string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -16639,7 +16648,14 @@ string_decoder@~1.1.1: dependencies: safe-buffer "~5.1.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1": + version "6.0.1" + resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" + integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== + dependencies: + ansi-regex "^5.0.1" + +strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -17992,7 +18008,7 @@ worker-timers@^7.0.40: worker-timers-broker "^6.0.95" worker-timers-worker "^7.0.59" -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -18010,6 +18026,15 @@ wrap-ansi@^6.0.1, wrap-ansi@^6.2.0: string-width "^4.1.0" strip-ansi "^6.0.0" +wrap-ansi@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" + integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== + dependencies: + ansi-styles "^4.0.0" + string-width "^4.1.0" + strip-ansi "^6.0.0" + wrap-ansi@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214" From e955d4917b61036d2ca2d1ae89618f18da02c25a Mon Sep 17 00:00:00 2001 From: Ravi theja Date: Mon, 30 Sep 2024 16:21:49 +0530 Subject: [PATCH 19/19] Merge main to dev --- yarn.lock | 31 +++---------------------------- 1 file changed, 3 insertions(+), 28 deletions(-) diff --git a/yarn.lock b/yarn.lock index 091e434c67..8cb23dcb50 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16534,16 +16534,7 @@ string-natural-compare@^3.0.1: resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4" integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw== -"string-width-cjs@npm:string-width@^4.2.0": - version "4.2.3" - resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" - integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== - dependencies: - emoji-regex "^8.0.0" - is-fullwidth-code-point "^3.0.0" - strip-ansi "^6.0.1" - -"string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0", "string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -16648,14 +16639,7 @@ string_decoder@~1.1.1: dependencies: safe-buffer "~5.1.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1": - version "6.0.1" - resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" - integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== - dependencies: - ansi-regex "^5.0.1" - -strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -18008,7 +17992,7 @@ worker-timers@^7.0.40: worker-timers-broker "^6.0.95" worker-timers-worker "^7.0.59" -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -18026,15 +18010,6 @@ wrap-ansi@^6.0.1, wrap-ansi@^6.2.0: string-width "^4.1.0" strip-ansi "^6.0.0" -wrap-ansi@^7.0.0: - version "7.0.0" - resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" - integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== - dependencies: - ansi-styles "^4.0.0" - string-width "^4.1.0" - strip-ansi "^6.0.0" - wrap-ansi@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"