android and web refactor

Author: Andrzej Antoni Kwaśniewski

packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerDetectorView.kt

@@ -16,12 +16,7 @@ class RNGestureHandlerDetectorView(context: Context) : ReactViewGroup(context) {
   private var nativeHandlers: MutableSet<Int> = mutableSetOf()
   private var attachedHandlers: MutableSet<Int> = mutableSetOf()
   private var moduleId: Int = -1
-  private var logicChildren: HashMap<Int, LogicChild> = hashMapOf()
-
-  class LogicChild {
-    var handlerTags: List<Int>? = null
-    var attachedHandlers: MutableSet<Int> = mutableSetOf()
-  }
+  private var logicChildren: HashMap<Int, MutableSet<Int>> = hashMapOf()
 
   data class LogicProps(val handlerTags: List<Int>, val moduleId: Int, val viewTag: Int)
 
@@ -46,10 +41,12 @@ class RNGestureHandlerDetectorView(context: Context) : ReactViewGroup(context) {
   }
 
   fun setLogicChildren(newLogicChildren: ReadableArray?) {
-    val shouldKeepLogicChild = HashMap<Int, Boolean>()
+    val logicChildrenToDelete = HashSet<Int>()
+
     for (child in logicChildren) {
-      shouldKeepLogicChild[child.key] = false
+      logicChildrenToDelete.add(child.key)
     }
+
     val mappedChildren = mutableListOf<LogicProps>()
 
     for (i in 0 until newLogicChildren!!.size()) {
@@ -73,16 +70,24 @@ class RNGestureHandlerDetectorView(context: Context) : ReactViewGroup(context) {
       )
     }
 
-    for (child in logicChildren) {
-      shouldKeepLogicChild[child.key] = false
-    }
-
     for (child in mappedChildren) {
       if (!logicChildren.containsKey(child.viewTag)) {
-        logicChildren.put(child.viewTag, LogicChild())
+        logicChildren.put(child.viewTag, mutableSetOf())
       }
-      shouldKeepLogicChild[child.viewTag] = true
-      attachHandlers(child.handlerTags, child.viewTag, true, logicChildren[child.viewTag]!!.attachedHandlers)
+      logicChildrenToDelete.remove(child.viewTag)
+      attachHandlers(
+        child.handlerTags,
+        child.viewTag,
+        true,
+        logicChildren[child.viewTag]!!,
+      )
+    }
+
+    for (childTag in logicChildrenToDelete) {
+      val registry = RNGestureHandlerModule.registries[moduleId]
+        ?: throw Exception("Tried to access a non-existent registry")
+      registry.detachHandler(childTag)
+      logicChildren.remove(childTag)
     }
   }
 
@@ -197,10 +202,10 @@ class RNGestureHandlerDetectorView(context: Context) : ReactViewGroup(context) {
     }
 
     for (child in logicChildren) {
-      for (tag in child.value.attachedHandlers) {
+      for (tag in child.value) {
         registry.detachHandler(tag)
       }
-      child.value.attachedHandlers.clear()
+      child.value.clear()
     }
   }
 

packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerDetectorViewManager.kt

@@ -37,8 +37,8 @@ class RNGestureHandlerDetectorViewManager :
     view.setModuleId(value)
   }
 
