this repo has no description
Fix dragging up in flat list dialogs on Android (#5817)
+32
-11
+32
-11
src/components/Dialog/index.tsx
+32
-11
src/components/Dialog/index.tsx
···
15
15
useKeyboardHandler,
16
16
} from 'react-native-keyboard-controller'
17
17
import {runOnJS} from 'react-native-reanimated'
18
+
import {ReanimatedScrollEvent} from 'react-native-reanimated/lib/typescript/reanimated2/hook/commonTypes'
18
19
import {useSafeAreaInsets} from 'react-native-safe-area-context'
19
20
import {msg} from '@lingui/macro'
20
21
import {useLingui} from '@lingui/react'
21
22
23
+
import {ScrollProvider} from '#/lib/ScrollContext'
22
24
import {logger} from '#/logger'
23
25
import {isAndroid, isIOS} from '#/platform/detection'
24
26
import {useA11y} from '#/state/a11y'
···
228
230
nativeSnapPoint === BottomSheetSnapPoint.Full ? fullPadding : basePading
229
231
230
232
const onScroll = (e: NativeSyntheticEvent<NativeScrollEvent>) => {
233
+
if (!isAndroid) {
234
+
return
235
+
}
231
236
const {contentOffset} = e.nativeEvent
232
237
if (contentOffset.y > 0 && !disableDrag) {
233
238
setDisableDrag(true)
···
265
270
ListProps<any> & {webInnerStyle?: StyleProp<ViewStyle>}
266
271
>(function InnerFlatList({style, ...props}, ref) {
267
272
const insets = useSafeAreaInsets()
268
-
const {nativeSnapPoint} = useDialogContext()
273
+
const {nativeSnapPoint, disableDrag, setDisableDrag} = useDialogContext()
274
+
275
+
const onScroll = (e: ReanimatedScrollEvent) => {
276
+
'worklet'
277
+
if (!isAndroid) {
278
+
return
279
+
}
280
+
const {contentOffset} = e
281
+
if (contentOffset.y > 0 && !disableDrag) {
282
+
runOnJS(setDisableDrag)(true)
283
+
} else if (contentOffset.y <= 1 && disableDrag) {
284
+
runOnJS(setDisableDrag)(false)
285
+
}
286
+
}
287
+
269
288
return (
270
-
<List
271
-
keyboardShouldPersistTaps="handled"
272
-
bounces={nativeSnapPoint === BottomSheetSnapPoint.Full}
273
-
ListFooterComponent={
274
-
<View style={{height: insets.bottom + a.pt_5xl.paddingTop}} />
275
-
}
276
-
ref={ref}
277
-
{...props}
278
-
style={[style]}
279
-
/>
289
+
<ScrollProvider onScroll={onScroll}>
290
+
<List
291
+
keyboardShouldPersistTaps="handled"
292
+
bounces={nativeSnapPoint === BottomSheetSnapPoint.Full}
293
+
ListFooterComponent={
294
+
<View style={{height: insets.bottom + a.pt_5xl.paddingTop}} />
295
+
}
296
+
ref={ref}
297
+
{...props}
298
+
style={[style]}
299
+
/>
300
+
</ScrollProvider>
280
301
)
281
302
})
282
303