fix relations (#3722)

## Description

After
#3715
v3 api relations did not work. This PR fixes this issue, now relations
work in both APIs.

## Test plan
<details> 

<summary>old api</summary>

```ts
import React from 'react';
import { View, StyleSheet } from 'react-native';
import {
  GestureDetector,
  Gesture,
  GestureHandlerRootView,
} from 'react-native-gesture-handler';

export default function Example() {
  const innerTap = Gesture.Tap()
    .onStart(() => {
      console.log('inner tap');
    });

  const outerTap = Gesture.Tap()
    .onStart(() => {
      console.log('outer tap');
    })
    .simultaneousWithExternalGesture(innerTap);

  return (
    <GestureHandlerRootView style={styles.container}>
      <GestureDetector gesture={outerTap}>
        <View style={styles.outer}>
          <GestureDetector gesture={innerTap}>
            <View style={styles.inner} />
          </GestureDetector>
        </View>
      </GestureDetector>
    </GestureHandlerRootView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  outer: {
    width: 250,
    height: 250,
    backgroundColor: 'lightblue',
  },
  inner: {
    width: 100,
    height: 100,
    backgroundColor: 'blue',
    alignSelf: 'center',
  },
});
```

</details>

<details>

<summary>new api</summary>

```ts
import * as React from 'react';
import { Animated, Button, useAnimatedValue } from 'react-native';
import {
  GestureHandlerRootView,
  NativeDetector,
  useSimultaneous,
  useGesture,
  useExclusive,
  useRace,
  SingleGestureName,
} from 'react-native-gesture-handler';

export default function App() {
  const [visible, setVisible] = React.useState(true);

  const av = React.useRef(new Animated.Value(0)).current
  const event = Animated.event(
    [{ nativeEvent: { handlerData: { translationX: av } } }],
    {
      useNativeDriver: true,
    }
  );

  const tap1 = useGesture(SingleGestureName.Tap, {
    onEnd: () => {
      // 'worklet';
      console.log('Tap 1');
    },
    numberOfTaps: 1,
    disableReanimated: true,

  });

  const tap2 = useGesture(SingleGestureName.Tap, {
    onEnd: () => {
      // 'worklet';
      console.log('Tap 2');
    },
    numberOfTaps: 2,
    disableReanimated: true,
  });

  // const tap1 = useGesture('TapGestureHandler', {
  //   onEnd: () => {
  //     'worklet';
  //     console.log('Tap 1');
  //   },
  //   numberOfTaps: 1,
  //   // disableReanimated: true,
  //   requireExternalGestureToFail: tap2,
  // });

  // const pan1 = useGesture(SingleGestureName.Pan, {
  //   // onUpdate: event,
  //   onUpdate: (e) => {
  //     'worklet';
  //     console.log('Pan 1');
  //   },
  //   // disableReanimated: true,
  // });
  //
  // const pan2 = useGesture(SingleGestureName.Pan, {
  //   onUpdate: (e) => {
  //     'worklet';
  //     console.log('Pan 2');
  //   },
  //   simultaneousWithExternalGesture: pan1,
  //   // requireExternalGestureToFail: pan1,
  //   // blocksExternalGesture: pan1,
  //   // disableReanimated: true,
  // });

  // const composedGesture = useSimultaneous(pan1, pan2);

  const composedGesture = useExclusive(tap2, tap1);
  // const composedGesture = useExclusive(pan2, pan1); // For Animated.Event
  // const composedGesture = useExclusive(pan1, pan2); // For Animated.Event

  // const composedGesture = useRace(pan1, pan2);
  // const composedGesture = useRace(pan2, pan1);

  // const composedGesture = useExclusive(tap1, useSimultaneous(pan1, pan2));

  return (
    <GestureHandlerRootView
      style={{ flex: 1, backgroundColor: 'white', paddingTop: 8 }}>
      <Button
        title="Toggle visibility"
        onPress={() => {
          setVisible(!visible);
        }}
      />

      {visible && (
        <NativeDetector gesture={composedGesture}>
          <Animated.View
            style={[
              {
                width: 150,
                height: 150,
                backgroundColor: 'blue',
                opacity: 0.5,
                borderWidth: 10,
                borderColor: 'green',
                marginTop: 20,
                marginLeft: 40,
                display: 'flex',
                alignItems: 'center',
                justifyContent: 'space-around',
              },
              { transform: [{ translateX: av }] },
            ]}>
          </Animated.View>
        </NativeDetector>
      )}
    </GestureHandlerRootView>
  );
}
```
</details>

Author: akwasniewski

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

@@ -98,11 +98,6 @@ class RNGestureHandlerModule(reactContext: ReactApplicationContext?) :
     val factory = RNGestureHandlerFactoryUtil.findFactoryForHandler<GestureHandler>(handler) ?: return
 
     factory.setConfig(handler, config)
-
-    if (handler.actionType != GestureHandler.ACTION_TYPE_NATIVE_DETECTOR) {
-      interactionManager.dropRelationsForHandlerWithTag(handlerTag)
-      interactionManager.configureInteractions(handler, config)
-    }
   }
 
   @ReactMethod

