Merge branch 'main' into docs-fix

GetStream · Nov 3, 2023 · aa607e2 · aa607e2
2 parents b50d8bd + 65a8eb5
commit aa607e2
Show file tree

Hide file tree

Showing 211 changed files with 4,852 additions and 3,372 deletions.
diff --git a/packages/client/CHANGELOG.md b/packages/client/CHANGELOG.md
@@ -2,6 +2,45 @@
 
 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-client-0.4.3...@stream-io/video-client-0.4.4) (2023-11-02)
+
+
+### Bug Fixes
+
+* allow audio and screen share audio tracks, delay setSinkId ([#1176](https://github.com/GetStream/stream-video-js/issues/1176)) ([6a099c5](https://github.com/GetStream/stream-video-js/commit/6a099c5c7cc6f5d389961a7c594e914e19be4ddb))
+
+### [0.4.3](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-0.4.2...@stream-io/video-client-0.4.3) (2023-11-01)
+
+
+### Bug Fixes
+
+* **client:** optimized device enumeration ([#1111](https://github.com/GetStream/stream-video-js/issues/1111)) ([435bd33](https://github.com/GetStream/stream-video-js/commit/435bd33afbe8b368413690f8f2d67d0b4918dbaa))
+
+### [0.4.2](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-0.4.1...@stream-io/video-client-0.4.2) (2023-11-01)
+
+
+### 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.1](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-0.4.0...@stream-io/video-client-0.4.1) (2023-10-30)
+
+
+### Features
+
+* Apply device config settings when call state becomes available ([#1167](https://github.com/GetStream/stream-video-js/issues/1167)) ([38e8ba4](https://github.com/GetStream/stream-video-js/commit/38e8ba459b60d9705af96ad7b9a2a7fa1827ad1e))
+
+## [0.4.0](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-0.3.36...@stream-io/video-client-0.4.0) (2023-10-27)
+
+
+### ⚠ BREAKING CHANGES
+
+* **react-sdk:** Universal Device Management API (#1127)
+
+### Features
+
+* **react-sdk:** Universal Device Management API ([#1127](https://github.com/GetStream/stream-video-js/issues/1127)) ([aeb3561](https://github.com/GetStream/stream-video-js/commit/aeb35612745f45254b536281c5f81d1bcac2bab5))
+
 ### [0.3.36](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-0.3.35...@stream-io/video-client-0.3.36) (2023-10-25)
 
 

diff --git a/packages/client/docusaurus/docs/javascript/02-guides/02-joining-creating-calls.mdx b/packages/client/docusaurus/docs/javascript/02-guides/02-joining-creating-calls.mdx
@@ -34,6 +34,26 @@ await client.call(callType, callId).getOrCreate();
 
 See all possible options at the [Call creation options section](#call-creation-options)
 
+### Join with mic and camera on or off
+
+You can override the default mic and camera settings before you join a call.
+Typically, you should configure this in your Lobby view:
+
+```typescript
+const call = client.call('default', 'test-call');
+
+// enable mic and camera
+await call.camera.enable();
+await call.microphone.enable();
+
+// alternatively, you can disable them
+await call.camera.disable();
+await call.microphone.disable();
+
+// and then join the call
+await call.join();
+```
+
 ### Leave call
 
 To leave a call, you can use the `leave` method:
@@ -76,16 +96,32 @@ await client.call('default', 'test-outgoing-call').getOrCreate({
 See all possible options at the [Call creation options section](#call-creation-options)
 
 This step will start the signaling flow.
-
 The caller will automatically join the call once the first callee accepts the call.
-
 The calling will automatically stop if all callee rejects the call.
 
 ### Watch for incoming and outgoing calls
 
 The easiest way to watch for incoming and outgoing calls is to use the `client.state.calls$` Observable.
 
-Let's see how the cancel, accept and reject operations work:
+```typescript
+import { CallingState } from '@stream-io/video-client';
+
+client.state.calls$.subscribe((calls) => {
+  const incomingCalls = calls.filter(
+    (call) =>
+      call.isCreatedByMe === false &&
+      call.state.callingState === CallingState.RINGING,
+  );
+  console.log('Incoming calls', incomingCalls);
+
+  const outgoingCalls = calls.filter(
+    (call) =>
+      call.isCreatedByMe === true &&
+      call.state.callingState === CallingState.RINGING,
+  );
+  console.log('Outgoing calls', outgoingCalls);
+});
+```
 
 ### Canceling a call
 

diff --git a/packages/client/docusaurus/docs/javascript/02-tutorials/03-livestream.mdx b/packages/client/docusaurus/docs/javascript/02-tutorials/03-livestream.mdx
@@ -51,14 +51,8 @@ const user: User = {
   image: 'https://getstream.io/random_svg/?id=oliver&name=Oliver',
 };
 
-const client = new StreamVideoClient({
-  apiKey,
-  token,
-  user,
-});
-
+const client = new StreamVideoClient({ apiKey, token, user });
 const call = client.call('livestream', callId);
-
 call.join({ create: true }).then(() => {
   call.camera.enable();
   call.microphone.enable();

diff --git a/packages/client/package.json b/packages/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-client",
-  "version": "0.3.36",
+  "version": "0.4.4",
   "packageManager": "[email protected]",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",

diff --git a/packages/client/src/Call.ts b/packages/client/src/Call.ts
@@ -9,11 +9,7 @@ import {
   Subscriber,
 } from './rtc';
 import { muteTypeToTrackType } from './rtc/helpers/tracks';
-import {
-  GoAwayReason,
-  SdkType,
-  TrackType,
-} from './gen/video/sfu/models/models';
+import { GoAwayReason, TrackType } from './gen/video/sfu/models/models';
 import {
   registerEventHandlers,
   registerRingingCallEventHandlers,
@@ -120,7 +116,7 @@ import {
   Logger,
   StreamCallEvent,
 } from './coordinator/connection/types';
-import { getClientDetails, getSdkInfo } from './client-details';
+import { getClientDetails } from './client-details';
 import { getLogger } from './logger';
 import {
   CameraDirection,
@@ -564,6 +560,8 @@ export class Call {
       this.clientStore.registerCall(this);
     }
 
+    this.applyDeviceConfig();
+
     return response;
   };
 
@@ -591,6 +589,8 @@ export class Call {
       this.clientStore.registerCall(this);
     }
 
+    this.applyDeviceConfig();
+
     return response;
   };
 
@@ -1004,14 +1004,11 @@ export class Call {
       this.reconnectAttempts = 0; // reset the reconnect attempts counter
       this.state.setCallingState(CallingState.JOINED);
 
-      // React uses a different device management for now
-      if (getSdkInfo()?.type !== SdkType.REACT) {
-        try {
-          await this.initCamera();
-          await this.initMic();
-        } catch (error) {
-          this.logger('warn', 'Camera and/or mic init failed during join call');
-        }
+      try {
+        await this.initCamera({ setStatus: true });
+        await this.initMic({ setStatus: true });
+      } catch (error) {
+        this.logger('warn', 'Camera and/or mic init failed during join call');
       }
 
       // 3. once we have the "joinResponse", and possibly reconciled the local state
@@ -1322,56 +1319,6 @@ export class Call {
     return this.statsReporter?.stopReportingStatsFor(sessionId);
   };
 
-  /**
-   * Sets the used audio output device (`audioOutputDeviceId` of the [`localParticipant$`](./StreamVideoClient.md/#readonlystatestore).
-   *
-   * This method only stores the selection, if you're using custom UI components, you'll have to implement the audio switching, for more information see: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/sinkId.
-   *
-   *
-   * @param deviceId the selected device, `undefined` means the user wants to use the system's default audio output
-   *
-   * @deprecated use `call.speaker` instead
-   */
-  setAudioOutputDevice = (deviceId?: string) => {
-    if (!this.sfuClient) return;
-    this.state.updateParticipant(this.sfuClient.sessionId, {
-      audioOutputDeviceId: deviceId,
-    });
-  };
-
-  /**
-   * Sets the `audioDeviceId` property of the [`localParticipant$`](./StreamVideoClient.md/#readonlystatestore)).
-   *
-   * This method only stores the selection, if you want to start publishing a media stream call the [`publishAudioStream` method](#publishaudiostream) that will set `audioDeviceId` as well.
-   *
-   *
-   * @param deviceId the selected device, pass `undefined` to clear the device selection
-   *
-   * @deprecated use call.microphone.select
-   */
-  setAudioDevice = (deviceId?: string) => {
-    if (!this.sfuClient) return;
-    this.state.updateParticipant(this.sfuClient.sessionId, {
-      audioDeviceId: deviceId,
-    });
-  };
-
-  /**
-   * Sets the `videoDeviceId` property of the [`localParticipant$`](./StreamVideoClient.md/#readonlystatestore).
-   *
-   * This method only stores the selection, if you want to start publishing a media stream call the [`publishVideoStream` method](#publishvideostream) that will set `videoDeviceId` as well.
-   *
-   * @param deviceId the selected device, pass `undefined` to clear the device selection
-   *
-   * @deprecated use call.camera.select
-   */
-  setVideoDevice = (deviceId?: string) => {
-    if (!this.sfuClient) return;
-    this.state.updateParticipant(this.sfuClient.sessionId, {
-      videoDeviceId: deviceId,
-    });
-  };
-
   /**
    * Resets the last sent reaction for the user holding the given `sessionId`. This is a local action, it won't reset the reaction on the backend.
    *
@@ -1839,7 +1786,12 @@ export class Call {
     );
   };
 
-  private async initCamera() {
+  applyDeviceConfig = () => {
+    this.initCamera({ setStatus: false });
+    this.initMic({ setStatus: false });
+  };
+
+  private async initCamera(options: { setStatus: boolean }) {
     // Wait for any in progress camera operation
     if (this.camera.enablePromise) {
       await this.camera.enablePromise;
@@ -1871,25 +1823,27 @@ export class Call {
       await this.camera.selectTargetResolution(targetResolution);
     }
 
-    // Publish already that was set before we joined
-    if (
-      this.camera.state.status === 'enabled' &&
-      this.camera.state.mediaStream &&
-      !this.publisher?.isPublishing(TrackType.VIDEO)
-    ) {
-      await this.publishVideoStream(this.camera.state.mediaStream);
-    }
+    if (options.setStatus) {
+      // Publish already that was set before we joined
+      if (
+        this.camera.state.status === 'enabled' &&
+        this.camera.state.mediaStream &&
+        !this.publisher?.isPublishing(TrackType.VIDEO)
+      ) {
+        await this.publishVideoStream(this.camera.state.mediaStream);
+      }
 
-    // Start camera if backend config speicifies, and there is no local setting
-    if (
-      this.camera.state.status === undefined &&
-      this.state.settings?.video.camera_default_on
-    ) {
-      await this.camera.enable();
+      // Start camera if backend config speicifies, and there is no local setting
+      if (
+        this.camera.state.status === undefined &&
+        this.state.settings?.video.camera_default_on
+      ) {
+        await this.camera.enable();
+      }
     }
   }
 
-  private async initMic() {
+  private async initMic(options: { setStatus: boolean }) {
     // Wait for any in progress mic operation
     if (this.microphone.enablePromise) {
       await this.microphone.enablePromise;
@@ -1905,21 +1859,23 @@ export class Call {
       return;
     }
 
-    // Publish media stream that was set before we joined
-    if (
-      this.microphone.state.status === 'enabled' &&
-      this.microphone.state.mediaStream &&
-      !this.publisher?.isPublishing(TrackType.AUDIO)
-    ) {
-      await this.publishAudioStream(this.microphone.state.mediaStream);
-    }
+    if (options.setStatus) {
+      // Publish media stream that was set before we joined
+      if (
+        this.microphone.state.status === 'enabled' &&
+        this.microphone.state.mediaStream &&
+        !this.publisher?.isPublishing(TrackType.AUDIO)
+      ) {
+        await this.publishAudioStream(this.microphone.state.mediaStream);
+      }
 
-    // Start mic if backend config specifies, and there is no local setting
-    if (
-      this.microphone.state.status === undefined &&
-      this.state.settings?.audio.mic_default_on
-    ) {
-      await this.microphone.enable();
+      // Start mic if backend config specifies, and there is no local setting
+      if (
+        this.microphone.state.status === undefined &&
+        this.state.settings?.audio.mic_default_on
+      ) {
+        await this.microphone.enable();
+      }
     }
   }
 

diff --git a/packages/client/src/StreamVideoClient.ts b/packages/client/src/StreamVideoClient.ts
@@ -352,6 +352,7 @@ export class StreamVideoClient {
         clientStore: this.writeableStateStore,
       });
       call.state.updateFromCallResponse(c.call);
+      call.applyDeviceConfig();
       if (data.watch) {
         this.writeableStateStore.registerCall(call);
       }

diff --git a/packages/client/src/__tests__/StreamVideoClient.test.ts b/packages/client/src/__tests__/StreamVideoClient.test.ts
@@ -8,9 +8,6 @@ import { User } from '../coordinator/connection/types';
 const apiKey = process.env.STREAM_API_KEY!;
 const secret = process.env.STREAM_SECRET!;
 
-vi.mock('../devices/CameraManager.ts');
-vi.mock('../devices/MicrophoneManager.ts');
-
 const tokenProvider = (userId: string) => {
   const serverClient = new StreamVideoServerClient(apiKey, { secret });
   return async () => {