diff --git a/src/screens/Messages/Conversation/MessageInput.tsx b/src/screens/Messages/Conversation/MessageInput.tsx index 3848bcab..d477a20c 100644 --- a/src/screens/Messages/Conversation/MessageInput.tsx +++ b/src/screens/Messages/Conversation/MessageInput.tsx @@ -12,6 +12,7 @@ import {useSafeAreaInsets} from 'react-native-safe-area-context' import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {HITSLOP_10} from '#/lib/constants' import {atoms as a, useTheme} from '#/alf' import {PaperPlane_Stroke2_Corner0_Rounded as PaperPlane} from '#/components/icons/PaperPlane' @@ -60,44 +61,49 @@ export function MessageInput({ ) return ( - - - + - - + a.w_full, + a.flex_row, + a.py_sm, + a.px_sm, + a.pl_md, + t.atoms.bg_contrast_25, + {borderRadius: 23}, + ]}> + + + + + ) } diff --git a/src/screens/Messages/Conversation/MessageInput.web.tsx b/src/screens/Messages/Conversation/MessageInput.web.tsx index 5ecaad3a..2370b52d 100644 --- a/src/screens/Messages/Conversation/MessageInput.web.tsx +++ b/src/screens/Messages/Conversation/MessageInput.web.tsx @@ -45,47 +45,48 @@ export function MessageInput({ ) return ( - - - + - - + + + + + ) } diff --git a/src/screens/Messages/Conversation/MessageItem.tsx b/src/screens/Messages/Conversation/MessageItem.tsx index ba10978e..ba1bcfd3 100644 --- a/src/screens/Messages/Conversation/MessageItem.tsx +++ b/src/screens/Messages/Conversation/MessageItem.tsx @@ -153,7 +153,7 @@ function Metadata({ style={[ t.atoms.text_contrast_medium, a.text_xs, - a.mt_xs, + a.mt_2xs, a.mb_lg, style, ]}> diff --git a/src/screens/Messages/Conversation/MessagesList.tsx b/src/screens/Messages/Conversation/MessagesList.tsx index 5fedf062..55e1e43c 100644 --- a/src/screens/Messages/Conversation/MessagesList.tsx +++ b/src/screens/Messages/Conversation/MessagesList.tsx @@ -6,14 +6,18 @@ import { View, } from 'react-native' import {KeyboardAvoidingView} from 'react-native-keyboard-controller' +import {useSafeAreaInsets} from 'react-native-safe-area-context' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {useFocusEffect} from '@react-navigation/native' +import {isIOS} from '#/platform/detection' import {useChat} from '#/state/messages' import {ConvoItem, ConvoStatus} from '#/state/messages/convo' -import {isWeb} from 'platform/detection' +import {useSetMinimalShellMode} from '#/state/shell' import {MessageInput} from '#/screens/Messages/Conversation/MessageInput' import {MessageItem} from '#/screens/Messages/Conversation/MessageItem' +import {atoms as a} from '#/alf' import {Button, ButtonText} from '#/components/Button' import {Loader} from '#/components/Loader' import {Text} from '#/components/Typography' @@ -112,13 +116,24 @@ export function MessagesList() { [], ) + const setMinShellMode = useSetMinimalShellMode() + useFocusEffect( + useCallback(() => { + setMinShellMode(true) + return () => setMinShellMode(false) + }, [setMinShellMode]), + ) + + const {bottom: bottomInset} = useSafeAreaInsets() + return ( + contentContainerStyle={a.flex_1}> } removeClippedSubviews={true} - ref={flatListRef} - keyboardDismissMode="none" + keyboardDismissMode="on-drag" + /> + - - - - ) }