fix types

Author: coado

apps/common-app/src/new_api/index.tsx

@@ -40,9 +40,9 @@ import PointerTypeExample from './tests/pointerType';
 import PressableExample from './tests/pressable';
 import ReattachingExample from './tests/reattaching';
 import RectButtonExample from './tests/rectButton';
+import RNResponderCancellationExample from './tests/rnResponderCancellation';
 import TwoFingerPanExample from './tests/twoFingerPan';
 import WebStylesResetExample from './tests/webStylesReset';
-import RNResponderCancellationExample from './tests/rnResponderCancellation';
 
 export const NEW_EXAMPLES: ExamplesSection[] = [
   {

apps/common-app/src/new_api/tests/rnResponderCancellation/MultiHandlerExample.tsx

@@ -1,12 +1,9 @@
 import React, { useCallback, useRef, useState } from 'react';
 import { StyleSheet, Switch, Text, View } from 'react-native';
 import { GestureDetector, usePanGesture } from 'react-native-gesture-handler';
-import {
-  COLORS,
-  Feedback,
-  FeedbackHandle,
-  commonStyles,
-} from '../../../common';
+
+import type { FeedbackHandle } from '../../../common';
+import { COLORS, commonStyles, Feedback } from '../../../common';
 
 // Validates that when two Gesture Handler recognizers are active at the same
 // time, both with cancelsJSResponder set to true, finishing ONE of them does
@@ -47,17 +44,17 @@ export function MultiHandlerExample() {
     runOnJS: true,
     cancelsJSResponder,
     onActivate: () => pushEvent('GH_A ACTIVE'),
-    onFinalize: (_e, success) =>
-      pushEvent(`GH_A finalize (${success ? 'success' : 'cancel/fail'})`),
+    onFinalize: (e) =>
+      pushEvent(`GH_A finalize (${e.canceled ? 'cancel/fail' : 'success'})`),
   });
 
   const panB = usePanGesture({
     minDistance: 8,
     runOnJS: true,
     cancelsJSResponder,
     onActivate: () => pushEvent('GH_B ACTIVE'),
-    onFinalize: (_e, success) =>
-      pushEvent(`GH_B finalize (${success ? 'success' : 'cancel/fail'})`),
+    onFinalize: (e) =>
+      pushEvent(`GH_B finalize (${e.canceled ? 'cancel/fail' : 'success'})`),
   });
 
   const clearLog = useCallback(() => {

apps/common-app/src/new_api/tests/rnResponderCancellation/SingleHandlerExample.tsx

@@ -1,12 +1,9 @@
 import React, { useCallback, useRef, useState } from 'react';
 import { StyleSheet, Switch, Text, View } from 'react-native';
 import { GestureDetector, usePanGesture } from 'react-native-gesture-handler';
-import {
-  COLORS,
-  Feedback,
-  FeedbackHandle,
-  commonStyles,
-} from '../../../common';
+
+import type { FeedbackHandle } from '../../../common';
+import { COLORS, commonStyles, Feedback } from '../../../common';
 
 const SINGLE_MAX_EVENTS = 8;
 
@@ -32,8 +29,10 @@ export function SingleHandlerExample() {
     onActivate: () => {
       pushEvent('GH pan ACTIVE');
     },
-    onFinalize: (_event, success) => {
-      pushEvent(`GH pan finalize (${success ? 'success' : 'cancel/fail'})`);
+    onFinalize: (event) => {
+      pushEvent(
+        `GH pan finalize (${event.canceled ? 'cancel/fail' : 'success'})`
+      );
     },
   });
 

apps/common-app/src/new_api/tests/rnResponderCancellation/index.tsx

@@ -1,8 +1,9 @@
 import React, { useState } from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
+
 import { COLORS } from '../../../common';
-import { SingleHandlerExample } from './SingleHandlerExample';
 import { MultiHandlerExample } from './MultiHandlerExample';
+import { SingleHandlerExample } from './SingleHandlerExample';
 
 type Tab = 'single' | 'multi';