Filter config

packages/react-native-gesture-handler/src/v3/hooks/useGesture.ts

@@ -94,7 +94,7 @@ export function useGesture<THandlerData, TConfig>(
   }, [type, tag]);
 
   useEffect(() => {
-    const preparedConfig = prepareConfig(config);
+    const preparedConfig = prepareConfig(type, config);
     RNGestureHandlerModule.setGestureHandlerConfig(tag, preparedConfig);
     RNGestureHandlerModule.flushOperations();
 

packages/react-native-gesture-handler/src/v3/hooks/utils.ts

@@ -3,17 +3,26 @@ import {
   AnimatedEvent,
   BaseGestureConfig,
   ChangeCalculatorType,
+  CommonGestureConfig,
   DiffCalculatorType,
   ExcludeInternalConfigProps,
   UnpackedGestureHandlerEvent,
   GestureHandlerEvent,
   GestureStateChangeEvent,
   GestureUpdateEvent,
   SharedValueOrT,
+  SingleGestureName,
+  HandlersPropsWhiteList,
+  InternalConfigProps,
 } from '../types';
 import { GestureTouchEvent } from '../../handlers/gestureHandlerCommon';
 import { tagMessage } from '../../utils';
 import { Reanimated } from '../../handlers/gestures/reanimatedWrapper';
+import { panGestureHandlerProps } from '../../handlers/PanGestureHandler';
+import { tapGestureHandlerProps } from '../../handlers/TapGestureHandler';
+import { nativeViewGestureHandlerProps } from '../../handlers/NativeViewGestureHandler';
+import { longPressGestureHandlerProps } from '../../handlers/LongPressGestureHandler';
+import { flingGestureHandlerProps } from '../../handlers/FlingGestureHandler';
 
 export function isNativeEvent<THandlerData>(
   event: GestureHandlerEvent<THandlerData>
@@ -79,27 +88,91 @@ export function checkMappingForChangeProperties(animatedEvent: AnimatedEvent) {
   }
 }
 
-export function prepareConfig<THandlerData, TConfig>(
+export const commonGestureConfig = new Set<keyof CommonGestureConfig>([
+  'disableReanimated',
+  'enabled',
+  'shouldCancelWhenOutside',
+  'hitSlop',
+  'userSelect',
+  'activeCursor',
+  'mouseButton',
+  'enableContextMenu',
+  'touchAction',
+]);
+
+export const internalConfigProps = new Set<keyof InternalConfigProps<unknown>>([
+  'shouldUseReanimated',
+  'dispatchesAnimatedEvents',
+  'needsPointerData',
+  'changeEventCalculator',
+]);
+
+const PropsToFilter = new Set<BaseGestureConfig<unknown, unknown>>([
+  // Callbacks
+  'onBegin',
+  'onStart',
+  'onUpdate',
+  'onEnd',
+  'onFinalize',
+  'onTouchesDown',
+  'onTouchesMove',
+  'onTouchesUp',
+  'onTouchesCancelled',
+
+  // Config props
+  'changeEventCalculator',
+  'disableReanimated',
+
+  // Relations
+  'simultaneousWithExternalGesture',
+  'requireExternalGestureToFail',
+  'blocksExternalGesture',
+]);
+
+function withCommonProps<T extends string>(handlerProps: readonly T[]) {
+  return new Set<
+    T | keyof CommonGestureConfig | keyof InternalConfigProps<unknown>
+  >([...handlerProps, ...commonGestureConfig, ...internalConfigProps]);
+}
+
+export const PropsWhiteList = new Map<
+  SingleGestureName,
+  HandlersPropsWhiteList
+>([
+  [SingleGestureName.Pan, withCommonProps(panGestureHandlerProps)],
+  [SingleGestureName.Tap, withCommonProps(tapGestureHandlerProps)],
+  [SingleGestureName.Native, withCommonProps(nativeViewGestureHandlerProps)],
+  [SingleGestureName.LongPress, withCommonProps(longPressGestureHandlerProps)],
+  [SingleGestureName.Fling, withCommonProps(flingGestureHandlerProps)],
+]);
+
+const EMPTY_WHILE_LIST = new Set<string>();
+
+export function prepareConfig<THandlerData, TConfig extends object>(
+  handlerType: SingleGestureName,
   config: BaseGestureConfig<THandlerData, TConfig>
 ) {
-  const copy = { ...config };
-
-  for (const key in copy) {
-    // @ts-ignore It is fine to use string as index
-    if (Reanimated?.isSharedValue(copy[key])) {
-      // @ts-ignore It is fine to use string as index
-      copy[key] = copy[key].value;
+  // @ts-ignore Seems like TypeScript can't infer the type here properly because of generic
+  const filteredConfig: BaseGestureConfig<THandlerData, TConfig> = {};
+  const propsWhiteList = PropsWhiteList.get(handlerType) ?? EMPTY_WHILE_LIST;
+
+  for (const [key, value] of Object.entries(config)) {
+    if (propsWhiteList.has(key)) {
+      Object.assign(filteredConfig, {
+        [key]: Reanimated?.isSharedValue(value) ? value.value : value,
+      });
+    } else if (PropsToFilter.has(key)) {
+      continue;
+    } else {
+      console.warn(
+        tagMessage(
+          `${key} is not a valid property for ${handlerType} and will be ignored.`
+        )
+      );
     }
   }
 
-  // TODO: Filter changes - passing functions (and possibly other types)
-  // causes a native crash
-  delete copy.onUpdate;
-  delete copy.simultaneousWithExternalGesture;
-  delete copy.requireExternalGestureToFail;
-  delete copy.blocksExternalGesture;
-
-  return copy;
+  return filteredConfig;
 }
 
 export function shouldHandleTouchEvents<THandlerData, TConfig>(

packages/react-native-gesture-handler/src/v3/types.ts

@@ -11,6 +11,12 @@ import { PointerType } from '../PointerType';
 
 import { State } from '../State';
 
+import { panGestureHandlerProps } from '../handlers/PanGestureHandler';
+import { tapGestureHandlerProps } from '../handlers/TapGestureHandler';
+import { nativeViewGestureHandlerProps } from '../handlers/NativeViewGestureHandler';
+import { longPressGestureHandlerProps } from '../handlers/LongPressGestureHandler';
+import { flingGestureHandlerProps } from '../handlers/FlingGestureHandler';
+
 interface EventPayload {
   handlerTag: number;
   state: State;
@@ -168,7 +174,7 @@ export type InternalConfigProps<THandlerData> = {
   changeEventCalculator?: ChangeCalculatorType<THandlerData>;
 };
 
-type CommonGestureConfig = WithSharedValue<
+export type CommonGestureConfig = WithSharedValue<
   {
     disableReanimated?: boolean;
     enabled?: boolean;
@@ -253,3 +259,15 @@ type Simplify<T> =
           // For a generic object, retain the original structure while forcing an object type
           [K in keyof T]: T[K];
         } & NonNullable<unknown>;
+
+export type WithAcceptedConfig<T> =
+  | T
+  | keyof CommonGestureConfig
+  | keyof InternalConfigProps<unknown>;
+
+export type HandlersPropsWhiteList =
+  | Set<WithAcceptedConfig<(typeof panGestureHandlerProps)[number]>>
+  | Set<WithAcceptedConfig<(typeof tapGestureHandlerProps)[number]>>
+  | Set<WithAcceptedConfig<(typeof nativeViewGestureHandlerProps)[number]>>
+  | Set<WithAcceptedConfig<(typeof longPressGestureHandlerProps)[number]>>
+  | Set<WithAcceptedConfig<(typeof flingGestureHandlerProps)[number]>>;