Merge remote-tracking branch 'origin/v0.13.z-release' into v0.14.z-re…

…lease
mconf · Jul 3, 2024 · 4e939a1 · 4e939a1
2 parents 4f90f81 + d98ef2c
commit 4e939a1
Show file tree

Hide file tree

Showing 3 changed files with 82 additions and 15 deletions.
diff --git a/src/app-content/index.js b/src/app-content/index.js
@@ -63,6 +63,15 @@ const AppContent = ({
     return hasCustomLeaveSession;
   };
 
+  const onForcedLeaveSession = () => {
+    dispatch(leave(api));
+    dispatch(sessionStateChanged({
+      ended: true,
+      endReason: 'logged_out',
+    }));
+    onLeaveSession();
+  };
+
   useEffect(() => {
     logger.info({
       logCode: 'app_mounted',
@@ -87,7 +96,12 @@ const AppContent = ({
             onPress: () => { },
             style: 'cancel',
           },
-          { text: 'OK', onPress: () => dispatch(leave(api)) },
+          {
+            text: 'OK',
+            onPress: () => {
+              onForcedLeaveSession();
+            }
+          },
         ]);
       }
 
@@ -120,7 +134,10 @@ const AppContent = ({
 
   if (transferUrl) {
     return (
-      <TransferScreen transferUrl={transferUrl} />
+      <TransferScreen
+        transferUrl={transferUrl}
+        onLeaveSession={onForcedLeaveSession}
+      />
     );
   }
 

diff --git a/src/screens/transfer-screen/index.js b/src/screens/transfer-screen/index.js
@@ -1,26 +1,43 @@
 import React, { useState } from 'react';
+import { Alert } from 'react-native';
 import WebView from 'react-native-webview';
-import { View } from 'react-native';
 import { useTranslation } from 'react-i18next';
 import LottieView from 'lottie-react-native';
 import Styled from './styles';
 
 const TransferScreen = (props) => {
-  const { transferUrl } = props;
+  const { transferUrl, onLeaveSession } = props;
   const [joinTransfer, setJoinTransfer] = useState(false);
   const { t } = useTranslation();
 
+  const leaveConference = () => (
+    Alert.alert(t('app.leaveModal.title'), t('app.leaveModal.desc'), [
+      {
+        text: t('app.settings.main.cancel.label'),
+        onPress: () => { },
+        style: 'cancel',
+      },
+      {
+        text: 'OK',
+        onPress: () => { onLeaveSession(); }
+      },
+    ])
+  );
+
   if (joinTransfer) {
     return (
-      <View style={{ flex: 1 }}>
-        <WebView
-          source={{ uri: transferUrl }}
-          allowsFullscreenVideo
-          javaScriptEnabled
-          sharedCookiesEnabled
-          thirdPartyCookiesEnabled
-        />
-      </View>
+      <Styled.Container>
+        <Styled.Wrapper>
+          <WebView
+            source={{ uri: transferUrl }}
+            allowsFullscreenVideo
+            javaScriptEnabled
+            sharedCookiesEnabled
+            thirdPartyCookiesEnabled
+          />
+        </Styled.Wrapper>
+        <Styled.LeaveIconButton onPress={leaveConference} />
+      </Styled.Container>
     );
   }
 

diff --git a/src/screens/transfer-screen/styles.js b/src/screens/transfer-screen/styles.js
@@ -1,4 +1,4 @@
-import { Button } from 'react-native-paper';
+import { Button, IconButton } from 'react-native-paper';
 import styled from 'styled-components/native';
 import Colors from '../../constants/colors';
 
@@ -55,9 +55,42 @@ const PressableButton = ({
   );
 };
 
+const LeaveIconButton = ({
+  onPress
+}) => {
+  return (
+    <IconButton
+      style={{
+        position: 'absolute', left: 12, top: 30, margin: 0,
+      }}
+      icon="account-arrow-left"
+      mode="contained"
+      iconColor={Colors.white}
+      containerColor={Colors.orange}
+      size={14}
+      onPress={onPress}
+    />
+  );
+};
+
+const Container = styled.View`
+width: 100%;
+height: 100%;
+display: flex;
+justify-content: space-between;
+`;
+
+const Wrapper = styled.View`
+  width: 100%;
+  height: 100%;
+`;
+
 export default {
   ContainerView,
   TitleText,
   SubtitleText,
-  PressableButton
+  PressableButton,
+  LeaveIconButton,
+  Container,
+  Wrapper
 };