Fix Android keyboard bug when opening a sheet (#6739)

* reimplement KeyboardStickyView

* fix missing arg
This commit is contained in:
Samuel Newman
2024-11-26 15:57:21 +00:00
committed by GitHub
parent ce1b04b925
commit 736ea3f49d
@@ -1,10 +1,7 @@
import React, {useCallback, useRef} from 'react' import React, {useCallback, useRef} from 'react'
import {LayoutChangeEvent, View} from 'react-native' import {LayoutChangeEvent, View} from 'react-native'
import { import {useKeyboardHandler} from 'react-native-keyboard-controller'
KeyboardStickyView, import Animated, {
useKeyboardHandler,
} from 'react-native-keyboard-controller'
import {
runOnJS, runOnJS,
scrollTo, scrollTo,
useAnimatedRef, useAnimatedRef,
@@ -270,8 +267,12 @@ export function MessagesList({
scrollTo(flatListRef, 0, 1e7, false) scrollTo(flatListRef, 0, 1e7, false)
} }
}, },
onEnd: () => { onEnd: e => {
'worklet' 'worklet'
keyboardHeight.set(e.height)
if (e.height > bottomOffset) {
scrollTo(flatListRef, 0, 1e7, false)
}
keyboardIsOpening.set(false) keyboardIsOpening.set(false)
}, },
}, },
@@ -279,8 +280,11 @@ export function MessagesList({
) )
const animatedListStyle = useAnimatedStyle(() => ({ const animatedListStyle = useAnimatedStyle(() => ({
marginBottom: marginBottom: Math.max(keyboardHeight.get(), bottomOffset),
keyboardHeight.get() > bottomOffset ? keyboardHeight.get() : bottomOffset, }))
const animatedStickyViewStyle = useAnimatedStyle(() => ({
transform: [{translateY: -Math.max(keyboardHeight.get(), bottomOffset)}],
})) }))
// -- Message sending // -- Message sending
@@ -422,7 +426,7 @@ export function MessagesList({
} }
/> />
</ScrollProvider> </ScrollProvider>
<KeyboardStickyView offset={{closed: -bottomOffset, opened: 0}}> <Animated.View style={animatedStickyViewStyle}>
{convoState.status === ConvoStatus.Disabled ? ( {convoState.status === ConvoStatus.Disabled ? (
<ChatDisabled /> <ChatDisabled />
) : blocked ? ( ) : blocked ? (
@@ -441,7 +445,7 @@ export function MessagesList({
</MessageInput> </MessageInput>
</> </>
)} )}
</KeyboardStickyView> </Animated.View>
{isWeb && ( {isWeb && (
<EmojiPicker <EmojiPicker