packages/react-native-gesture-handler/apple/RNGestureHandler.mm

@@ -182,10 +182,6 @@ - (void)updateConfig:(NSDictionary *)config
       RCTLogError(@"Cannot have all of top, bottom and height defined");
     }
   }
-
-  if (_actionType != RNGestureHandlerActionTypeNativeDetector) {
-    [self updateRelations:config];
-  }
 }
 
 - (void)updateRelations:(NSDictionary *)relations

packages/react-native-gesture-handler/apple/RNGestureHandlerModule.mm

@@ -161,8 +161,9 @@ - (void)updateGestureHandlerConfig:(double)handlerTag newConfig:(NSDictionary *)
 
 - (void)configureRelations:(double)handlerTag relations:(NSDictionary *)relations
 {
-  RNGestureHandlerManager *manager = [RNGestureHandlerModule handlerManagerForModuleId:_moduleId];
-  [manager updateGestureHandlerRelations:[NSNumber numberWithDouble:handlerTag] relations:relations];
+  [self addOperationBlock:^(RNGestureHandlerManager *manager) {
+    [manager updateGestureHandlerRelations:[NSNumber numberWithDouble:handlerTag] relations:relations];
+  }];
 }
 
 - (void)dropGestureHandler:(double)handlerTag

packages/react-native-gesture-handler/src/handlers/createHandler.tsx

@@ -405,6 +405,16 @@ export default function createHandler<
         this.handlerTag,
         newConfig
       );
+
+      RNGestureHandlerModule.configureRelations(
+        this.handlerTag,
+        filterConfig(this.config, [
+          'waitFor',
+          'simultaneousHandlers',
+          'blocksHandlers',
+        ])
+      );
+
       scheduleFlushOperations();
     };
 

packages/react-native-gesture-handler/src/handlers/gestures/GestureDetector/attachHandlers.ts

@@ -63,11 +63,12 @@ export function attachHandlers({
     for (const handler of gesturesToAttach) {
       RNGestureHandlerModule.setGestureHandlerConfig(
         handler.handlerTag,
-        filterConfig(
-          handler.config,
-          ALLOWED_PROPS,
-          extractGestureRelations(handler)
-        )
+        filterConfig(handler.config, ALLOWED_PROPS)
+      );
+
+      RNGestureHandlerModule.configureRelations(
+        handler.handlerTag,
+        extractGestureRelations(handler)
       );
     }
 

packages/react-native-gesture-handler/src/handlers/gestures/GestureDetector/updateHandlers.ts

@@ -67,11 +67,12 @@ export function updateHandlers(
 
       RNGestureHandlerModule.setGestureHandlerConfig(
         handler.handlerTag,
-        filterConfig(
-          handler.config,
-          ALLOWED_PROPS,
-          extractGestureRelations(handler)
-        )
+        filterConfig(handler.config, ALLOWED_PROPS)
+      );
+
+      RNGestureHandlerModule.configureRelations(
+        handler.handlerTag,
+        extractGestureRelations(handler)
       );
 
       registerHandler(handler.handlerTag, handler, handler.config.testId);

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

@@ -146,4 +146,6 @@ export function configureRelations<THandlerData, TConfig>(
       gesture.gestureRelations
     );
   }
+
+  RNGestureHandlerModule.flushOperations();
 }

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

@@ -764,10 +764,6 @@ export default abstract class GestureHandler implements IGestureHandler {
       this._userSelect = config.userSelect;
     }
 
-    if (this.actionType !== ActionType.NATIVE_DETECTOR) {
-      InteractionManager.instance.configureInteractions(this, config);
-    }
-
     if (this.enabled) {
       return;
     }