From 9c737141f9e82ed0d50c97eb4b4f4427e30f6dda Mon Sep 17 00:00:00 2001
From: Antonella Sgarlatta <anto@standardnotes.com>
Date: Mon, 5 Jan 2026 13:48:46 -0300
Subject: [PATCH] fix: fix extra bottom space when scrolling down note in
 android (#2965)

---
 packages/mobile/src/MobileWebAppContainer.tsx | 57 ++++++++++++-------
 1 file changed, 37 insertions(+), 20 deletions(-)

diff --git a/packages/mobile/src/MobileWebAppContainer.tsx b/packages/mobile/src/MobileWebAppContainer.tsx
index a31ba3789..50986e08d 100644
--- a/packages/mobile/src/MobileWebAppContainer.tsx
+++ b/packages/mobile/src/MobileWebAppContainer.tsx
@@ -47,6 +47,9 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
 
   const insets = useSafeAreaInsets()
 
+  const screenHeight = Dimensions.get('screen').height
+  const [webViewContainerHeight, setWebViewContainerHeight] = useState(screenHeight)
+
   useEffect(() => {
     const removeStateServiceListener = stateService.addEventObserver((event: ReactNativeToWebEvent) => {
       webViewRef.current?.postMessage(JSON.stringify({ reactNativeEvent: event, messageType: 'event' }))
@@ -98,27 +101,33 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
 
     const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', (e) => {
       // iOS handles this using the `willChangeFrame` event instead
-      if (Platform.OS === 'android' && insets.bottom > 0) {
-        fireKeyboardSizeChangeEvent(e)
-        webViewRef.current?.postMessage(
-          JSON.stringify({
-            reactNativeEvent: ReactNativeToWebEvent.KeyboardDidShow,
-            messageType: 'event',
-          }),
-        )
+      if (Platform.OS === 'android') {
+        setWebViewContainerHeight(e.endCoordinates.screenY)
+        if (insets.bottom > 0) {
+          fireKeyboardSizeChangeEvent(e)
+          webViewRef.current?.postMessage(
+            JSON.stringify({
+              reactNativeEvent: ReactNativeToWebEvent.KeyboardDidShow,
+              messageType: 'event',
+            }),
+          )
+        }
       }
       device.reloadStatusBarStyle(false)
     })
 
     const keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', () => {
       // iOS handles this using the `willChangeFrame` event instead
-      if (Platform.OS === 'android' && insets.bottom > 0) {
-        webViewRef.current?.postMessage(
-          JSON.stringify({
-            reactNativeEvent: ReactNativeToWebEvent.KeyboardDidHide,
-            messageType: 'event',
-          }),
-        )
+      if (Platform.OS === 'android') {
+        setWebViewContainerHeight(screenHeight)
+        if (insets.bottom > 0) {
+          webViewRef.current?.postMessage(
+            JSON.stringify({
+              reactNativeEvent: ReactNativeToWebEvent.KeyboardDidHide,
+              messageType: 'event',
+            }),
+          )
+        }
       }
       device.reloadStatusBarStyle(false)
     })
@@ -137,7 +146,7 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
       keyboardDidHideListener.remove()
       keyboardWillChangeFrame.remove()
     }
-  }, [webViewRef, stateService, device, androidBackHandlerService, colorSchemeService, insets.bottom])
+  }, [webViewRef, stateService, device, androidBackHandlerService, colorSchemeService, insets.bottom, screenHeight])
 
   useEffect(() => {
     return notifee.onForegroundEvent(({ type, detail }) => {
@@ -417,10 +426,18 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
 
   return (
     <View
-      style={{
-        flex: 1,
-        backgroundColor: '#000000',
-      }}
+      style={
+        Platform.OS === 'android'
+          ? {
+              height: webViewContainerHeight,
+              backgroundColor: '#000000',
+              overflow: 'hidden',
+            }
+          : {
+              flex: 1,
+              backgroundColor: '#000000',
+            }
+      }
     >
       <WebView
         ref={webViewRef}