@stream-io/video-react-sdk 0.6.10 → 0.6.12

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import { SfuModels, CallingState, OwnCapability, name, VisibilityState, Browsers, paginatedLayoutSortPreset, combineComparators, screenSharing, speakerLayoutSortPreset, CallTypes, defaultSortPreset, setSdkInfo } from '@stream-io/video-client';
+import { SfuModels, CallingState, OwnCapability, name, NoiseCancellationSettingsModeEnum, VisibilityState, Browsers, paginatedLayoutSortPreset, combineComparators, screenSharing, speakerLayoutSortPreset, CallTypes, defaultSortPreset, setSdkInfo } from '@stream-io/video-client';
 export * from '@stream-io/video-client';
 import { useCall, useCallStateHooks, useI18n, Restricted, useConnectedUser, StreamCallProvider, StreamVideoProvider } from '@stream-io/video-react-bindings';
 export * from '@stream-io/video-react-bindings';
@@ -127,21 +127,24 @@ const BackgroundFilters = (props) => {
     const [canvasRef, setCanvasRef] = useState(null);
     const [width, setWidth] = useState(1920);
     const [height, setHeight] = useState(1080);
-    const resolveFilterRef = useRef();
+    // Holds a ref to the `resolve` function of the returned Promise as part
+    // of the `camera.registerFilter()` API. Once the filter is initialized,
+    // it should be called with the filtered MediaStream as an argument.
+    const signalFilterReadyRef = useRef();
     const [mediaStream, setMediaStream] = useState();
-    const registerFilterRef = useRef(Promise.resolve(async () => { }));
+    const unregister = useRef();
     useEffect(() => {
         if (!call || !backgroundFilter)
             return;
-        registerFilterRef.current = registerFilterRef.current.then(() => call.camera.registerFilter(async (ms) => {
+        const register = (unregister.current || Promise.resolve()).then(() => call.camera.registerFilter(async (ms) => {
             return new Promise((resolve) => {
                 setMediaStream(ms);
-                resolveFilterRef.current = resolve;
+                signalFilterReadyRef.current = resolve;
             });
         }));
         return () => {
-            registerFilterRef.current
-                .then((unregister) => unregister())
+            unregister.current = register
+                .then((unregisterFilter) => unregisterFilter())
                 .then(() => setMediaStream(undefined))
                 .catch((err) => console.error('Failed to unregister filter', err));
         };
@@ -156,7 +159,7 @@ const BackgroundFilters = (props) => {
                 setWidth(w);
                 setHeight(h);
             }
-            const resolveFilter = resolveFilterRef.current;
+            const resolveFilter = signalFilterReadyRef.current;
             if (!resolveFilter)
                 return;
             const filter = canvasRef.captureStream();
@@ -1544,6 +1547,67 @@ const CallRecordingList = ({ callRecordings, CallRecordingListHeader: CallRecord
     return (jsxs("div", { className: "str-video__call-recording-list", children: [jsx(CallRecordingListHeader$1, { callRecordings: callRecordings, onRefresh: onRefresh }), jsx("div", { className: "str-video__call-recording-list__listing", children: loading ? (jsx(LoadingCallRecordingList, { callRecordings: callRecordings })) : callRecordings.length ? (jsxs(Fragment, { children: [jsx("ul", { className: "str-video__call-recording-list__list", children: jsxs("li", { className: "str-video__call-recording-list__item", children: [jsx("div", { className: "str-video__call-recording-list__filename", children: "Name" }), jsx("div", { className: "str-video__call-recording-list__time", children: "Start time" }), jsx("div", { className: "str-video__call-recording-list__time", children: "End time" }), jsx("div", { className: "str-video__call-recording-list__download" })] }) }), jsx("ul", { className: "str-video__call-recording-list__list", children: callRecordings.map((recording) => (jsx(CallRecordingListItem$1, { recording: recording }, recording.filename))) })] })) : (jsx(EmptyCallRecordingList, {})) })] }));
 };
 
+const NoiseCancellationContext = createContext(null);
+/**
+ * Exposes the NoiseCancellation API.
+ * Throws an error if used outside <NoiseCancellationProvider />.
+ */
+const useNoiseCancellation = () => {
+    const context = useContext(NoiseCancellationContext);
+    if (!context) {
+        throw new Error('useNoiseCancellation must be used within a NoiseCancellationProvider');
+    }
+    return context;
+};
+const NoiseCancellationProvider = (props) => {
+    const { children, noiseCancellation } = props;
+    const call = useCall();
+    const { useCallSettings, useHasPermissions } = useCallStateHooks();
+    const settings = useCallSettings();
+    const noiseCancellationAllowed = !!(settings &&
+        settings.audio.noise_cancellation &&
+        settings.audio.noise_cancellation.mode !==
+            NoiseCancellationSettingsModeEnum.DISABLED);
+    const hasCapability = useHasPermissions(OwnCapability.ENABLE_NOISE_CANCELLATION);
+    const isSupported = hasCapability &&
+        noiseCancellationAllowed &&
+        noiseCancellation.isSupported();
+    const [isEnabled, setIsEnabled] = useState(false);
+    const deinit = useRef();
+    useEffect(() => {
+        if (!call || !isSupported)
+            return;
+        const unsubscribe = noiseCancellation.on('change', (v) => setIsEnabled(v));
+        const init = (deinit.current || Promise.resolve())
+            .then(() => noiseCancellation.init())
+            .then(() => call.microphone.enableNoiseCancellation(noiseCancellation))
+            .catch((err) => console.error(`Can't initialize noise suppression`, err));
+        return () => {
+            deinit.current = init
+                .then(() => call.microphone.disableNoiseCancellation())
+                .then(() => noiseCancellation.dispose())
+                .then(() => unsubscribe());
+        };
+    }, [call, isSupported, noiseCancellation]);
+    return (jsx(NoiseCancellationContext.Provider, { value: {
+            isSupported,
+            isEnabled,
+            setEnabled: (enabledOrSetter) => {
+                if (!noiseCancellation)
+                    return;
+                const enable = typeof enabledOrSetter === 'function'
+                    ? enabledOrSetter(isEnabled)
+                    : enabledOrSetter;
+                if (enable) {
+                    noiseCancellation.enable();
+                }
+                else {
+                    noiseCancellation.disable();
+                }
+            },
+        }, children: children }));
+};
+
 const RingingCallControls = () => {
     const call = useCall();
     const { useCallCallingState } = useCallStateHooks();
@@ -2433,7 +2497,7 @@ const VerticalScrollButtons = ({ scrollWrapper, }) => {
 };
 const hasScreenShare = (p) => !!p?.publishedTracks.includes(SfuModels.TrackType.SCREEN_SHARE);
 
-const [major, minor, patch] = ("0.6.10" ).split('.');
+const [major, minor, patch] = ("0.6.12" ).split('.');
 setSdkInfo({
     type: SfuModels.SdkType.REACT,
     major,
@@ -2441,5 +2505,5 @@ setSdkInfo({
     patch,
 });
 
-export { AcceptCallButton, Audio, Avatar, AvatarFallback, BackgroundFiltersProvider, BaseVideo, CallControls, CallParticipantListing, CallParticipantListingItem, CallParticipantsList, CallPreview, CallRecordingList, CallRecordingListHeader, CallRecordingListItem, CallStats, CallStatsButton, CallStatsLatencyChart, CancelCallButton, CancelCallConfirmButton, CompositeButton, DefaultParticipantViewUI, DefaultReactionsMenu, DefaultScreenShareOverlay, DefaultVideoPlaceholder, DeviceSelector, DeviceSelectorAudioInput, DeviceSelectorAudioOutput, DeviceSelectorVideo, DeviceSettings, DropDownSelect, DropDownSelectOption, EmptyCallRecordingListing, GenericMenu, GenericMenuButtonItem, Icon, IconButton, LivestreamLayout, LoadingCallRecordingListing, LoadingIndicator, MenuToggle, MenuVisualType, Notification, PaginatedGridLayout, ParticipantActionsContextMenu, ParticipantDetails, ParticipantView, ParticipantViewContext, ParticipantsAudio, PermissionNotification, PermissionRequestList, PermissionRequests, ReactionsButton, RecordCallButton, RecordCallConfirmationButton, RecordingInProgressNotification, RingingCall, RingingCallControls, ScreenShareButton, SearchInput, SearchResults, SpeakerLayout, SpeakingWhileMutedNotification, SpeechIndicator, StatCard, StatCardExplanation, StatsTag, Statuses, StreamCall, StreamTheme, StreamVideo, TextButton, ToggleAudioOutputButton, ToggleAudioPreviewButton, ToggleAudioPublishingButton, ToggleVideoPreviewButton, ToggleVideoPublishingButton, Tooltip, Video$1 as Video, VideoPreview, WithTooltip, defaultReactions, translations, useBackgroundFilters, useHorizontalScrollPosition, useMenuContext, useParticipantViewContext, usePersistedDevicePreferences, useRequestPermission, useTrackElementVisibility, useVerticalScrollPosition };
+export { AcceptCallButton, Audio, Avatar, AvatarFallback, BackgroundFiltersProvider, BaseVideo, CallControls, CallParticipantListing, CallParticipantListingItem, CallParticipantsList, CallPreview, CallRecordingList, CallRecordingListHeader, CallRecordingListItem, CallStats, CallStatsButton, CallStatsLatencyChart, CancelCallButton, CancelCallConfirmButton, CompositeButton, DefaultParticipantViewUI, DefaultReactionsMenu, DefaultScreenShareOverlay, DefaultVideoPlaceholder, DeviceSelector, DeviceSelectorAudioInput, DeviceSelectorAudioOutput, DeviceSelectorVideo, DeviceSettings, DropDownSelect, DropDownSelectOption, EmptyCallRecordingListing, GenericMenu, GenericMenuButtonItem, Icon, IconButton, LivestreamLayout, LoadingCallRecordingListing, LoadingIndicator, MenuToggle, MenuVisualType, NoiseCancellationProvider, Notification, PaginatedGridLayout, ParticipantActionsContextMenu, ParticipantDetails, ParticipantView, ParticipantViewContext, ParticipantsAudio, PermissionNotification, PermissionRequestList, PermissionRequests, ReactionsButton, RecordCallButton, RecordCallConfirmationButton, RecordingInProgressNotification, RingingCall, RingingCallControls, ScreenShareButton, SearchInput, SearchResults, SpeakerLayout, SpeakingWhileMutedNotification, SpeechIndicator, StatCard, StatCardExplanation, StatsTag, Statuses, StreamCall, StreamTheme, StreamVideo, TextButton, ToggleAudioOutputButton, ToggleAudioPreviewButton, ToggleAudioPublishingButton, ToggleVideoPreviewButton, ToggleVideoPublishingButton, Tooltip, Video$1 as Video, VideoPreview, WithTooltip, defaultReactions, translations, useBackgroundFilters, useHorizontalScrollPosition, useMenuContext, useNoiseCancellation, useParticipantViewContext, usePersistedDevicePreferences, useRequestPermission, useTrackElementVisibility, useVerticalScrollPosition };
 //# sourceMappingURL=index.es.js.map