@stream-io/video-react-sdk 0.4.2 → 0.4.4

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+### [0.4.4](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.4.3...@stream-io/video-react-sdk-0.4.4) (2023-11-01)
+
+### Dependency Updates
+
+* `@stream-io/video-client` updated to version `0.4.2`
+* `@stream-io/video-react-bindings` updated to version `0.3.2`
+
+### Bug Fixes
+
+* respect server-side settings in the lobby ([#1175](https://github.com/GetStream/stream-video-js/issues/1175)) ([b722a0a](https://github.com/GetStream/stream-video-js/commit/b722a0a4f8fd4e4e56787db3d9a56e45ee195974))
+
+### [0.4.3](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.4.2...@stream-io/video-react-sdk-0.4.3) (2023-10-30)
+
+
+### Bug Fixes
+
+* add marker classes for the default `VideoPreview` components ([#1172](https://github.com/GetStream/stream-video-js/issues/1172)) ([7948cd8](https://github.com/GetStream/stream-video-js/commit/7948cd81a5ad6271872239a77b2a5ab8a856d231))
+
 ### [0.4.2](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.4.1...@stream-io/video-react-sdk-0.4.2) (2023-10-30)
 
 ### Dependency Updates

package/dist/index.cjs.js

@@ -252,21 +252,26 @@ const useFloatingUIPreset = ({ placement, strategy, }) => {
  * @param key the key to use for local storage.
  */
 const usePersistDevicePreferences = (key) => {
-    const { useMicrophoneState, useCameraState, useSpeakerState } = videoReactBindings.useCallStateHooks();
+    const { useMicrophoneState, useCameraState, useSpeakerState, useCallSettings, } = videoReactBindings.useCallStateHooks();
     const mic = useMicrophoneState();
     const camera = useCameraState();
     const speaker = useSpeakerState();
+    const settings = useCallSettings();
     react.useEffect(() => {
+        if (!settings)
+            return;
         try {
+            const hasPreferences = !!window.localStorage.getItem(key);
+            const { audio, video } = settings;
             const defaultDevice = 'default';
             const preferences = {
                 mic: {
                     selectedDeviceId: mic.selectedDevice || defaultDevice,
-                    muted: mic.isMute,
+                    muted: hasPreferences ? mic.isMute : !audio.mic_default_on,
                 },
                 camera: {
                     selectedDeviceId: camera.selectedDevice || defaultDevice,
-                    muted: camera.isMute,
+                    muted: hasPreferences ? camera.isMute : !video.camera_default_on,
                 },
                 speaker: {
                     selectedDeviceId: speaker.selectedDevice || defaultDevice,
@@ -284,6 +289,7 @@ const usePersistDevicePreferences = (key) => {
         key,
         mic.isMute,
         mic.selectedDevice,
+        settings,
         speaker.selectedDevice,
     ]);
 };
@@ -294,8 +300,10 @@ const usePersistDevicePreferences = (key) => {
  */
 const useApplyDevicePreferences = (key) => {
     const call = videoReactBindings.useCall();
+    const { useCallSettings } = videoReactBindings.useCallStateHooks();
+    const settings = useCallSettings();
     react.useEffect(() => {
-        if (!call)
+        if (!call || !settings)
             return;
         const apply = async () => {
             const initMic = async (setting) => {
@@ -319,22 +327,30 @@ const useApplyDevicePreferences = (key) => {
             const initSpeaker = (setting) => {
                 call.speaker.select(setting.selectedDeviceId);
             };
+            let preferences = null;
             try {
-                const preferences = JSON.parse(window.localStorage.getItem(key));
-                if (preferences) {
-                    await initMic(preferences.mic);
-                    await initCamera(preferences.camera);
-                    initSpeaker(preferences.speaker);
-                }
+                preferences = JSON.parse(window.localStorage.getItem(key));
             }
             catch (err) {
                 console.warn('Failed to load device preferences', err);
             }
+            if (preferences) {
+                await initMic(preferences.mic);
+                await initCamera(preferences.camera);
+                initSpeaker(preferences.speaker);
+            }
+            else {
+                const { audio, video } = settings;
+                if (audio.mic_default_on)
+                    await call.microphone.enable();
+                if (video.camera_default_on)
+                    await call.camera.enable();
+            }
         };
         apply().catch((err) => {
             console.warn('Failed to apply device preferences', err);
         });
-    }, [call, key]);
+    }, [call, key, settings]);
 };
 /**
  * This hook will apply and persist the device preferences from local storage.
@@ -816,8 +832,11 @@ const ScreenShareButton = (props) => {
     const { useHasOngoingScreenShare, useScreenShareState } = videoReactBindings.useCallStateHooks();
     const isSomeoneScreenSharing = useHasOngoingScreenShare();
     const { hasPermission, requestPermission, isAwaitingPermission } = useRequestPermission(videoClient.OwnCapability.SCREENSHARE);
-    const { screenShare, isMute: isScreenSharing } = useScreenShareState();
-    return (jsxRuntime.jsx(videoReactBindings.Restricted, { requiredGrants: [videoClient.OwnCapability.SCREENSHARE], children: jsxRuntime.jsx(PermissionNotification, { permission: videoClient.OwnCapability.SCREENSHARE, isAwaitingApproval: isAwaitingPermission, messageApproved: t('You can now share your screen.'), messageAwaitingApproval: t('Awaiting for an approval to share screen.'), messageRevoked: t('You can no longer share your screen.'), children: jsxRuntime.jsx(CompositeButton, { active: isSomeoneScreenSharing, caption: caption, children: jsxRuntime.jsx(IconButton, { icon: isScreenSharing ? 'screen-share-on' : 'screen-share-off', title: t('Share screen'), disabled: !isScreenSharing && isSomeoneScreenSharing, onClick: async () => {
+    const { screenShare, isMute: amIScreenSharing } = useScreenShareState();
+    const disableScreenShareButton = amIScreenSharing
+        ? isSomeoneScreenSharing
+        : false;
+    return (jsxRuntime.jsx(videoReactBindings.Restricted, { requiredGrants: [videoClient.OwnCapability.SCREENSHARE], children: jsxRuntime.jsx(PermissionNotification, { permission: videoClient.OwnCapability.SCREENSHARE, isAwaitingApproval: isAwaitingPermission, messageApproved: t('You can now share your screen.'), messageAwaitingApproval: t('Awaiting for an approval to share screen.'), messageRevoked: t('You can no longer share your screen.'), children: jsxRuntime.jsx(CompositeButton, { active: isSomeoneScreenSharing, caption: caption, children: jsxRuntime.jsx(IconButton, { icon: isSomeoneScreenSharing ? 'screen-share-on' : 'screen-share-off', title: t('Share screen'), disabled: disableScreenShareButton, onClick: async () => {
                         if (!hasPermission) {
                             await requestPermission();
                         }
@@ -1482,11 +1501,11 @@ const StreamTheme = ({ as: Component = 'div', className, children, ...props }) =
 
 const DefaultDisabledVideoPreview = () => {
     const { t } = videoReactBindings.useI18n();
-    return jsxRuntime.jsx("div", { children: t('Video is disabled') });
+    return (jsxRuntime.jsx("div", { className: "str_video__video-preview__disabled-video-preview", children: t('Video is disabled') }));
 };
 const DefaultNoCameraPreview = () => {
     const { t } = videoReactBindings.useI18n();
-    return jsxRuntime.jsx("div", { children: t('No camera found') });
+    return (jsxRuntime.jsx("div", { className: "str_video__video-preview__no-camera-preview", children: t('No camera found') }));
 };
 const VideoPreview = ({ className, mirror = true, DisabledVideoPreview = DefaultDisabledVideoPreview, NoCameraPreview = DefaultNoCameraPreview, StartingCameraPreview = LoadingIndicator, }) => {
     const { useCameraState } = videoReactBindings.useCallStateHooks();
@@ -2097,7 +2116,7 @@ const VerticalScrollButtons = ({ scrollWrapper, }) => {
 };
 const hasScreenShare = (p) => !!p?.publishedTracks.includes(videoClient.SfuModels.TrackType.SCREEN_SHARE);
 
-const [major, minor, patch] = ("0.4.2" ).split('.');
+const [major, minor, patch] = ("0.4.4" ).split('.');
 videoClient.setSdkInfo({
     type: videoClient.SfuModels.SdkType.REACT,
     major,