diff --git a/src/video-grid/VideoTile.tsx b/src/video-grid/VideoTile.tsx index 63ceddf2..f15052e0 100644 --- a/src/video-grid/VideoTile.tsx +++ b/src/video-grid/VideoTile.tsx @@ -121,6 +121,15 @@ export const VideoTile = forwardRef( const toolbarButtons: JSX.Element[] = []; if (!sfuParticipant.isLocal) { + toolbarButtons.push( + + ); + if (content === TileContent.ScreenShare) { toolbarButtons.push( ( onPress={onFullscreen} /> ); - } else { - // Due to the LK SDK this sadly only works for user-media atm - toolbarButtons.push( - - ); } } diff --git a/src/video-grid/VideoTileSettingsModal.tsx b/src/video-grid/VideoTileSettingsModal.tsx index 00d41c50..0c77075a 100644 --- a/src/video-grid/VideoTileSettingsModal.tsx +++ b/src/video-grid/VideoTileSettingsModal.tsx @@ -16,29 +16,36 @@ limitations under the License. import React, { ChangeEvent, useState } from "react"; import { useTranslation } from "react-i18next"; -import { RemoteParticipant } from "livekit-client"; +import { RemoteParticipant, Track } from "livekit-client"; import { FieldRow } from "../input/Input"; import { Modal } from "../Modal"; import styles from "./VideoTileSettingsModal.module.css"; import { VolumeIcon } from "../button/VolumeIcon"; -import { ItemData } from "./VideoTile"; +import { ItemData, TileContent } from "./VideoTile"; interface LocalVolumeProps { participant: RemoteParticipant; + content: TileContent; } const LocalVolume: React.FC = ({ participant, + content, }: LocalVolumeProps) => { + const source = + content === TileContent.UserMedia + ? Track.Source.Microphone + : Track.Source.ScreenShareAudio; + const [localVolume, setLocalVolume] = useState( - participant.getVolume() ?? 0 + participant.getVolume(source) ?? 0 ); const onLocalVolumeChanged = (event: ChangeEvent) => { const value: number = +event.target.value; setLocalVolume(value); - participant.setVolume(value); + participant.setVolume(value, source); }; return ( @@ -78,7 +85,10 @@ export const VideoTileSettingsModal = ({ data, onClose, ...rest }: Props) => { {...rest} >
- +
);