-  override fun setLogicChildren(view: RNGestureHandlerDetectorView?, value: ReadableArray?) {
-    view?.setLogicChildren(value)
+  override fun setLogicChildren(view: RNGestureHandlerDetectorView, value: ReadableArray?) {
+    view.setLogicChildren(value)
   }
 
   override fun onDropViewInstance(view: RNGestureHandlerDetectorView) {

packages/react-native-gesture-handler/src/ActionType.ts

@@ -4,7 +4,7 @@ export const ActionType = {
   JS_FUNCTION_OLD_API: 3,
   JS_FUNCTION_NEW_API: 4,
   NATIVE_DETECTOR: 5,
-  LogicDetector: 6,
+  LOGIC_DETECTOR: 6,
 } as const;
 
 // eslint-disable-next-line @typescript-eslint/no-redeclare -- backward compatibility; it can be used as a type and as a value

packages/react-native-gesture-handler/src/v3/HostGestureDetector.web.tsx

@@ -19,11 +19,6 @@ export interface LogicDetectorProps {
   viewRef: RefObject<Element | null>;
 }
 
-interface LogicChild {
-  attachedHandlerTags: Set<number>;
-  attachedNativeHandlerTags: Set<number>;
-}
-
 const HostGestureDetector = (props: GestureHandlerDetectorProps) => {
   const { handlerTags, children } = props;
 
@@ -32,16 +27,15 @@ const HostGestureDetector = (props: GestureHandlerDetectorProps) => {
   const attachedHandlerTags = useRef<Set<number>>(new Set<number>());
   const attachedNativeHandlerTags = useRef<Set<number>>(new Set<number>());
 
-  const logicChildren = useRef<Map<number, LogicChild>>(new Map());
+  const logicChildren = useRef<Map<number, Set<number>>>(new Map());
 
   const detachHandlers = (
     oldHandlerTags: Set<number>,
-    attachedHandlerTags: Set<number>,
-    attachedNativeHandlerTags: Set<number>
+    attachedHandlerTags: Set<number>
   ) => {
     oldHandlerTags.forEach((tag) => {
       RNGestureHandlerModule.detachGestureHandler(tag);
-      attachedNativeHandlerTags.delete(tag);
+      attachedNativeHandlerTags.current.delete(tag);
       attachedHandlerTags.delete(tag);
     });
   };
@@ -51,16 +45,11 @@ const HostGestureDetector = (props: GestureHandlerDetectorProps) => {
     propsRef: RefObject<PropsRef>,
     currentHandlerTags: Set<number>,
     attachedHandlerTags: Set<number>,
-    attachedNativeHandlerTags: Set<number>,
     isLogic: boolean
   ) => {
     const oldHandlerTags = attachedHandlerTags.difference(currentHandlerTags);
     const newHandlerTags = currentHandlerTags.difference(attachedHandlerTags);
-    detachHandlers(
-      oldHandlerTags,
-      attachedHandlerTags,
-      attachedNativeHandlerTags
-    );
+    detachHandlers(oldHandlerTags, attachedHandlerTags);
 
     newHandlerTags.forEach((tag) => {
       if (
@@ -74,12 +63,12 @@ const HostGestureDetector = (props: GestureHandlerDetectorProps) => {
           ActionType.NATIVE_DETECTOR,
           propsRef
         );
-        attachedNativeHandlerTags.add(tag);
+        attachedNativeHandlerTags.current.add(tag);
       } else {
         RNGestureHandlerModule.attachGestureHandler(
           tag,
           viewRef.current,
-          isLogic ? ActionType.LogicDetector : ActionType.NATIVE_DETECTOR,
+          isLogic ? ActionType.LOGIC_DETECTOR : ActionType.NATIVE_DETECTOR,
           propsRef
         );
       }
@@ -90,8 +79,7 @@ const HostGestureDetector = (props: GestureHandlerDetectorProps) => {
   useEffect(() => {
     detachHandlers(
       attachedNativeHandlerTags.current,
-      attachedHandlerTags.current,
-      attachedNativeHandlerTags.current
+      attachedHandlerTags.current
     );
   }, [children]);
 
@@ -107,74 +95,47 @@ const HostGestureDetector = (props: GestureHandlerDetectorProps) => {
       propsRef,
       new Set(handlerTags),
       attachedHandlerTags.current,
-      attachedNativeHandlerTags.current,
       false
     );
   }, [handlerTags, children]);
 
   useEffect(() => {
-    const shouldKeepLogicChild: Map<number, boolean> = new Map();
+    const logicChildrenToDelete: Set<number> = new Set();
 
     for (const key of logicChildren.current.keys()) {
-      shouldKeepLogicChild.set(key, false);
+      logicChildrenToDelete.add(key);
     }
 
-    props.logicChildren?.forEach((child, key) => {
+    props.logicChildren?.forEach((child) => {
       if (!logicChildren.current.has(child.viewTag)) {
-        logicChildren.current.set(child.viewTag, {
-          attachedHandlerTags: new Set(),
-          attachedNativeHandlerTags: new Set(),
-        });
-      }
-      shouldKeepLogicChild.set(key.viewTag, true);
-      const attachedHandlerTags = logicChildren.current.get(
-        child.viewTag
-      )?.attachedHandlerTags;
-      const attachedNativeHandlerTags = logicChildren.current.get(
-        child.viewTag
-      )?.attachedNativeHandlerTags;
-      if (attachedHandlerTags && attachedNativeHandlerTags) {
-        attachHandlers(
-          child.viewRef,
-          propsRef,
-          new Set(child.handlerTags),
-          attachedHandlerTags,
-          attachedNativeHandlerTags,
-          true
-        );
+        logicChildren.current.set(child.viewTag, new Set());
       }
+      logicChildrenToDelete.delete(child.viewTag);
+      attachHandlers(
+        child.viewRef,
+        propsRef,
+        new Set(child.handlerTags),
+        logicChildren.current.get(child.viewTag)!,
+        true
+      );
     });
 
-    shouldKeepLogicChild.forEach((value, key) => {
-      if (value) {
-        const attachedHandlerTags =
-          logicChildren.current.get(key)?.attachedHandlerTags;
-        const attachedNativeHandlerTags =
-          logicChildren.current.get(key)?.attachedNativeHandlerTags;
-        if (attachedHandlerTags && attachedNativeHandlerTags) {
-          detachHandlers(
-            attachedHandlerTags,
-            attachedHandlerTags,
-            attachedNativeHandlerTags
-          );
-        }
+    logicChildrenToDelete.forEach((childTag) => {
+      if (attachedHandlerTags && attachedNativeHandlerTags) {
+        detachHandlers(
+          logicChildren.current.get(childTag)!,
+          logicChildren.current.get(childTag)!
+        );
       }
+      logicChildren.current.delete(childTag);
     });
   }, [props.logicChildren]);
 
   useEffect(() => {
     return () => {
-      detachHandlers(
-        attachedHandlerTags.current,
-        attachedHandlerTags.current,
-        attachedNativeHandlerTags.current
-      );
+      detachHandlers(attachedHandlerTags.current, attachedHandlerTags.current);
       logicChildren?.current.forEach((child) => {
-        detachHandlers(
-          child.attachedHandlerTags,
-          child.attachedHandlerTags,
-          child.attachedNativeHandlerTags
-        );
+        detachHandlers(child, child);
       });
     };
   }, []);

packages/react-native-gesture-handler/src/web/handlers/GestureHandler.ts

@@ -405,7 +405,7 @@ export default abstract class GestureHandler implements IGestureHandler {
         invokeNullableMethod(onGestureHandlerTouchEvent, touchEvent);
       } else if (
         onGestureHandlerLogicTouchEvent &&
-        this.actionType === ActionType.LogicDetector
+        this.actionType === ActionType.LOGIC_DETECTOR
       ) {
         invokeNullableMethod(onGestureHandlerLogicTouchEvent, touchEvent);
       } else {
@@ -429,14 +429,14 @@ export default abstract class GestureHandler implements IGestureHandler {
 
     const resultEvent: ResultEvent =
       this.actionType !== ActionType.NATIVE_DETECTOR &&
-      this.actionType !== ActionType.LogicDetector
+      this.actionType !== ActionType.LOGIC_DETECTOR
         ? this.transformEventData(newState, oldState)
         : this.lastSentState !== newState
           ? this.transformStateChangeEvent(newState, oldState)
           : this.transformUpdateEvent(newState);
 
     // TODO: cleanup the logic detector types
-    if (this.actionType === ActionType.LogicDetector) {
+    if (this.actionType === ActionType.LOGIC_DETECTOR) {
       resultEvent.nativeEvent = {
         ...resultEvent.nativeEvent,
         childTag: this.childTag,
@@ -450,7 +450,7 @@ export default abstract class GestureHandler implements IGestureHandler {
       this.lastSentState = newState;
       if (
         onGestureHandlerLogicStateChange &&
-        this.actionType === ActionType.LogicDetector
+        this.actionType === ActionType.LOGIC_DETECTOR
       ) {
         invokeNullableMethod(onGestureHandlerLogicStateChange, resultEvent);
       } else {
@@ -460,7 +460,7 @@ export default abstract class GestureHandler implements IGestureHandler {
     if (this.state === State.ACTIVE) {
       if (
         this.actionType !== ActionType.NATIVE_DETECTOR &&
-        this.actionType !== ActionType.LogicDetector
+        this.actionType !== ActionType.LOGIC_DETECTOR
       ) {
         (resultEvent.nativeEvent as GestureHandlerNativeEvent).oldState =
           undefined;
@@ -471,7 +471,7 @@ export default abstract class GestureHandler implements IGestureHandler {
 
       if (
         onGestureHandlerLogicEvent &&
-        this.actionType === ActionType.LogicDetector
+        this.actionType === ActionType.LOGIC_DETECTOR
       ) {
         invokeNullableMethod(onGestureHandlerLogicEvent, resultEvent);
       } else {