@stream-io/video-client 0.1.11 → 0.2.0

package/CHANGELOG.md

@@ -2,6 +2,17 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.2.0](https://github.com/GetStream/stream-video-js/compare/client0.1.11...client0.2.0) (2023-08-07)
+
+
+### ⚠ BREAKING CHANGES
+
+* Server-side participant pinning (#881)
+
+### Features
+
+* Server-side participant pinning ([#881](https://github.com/GetStream/stream-video-js/issues/881)) ([72829f1](https://github.com/GetStream/stream-video-js/commit/72829f1caf5b9c719d063a7e5175b7aa7431cd71))
+
 ### [0.1.11](https://github.com/GetStream/stream-video-js/compare/client0.1.10...client0.1.11) (2023-08-04)
 
 

package/dist/index.browser.es.js

@@ -47,6 +47,7 @@ const OwnCapability = {
     JOIN_CALL: 'join-call',
     JOIN_ENDED_CALL: 'join-ended-call',
     MUTE_USERS: 'mute-users',
+    PIN_FOR_EVERYONE: 'pin-for-everyone',
     READ_CALL: 'read-call',
     REMOVE_CALL_MEMBER: 'remove-call-member',
     SCREENSHARE: 'screenshare',
@@ -971,10 +972,17 @@ class CallState$Type extends MessageType {
                 kind: 'message',
                 T: () => ParticipantCount,
             },
+            {
+                no: 4,
+                name: 'pins',
+                kind: 'message',
+                repeat: 1 /*RepeatType.PACKED*/,
+                T: () => Pin,
+            },
         ]);
     }
     create(value) {
-        const message = { participants: [] };
+        const message = { participants: [], pins: [] };
         globalThis.Object.defineProperty(message, MESSAGE_TYPE, {
             enumerable: false,
             value: this,
@@ -997,6 +1005,9 @@ class CallState$Type extends MessageType {
                 case /* stream.video.sfu.models.ParticipantCount participant_count */ 3:
                     message.participantCount = ParticipantCount.internalBinaryRead(reader, reader.uint32(), options, message.participantCount);
                     break;
+                case /* repeated stream.video.sfu.models.Pin pins */ 4:
+                    message.pins.push(Pin.internalBinaryRead(reader, reader.uint32(), options));
+                    break;
                 default:
                     let u = options.readUnknownField;
                     if (u === 'throw')
@@ -1018,6 +1029,9 @@ class CallState$Type extends MessageType {
         /* stream.video.sfu.models.ParticipantCount participant_count = 3; */
         if (message.participantCount)
             ParticipantCount.internalBinaryWrite(message.participantCount, writer.tag(3, WireType.LengthDelimited).fork(), options).join();
+        /* repeated stream.video.sfu.models.Pin pins = 4; */
+        for (let i = 0; i < message.pins.length; i++)
+            Pin.internalBinaryWrite(message.pins[i], writer.tag(4, WireType.LengthDelimited).fork(), options).join();
         let u = options.writeUnknownFields;
         if (u !== false)
             (u == true ? UnknownFieldHandler.onWrite : u)(this.typeName, message, writer);
@@ -1086,6 +1100,63 @@ class ParticipantCount$Type extends MessageType {
  */
 const ParticipantCount = new ParticipantCount$Type();
 // @generated message type with reflection information, may provide speed optimized methods
+class Pin$Type extends MessageType {
+    constructor() {
+        super('stream.video.sfu.models.Pin', [
+            { no: 1, name: 'user_id', kind: 'scalar', T: 9 /*ScalarType.STRING*/ },
+            { no: 2, name: 'session_id', kind: 'scalar', T: 9 /*ScalarType.STRING*/ },
+        ]);
+    }
+    create(value) {
+        const message = { userId: '', sessionId: '' };
+        globalThis.Object.defineProperty(message, MESSAGE_TYPE, {
+            enumerable: false,
+            value: this,
+        });
+        if (value !== undefined)
+            reflectionMergePartial(this, message, value);
+        return message;
+    }
+    internalBinaryRead(reader, length, options, target) {
+        let message = target !== null && target !== void 0 ? target : this.create(), end = reader.pos + length;
+        while (reader.pos < end) {
+            let [fieldNo, wireType] = reader.tag();
+            switch (fieldNo) {
+                case /* string user_id */ 1:
+                    message.userId = reader.string();
+                    break;
+                case /* string session_id */ 2:
+                    message.sessionId = reader.string();
+                    break;
+                default:
+                    let u = options.readUnknownField;
+                    if (u === 'throw')
+                        throw new globalThis.Error(`Unknown field ${fieldNo} (wire type ${wireType}) for ${this.typeName}`);
+                    let d = reader.skip(wireType);
+                    if (u !== false)
+                        (u === true ? UnknownFieldHandler.onRead : u)(this.typeName, message, fieldNo, wireType, d);
+            }
+        }
+        return message;
+    }
+    internalBinaryWrite(message, writer, options) {
+        /* string user_id = 1; */
+        if (message.userId !== '')
+            writer.tag(1, WireType.LengthDelimited).string(message.userId);
+        /* string session_id = 2; */
+        if (message.sessionId !== '')
+            writer.tag(2, WireType.LengthDelimited).string(message.sessionId);
+        let u = options.writeUnknownFields;
+        if (u !== false)
+            (u == true ? UnknownFieldHandler.onWrite : u)(this.typeName, message, writer);
+        return writer;
+    }
+}
+/**
+ * @generated MessageType for protobuf message stream.video.sfu.models.Pin
+ */
+const Pin = new Pin$Type();
+// @generated message type with reflection information, may provide speed optimized methods
 class Participant$Type extends MessageType {
     constructor() {
         super('stream.video.sfu.models.Participant', [
@@ -2400,6 +2471,7 @@ var models = /*#__PURE__*/Object.freeze({
     Participant: Participant,
     ParticipantCount: ParticipantCount,
     get PeerType () { return PeerType; },
+    Pin: Pin,
     Sdk: Sdk,
     get SdkType () { return SdkType; },
     StreamQuality: StreamQuality,
@@ -3491,6 +3563,13 @@ class SfuEvent$Type extends MessageType {
                 oneof: 'eventPayload',
                 T: () => ICERestart,
             },
+            {
+                no: 22,
+                name: 'pins_updated',
+                kind: 'message',
+                oneof: 'eventPayload',
+                T: () => PinsChanged,
+            },
         ]);
     }
     create(value) {
@@ -3610,6 +3689,12 @@ class SfuEvent$Type extends MessageType {
                         iceRestart: ICERestart.internalBinaryRead(reader, reader.uint32(), options, message.eventPayload.iceRestart),
                     };
                     break;
+                case /* stream.video.sfu.event.PinsChanged pins_updated */ 22:
+                    message.eventPayload = {
+                        oneofKind: 'pinsUpdated',
+                        pinsUpdated: PinsChanged.internalBinaryRead(reader, reader.uint32(), options, message.eventPayload.pinsUpdated),
+                    };
+                    break;
                 default:
                     let u = options.readUnknownField;
                     if (u === 'throw')
@@ -3673,6 +3758,9 @@ class SfuEvent$Type extends MessageType {
         /* stream.video.sfu.event.ICERestart ice_restart = 21; */
         if (message.eventPayload.oneofKind === 'iceRestart')
             ICERestart.internalBinaryWrite(message.eventPayload.iceRestart, writer.tag(21, WireType.LengthDelimited).fork(), options).join();
+        /* stream.video.sfu.event.PinsChanged pins_updated = 22; */
+        if (message.eventPayload.oneofKind === 'pinsUpdated')
+            PinsChanged.internalBinaryWrite(message.eventPayload.pinsUpdated, writer.tag(22, WireType.LengthDelimited).fork(), options).join();
         let u = options.writeUnknownFields;
         if (u !== false)
             (u == true ? UnknownFieldHandler.onWrite : u)(this.typeName, message, writer);
@@ -3684,6 +3772,62 @@ class SfuEvent$Type extends MessageType {
  */
 const SfuEvent = new SfuEvent$Type();
 // @generated message type with reflection information, may provide speed optimized methods
+class PinsChanged$Type extends MessageType {
+    constructor() {
+        super('stream.video.sfu.event.PinsChanged', [
+            {
+                no: 1,
+                name: 'pins',
+                kind: 'message',
+                repeat: 1 /*RepeatType.PACKED*/,
+                T: () => Pin,
+            },
+        ]);
+    }
+    create(value) {
+        const message = { pins: [] };
+        globalThis.Object.defineProperty(message, MESSAGE_TYPE, {
+            enumerable: false,
+            value: this,
+        });
+        if (value !== undefined)
+            reflectionMergePartial(this, message, value);
+        return message;
+    }
+    internalBinaryRead(reader, length, options, target) {
+        let message = target !== null && target !== void 0 ? target : this.create(), end = reader.pos + length;
+        while (reader.pos < end) {
+            let [fieldNo, wireType] = reader.tag();
+            switch (fieldNo) {
+                case /* repeated stream.video.sfu.models.Pin pins */ 1:
+                    message.pins.push(Pin.internalBinaryRead(reader, reader.uint32(), options));
+                    break;
+                default:
+                    let u = options.readUnknownField;
+                    if (u === 'throw')
+                        throw new globalThis.Error(`Unknown field ${fieldNo} (wire type ${wireType}) for ${this.typeName}`);
+                    let d = reader.skip(wireType);
+                    if (u !== false)
+                        (u === true ? UnknownFieldHandler.onRead : u)(this.typeName, message, fieldNo, wireType, d);
+            }
+        }
+        return message;
+    }
+    internalBinaryWrite(message, writer, options) {
+        /* repeated stream.video.sfu.models.Pin pins = 1; */
+        for (let i = 0; i < message.pins.length; i++)
+            Pin.internalBinaryWrite(message.pins[i], writer.tag(1, WireType.LengthDelimited).fork(), options).join();
+        let u = options.writeUnknownFields;
+        if (u !== false)
+            (u == true ? UnknownFieldHandler.onWrite : u)(this.typeName, message, writer);
+        return writer;
+    }
+}
+/**
+ * @generated MessageType for protobuf message stream.video.sfu.event.PinsChanged
+ */
+const PinsChanged = new PinsChanged$Type();
+// @generated message type with reflection information, may provide speed optimized methods
 class Error$Type extends MessageType {
     constructor() {
         super('stream.video.sfu.event.Error', [
@@ -5546,6 +5690,7 @@ var events = /*#__PURE__*/Object.freeze({
     Migration: Migration,
     ParticipantJoined: ParticipantJoined,
     ParticipantLeft: ParticipantLeft,
+    PinsChanged: PinsChanged,
     PublisherAnswer: PublisherAnswer,
     SfuEvent: SfuEvent,
     SfuRequest: SfuRequest,
@@ -6038,6 +6183,7 @@ const sfuEventKinds = {
     callGrantsUpdated: undefined,
     goAway: undefined,
     iceRestart: undefined,
+    pinsUpdated: undefined,
 };
 const isSfuEvent = (eventName) => {
     return Object.prototype.hasOwnProperty.call(sfuEventKinds, eventName);
@@ -7690,15 +7836,19 @@ const publishingAudio = (a, b) => {
  * @param b the second participant.
  */
 const pinned = (a, b) => {
-    if (a.pinnedAt && b.pinnedAt) {
-        if (a.pinnedAt > b.pinnedAt)
+    if (a.pin && b.pin) {
+        if (!a.pin.isLocalPin && b.pin.isLocalPin)
+            return -1;
+        if (a.pin.isLocalPin && !b.pin.isLocalPin)
+            return 1;
+        if (a.pin.pinnedAt > b.pin.pinnedAt)
             return -1;
-        if (a.pinnedAt < b.pinnedAt)
+        if (a.pin.pinnedAt < b.pin.pinnedAt)
             return 1;
     }
-    if (a.pinnedAt && !b.pinnedAt)
+    if (a.pin && !b.pin)
         return -1;
-    if (!a.pinnedAt && b.pinnedAt)
+    if (!a.pin && b.pin)
         return 1;
     return 0;
 };
@@ -8097,11 +8247,39 @@ class CallState {
                 return p;
             }));
         };
+        /**
+         * Updates the participant pinned state with server side pinning data.
+         *
+         * @param pins the latest pins from the server.
+         */
+        this.setServerSidePins = (pins) => {
+            const pinsLookup = pins.reduce((lookup, pin) => {
+                lookup[pin.sessionId] = Date.now();
+                return lookup;
+            }, {});
+            return this.setParticipants((participants) => participants.map((participant) => {
+                const serverSidePinnedAt = pinsLookup[participant.sessionId];
+                // the participant is newly pinned
+                if (serverSidePinnedAt) {
+                    return Object.assign(Object.assign({}, participant), { pin: {
+                            isLocalPin: false,
+                            pinnedAt: serverSidePinnedAt,
+                        } });
+                }
+                // the participant is no longer pinned server side
+                // we need to reset the pin
+                if (participant.pin && !participant.pin.isLocalPin) {
+                    return Object.assign(Object.assign({}, participant), { pin: undefined });
+                }
+                // no changes to be applied
+                return participant;
+            }));
+        };
         this.logger = getLogger(['call-state']);
         this.participants$ = this.participantsSubject.pipe(map$1((ps) => ps.sort(this.sortParticipantsBy)));
         this.localParticipant$ = this.participants$.pipe(map$1((participants) => participants.find(isStreamVideoLocalParticipant)));
         this.remoteParticipants$ = this.participants$.pipe(map$1((participants) => participants.filter((p) => !p.isLocalParticipant)));
-        this.pinnedParticipants$ = this.participants$.pipe(map$1((participants) => participants.filter((p) => p.pinnedAt)));
+        this.pinnedParticipants$ = this.participants$.pipe(map$1((participants) => participants.filter((p) => !!p.pin)));
         this.dominantSpeaker$ = this.participants$.pipe(map$1((participants) => participants.find((p) => p.isDominantSpeaker)));
         this.hasOngoingScreenShare$ = this.participants$.pipe(map$1((participants) => {
             return participants.some((p) => p.publishedTracks.includes(TrackType.SCREEN_SHARE));
@@ -8414,6 +8592,18 @@ const watchSfuErrorReports = (dispatcher) => {
         });
     });
 };
+/**
+ * Watches for `pinsUpdated` events and updates the pinned state of participants
+ * in the call.
+ */
+const watchPinsUpdated = (state) => {
+    return function onPinsUpdated(e) {
+        if (e.eventPayload.oneofKind !== 'pinsUpdated')
+            return;
+        const { pins } = e.eventPayload.pinsUpdated;
+        state.setServerSidePins(pins);
+    };
+};
 
 /**
  * Watches for `call.member_added` events.
@@ -8792,6 +8982,7 @@ const registerEventHandlers = (call, state, dispatcher) => {
         watchAudioLevelChanged(dispatcher, state),
         watchDominantSpeakerChanged(dispatcher, state),
         call.on('callGrantsUpdated', watchCallGrantsUpdated(state)),
+        call.on('pinsUpdated', watchPinsUpdated(state)),
     ];
     Object.keys(coordinatorEvents).forEach((event) => {
         const eventName = event;
@@ -8897,14 +9088,8 @@ const getCascadingModeParams = () => {
 const reconcileParticipantLocalState = (target, source) => {
     if (!source)
         return target;
-    target.audioStream = source.audioStream;
-    target.videoStream = source.videoStream;
-    target.screenShareStream = source.screenShareStream;
-    target.videoDimension = source.videoDimension;
-    target.screenShareDimension = source.screenShareDimension;
-    target.pinnedAt = source.pinnedAt;
-    target.reaction = source.reaction;
-    target.viewportVisibilityState = source.viewportVisibilityState;
+    // copy everything from source to target
+    Object.assign(target, source);
     if (isStreamVideoLocalParticipant(source) &&
         isStreamVideoLocalParticipant(target)) {
         target.audioDeviceId = source.audioDeviceId;
@@ -9587,7 +9772,7 @@ class Call {
          * @returns a promise which resolves once the call join-flow has finished.
          */
         this.join = (data) => __awaiter(this, void 0, void 0, function* () {
-            var _e, _f;
+            var _e, _f, _g;
             const callingState = this.state.callingState;
             if ([CallingState.JOINED, CallingState.JOINING].includes(callingState)) {
                 this.logger('warn', 'Join method called twice, you should only call this once');
@@ -9835,6 +10020,7 @@ class Call {
                 const startedAt = (callState === null || callState === void 0 ? void 0 : callState.startedAt)
                     ? Timestamp.toDate(callState.startedAt)
                     : new Date();
+                const pins = (_g = callState === null || callState === void 0 ? void 0 : callState.pins) !== null && _g !== void 0 ? _g : [];
                 this.state.setParticipants(() => {
                     const participantLookup = this.state.getParticipantLookupBySessionId();
                     return currentParticipants.map((p) => {
@@ -9842,7 +10028,7 @@ class Call {
                             isLocalParticipant: p.sessionId === sfuClient.sessionId,
                             viewportVisibilityState: VisibilityState.UNKNOWN,
                         });
-                        // We need to preserve some of the local state of the participant
+                        // We need to preserve the local state of the participant
                         // (e.g. videoDimension, visibilityState, pinnedAt, etc.)
                         // as it doesn't exist on the server.
                         const existingParticipant = participantLookup[p.sessionId];
@@ -9852,6 +10038,7 @@ class Call {
                 this.state.setParticipantCount((participantCount === null || participantCount === void 0 ? void 0 : participantCount.total) || 0);
                 this.state.setAnonymousParticipantCount((participantCount === null || participantCount === void 0 ? void 0 : participantCount.anonymous) || 0);
                 this.state.setStartedAt(startedAt);
+                this.state.setServerSidePins(pins);
                 this.reconnectAttempts = 0; // reset the reconnect attempts counter
                 this.state.setCallingState(CallingState.JOINED);
                 // 3. once we have the "joinResponse", and possibly reconciled the local state
@@ -9976,9 +10163,9 @@ class Call {
          * @param trackType the track type to stop publishing.
          */
         this.stopPublish = (trackType) => __awaiter(this, void 0, void 0, function* () {
-            var _g;
+            var _h;
             this.logger('info', `stopPublish ${TrackType[trackType]}`);
-            yield ((_g = this.publisher) === null || _g === void 0 ? void 0 : _g.unpublishStream(trackType));
+            yield ((_h = this.publisher) === null || _h === void 0 ? void 0 : _h.unpublishStream(trackType));
         });
         /**
          * Update track subscription configuration for one or more participants.
@@ -10066,6 +10253,8 @@ class Call {
          * @param deviceId the selected device, `undefined` means the user wants to use the system's default audio output
          */
         this.setAudioOutputDevice = (deviceId) => {
+            if (!this.sfuClient)
+                return;
             this.state.updateParticipant(this.sfuClient.sessionId, {
                 audioOutputDeviceId: deviceId,
             });
@@ -10079,6 +10268,8 @@ class Call {
          * @param deviceId the selected device, pass `undefined` to clear the device selection
          */
         this.setAudioDevice = (deviceId) => {
+            if (!this.sfuClient)
+                return;
             this.state.updateParticipant(this.sfuClient.sessionId, {
                 audioDeviceId: deviceId,
             });
@@ -10091,6 +10282,8 @@ class Call {
          * @param deviceId the selected device, pass `undefined` to clear the device selection
          */
         this.setVideoDevice = (deviceId) => {
+            if (!this.sfuClient)
+                return;
             this.state.updateParticipant(this.sfuClient.sessionId, {
                 videoDeviceId: deviceId,
             });
@@ -10119,8 +10312,8 @@ class Call {
          * @returns
          */
         this.updatePublishQuality = (enabledRids) => __awaiter(this, void 0, void 0, function* () {
-            var _h;
-            return (_h = this.publisher) === null || _h === void 0 ? void 0 : _h.updateVideoPublishQuality(enabledRids);
+            var _j;
+            return (_j = this.publisher) === null || _j === void 0 ? void 0 : _j.updateVideoPublishQuality(enabledRids);
         });
         this.assertCallJoined = () => {
             return new Promise((resolve) => {
@@ -10324,16 +10517,48 @@ class Call {
             return this.streamClient.post(`${this.streamClientBasePath}/mark_ended`);
         });
         /**
-         * Sets the `participant.pinnedAt` value.
-         * @param sessionId the session id of the participant
-         * @param pinnedAt the value to set the participant.pinnedAt
-         * @returns
+         * Pins the given session to the top of the participants list.
+         *
+         * @param sessionId the sessionId to pin.
+         */
+        this.pin = (sessionId) => {
+            this.state.updateParticipant(sessionId, {
+                pin: {
+                    isLocalPin: true,
+                    pinnedAt: Date.now(),
+                },
+            });
+        };
+        /**
+         * Unpins the given session from the top of the participants list.
+         *
+         * @param sessionId the sessionId to unpin.
          */
-        this.setParticipantPinnedAt = (sessionId, pinnedAt) => {
+        this.unpin = (sessionId) => {
             this.state.updateParticipant(sessionId, {
-                pinnedAt,
+                pin: undefined,
             });
         };
+        /**
+         * Pins the given session to the top of the participants list for everyone
+         * in the call.
+         * You can execute this method only if you have the `pin-for-everyone` capability.
+         *
+         * @param request the request object.
+         */
+        this.pinForEveryone = (request) => __awaiter(this, void 0, void 0, function* () {
+            return this.streamClient.post(`${this.streamClientBasePath}/pin`, request);
+        });
+        /**
+         * Unpins the given session from the top of the participants list for everyone
+         * in the call.
+         * You can execute this method only if you have the `pin-for-everyone` capability.
+         *
+         * @param request the request object.
+         */
+        this.unpinForEveryone = (request) => __awaiter(this, void 0, void 0, function* () {
+            return this.streamClient.post(`${this.streamClientBasePath}/unpin`, request);
+        });
         /**
          * Query call members with filter query. The result won't be stored in call state.
          * @param request
@@ -11651,7 +11876,7 @@ class WSConnectionFallback {
     }
 }
 
-const version = '0.1.11';
+const version = '0.2.0';
 
 const logger = getLogger(['location']);
 const HINT_URL = `https://hint.stream-io-video.com/`;