From dfffcc001559822e30c6c09bcee68075b6e9ce3a Mon Sep 17 00:00:00 2001
From: Mattermost Build <build@mattermost.com>
Date: Wed, 28 Aug 2024 16:06:52 +0200
Subject: [PATCH] Automated cherry pick of #8185 (#8186)

* [MM-60291] Fix rendering of live captions (#8185)

* Load jobs state from call state

* Fix rendering of live captions overlay

(cherry picked from commit 13ca3461556c2677edef7182c8e393b060a8489d)

* Fix type error

---------

Co-authored-by: Claudio Costa <cstcld91@gmail.com>
---
 app/products/calls/components/captions.tsx                | 6 +++++-
 app/products/calls/connection/websocket_event_handlers.ts | 8 ++++++++
 app/products/calls/types/calls.ts                         | 1 +
 package-lock.json                                         | 4 ++--
 4 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/app/products/calls/components/captions.tsx b/app/products/calls/components/captions.tsx
index 47bffee41..dff6410d0 100644
--- a/app/products/calls/components/captions.tsx
+++ b/app/products/calls/components/captions.tsx
@@ -21,11 +21,15 @@ const styles = StyleSheet.create({
     captionContainer: {
         display: 'flex',
         height: 400,
-        bottom: -352, // 48-400, to place the bottoms at the same place
+        bottom: 400 - 48, // to place the bottoms at the same place
         gap: 8,
         alignItems: 'center',
         flexDirection: 'column-reverse',
         overflow: 'hidden',
+
+        // needed so that events (e.g., long press on participants)
+        // still work when the captions overlay is rendered on top
+        pointerEvents: 'none',
     },
     caption: {
         paddingTop: 1,
diff --git a/app/products/calls/connection/websocket_event_handlers.ts b/app/products/calls/connection/websocket_event_handlers.ts
index 9a0693dda..5c1c9aac0 100644
--- a/app/products/calls/connection/websocket_event_handlers.ts
+++ b/app/products/calls/connection/websocket_event_handlers.ts
@@ -250,5 +250,13 @@ export const handleCallState = (serverUrl: string, msg: WebSocketMessage<CallSta
     const call = createCallAndAddToIds(msg.data.channel_id, callState);
 
     setCallForChannel(serverUrl, msg.data.channel_id, call);
+
+    if (callState.recording) {
+        setRecordingState(serverUrl, msg.data.channel_id, callState.recording);
+    }
+
+    if (callState.live_captions) {
+        setCaptioningState(serverUrl, msg.data.channel_id, callState.live_captions);
+    }
 };
 
diff --git a/app/products/calls/types/calls.ts b/app/products/calls/types/calls.ts
index 16bd631a1..4e3fe7f80 100644
--- a/app/products/calls/types/calls.ts
+++ b/app/products/calls/types/calls.ts
@@ -174,6 +174,7 @@ export const DefaultCallsConfig: CallsConfigState = {
     EnableTranscriptions: false,
     EnableLiveCaptions: false,
     HostControlsAllowed: false,
+    GroupCallsAllowed: true, // Set to true to keep backward compatibility with older servers.
 };
 
 export type ApiResp = {
diff --git a/package-lock.json b/package-lock.json
index 150f145ec..19cc693e3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6,7 +6,7 @@
   "packages": {
     "": {
       "name": "mattermost-mobile",
-      "version": "2.18.0",
+      "version": "2.19.1",
       "hasInstallScript": true,
       "license": "Apache 2.0",
       "dependencies": {
@@ -49,7 +49,7 @@
         "emoji-regex": "10.3.0",
         "expo": "51.0.14",
         "expo-application": "5.9.1",
-        "expo-crypto": "~13.0.2",
+        "expo-crypto": "13.0.2",
         "expo-device": "6.0.2",
         "expo-image": "1.12.12",
         "expo-linear-gradient": "13.0.2",