From 777cb28a6fd2180d07e3473a80dfc559d1498071 Mon Sep 17 00:00:00 2001
From: Djorkaeff Alexandre <djorkaeff.unb@gmail.com>
Date: Mon, 17 Feb 2020 13:42:34 -0300
Subject: [PATCH] [FIX]  UIKit Modal: Weird behavior on Android Tablet (#1742)

---
 app/index.js                | 29 ++++++++++++++++++++++++-----
 app/views/ModalBlockView.js | 11 +++++++++++
 2 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/app/index.js b/app/index.js
index 009fefe86..0f596f650 100644
--- a/app/index.js
+++ b/app/index.js
@@ -1,5 +1,7 @@
 import React from 'react';
-import { View, Linking, BackHandler } from 'react-native';
+import {
+	View, Linking, BackHandler, ScrollView
+} from 'react-native';
 import { createAppContainer, createSwitchNavigator } from 'react-navigation';
 import { createStackNavigator } from 'react-navigation-stack';
 import { createDrawerNavigator } from 'react-navigation-drawer';
@@ -34,7 +36,7 @@ import { ThemeContext } from './theme';
 import RocketChat, { THEME_PREFERENCES_KEY } from './lib/rocketchat';
 import { MIN_WIDTH_SPLIT_LAYOUT } from './constants/tablet';
 import {
-	isTablet, isSplited, isIOS, setWidth, supportSystemTheme
+	isTablet, isSplited, isIOS, setWidth, supportSystemTheme, isAndroid
 } from './utils/deviceInfo';
 import { KEY_COMMAND } from './commands';
 import Tablet, { initTabletNav } from './tablet';
@@ -479,6 +481,24 @@ class CustomModalStack extends React.Component {
 		const pageSheetViews = ['AttachmentView'];
 		const pageSheet = pageSheetViews.includes(getActiveRouteName(navigation.state));
 
+		const androidProps = isAndroid && {
+			style: { marginBottom: 0 }
+		};
+
+		let content = (
+			<View style={[sharedStyles.modal, pageSheet ? sharedStyles.modalPageSheet : sharedStyles.modalFormSheet]}>
+				<ModalSwitch navigation={navigation} screenProps={{ ...screenProps, closeModal: this.closeModal }} />
+			</View>
+		);
+
+		if (isAndroid) {
+			content = (
+				<ScrollView overScrollMode='never'>
+					{content}
+				</ScrollView>
+			);
+		}
+
 		return (
 			<Modal
 				useNativeDriver
@@ -487,10 +507,9 @@ class CustomModalStack extends React.Component {
 				onBackdropPress={closeModal}
 				hideModalContentWhileAnimating
 				avoidKeyboard
+				{...androidProps}
 			>
-				<View style={[sharedStyles.modal, pageSheet ? sharedStyles.modalPageSheet : sharedStyles.modalFormSheet]}>
-					<ModalSwitch navigation={navigation} screenProps={{ ...screenProps, closeModal: this.closeModal }} />
-				</View>
+				{content}
 			</Modal>
 		);
 	}
diff --git a/app/views/ModalBlockView.js b/app/views/ModalBlockView.js
index ba4cd963c..2a6350de5 100644
--- a/app/views/ModalBlockView.js
+++ b/app/views/ModalBlockView.js
@@ -118,6 +118,17 @@ class ModalBlockView extends React.Component {
 		EventEmitter.addEventListener(viewId, this.handleUpdate);
 	}
 
+	shouldComponentUpdate(nextProps, nextState) {
+		if (!isEqual(nextProps, this.props)) {
+			return true;
+		}
+		if (!isEqual(nextState, this.state)) {
+			return true;
+		}
+
+		return false;
+	}
+
 	componentDidUpdate(prevProps) {
 		const { navigation } = this.props;
 		const oldData = prevProps.navigation.getParam('data', {});