From bebcfa3fd705a2a7437e8720b2002507e9bec68d Mon Sep 17 00:00:00 2001
From: Horatiu Muresan <39557534+horymury@users.noreply.github.com>
Date: Tue, 11 Jun 2024 13:59:11 +0300
Subject: [PATCH] fix(iOS-responsive-ui) Attempt fix iOS responsive ui issue
 (#14819)

- on iOS safari and chrome, in case we show eg a spinner until we get the videoConferenceJoined event, all `clientResize` are done with size 0 for width/height
- on iOS we never get a `clientResize` call with correct values, except if we force a call by eg opening/closing the chat window
---
 react/features/base/responsive-ui/actions.ts       |  4 ++++
 .../features/base/responsive-ui/middleware.web.ts  | 14 ++++++++++++++
 2 files changed, 18 insertions(+)

diff --git a/react/features/base/responsive-ui/actions.ts b/react/features/base/responsive-ui/actions.ts
index 7b89a75168..f33cfaa466 100644
--- a/react/features/base/responsive-ui/actions.ts
+++ b/react/features/base/responsive-ui/actions.ts
@@ -35,6 +35,10 @@ const REDUCED_UI_THRESHOLD = 300;
  */
 export function clientResized(clientWidth: number, clientHeight: number) {
     return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
+        if (!clientWidth && !clientHeight) {
+            return;
+        }
+
         let availableWidth = clientWidth;
 
         if (navigator.product !== 'ReactNative') {
diff --git a/react/features/base/responsive-ui/middleware.web.ts b/react/features/base/responsive-ui/middleware.web.ts
index b1b7932b8c..f4130b54af 100644
--- a/react/features/base/responsive-ui/middleware.web.ts
+++ b/react/features/base/responsive-ui/middleware.web.ts
@@ -1,5 +1,6 @@
 import { IStore } from '../../app/types';
 import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../app/actionTypes';
+import { CONFERENCE_JOINED } from '../conference/actionTypes';
 import MiddlewareRegistry from '../redux/MiddlewareRegistry';
 
 import { clientResized } from './actions';
@@ -27,6 +28,19 @@ MiddlewareRegistry.register(store => next => action => {
         _appWillMount(store);
         break;
 
+    case CONFERENCE_JOINED: {
+        const { clientHeight = 0, clientWidth = 0 } = store.getState()['features/base/responsive-ui'];
+
+        if (!clientHeight && !clientWidth) {
+            const {
+                innerHeight,
+                innerWidth
+            } = window;
+
+            store.dispatch(clientResized(innerWidth, innerHeight));
+        }
+        break;
+    }
     }
 
     return result;