forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
create keyboardverticaloffset hook (#3823)
authored by
Samuel Newman
and committed by
GitHub
96c5db3e
aca55cb1
+28
-3
+28
-3
src/screens/Messages/Conversation/MessagesList.tsx
+28
-3
src/screens/Messages/Conversation/MessagesList.tsx
···
1
-
import React, {useCallback, useRef} from 'react'
1
+
import React, {useCallback, useEffect, useRef} from 'react'
2
2
import {
3
+
Dimensions,
3
4
FlatList,
4
5
NativeScrollEvent,
5
6
NativeSyntheticEvent,
7
+
Platform,
6
8
View,
7
9
} from 'react-native'
8
10
import {KeyboardAvoidingView} from 'react-native-keyboard-controller'
···
11
13
import {useLingui} from '@lingui/react'
12
14
import {useFocusEffect} from '@react-navigation/native'
13
15
14
-
import {isIOS} from '#/platform/detection'
15
16
import {useChat} from '#/state/messages'
16
17
import {ConvoItem, ConvoStatus} from '#/state/messages/convo'
17
18
import {useSetMinimalShellMode} from '#/state/shell'
···
125
126
)
126
127
127
128
const {bottom: bottomInset} = useSafeAreaInsets()
129
+
const keyboardVerticalOffset = useKeyboardVerticalOffset()
128
130
129
131
return (
130
132
<KeyboardAvoidingView
131
133
style={[a.flex_1, {marginBottom: bottomInset}]}
132
-
keyboardVerticalOffset={isIOS ? 60 : 25}
134
+
keyboardVerticalOffset={keyboardVerticalOffset}
133
135
behavior="padding"
134
136
contentContainerStyle={a.flex_1}>
135
137
<FlatList
···
175
177
</KeyboardAvoidingView>
176
178
)
177
179
}
180
+
181
+
function useKeyboardVerticalOffset() {
182
+
const {top: topInset} = useSafeAreaInsets()
183
+
const [screenWindowDifference, setScreenWindowDifference] = React.useState(
184
+
() => Dimensions.get('screen').height - Dimensions.get('window').height,
185
+
)
186
+
187
+
useEffect(() => {
188
+
const subscription = Dimensions.addEventListener(
189
+
'change',
190
+
({screen, window}) => {
191
+
setScreenWindowDifference(screen.height - window.height)
192
+
},
193
+
)
194
+
return () => subscription.remove()
195
+
}, [])
196
+
197
+
return Platform.select({
198
+
ios: topInset,
199
+
android: screenWindowDifference,
200
+
default: 0,
201
+
})
202
+
}