@stream-io/video-client 2.0.0-beta.0 → 2.0.0-beta.1

package/src/StreamSfuClient.ts

@@ -39,7 +39,8 @@ import {
 } from './helpers/promise';
 import { withoutConcurrency } from './helpers/concurrency';
 import { getTimers } from './timers';
-import { Tracer, TraceSlice } from './stats';
+import { getSdkInfo } from './helpers/client-details';
+import { getStreamClientId, Tracer, TraceSlice } from './stats';
 import { SfuJoinError, SfuTimeoutError } from './errors';
 
 export type StreamSfuClientConstructor = {
@@ -271,7 +272,10 @@ export class StreamSfuClient {
     this.rpc = createSignalClient({
       baseUrl: server.url,
       interceptors: [
-        withHeaders({ Authorization: `Bearer ${token}` }),
+        withHeaders({
+          Authorization: `Bearer ${token}`,
+          'X-Stream-Client': getStreamClientId(getSdkInfo()),
+        }),
         this.tracer && withRequestTracer(this.tracer.trace),
         this.logger.getLogLevel() === 'trace' && withRequestLogger(this.logger),
         withTimeout(rpcRequestTimeout, this.tracer?.trace),

package/src/StreamVideoClient.ts

@@ -1,10 +1,6 @@
 import { Call } from './Call';
 import { StreamClient } from './coordinator/connection/client';
-import {
-  CallingState,
-  StreamVideoReadOnlyStateStore,
-  StreamVideoWriteableStateStore,
-} from './store';
+import { CallingState, ClientState } from './store';
 import type {
   CallCreatedEvent,
   CallRingEvent,
@@ -48,19 +44,14 @@ import { ClientEventReporter } from './reporting';
  */
 export class StreamVideoClient {
   /**
-   * A reactive store that exposes all the state variables reactively.
+   * The reactive state of this client.
    * You can subscribe to changes of the different state variables.
-   * Our library is built in a way that all state changes are exposed in this store,
-   * o all UI changes in your application should be handled by subscribing to these variables.
-   *
-   * @deprecated use the `client.state` getter.
    */
-  readonly readOnlyStateStore: StreamVideoReadOnlyStateStore;
+  readonly state = new ClientState();
   readonly logger: ScopedLogger;
 
-  protected readonly writeableStateStore: StreamVideoWriteableStateStore;
-  streamClient: StreamClient;
-  readonly clientEventReporter: ClientEventReporter;
+  readonly streamClient: StreamClient;
+  private readonly clientEventReporter: ClientEventReporter;
 
   private effectsRegistered = false;
   private eventHandlersToUnregister: Array<() => void> = [];
@@ -103,11 +94,6 @@ export class StreamVideoClient {
       enabled: clientOptions?.clientEventsReportingEnabled ?? true,
     });
 
-    this.writeableStateStore = new StreamVideoWriteableStateStore();
-    this.readOnlyStateStore = new StreamVideoReadOnlyStateStore(
-      this.writeableStateStore,
-    );
-
     if (typeof apiKeyOrArgs !== 'string' && apiKeyOrArgs.user) {
       const user = apiKeyOrArgs.user;
       if (user.type === 'anonymous') user.id = '!anon';
@@ -158,13 +144,6 @@ export class StreamVideoClient {
     StreamVideoClient._instances.set(instanceKey, this);
   };
 
-  /**
-   * Return the reactive state store, use this if you want to be notified about changes to the client state
-   */
-  get state() {
-    return this.readOnlyStateStore;
-  }
-
   private registerEffects = () => {
     if (this.effectsRegistered) return;
 
@@ -174,7 +153,7 @@ export class StreamVideoClient {
       this.on('connection.changed', (event) => {
         if (!event.online) return;
 
-        const callsToReWatch = this.writeableStateStore.calls
+        const callsToReWatch = this.state.calls
           .filter((call) => call.watching)
           .map((call) => call.cid);
         if (callsToReWatch.length <= 0) return;
@@ -197,7 +176,7 @@ export class StreamVideoClient {
       const concurrencyTag = getCallInitConcurrencyTag(e.call_cid);
       await withoutConcurrency(concurrencyTag, async () => {
         const ringing = e.type === 'call.ring';
-        let call = this.writeableStateStore.findCall(e.call.type, e.call.id);
+        let call = this.state.findCall(e.call.type, e.call.id);
         if (call) {
           if (ringing) {
             if (this.shouldRejectCall(call.cid)) {
@@ -224,7 +203,7 @@ export class StreamVideoClient {
           type: e.call.type,
           id: e.call.id,
           members: e.members,
-          clientStore: this.writeableStateStore,
+          clientState: this.state,
           ringing,
         });
 
@@ -239,7 +218,7 @@ export class StreamVideoClient {
           }
         } else {
           call.state.updateFromCallResponse(e.call);
-          this.writeableStateStore.registerCall(call);
+          this.state.registerCall(call);
           this.logger.info(`New call created and registered: ${call.cid}`);
         }
       });
@@ -278,10 +257,7 @@ export class StreamVideoClient {
         });
 
         for (const c of response.calls) {
-          const call = this.writeableStateStore.findCall(
-            c.call.type,
-            c.call.id,
-          );
+          const call = this.state.findCall(c.call.type, c.call.id);
 
           if (call) {
             call.updateFromCallStateResponse(c);
@@ -310,8 +286,6 @@ export class StreamVideoClient {
 
   /**
    * Connects the given user to the client.
-   * Only one user can connect at a time, if you want to change users, call `disconnectUser` before connecting a new user.
-   * If the connection is successful, the connected user [state variable](#readonlystatestore) will be updated accordingly.
    *
    * @param user the user to connect.
    * @param tokenOrProvider a token or a function that returns a token.
@@ -369,7 +343,7 @@ export class StreamVideoClient {
 
     // connectUserResponse will be void if connectUser called twice for the same user
     if (connectUserResponse?.me) {
-      this.writeableStateStore.setConnectedUser(connectUserResponse.me);
+      this.state.setConnectedUser(connectUserResponse.me);
     }
 
     this.registerEffects();
@@ -377,19 +351,36 @@ export class StreamVideoClient {
     return connectUserResponse;
   };
 
+  /**
+   * Leaves every call this client still tracks. Runs while the coordinator
+   * connection is alive, so that the leave requests each call sends reach the
+   * backend.
+   */
+  private leaveAllCalls = async () => {
+    for (const call of this.state.calls) {
+      if (call.state.callingState === CallingState.LEFT) continue;
+
+      this.logger.info(`User disconnected, leaving call: ${call.cid}`);
+      await call
+        .leave({ message: 'client.disconnectUser() called' })
+        .catch((err) => {
+          this.logger.error(`Error leaving call: ${call.cid}`, err);
+        });
+    }
+  };
+
   /**
    * Disconnects the currently connected user from the client.
-   *
-   * If the connection is successfully disconnected, the connected user [state variable](#readonlystatestore) will be updated accordingly
+   * Leaves every call the user is still in, and updates `client.state`accordingly.
    *
    * @param timeout Max number of ms, to wait for close event of websocket, before forcefully assuming successful disconnection.
-   *                https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent
    */
   disconnectUser = async (timeout?: number) => {
     await withoutConcurrency(this.connectionConcurrencyTag, async () => {
       const { user, key } = this.streamClient;
       if (!user) return;
 
+      await this.leaveAllCalls();
       await this.streamClient.disconnectUser(timeout);
 
       if (user.id) {
@@ -398,14 +389,16 @@ export class StreamVideoClient {
       this.eventHandlersToUnregister.forEach((unregister) => unregister());
       this.eventHandlersToUnregister = [];
       this.effectsRegistered = false;
-      this.writeableStateStore.setConnectedUser(undefined);
+      this.state.setConnectedUser(undefined);
     });
   };
 
   /**
    * You can subscribe to WebSocket events provided by the API.
    * To remove a subscription, call the `off` method or, execute the returned unsubscribe function.
-   * Please note that subscribing to WebSocket events is an advanced use-case, for most use-cases it should be enough to watch for changes in the reactive [state store](#readonlystatestore).
+   * Please note that subscribing to WebSocket events is an advanced use-case,
+   * for most use-cases it should be enough to watch for changes in the reactive
+   * `client.state`.
    *
    * @param eventName the event name or 'all'.
    * @param callback the callback which will be called when the event is emitted.
@@ -444,7 +437,7 @@ export class StreamVideoClient {
     options: { reuseInstance?: boolean } = {},
   ) => {
     const call = options.reuseInstance
-      ? this.writeableStateStore.findCall(type, id)
+      ? this.state.findCall(type, id)
       : undefined;
     return (
       call ??
@@ -453,7 +446,7 @@ export class StreamVideoClient {
         clientEventReporter: this.clientEventReporter,
         id: id,
         type: type,
-        clientStore: this.writeableStateStore,
+        clientState: this.state,
       })
     );
   };
@@ -492,7 +485,7 @@ export class StreamVideoClient {
         members: c.members,
         ownCapabilities: c.own_capabilities,
         watching: data.watch,
-        clientStore: this.writeableStateStore,
+        clientState: this.state,
       });
       call.state.updateFromCallResponse(c.call);
       await call.applyDeviceConfig(c.call.settings, {
@@ -501,7 +494,7 @@ export class StreamVideoClient {
       });
       if (data.watch) {
         await call.setup();
-        this.writeableStateStore.registerCall(call);
+        this.state.registerCall(call);
       }
       calls.push(call);
     }
@@ -636,7 +629,7 @@ export class StreamVideoClient {
           clientEventReporter: this.clientEventReporter,
           type: callType,
           id: callId,
-          clientStore: this.writeableStateStore,
+          clientState: this.state,
           ringing: true,
         });
         await call.get();

package/src/__tests__/Call.autodrop.test.ts

@@ -1,104 +1,156 @@
 import '../rtc/__tests__/mocks/webrtc.mocks';
 
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { fromPartial } from '@total-typescript/shoehorn';
 import { Call } from '../Call';
 import { StreamClient } from '../coordinator/connection/client';
 import { ClientEventReporter } from '../reporting';
 import { generateUUIDv4 } from '../coordinator/connection/utils';
-import { CallingState, StreamVideoWriteableStateStore } from '../store';
+import { CallingState, ClientState } from '../store';
+import { CallSettingsResponse } from '../gen/coordinator';
 
+const TIMEOUT_MS = 30_000;
+
+// The timeout's own behaviour is covered by `ringing/__tests__/RingTimeout`.
+// This file covers the wiring: that a ringing call arms one and that leaving
+// cancels it.
 describe('Auto drop ringing calls', () => {
-  let call: Call;
   const userId = 'jane';
+  let call: Call;
 
-  beforeEach(async () => {
-    vi.useFakeTimers();
-
-    const clientStore = new StreamVideoWriteableStateStore();
+  const ringingCall = () => {
+    const clientState = new ClientState();
     const streamClient = new StreamClient('abc');
-    call = new Call({
+    const newCall = new Call({
       type: 'test',
       id: generateUUIDv4(),
       streamClient,
       clientEventReporter: new ClientEventReporter({ streamClient }),
-      clientStore: clientStore,
+      clientState,
+      ringing: true,
     });
 
-    // @ts-expect-error mocking only what we need for the test
-    clientStore.connectedUserSubject.next({
-      id: userId,
-    });
-
-    call.state['callingStateSubject'].next(CallingState.RINGING);
-
-    vi.spyOn(call, 'leave').mockImplementation(async () => {
-      console.log(`TEST: leave() called`);
-    });
-  });
-
-  it('caller should drop ringing calls after a timeout if no one accepted', async () => {
-    call.state['settingsSubject'].next({
-      // @ts-expect-error mocking only what we need for the test, we use fake timers, so undefined for timeout works
-      ring: {},
-      // @ts-expect-error mocking only what we need for the test
-      screensharing: {
-        enabled: false,
-        target_resolution: {
-          width: 100,
-          height: 100,
+    clientState.setConnectedUser(fromPartial({ id: userId }));
+    newCall.state['createdBySubject'].next(fromPartial({ id: userId }));
+    newCall.state['settingsSubject'].next(
+      fromPartial<CallSettingsResponse>({
+        ring: {
+          auto_cancel_timeout_ms: TIMEOUT_MS,
+          incoming_call_timeout_ms: TIMEOUT_MS,
+          missed_call_timeout_ms: TIMEOUT_MS,
         },
-      },
-    });
+        screensharing: {
+          enabled: false,
+          target_resolution: { width: 100, height: 100 },
+        },
+      }),
+    );
+    newCall.state['sessionSubject'].next(
+      fromPartial({
+        id: 'session-1',
+        accepted_by: {},
+        rejected_by: {},
+        missed_by: {},
+      }),
+    );
+    newCall.state['callingStateSubject'].next(CallingState.RINGING);
+
+    vi.spyOn(newCall, 'leave').mockResolvedValue(undefined);
+    return newCall;
+  };
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    call = ringingCall();
+  });
 
-    // @ts-expect-error mocking only what we need for the test
-    call.state['createdBySubject'].next({
-      id: userId,
-    });
+  afterEach(() => {
+    call['cancelAutoDrop']();
+    vi.useRealTimers();
+    vi.restoreAllMocks();
+  });
 
-    // black-box test, calling private method
-    call['scheduleAutoDrop']();
+  it('is armed when a call starts ringing', async () => {
+    call.state['callingStateSubject'].next(CallingState.IDLE);
 
-    await vi.runAllTimersAsync();
+    call['handleRingingCall']();
 
+    expect(call['ringTimeout']).toBeDefined();
+    await vi.advanceTimersByTimeAsync(TIMEOUT_MS);
     expect(call.leave).toHaveBeenCalledWith({
       reject: true,
       reason: 'timeout',
-      message: `ringing timeout - no one accepted`,
+      message: 'ringing timeout - no one accepted',
     });
   });
 
-  it(`callee should drop ringing calls after a timeout if user didn't interact with incoming call screen`, async () => {
-    call.state['settingsSubject'].next({
-      // @ts-expect-error mocking only what we need for the test, we use fake timers, so undefined for timeout works
-      ring: {},
-      // @ts-expect-error mocking only what we need for the test
-      screensharing: {
-        enabled: false,
-        target_resolution: {
-          width: 100,
-          height: 100,
-        },
-      },
-    });
+  it('is cancelled by cancelAutoDrop', async () => {
+    call['scheduleAutoDrop']();
 
-    // @ts-expect-error mocking only what we need for the test
-    call.state['createdBySubject'].next({
-      id: 'not-' + userId,
-    });
+    call['cancelAutoDrop']();
 
-    // black-box test, calling private method
+    expect(call['ringTimeout']).toBeUndefined();
+    await vi.advanceTimersByTimeAsync(TIMEOUT_MS);
+    expect(call.leave).not.toHaveBeenCalled();
+  });
+
+  // the calling state stays RINGING well into teardown, so the watchdogs have
+  // to be paused before `leave` awaits anything
+  it('pauses the watchdogs synchronously when leave starts', async () => {
     call['scheduleAutoDrop']();
+    call['scheduleRingStatePolling']();
+    const timeout = call['ringTimeout'];
+    vi.spyOn(call, 'leave').mockRestore();
+    vi.spyOn(call, 'reject').mockResolvedValue(fromPartial({}));
 
-    await vi.runAllTimersAsync();
+    const poller = call['ringStatePoller'];
 
-    expect(call.leave).toHaveBeenCalledWith({
-      reject: true,
-      reason: 'timeout',
-      message: `ringing timeout - user didn't interact with incoming call screen`,
-    });
+    const leaving = call.leave({ reject: false });
+
+    // paused, not cancelled: both keep the window this leave is ending
+    expect(call['ringTimeout']).toBe(timeout);
+    expect(call['ringStatePoller']).toBe(poller);
+    expect(timeout!['timeoutId']).toBeUndefined();
+    expect(timeout!['stopped']).toBe(false);
+    expect(poller!['idleTimeoutId']).toBeUndefined();
+    expect(poller!['stopped']).toBe(false);
+
+    await leaving.catch(() => {});
+
+    expect(timeout!['stopped']).toBe(true);
+    expect(poller!['stopped']).toBe(true);
   });
 
-  afterEach(() => {
-    vi.useRealTimers();
+  it('restores both watchdogs when rejecting the ring fails', async () => {
+    call['scheduleAutoDrop']();
+    call['scheduleRingStatePolling']();
+    const timeout = call['ringTimeout'];
+    const deadlineAt = timeout!['deadlineAt'];
+    const poller = call['ringStatePoller'];
+    const pollDeadlineAt = poller!['deadlineAt'];
+    vi.spyOn(call, 'leave').mockRestore();
+    vi.spyOn(call, 'reject').mockRejectedValueOnce(new Error('transient'));
+
+    await expect(call.leave({ reject: true })).rejects.toThrow('transient');
+
+    expect(call.state.callingState).toBe(CallingState.RINGING);
+    expect(call['ringTimeout']).toBe(timeout);
+    expect(timeout!['timeoutId']).toBeDefined();
+    expect(timeout!['deadlineAt']).toBe(deadlineAt);
+    expect(call['ringStatePoller']).toBe(poller);
+    expect(poller!['deadlineAt']).toBe(pollDeadlineAt);
+    expect(poller!['stopped']).toBe(false);
+  });
+
+  it('replaces a previously armed timeout', async () => {
+    call['scheduleAutoDrop']();
+    const first = call['ringTimeout'];
+
+    call['scheduleAutoDrop']();
+
+    expect(call['ringTimeout']).not.toBe(first);
+    expect(first!['stopped']).toBe(true);
+    await vi.advanceTimersByTimeAsync(TIMEOUT_MS);
+    expect(call.leave).toHaveBeenCalledTimes(1);
   });
 });

package/src/__tests__/Call.getRingState.test.ts

@@ -0,0 +1,87 @@
+import '../rtc/__tests__/mocks/webrtc.mocks';
+
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { fromPartial } from '@total-typescript/shoehorn';
+import { Call } from '../Call';
+import { StreamClient } from '../coordinator/connection/client';
+import { ClientEventReporter } from '../reporting';
+import { generateUUIDv4 } from '../coordinator/connection/utils';
+import { ClientState } from '../store';
+import { CallSessionResponse } from '../gen/coordinator';
+
+describe('Call.getRingState', () => {
+  const callId = generateUUIDv4();
+
+  const fakeCall = (sessionId?: string) => {
+    const streamClient = new StreamClient('abc');
+    const call = new Call({
+      type: 'test',
+      id: callId,
+      streamClient,
+      clientEventReporter: new ClientEventReporter({ streamClient }),
+      clientState: new ClientState(),
+    });
+
+    if (sessionId) {
+      call.state['sessionSubject'].next(
+        fromPartial<CallSessionResponse>({ id: sessionId }),
+      );
+    }
+
+    const get = vi
+      .spyOn(streamClient, 'get')
+      .mockResolvedValue(fromPartial({ session_id: sessionId }));
+
+    return { call, get };
+  };
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it('reads the ring state of the current session', async () => {
+    const { call, get } = fakeCall('session-1');
+
+    await call.getRingState();
+
+    expect(get).toHaveBeenCalledWith(`/call/test/${callId}/ring_state`, {
+      call_session_id: 'session-1',
+    });
+  });
+
+  it('reads the ring state of an explicitly named session', async () => {
+    // ending a call clears its current session, so a caller reconciling after
+    // `call.ended` has to name the session it rang on
+    const { call, get } = fakeCall('current-session');
+
+    await call.getRingState('ended-session');
+
+    expect(get).toHaveBeenCalledWith(`/call/test/${callId}/ring_state`, {
+      call_session_id: 'ended-session',
+    });
+  });
+
+  it('returns the coordinator response', async () => {
+    const { call, get } = fakeCall('session-1');
+    get.mockResolvedValue(
+      fromPartial({
+        session_id: 'session-1',
+        accepted_by: { bob: '2026-08-24T10:00:04Z' },
+      }),
+    );
+
+    await expect(call.getRingState()).resolves.toMatchObject({
+      session_id: 'session-1',
+      accepted_by: { bob: '2026-08-24T10:00:04Z' },
+    });
+  });
+
+  it('rejects when the call has no session to read', async () => {
+    const { call, get } = fakeCall();
+
+    await expect(call.getRingState()).rejects.toThrow(
+      'Cannot read the ring state: the call has no session',
+    );
+    expect(get).not.toHaveBeenCalled();
+  });
+});