From ffbaee065da0dc581dba6bf44bd2b7725a0418d9 Mon Sep 17 00:00:00 2001
From: damencho <damencho@jitsi.org>
Date: Fri, 22 Mar 2024 12:49:43 -0500
Subject: [PATCH] fix: Fixes showing left participants in the pane under
 certain conditions.

Fixes #14491.
When a screensharing participant leaves and is unmuted or sharing the tab audio, there is a dominant speaker changed event which stores wrong values in filmstrip state. And because we skip reordering when there is no filmstrip scroll and no screensharers to avoid reordering on every dominant speaker event for small meetings, we fail to evaluate that the screensharere is actually gone and we still show it.
This will not happen if the one sharing is not dominant speaker (muted) or if there are more participants in the meeting (there is a scroll).
---
 react/features/filmstrip/functions.any.ts     | 5 +++--
 react/features/filmstrip/middleware.native.ts | 2 +-
 react/features/filmstrip/middleware.web.ts    | 2 +-
 react/features/filmstrip/subscriber.any.ts    | 5 ++++-
 4 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/react/features/filmstrip/functions.any.ts b/react/features/filmstrip/functions.any.ts
index 1a3cb9e233..0a908d5945 100644
--- a/react/features/filmstrip/functions.any.ts
+++ b/react/features/filmstrip/functions.any.ts
@@ -11,16 +11,17 @@ import { isFilmstripScrollVisible } from './functions';
  * Computes the reorderd list of the remote participants.
  *
  * @param {*} store - The redux store.
+ * @param {boolean} force - Does not short circuit, the execution, make execute all checks.
  * @param {string} participantId - The endpoint id of the participant that joined the call.
  * @returns {void}
  * @private
  */
-export function updateRemoteParticipants(store: IStore, participantId?: string) {
+export function updateRemoteParticipants(store: IStore, force?: boolean, participantId?: string) {
     const state = store.getState();
     let reorderedParticipants = [];
     const { sortedRemoteVirtualScreenshareParticipants } = state['features/base/participants'];
 
-    if (!isFilmstripScrollVisible(state) && !sortedRemoteVirtualScreenshareParticipants.size) {
+    if (!isFilmstripScrollVisible(state) && !sortedRemoteVirtualScreenshareParticipants.size && !force) {
         if (participantId) {
             const { remoteParticipants } = state['features/filmstrip'];
 
diff --git a/react/features/filmstrip/middleware.native.ts b/react/features/filmstrip/middleware.native.ts
index 8b198795bd..2cd823f178 100644
--- a/react/features/filmstrip/middleware.native.ts
+++ b/react/features/filmstrip/middleware.native.ts
@@ -28,7 +28,7 @@ MiddlewareRegistry.register(store => next => action => {
         store.dispatch(setTileViewDimensions());
         break;
     case PARTICIPANT_JOINED: {
-        updateRemoteParticipants(store, action.participant?.id);
+        updateRemoteParticipants(store, false, action.participant?.id);
         break;
     }
     }
diff --git a/react/features/filmstrip/middleware.web.ts b/react/features/filmstrip/middleware.web.ts
index a7c514d66e..fc77dc8bb3 100644
--- a/react/features/filmstrip/middleware.web.ts
+++ b/react/features/filmstrip/middleware.web.ts
@@ -114,7 +114,7 @@ MiddlewareRegistry.register(store => next => action => {
             break;
         }
 
-        updateRemoteParticipants(store, action.participant?.id);
+        updateRemoteParticipants(store, false, action.participant?.id);
         break;
     }
     case SETTINGS_UPDATED: {
diff --git a/react/features/filmstrip/subscriber.any.ts b/react/features/filmstrip/subscriber.any.ts
index f61d057e3b..fb5f3e8d3d 100644
--- a/react/features/filmstrip/subscriber.any.ts
+++ b/react/features/filmstrip/subscriber.any.ts
@@ -12,10 +12,13 @@ StateListenerRegistry.register(
 
 /**
  * Listens for changes to the remote screenshare participants to recompute the reordered list of the remote endpoints.
+ * We force updateRemoteParticipants to make sure it executes and for the case where
+ * sortedRemoteVirtualScreenshareParticipants becomes 0. We do not want to short circuit it in case of no screen-sharers
+ * and no scroll and triggered for dominant speaker changed.
  */
 StateListenerRegistry.register(
     /* selector */ state => state['features/base/participants'].sortedRemoteVirtualScreenshareParticipants,
-    /* listener */ (sortedRemoteVirtualScreenshareParticipants, store) => updateRemoteParticipants(store));
+    /* listener */ (sortedRemoteVirtualScreenshareParticipants, store) => updateRemoteParticipants(store, true));
 
 /**
  * Listens for changes to the dominant speaker to recompute the reordered list of the remote endpoints.