diff --git a/.argent/flows/basic-long-press-test.yaml b/.argent/flows/basic-long-press-test.yaml new file mode 100644 index 0000000000..182eb3216a --- /dev/null +++ b/.argent/flows/basic-long-press-test.yaml @@ -0,0 +1,51 @@ +steps: + - echo: Launching Expo Example + - launch: com.example.ExpoExample + - await: { visible: { text: "Empty Example" }, timeout: 15000 } + - echo: "On the Home list, search for long press example" + - type: { text: "long", into: { id: "search-examples" } } + - echo: "Tap the example to open it" + - tap: "Basic LongPress" + - echo: "Clear console" + - await: { visible: "open-console-button" } + - await: { idle: true } + - tap: "open-console-button" + - await: { visible: "clear-console-button" } + - tap: "clear-console-button" + - tap: "close-console-button" + - await: { idle: true } + - echo: "Long press the box and check if long press count is updated" + - await: { visible: "Long press count: 0" } + - assert: { visible: "long-press-box" } + - long-press: "long-press-box" + - assert: { visible: "Long press count: 1" } + - echo: "Check if console logs are printed in order" + - tap: "open-console-button" + - await: { idle: true } + - await: { visible: "close-console-button" } + - assert: { visible: "1. onBegin" } + - assert: { visible: "2. onActivate" } + - assert: { visible: "3. onDeactivate" } + - assert: { visible: "4. onFinalize" } + - tap: "close-console-button" + - await: { idle: true } + - await: { visible: "Long press count: 1" } + - echo: "Long press the box again and check if long press count is updated" + - long-press: "long-press-box" + - assert: { visible: "Long press count: 2" } + - echo: "Clear console" + - await: { visible: "open-console-button" } + - tap: "open-console-button" + - await: { visible: "clear-console-button" } + - tap: "clear-console-button" + - tap: "close-console-button" + - await: { idle: true } + - echo: "Tap the box and check if long press count is not updated" + - tap: "long-press-box" + - assert: { visible: "Long press count: 2" } + - echo: "Check if console logs are printed in order" + - tap: "open-console-button" + - await: { idle: true } + - await: { visible: "close-console-button" } + - assert: { visible: "9. onBegin" } + - assert: { visible: "10. onFinalize" } diff --git a/apps/common-app/src/new_api/simple/longPress/index.tsx b/apps/common-app/src/new_api/simple/longPress/index.tsx index e0c3b56962..03b5d6242a 100644 --- a/apps/common-app/src/new_api/simple/longPress/index.tsx +++ b/apps/common-app/src/new_api/simple/longPress/index.tsx @@ -1,5 +1,5 @@ -import React from 'react'; -import { View } from 'react-native'; +import React, { useCallback, useState } from 'react'; +import { Text, View } from 'react-native'; import { GestureDetector, useLongPressGesture, @@ -10,12 +10,17 @@ import Animated, { useSharedValue, withTiming, } from 'react-native-reanimated'; +import { scheduleOnRN } from 'react-native-worklets'; -import { COLORS, commonStyles } from '../../../common'; +import { COLORS, commonStyles, useIndexedLogger } from '../../../common'; export default function LongPressExample() { - const colorProgress = useSharedValue(0); + const log = useIndexedLogger(); + const [count, setCount] = useState(0); + + const incrementCount = useCallback(() => setCount((c) => c + 1), []); + const colorProgress = useSharedValue(0); const finalise_color = useSharedValue(COLORS.PURPLE); const animatedStyle = useAnimatedStyle(() => { @@ -30,16 +35,26 @@ export default function LongPressExample() { const longPressGesture = useLongPressGesture({ onBegin: () => { + log('onBegin'); colorProgress.value = withTiming(1, { duration: 100, }); }, onActivate: () => { + log('onActivate'); + scheduleOnRN(incrementCount); colorProgress.value = withTiming(2, { duration: 100, }); }, + onDeactivate: () => { + log('onDeactivate'); + colorProgress.value = withTiming(1, { + duration: 100, + }); + }, onFinalize: (e) => { + log('onFinalize'); finalise_color.value = e.canceled ? COLORS.RED : COLORS.GREEN; colorProgress.value = 1; colorProgress.value = withTiming( @@ -56,8 +71,12 @@ export default function LongPressExample() { return ( + Long press count: {count} - + );