From d06d190229c084ac1bf0f511f9f5e3cd11907eef Mon Sep 17 00:00:00 2001
From: Robert Pintilii <robert.pin9@gmail.com>
Date: Wed, 15 Jun 2022 12:04:06 +0100
Subject: [PATCH] fix(keyboard-shortcut) Fix error on number keypress (#11680)

Fix error when pressing a number bigger than the number of participants
Fix local recording issue
---
 react/features/filmstrip/actions.web.js               | 11 ++++++++++-
 .../components/Recording/LocalRecordingManager.web.ts |  2 +-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/react/features/filmstrip/actions.web.js b/react/features/filmstrip/actions.web.js
index 4a017c36b..c3e327f3b 100644
--- a/react/features/filmstrip/actions.web.js
+++ b/react/features/filmstrip/actions.web.js
@@ -50,6 +50,7 @@ import {
     isFilmstripResizable,
     showGridInVerticalView
 } from './functions';
+import { isStageFilmstripAvailable } from './functions.web';
 
 export * from './actions.any';
 
@@ -334,9 +335,17 @@ export function clickOnVideo(n: number) {
         // Use the list that correctly represents the current order of the participants as visible in the UI.
         const { remoteParticipants } = state['features/filmstrip'];
         const participants = [ localId, ...remoteParticipants ];
+
+        if (participants.length - 1 < n) {
+            return;
+        }
         const { id, pinned } = getParticipantById(state, participants[n]);
 
-        dispatch(pinParticipant(pinned ? null : id));
+        if (isStageFilmstripAvailable(state)) {
+            dispatch(togglePinStageParticipant(id));
+        } else {
+            dispatch(pinParticipant(pinned ? null : id));
+        }
     };
 }
 
diff --git a/react/features/recording/components/Recording/LocalRecordingManager.web.ts b/react/features/recording/components/Recording/LocalRecordingManager.web.ts
index 557ab6049..43ac17da0 100644
--- a/react/features/recording/components/Recording/LocalRecordingManager.web.ts
+++ b/react/features/recording/components/Recording/LocalRecordingManager.web.ts
@@ -160,7 +160,7 @@ const LocalRecordingManager: ILocalRecordingManager = {
         // @ts-ignore
         const gdmStream = await navigator.mediaDevices.getDisplayMedia({
             // @ts-ignore
-            video: { displaySurface: 'browser', frameRate: { min: 30 } },
+            video: { displaySurface: 'browser', frameRate: 30 },
             audio: {
                 autoGainControl: false,
                 channelCount: 2,