feat(example): Add delayed button

- Add it for both Flows and Traces

Author: abdelhamid-f-nasser

examples/default/src/screens/apm/FlowsScreen.tsx

@@ -6,6 +6,7 @@ import { Screen } from '../../components/Screen';
 import { VStack } from 'native-base';
 import { InputField } from '../../components/InputField';
 import { CustomButton } from '../../components/CustomButton';
+import BackgroundTimer from 'react-native-background-timer';
 
 export const FlowsScreen: React.FC = () => {
   const [flowName, setFlowName] = useState<string>('');
@@ -16,6 +17,12 @@ export const FlowsScreen: React.FC = () => {
     return APM.startFlow(flowName);
   }
 
+  async function startDelayedFlow() {
+    return BackgroundTimer.setTimeout(() => {
+      APM.startFlow(flowName);
+    }, 5000);
+  }
+
   function setFlowAttribute() {
     return APM.setFlowAttribute(flowName, flowAttributeKey, flowAttributeValue);
   }
@@ -35,6 +42,7 @@ export const FlowsScreen: React.FC = () => {
               value={flowName}
             />
             <CustomButton title="Start Flow" onPress={startFlow} />
+            <CustomButton title="Start 5s Delayed Flow" onPress={startDelayedFlow} />
             <InputField
               placeholder="Flows Attribute Key"
               onChangeText={(text) => setFlowAttributeKey(text)}

examples/default/src/screens/apm/TracesScreen.tsx

@@ -6,6 +6,7 @@ import { Screen } from '../../components/Screen';
 import { VStack } from 'native-base';
 import { InputField } from '../../components/InputField';
 import { CustomButton } from '../../components/CustomButton';
+import BackgroundTimer from 'react-native-background-timer';
 
 export const TracesScreen: React.FC = () => {
   const [traceName, setTraceName] = useState<string>('');
@@ -17,6 +18,12 @@ export const TracesScreen: React.FC = () => {
     executionTrace = await APM.startExecutionTrace(traceName ?? '');
   }
 
+  async function startDelayedTrace() {
+    return BackgroundTimer.setTimeout(async () => {
+      executionTrace = await APM.startExecutionTrace(traceName ?? '');
+    }, 5000);
+  }
+
   function setTraceAttribute() {
     if (!executionTrace) {
       console.log('Please, start a trace before setting attributes.');
@@ -42,6 +49,7 @@ export const TracesScreen: React.FC = () => {
               value={traceName}
             />
             <CustomButton title="Start Trace" onPress={startTrace} />
+            <CustomButton title="Start 5s Delayed Trace" onPress={startDelayedTrace} />
             <InputField
               placeholder="Trace Key Attribute"
               onChangeText={(text) => setTraceAttributeKey(text)}