fix composer keyboard avoiding behaviour by using keyboard-controller

src/view/com/composer/Composer.tsx

@@ -11,7 +11,6 @@ import {
   ActivityIndicator,
   BackHandler,
   Keyboard,
-  KeyboardAvoidingView,
   type LayoutChangeEvent,
   ScrollView,
   type StyleProp,
@@ -19,6 +18,7 @@ import {
   View,
   type ViewStyle,
 } from 'react-native'
+import {KeyboardAvoidingView} from 'react-native-keyboard-controller'
 // @ts-expect-error no type definition
 import ProgressCircle from 'react-native-progress/Circle'
 import Animated, {
@@ -332,13 +332,7 @@ export const ComposePost = ({
       paddingTop: isAndroid ? insets.top : 0,
       paddingBottom:
         // iOS - when keyboard is closed, keep the bottom bar in the safe area
-        (isIOS && !isKeyboardVisible) ||
+        (isIOS && !isKeyboardVisible) || isAndroid ? insets.bottom : 0,
-        // Android - Android >=35 KeyboardAvoidingView adds double padding when
-        // keyboard is closed, so we subtract that in the offset and add it back
-        // here when the keyboard is open
-        (isAndroid && isKeyboardVisible)
-          ? insets.bottom * 2
-          : 0,
     }),
     [insets, isKeyboardVisible],
   )
@@ -730,15 +724,12 @@ export const ComposePost = ({
   const isWebFooterSticky = !isNative && thread.posts.length > 1
   return (
     <BottomSheetPortalProvider>
-      <KeyboardAvoidingView
+      <View style={[a.flex_1, viewStyles]} aria-modal accessibilityViewIsModal>
-        testID="composePostView"
+        <KeyboardAvoidingView
-        behavior={isIOS ? 'padding' : 'height'}
+          testID="composePostView"
-        keyboardVerticalOffset={keyboardVerticalOffset}
+          behavior={isIOS ? 'padding' : 'height'}
-        style={a.flex_1}>
+          keyboardVerticalOffset={keyboardVerticalOffset}
-        <View
+          style={a.flex_1}>
-          style={[a.flex_1, viewStyles]}
-          aria-modal
-          accessibilityViewIsModal>
           <ComposerTopBar
             canPost={canPost}
             isReply={!!replyTo}
@@ -797,17 +788,17 @@ export const ComposePost = ({
             ))}
           </Animated.ScrollView>
           {!isWebFooterSticky && footer}
-        </View>
+        </KeyboardAvoidingView>
+      </View>
 
-        <Prompt.Basic
+      <Prompt.Basic
-          control={discardPromptControl}
+        control={discardPromptControl}
-          title={_(msg`Discard draft?`)}
+        title={_(msg`Discard draft?`)}
-          description={_(msg`Are you sure you'd like to discard this draft?`)}
+        description={_(msg`Are you sure you'd like to discard this draft?`)}
-          onConfirm={onClose}
+        onConfirm={onClose}
-          confirmButtonCta={_(msg`Discard`)}
+        confirmButtonCta={_(msg`Discard`)}
-          confirmButtonColor="negative"
+        confirmButtonColor="negative"
-        />
+      />
-      </KeyboardAvoidingView>
     </BottomSheetPortalProvider>
   )
 }
@@ -1650,11 +1641,11 @@ function useScrollTracker({
 }
 
 function useKeyboardVerticalOffset() {
-  const {top, bottom} = useSafeAreaInsets()
+  const {top} = useSafeAreaInsets()
 
   // Android etc
   if (!isIOS) {
-    return bottom * -2
+    return 0
   }
 
   // iPhone SE

src/view/shell/Composer.tsx

@@ -2,6 +2,7 @@ import {useEffect} from 'react'
 import {Animated, Easing} from 'react-native'
 
 import {useAnimatedValue} from '#/lib/hooks/useAnimatedValue'
+import {useEnableKeyboardController} from '#/lib/hooks/useEnableKeyboardController'
 import {useComposerState} from '#/state/shell/composer'
 import {atoms as a, useTheme} from '#/alf'
 import {ComposePost} from '../com/composer/Composer'
@@ -34,6 +35,8 @@ export function Composer({winHeight}: {winHeight: number}) {
     ],
   }
 
+  useEnableKeyboardController(!!state)
+
   // rendering
   // =