Fix keyboard hiding alt text input after viewing DMs on iOS (#5739)

(cherry picked from commit 432dc867f8)
This commit is contained in:
Hailey
2024-10-14 08:02:16 -07:00
parent 65500294c5
commit 31c8d7d8cb
3 changed files with 22 additions and 9 deletions
+15
View File
@@ -11,6 +11,7 @@ import {
} from 'react-native'
import {
KeyboardAwareScrollView,
useKeyboardController,
useKeyboardHandler,
} from 'react-native-keyboard-controller'
import {runOnJS} from 'react-native-reanimated'
@@ -189,7 +190,21 @@ export const ScrollableInner = React.forwardRef<ScrollView, DialogInnerProps>(
function ScrollableInner({children, style, ...props}, ref) {
const {nativeSnapPoint, disableDrag, setDisableDrag} = useDialogContext()
const insets = useSafeAreaInsets()
const {setEnabled} = useKeyboardController()
const [keyboardHeight, setKeyboardHeight] = React.useState(0)
React.useEffect(() => {
if (!isIOS) {
return
}
setEnabled(true)
return () => {
setEnabled(false)
}
})
useKeyboardHandler({
onEnd: e => {
'worklet'
+4 -5
View File
@@ -1,5 +1,5 @@
import React, {useState} from 'react'
import {Dimensions, TouchableOpacity, View} from 'react-native'
import {TouchableOpacity, View} from 'react-native'
import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
@@ -9,7 +9,7 @@ import {
EmbedPlayerParams,
parseEmbedPlayerFromUrl,
} from '#/lib/strings/embed-player'
import {isAndroid, isWeb} from '#/platform/detection'
import {isAndroid} from '#/platform/detection'
import {useResolveGifQuery} from '#/state/queries/resolve-link'
import {Gif} from '#/state/queries/tenor'
import {AltTextCounterWrapper} from '#/view/com/composer/AltTextCounterWrapper'
@@ -107,8 +107,7 @@ export function GifAltTextDialogLoaded({
control={control}
onClose={() => {
onSubmit(altTextDraft)
}}
nativeOptions={{minHeight: Dimensions.get('window').height}}>
}}>
<Dialog.Handle />
<AltTextInner
vendorAltText={vendorAltText}
@@ -158,7 +157,7 @@ function AltTextInner({
defaultValue={altText}
multiline
numberOfLines={3}
autoFocus={isWeb}
autoFocus
onKeyPress={({nativeEvent}) => {
if (nativeEvent.key === 'Escape') {
control.close()
@@ -1,5 +1,5 @@
import React from 'react'
import {Dimensions, ImageStyle, useWindowDimensions, View} from 'react-native'
import {ImageStyle, useWindowDimensions, View} from 'react-native'
import {Image} from 'expo-image'
import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
@@ -38,8 +38,7 @@ export const ImageAltTextDialog = ({
...image,
alt: enforceLen(altText, MAX_ALT_TEXT, true),
})
}}
nativeOptions={{minHeight: Dimensions.get('window').height}}>
}}>
<Dialog.Handle />
<ImageAltTextInner
control={control}
@@ -123,7 +122,7 @@ const ImageAltTextInner = ({
defaultValue={altText}
multiline
numberOfLines={3}
autoFocus={isWeb}
autoFocus
/>
</TextField.Root>
</View>