fix: max simulcast layers preference

packages/client/src/rtc/Publisher.ts

@@ -390,11 +390,12 @@ export class Publisher {
 
     let changed = false;
     for (const encoder of params.encodings) {
-      const layer = usesSvcCodec
-        ? // for SVC, we only have one layer (q) and often rid is omitted
-          enabledLayers[0]
-        : // for non-SVC, we need to find the layer by rid (simulcast)
-          enabledLayers.find((l) => l.name === encoder.rid);
+      const layer =
+        usesSvcCodec || enabledLayers.length === 1
+          ? // for SVC, we only have one layer (q) and often rid is omitted
+            enabledLayers[0]
+          : // for non-SVC, we need to find the layer by rid (simulcast)
+            enabledLayers.find((l) => l.name === encoder.rid);
 
       // flip 'active' flag only when necessary
       const shouldActivate = !!layer?.active;

packages/client/src/rtc/videoLayers.ts

@@ -65,7 +65,11 @@ export const findOptimalVideoLayers = (
   const optimalVideoLayers: OptimalVideoLayer[] = [];
   const settings = videoTrack.getSettings();
   const { width = 0, height = 0 } = settings;
-  const { scalabilityMode, bitrateDownscaleFactor = 2 } = publishOptions || {};
+  const {
+    scalabilityMode,
+    bitrateDownscaleFactor = 2,
+    maxSimulcastLayers = 3,
+  } = publishOptions || {};
   const maxBitrate = getComputedMaxBitrate(
     targetResolution,
     width,
@@ -76,7 +80,7 @@ export const findOptimalVideoLayers = (
   let downscaleFactor = 1;
   let bitrateFactor = 1;
   const svcCodec = isSvcCodec(codecInUse);
-  for (const rid of ['f', 'h', 'q']) {
+  for (const rid of ['f', 'h', 'q'].slice(0, Math.min(3, maxSimulcastLayers))) {
     const layer: OptimalVideoLayer = {
       active: true,
       rid,

packages/client/src/types.ts

@@ -181,6 +181,10 @@ export type PublishOptions = {
    * in simulcast mode (non-SVC).
    */
   bitrateDownscaleFactor?: number;
+  /**
+   * The maximum number of simulcast layers to use when publishing the video stream.
+   */
+  maxSimulcastLayers?: number;
   /**
    * Screen share settings.
    */

sample-apps/react/react-dogfood/components/MeetingUI.tsx

@@ -56,6 +56,9 @@ export const MeetingUI = ({ chatClient, mode }: MeetingUIProps) => {
   const scalabilityMode = router.query['scalability_mode'] as
     | string
     | undefined;
+  const maxSimulcastLayers = router.query['max_simulcast_layers'] as
+    | string
+    | undefined;
 
   const onJoin = useCallback(
     async ({ fastJoin = false } = {}) => {
@@ -67,13 +70,16 @@ export const MeetingUI = ({ chatClient, mode }: MeetingUIProps) => {
           : undefined;
 
         call.updatePublishOptions({
-          preferredCodec: 'vp9',
+          preferredCodec: 'h264',
           forceCodec: videoCodecOverride,
           scalabilityMode,
           preferredBitrate,
           bitrateDownscaleFactor: bitrateFactorOverride
             ? parseInt(bitrateFactorOverride, 10)
             : 2, // default to 2
+          maxSimulcastLayers: maxSimulcastLayers
+            ? parseInt(maxSimulcastLayers, 10)
+            : 3, // default to 3
         });
 
         await call.join({ create: true });