Skip to content

Commit 18929e0

Browse files
m-bertm-bert
committed
Use set
1 parent 2051e8d commit 18929e0

17 files changed

Lines changed: 254 additions & 125 deletions

File tree

‎apps/common-app/src/e2e_screens/TestingScreen.tsx‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
import { Pressable, StyleSheet, Text, View } from 'react-native';
2-
import { ScrollView } from 'react-native-gesture-handler';
1+
import { StyleSheet, Text, View } from 'react-native';
2+
import { ScrollView, Touchable } from 'react-native-gesture-handler';
33

44
interface TestingScreenProps {
55
text: string;
6-
setText: (text: string) => void;
6+
buttonCallback: () => void;
77
children: React.ReactNode;
88
}
99

1010
export default function TestingScreen({
1111
text,
12-
setText,
12+
buttonCallback,
1313
children,
1414
}: TestingScreenProps) {
1515
return (
@@ -23,14 +23,12 @@ export default function TestingScreen({
2323
{children}
2424
</View>
2525
<View style={styles.buttonContainer}>
26-
<Pressable
27-
testID="reset"
28-
style={styles.resetButton}
29-
onPress={() => {
30-
setText('');
31-
}}>
32-
<Text>Reset</Text>
33-
</Pressable>
26+
<Touchable
27+
testID="extract-button"
28+
style={styles.extractButton}
29+
onPress={buttonCallback}>
30+
<Text style={styles.extractButtonText}>Extract callbacks</Text>
31+
</Touchable>
3432
</View>
3533
</View>
3634
);
@@ -59,7 +57,7 @@ const styles = StyleSheet.create({
5957
alignItems: 'center',
6058
justifyContent: 'center',
6159
},
62-
resetButton: {
60+
extractButton: {
6361
width: 120,
6462
height: 40,
6563
borderRadius: 20,
@@ -68,4 +66,7 @@ const styles = StyleSheet.create({
6866
justifyContent: 'center',
6967
alignItems: 'center',
7068
},
69+
extractButtonText: {
70+
color: 'white',
71+
},
7172
});

‎apps/common-app/src/e2e_screens/gestures/Fling.tsx‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,37 @@
1-
import { useState } from 'react';
1+
import { useRef, useState } from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import { GestureDetector, useFlingGesture } from 'react-native-gesture-handler';
44

55
import TestingScreen from '../TestingScreen';
6+
import { CallbackIDs } from '../utils';
67

78
export default function FlingScreen() {
89
const [text, setText] = useState('');
10+
const callbacks = useRef(new Set<string>());
911

1012
const flingGesture = useFlingGesture({
1113
onBegin: () => {
12-
setText((prev) => prev + '1');
14+
callbacks.current.add(CallbackIDs.onBegin);
1315
},
1416
onActivate: () => {
15-
setText((prev) => prev + '2');
17+
callbacks.current.add(CallbackIDs.onActivate);
1618
},
1719
onDeactivate: () => {
18-
setText((prev) => prev + '4');
20+
callbacks.current.add(CallbackIDs.onDeactivate);
1921
},
2022
onFinalize: () => {
21-
setText((prev) => prev + '5');
23+
callbacks.current.add(CallbackIDs.onFinalize);
2224
},
2325
runOnJS: true,
2426
});
2527

2628
return (
27-
<TestingScreen text={text} setText={setText}>
29+
<TestingScreen
30+
text={text}
31+
buttonCallback={() => {
32+
setText(`{Fling: ${Array.from(callbacks.current).join('')}}`);
33+
callbacks.current.clear();
34+
}}>
2835
<GestureDetector gesture={flingGesture}>
2936
<View style={styles.gestureBox} testID="fling-box" />
3037
</GestureDetector>

‎apps/common-app/src/e2e_screens/gestures/LongPress.tsx‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,40 @@
1-
import { useState } from 'react';
1+
import { useRef, useState } from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import {
44
GestureDetector,
55
useLongPressGesture,
66
} from 'react-native-gesture-handler';
77

88
import TestingScreen from '../TestingScreen';
9+
import { CallbackIDs } from '../utils';
910

1011
export default function LongPressScreen() {
1112
const [text, setText] = useState('');
13+
const callbacks = useRef(new Set<string>());
1214

1315
const longPressGesture = useLongPressGesture({
1416
onBegin: () => {
15-
setText((prev) => prev + '1');
17+
callbacks.current.add(CallbackIDs.onBegin);
1618
},
1719
onActivate: () => {
18-
setText((prev) => prev + '2');
20+
callbacks.current.add(CallbackIDs.onActivate);
1921
},
2022
onDeactivate: () => {
21-
setText((prev) => prev + '4');
23+
callbacks.current.add(CallbackIDs.onDeactivate);
2224
},
2325
onFinalize: () => {
24-
setText((prev) => prev + '5');
26+
callbacks.current.add(CallbackIDs.onFinalize);
2527
},
2628
runOnJS: true,
2729
});
2830

2931
return (
30-
<TestingScreen text={text} setText={setText}>
32+
<TestingScreen
33+
text={text}
34+
buttonCallback={() => {
35+
setText(`{LongPress: ${Array.from(callbacks.current).join('')}}`);
36+
callbacks.current.clear();
37+
}}>
3138
<GestureDetector gesture={longPressGesture}>
3239
<View style={styles.gestureBox} testID="long-press-box" />
3340
</GestureDetector>

‎apps/common-app/src/e2e_screens/gestures/Pan.tsx‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,40 @@
1-
import { useState } from 'react';
1+
import { useRef, useState } from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import { GestureDetector, usePanGesture } from 'react-native-gesture-handler';
44

55
import TestingScreen from '../TestingScreen';
6+
import { CallbackIDs } from '../utils';
67

78
export default function PanScreen() {
89
const [text, setText] = useState('');
10+
const callbacks = useRef(new Set<string>());
911

1012
const panGesture = usePanGesture({
1113
onBegin: () => {
12-
setText((prev) => prev + '1');
14+
callbacks.current.add(CallbackIDs.onBegin);
1315
},
1416
onActivate: () => {
15-
setText((prev) => prev + '2');
17+
callbacks.current.add(CallbackIDs.onActivate);
1618
},
1719
onUpdate: () => {
18-
// Skip subsequent updates
19-
if (text[text.length - 1] === '3') {
20-
return;
21-
}
22-
setText((prev) => prev + '3');
20+
callbacks.current.add(CallbackIDs.onUpdate);
2321
},
2422
onDeactivate: () => {
25-
setText((prev) => prev + '4');
23+
callbacks.current.add(CallbackIDs.onDeactivate);
2624
},
2725
onFinalize: () => {
28-
setText((prev) => prev + '5');
26+
callbacks.current.add(CallbackIDs.onFinalize);
2927
},
3028
runOnJS: true,
3129
});
3230

3331
return (
34-
<TestingScreen text={text} setText={setText}>
32+
<TestingScreen
33+
text={text}
34+
buttonCallback={() => {
35+
setText(`{Pan: ${Array.from(callbacks.current).join('')}}`);
36+
callbacks.current.clear();
37+
}}>
3538
<GestureDetector gesture={panGesture}>
3639
<View style={styles.gestureBox} testID="pan-box" />
3740
</GestureDetector>

‎apps/common-app/src/e2e_screens/gestures/Pinch.tsx‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,40 @@
1-
import { useState } from 'react';
1+
import { useRef, useState } from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import { GestureDetector, usePinchGesture } from 'react-native-gesture-handler';
44

55
import TestingScreen from '../TestingScreen';
6+
import { CallbackIDs } from '../utils';
67

78
export default function PinchScreen() {
89
const [text, setText] = useState('');
10+
const callbacks = useRef(new Set<string>());
911

1012
const pinchGesture = usePinchGesture({
1113
onBegin: () => {
12-
setText((prev) => prev + '1');
14+
callbacks.current.add(CallbackIDs.onBegin);
1315
},
1416
onActivate: () => {
15-
setText((prev) => prev + '2');
17+
callbacks.current.add(CallbackIDs.onActivate);
1618
},
1719
onUpdate: () => {
18-
// Skip subsequent updates
19-
if (text[text.length - 1] === '3') {
20-
return;
21-
}
22-
setText((prev) => prev + '3');
20+
callbacks.current.add(CallbackIDs.onUpdate);
2321
},
2422
onDeactivate: () => {
25-
setText((prev) => prev + '4');
23+
callbacks.current.add(CallbackIDs.onDeactivate);
2624
},
2725
onFinalize: () => {
28-
setText((prev) => prev + '5');
26+
callbacks.current.add(CallbackIDs.onFinalize);
2927
},
3028
runOnJS: true,
3129
});
3230

3331
return (
34-
<TestingScreen text={text} setText={setText}>
32+
<TestingScreen
33+
text={text}
34+
buttonCallback={() => {
35+
setText(`{Pinch: ${Array.from(callbacks.current).join('')}}`);
36+
callbacks.current.clear();
37+
}}>
3538
<GestureDetector gesture={pinchGesture}>
3639
<View style={styles.gestureBox} testID="pinch-box" />
3740
</GestureDetector>

‎apps/common-app/src/e2e_screens/gestures/Rotation.tsx‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,43 @@
1-
import { useState } from 'react';
1+
import { useRef, useState } from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import {
44
GestureDetector,
55
useRotationGesture,
66
} from 'react-native-gesture-handler';
77

88
import TestingScreen from '../TestingScreen';
9+
import { CallbackIDs } from '../utils';
910

1011
export default function RotationScreen() {
1112
const [text, setText] = useState('');
13+
const callbacks = useRef(new Set<string>());
1214

1315
const rotationGesture = useRotationGesture({
1416
onBegin: () => {
15-
setText((prev) => prev + '1');
17+
callbacks.current.add(CallbackIDs.onBegin);
1618
},
1719
onActivate: () => {
18-
setText((prev) => prev + '2');
20+
callbacks.current.add(CallbackIDs.onActivate);
1921
},
2022
onUpdate: () => {
21-
// Skip subsequent updates
22-
if (text[text.length - 1] === '3') {
23-
return;
24-
}
25-
setText((prev) => prev + '3');
23+
callbacks.current.add(CallbackIDs.onUpdate);
2624
},
2725
onDeactivate: () => {
28-
setText((prev) => prev + '4');
26+
callbacks.current.add(CallbackIDs.onDeactivate);
2927
},
3028
onFinalize: () => {
31-
setText((prev) => prev + '5');
29+
callbacks.current.add(CallbackIDs.onFinalize);
3230
},
3331
runOnJS: true,
3432
});
3533

3634
return (
37-
<TestingScreen text={text} setText={setText}>
35+
<TestingScreen
36+
text={text}
37+
buttonCallback={() => {
38+
setText(`{Rotation: ${Array.from(callbacks.current).join('')}}`);
39+
callbacks.current.clear();
40+
}}>
3841
<GestureDetector gesture={rotationGesture}>
3942
<View style={styles.gestureBox} testID="rotation-box" />
4043
</GestureDetector>

‎apps/common-app/src/e2e_screens/gestures/Tap.tsx‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,37 @@
1-
import { useState } from 'react';
1+
import { useRef, useState } from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import { GestureDetector, useTapGesture } from 'react-native-gesture-handler';
44

55
import TestingScreen from '../TestingScreen';
6+
import { CallbackIDs } from '../utils';
67

78
export default function TapScreen() {
89
const [text, setText] = useState('');
10+
const callbacks = useRef(new Set<string>());
911

1012
const tapGesture = useTapGesture({
1113
onBegin: () => {
12-
setText((prev) => prev + '1');
14+
callbacks.current.add(CallbackIDs.onBegin);
1315
},
1416
onActivate: () => {
15-
setText((prev) => prev + '2');
17+
callbacks.current.add(CallbackIDs.onActivate);
1618
},
1719
onDeactivate: () => {
18-
setText((prev) => prev + '4');
20+
callbacks.current.add(CallbackIDs.onDeactivate);
1921
},
2022
onFinalize: () => {
21-
setText((prev) => prev + '5');
23+
callbacks.current.add(CallbackIDs.onFinalize);
2224
},
2325
runOnJS: true,
2426
});
2527

2628
return (
27-
<TestingScreen text={text} setText={setText}>
29+
<TestingScreen
30+
text={text}
31+
buttonCallback={() => {
32+
setText(`{Tap: ${Array.from(callbacks.current).join('')}}`);
33+
callbacks.current.clear();
34+
}}>
2835
<GestureDetector gesture={tapGesture}>
2936
<View style={styles.gestureBox} testID="tap-box" />
3037
</GestureDetector>

0 commit comments

Comments
 (0)