From 7fd79702371e3d7829be2188c2212c090bf76670 Mon Sep 17 00:00:00 2001 From: dan Date: Thu, 14 Dec 2023 02:48:20 +0000 Subject: Make scroll handling contextual (#2200) * Add an intermediate List component * Fix type * Add onScrolledDownChange * Port pager to use onScrolledDownChange * Fix on mobile * Don't pass down onScroll (replacement TBD) * Remove resetMainScroll * Replace onMainScroll with MainScrollProvider * Hook ScrollProvider to pager * Fix the remaining special case * Optimize a bit * Enforce that onScroll cannot be passed * Keep value updated even if no handler * Also memo it --- src/lib/ScrollContext.tsx | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) create mode 100644 src/lib/ScrollContext.tsx (limited to 'src/lib/ScrollContext.tsx') diff --git a/src/lib/ScrollContext.tsx b/src/lib/ScrollContext.tsx new file mode 100644 index 000000000..00b197bed --- /dev/null +++ b/src/lib/ScrollContext.tsx @@ -0,0 +1,35 @@ +import React, {createContext, useContext, useMemo} from 'react' +import {ScrollHandlers} from 'react-native-reanimated' + +const ScrollContext = createContext>({ + onBeginDrag: undefined, + onEndDrag: undefined, + onScroll: undefined, +}) + +export function useScrollHandlers(): ScrollHandlers { + return useContext(ScrollContext) +} + +type ProviderProps = {children: React.ReactNode} & ScrollHandlers + +// Note: this completely *overrides* the parent handlers. +// It's up to you to compose them with the parent ones via useScrollHandlers() if needed. +export function ScrollProvider({ + children, + onBeginDrag, + onEndDrag, + onScroll, +}: ProviderProps) { + const handlers = useMemo( + () => ({ + onBeginDrag, + onEndDrag, + onScroll, + }), + [onBeginDrag, onEndDrag, onScroll], + ) + return ( + {children} + ) +} -- cgit 1.4.1