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

* Load jobs state from call state * Fix rendering of live captions overlay (cherry picked from commit 13ca346) Co-authored-by: Claudio Costa <[email protected]>
mattermost · Aug 28, 2024 · d5b8e17 · d5b8e17
1 parent ca69ba8
commit d5b8e17
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git 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
@@ -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);
+    }
 };