diff options
Diffstat (limited to 'src/view/com/composer/Composer.tsx')
-rw-r--r-- | src/view/com/composer/Composer.tsx | 67 |
1 files changed, 27 insertions, 40 deletions
diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx index 5bcac2e67..e8ea5189f 100644 --- a/src/view/com/composer/Composer.tsx +++ b/src/view/com/composer/Composer.tsx @@ -8,6 +8,7 @@ import React, { } from 'react' import { ActivityIndicator, + BackHandler, Keyboard, LayoutChangeEvent, StyleSheet, @@ -17,7 +18,7 @@ import { import { KeyboardAvoidingView, KeyboardStickyView, - useKeyboardContext, + useKeyboardController, } from 'react-native-keyboard-controller' import Animated, { interpolateColor, @@ -42,6 +43,7 @@ import {LikelyType} from '#/lib/link-meta/link-meta' import {logEvent} from '#/lib/statsig/statsig' import {logger} from '#/logger' import {emitPostCreated} from '#/state/events' +import {useModalControls} from '#/state/modals' import {useModals} from '#/state/modals' import {useRequireAltTextEnabled} from '#/state/preferences' import { @@ -108,9 +110,7 @@ export const ComposePost = observer(function ComposePost({ text: initText, imageUris: initImageUris, cancelRef, - isModalReady, }: Props & { - isModalReady: boolean cancelRef?: React.RefObject<CancelRef> }) { const {currentAccount} = useSession() @@ -128,11 +128,12 @@ export const ComposePost = observer(function ComposePost({ const textInput = useRef<TextInputRef>(null) const discardPromptControl = Prompt.usePromptControl() const {closeAllDialogs} = useDialogStateControlContext() + const {closeAllModals} = useModalControls() const t = useTheme() // Disable this in the composer to prevent any extra keyboard height being applied. // See https://github.com/bluesky-social/social-app/pull/4399 - const {setEnabled} = useKeyboardContext() + const {setEnabled} = useKeyboardController() React.useEffect(() => { if (!isAndroid) return setEnabled(false) @@ -180,6 +181,7 @@ export const ComposePost = observer(function ComposePost({ const insets = useSafeAreaInsets() const viewStyles = useMemo( () => ({ + paddingTop: isAndroid ? insets.top : 0, paddingBottom: isAndroid || (isIOS && !isKeyboardVisible) ? insets.bottom : 0, }), @@ -205,6 +207,26 @@ export const ComposePost = observer(function ComposePost({ useImperativeHandle(cancelRef, () => ({onPressCancel})) + // On Android, pressing Back should ask confirmation. + useEffect(() => { + if (!isAndroid) { + return + } + const backHandler = BackHandler.addEventListener( + 'hardwareBackPress', + () => { + if (closeAllDialogs() || closeAllModals()) { + return true + } + onPressCancel() + return true + }, + ) + return () => { + backHandler.remove() + } + }, [onPressCancel, closeAllDialogs, closeAllModals]) + // listen to escape key on desktop web const onEscape = useCallback( (e: KeyboardEvent) => { @@ -408,37 +430,6 @@ export const ComposePost = observer(function ComposePost({ bottomBarAnimatedStyle, } = useAnimatedBorders() - // Backup focus on android, if the keyboard *still* refuses to show - useEffect(() => { - if (!isAndroid) return - if (!isModalReady) return - - function tryFocus() { - if (!Keyboard.isVisible()) { - textInput.current?.blur() - textInput.current?.focus() - } - } - - tryFocus() - // Retry with enough gap to avoid interrupting the previous attempt. - // Unfortunately we don't know which attempt will succeed. - const retryInterval = setInterval(tryFocus, 500) - - function stopTrying() { - clearInterval(retryInterval) - } - - // Deactivate this fallback as soon as anything happens. - const sub1 = Keyboard.addListener('keyboardDidShow', stopTrying) - const sub2 = Keyboard.addListener('keyboardDidHide', stopTrying) - return () => { - clearInterval(retryInterval) - sub1.remove() - sub2.remove() - } - }, [isModalReady]) - return ( <> <KeyboardAvoidingView @@ -567,11 +558,7 @@ export const ComposePost = observer(function ComposePost({ ref={textInput} richtext={richtext} placeholder={selectTextInputPlaceholder} - // fixes autofocus on android - key={ - isAndroid ? (isModalReady ? 'ready' : 'animating') : 'static' - } - autoFocus={isAndroid ? isModalReady : true} + autoFocus setRichText={setRichText} onPhotoPasted={onPhotoPasted} onPressPublish={onPressPublish} |