@dynatrace/react-native-plugin 2.321.2 → 2.323.1

package/README.md

@@ -32,8 +32,8 @@ If you want to start using this plugin and are not a Dynatrace customer yet, hea
 ## Agent Versions
 This agent versions are configured in this plugin:
 
-* Android Agent: 8.321.1.1009
-* iOS Agent: 8.321.1.1007
+* Android Agent: 8.323.1.1002
+* iOS Agent: 8.323.1.1009
 
 ## Quick Setup
 
@@ -83,6 +83,7 @@ This agent versions are configured in this plugin:
 * [Maven Central in top-level gradle file](#maven-central-in-top-level-gradle-file)
 * [Configuration of standalone React Native project](#configuration-of-standalone-react-native-project)
 * [Instrumentation Overhead](#instrumentation-overhead)
+* [Typescript Setup for dtActionName and dtActionIgnore](#typescript-setup-for-dtactionignore-and-dtactionname)
 
 ## Troubleshooting
 * [Documentation](#dynatrace-documentation)
@@ -681,11 +682,7 @@ export default TouchableHighlightScreen;
 
 This example shows two *TouchableHighlight*, which will fire the *onPress()* function when pressed. The property `dtActionIgnore="true"` will prevent the monitoring of one of them. This means that the onPress will still be executed but we will no longer create a user action which is wrapping the button click. 
 
-If you want to set this property and use typescript you can use the following workaround: 
-
-```ts
-<TouchableHighlight {...{ "dtActionIgnore": "true" }}><Text>TouchableHighlight that will be ignored</Text></TouchableHighlight>
-```
+>*Attention:* If you are using Typescript and want to set this property with type-safety, look [here](#typescript-setup-for-dtactionignore-and-dtactionname).
 ## NPX Commands
 
 The following npx commands are available for the plugin:
@@ -1128,20 +1125,18 @@ ios: {
 
 ## Using dtActionName to change the name of the action
 
-We check for a property named `dtActionName` when creating an action. If `dtActionName` exists, this will be used for the action name above every other option listed in the previous section. Examples: 
-
-Typescript:
-```ts
-<TouchableHighlight {...{ "dtActionName": "CustomActionName" }}><Text>Custom Action Name</Text></TouchableHighlight>
-```
+We check for a property named `dtActionName` when creating an action. If `dtActionName` exists, this will be used for the action name above every other option listed in the previous section. Example: 
 
-JavaScript:
 ```js
-<TouchableHighlight dtActionName="CustomActionName"><Text>Custom Action Name</Text></TouchableHighlight>
+<TouchableHighlight dtActionName="CustomActionName">
+  <Text>Custom Action Name</Text>
+</TouchableHighlight>
 ```
 
 *Note:* [actionNamePrivacy](#plugin-startup) has no impact on using dtActionName. dtActionName will always be used.
 
+>*Attention:* If you are using Typescript and want to set this property with type-safety, look [here](#typescript-setup-for-dtactionignore-and-dtactionname).
+
 ## How does Dynatrace automatically report crashes?
  
 In general, Dynatrace always closes the session when a crash occurs. Usually a crash is when the application gets fully terminated. In React Native, we also see fatal errors in the JavaScript part as a full crash even though the native application is still alive. When this happens we will end the session. This is due to visibility reasons and may change in the future. The automated crash reporting will be (automatically) put in place by the transformer at the very beginning of the application. Using a custom error handler afterwards will not interfere with our crash handler.
@@ -1424,6 +1419,24 @@ When using auto-instrumenation through our plugin, here are some examples of the
 | Android              | Default new app         | 0.74.3         | 50.7 MB         | 50.9 MB        | 0.2 MB         |
 | iOS                  | Default new app         | 0.74.3         | 28.1 MB         | 36.5 MB        | 8.4 MB         |
 
+## Typescript Setup for dtActionIgnore and dtActionName
+
+We are using module augmentation to augment the IntrinsicAttributes Interface in the JSX namespace in the React module with dtActionName and dtActionIgnore. The IntrinsicAttributes Interface in the JSX namespace contains properties that you can pass to every JSX element, thus, in short, you can use dtActionName and dtActionIgnore with full type-safety on every JSX element if you follow the setup below.
+
+In general, ambient/global type declarations in packages like @dynatrace/react-native-plugin in your node_modules are visible and thus available to you for type checking in at least these cases:
+
+1. You import any type from a .ts or .d.ts file located in our package anywhere in your project. For instance, if you do `import { Dynatrace } from '@dynatrace/react-native-plugin'` anywhere in your project, Typescript will consider our Types and the module augmentation will work.
+
+2. You update your `tsconfig.json` to include our types, which will also make the module augmentation work:
+```json
+  "compilerOptions": {
+    "types": [
+      "@dynatrace/react-native-plugin"
+    ]
+  }
+```  
+We recommend the second option, since it works independent of whether you import anything from `@dynatrace/react-native-plugin`. We simply show the first option in case you wonder why `dtActionName` and `dtActionIgnore` are available on JSX elements despite not having added any configuration.
+
 ## Troubleshooting and applicable restrictions
 
 >**Attention:** If you think something is not working the way it should, ALWAYS try to reset the cache of metro first before starting a support case. You can do this via the CLI *react-native start --reset-cache*. If it still does not work feel free to open a support case.
@@ -1464,6 +1477,11 @@ If you are struggling with a problem, submit a support ticket to Dynatrace (supp
 <br/><br/>
 ## Changelog
 
+2.323.1
+* Updated Android (8.323.1.1002) & iOS Agent (8.323.1.1009)
+* Fixing Touchable/Text instrumentation for React Native 0.81+
+* Added [module augmentation of React](#typescript-setup-for-dtactionignore-and-dtactionname) to allow using dtActionName and dtActionIgnore type-safely on every JSX Element
+
 2.321.1
 * Updated Android (8.321.1.1009) & iOS Agent (8.321.1.1007)
 * Auto startup fixed for React Native v0.80 and higher

package/android/build.gradle

@@ -72,7 +72,7 @@ repositories {
 }
 
 dependencies {
-	implementation 'com.dynatrace.agent:agent-android:8.321.1.1009'
+	implementation 'com.dynatrace.agent:agent-android:8.323.1.1002'
     implementation "com.facebook.react:react-native:${safeExtGet('reactNative', '+')}"
 }
   

package/files/plugin.gradle

@@ -1,4 +1,4 @@
 // TEMPLATE: plugin-gradle.template
 dependencies {
-	classpath 'com.dynatrace.tools.android:gradle-plugin:8.321.1.1009'
+	classpath 'com.dynatrace.tools.android:gradle-plugin:8.323.1.1002'
 }

package/instrumentation/jsx/CreateElement.js

@@ -16,7 +16,7 @@ const createElement = (type, props, ...children) => {
             return _createElement(ClassComponent_1.DynatraceClassComponent, {}, _createElement(type, props, ...children));
         }
         else {
-            (0, ElementHelper_1.modifyElement)(type, props, ...children);
+            (0, ElementHelper_1.modifyElement)(type, props);
         }
     }
     return _createElement(type, props, ...children);

package/instrumentation/jsx/ElementHelper.js

@@ -2,11 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.isDtActionIgnore = exports.modifyElement = exports.instrumentCreateElement = void 0;
 const Types_1 = require("../model/Types");
-const TypesUtil_1 = require("../model/TypesUtil");
 const Dynatrace_1 = require("../../lib/core/Dynatrace");
-const ConsoleLogger_1 = require("../../lib/core/logging/ConsoleLogger");
 const Picker_1 = require("./components/Picker");
-const Touchable_1 = require("./components/Touchable");
 const RefreshControl_1 = require("./components/RefreshControl");
 const Switch_1 = require("./components/Switch");
 const FunctionalComponent_1 = require("./components/FunctionalComponent");
@@ -27,7 +24,7 @@ const instrumentCreateElement = (reactModule) => {
                     return reactCreateElement(ClassComponent_1.DynatraceClassComponent, {}, reactCreateElement(type, props, ...children));
                 }
                 else {
-                    (0, exports.modifyElement)(type, props, ...children);
+                    (0, exports.modifyElement)(type, props);
                 }
             }
             return reactCreateElement(type, props, ...children);
@@ -35,7 +32,7 @@ const instrumentCreateElement = (reactModule) => {
     }
 };
 exports.instrumentCreateElement = instrumentCreateElement;
-const modifyElement = (type, props, ...children) => {
+const modifyElement = (type, props) => {
     if (props != null) {
         if (type._dtInfo.type === Types_1.Types.RefreshControl &&
             props.onRefresh != null) {
@@ -45,17 +42,6 @@ const modifyElement = (type, props, ...children) => {
             props.onValueChange != null) {
             (0, Switch_1.SwitchHelper)(Dynatrace_1.Dynatrace).attachOnValueChange(props);
         }
-        else if (type._dtInfo.type === Types_1.Types.Button ||
-            type._dtInfo.type === Types_1.Types.Text ||
-            type._dtInfo.type === Types_1.Types.Pressable ||
-            (0, TypesUtil_1.isTypeTouchable)(type._dtInfo.type)) {
-            if (props.onPress != null) {
-                props.onPress = (0, Touchable_1.TouchableHelper)(Dynatrace_1.Dynatrace, new ConsoleLogger_1.ConsoleLogger('TouchableHelper')).attachOnPress(false, props, children, type._dtInfo.type);
-            }
-            if (props.onLongPress != null) {
-                props.onLongPress = (0, Touchable_1.TouchableHelper)(Dynatrace_1.Dynatrace, new ConsoleLogger_1.ConsoleLogger('TouchableHelper')).attachOnPress(true, props, children, type._dtInfo.type);
-            }
-        }
         else if (props.onValueChange != null &&
             type._dtInfo.type === Types_1.Types.Picker) {
             (0, Picker_1.PickerHelper)(Dynatrace_1.Dynatrace).attachOnValueChange(props);

package/instrumentation/jsx/IDynatraceProperties.js

@@ -1,9 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isDynatraceIgnored = exports.isDynatraceNaming = void 0;
-const isDynatraceNaming = (properties) => properties.dtActionName !== undefined;
-exports.isDynatraceNaming = isDynatraceNaming;
-const isDynatraceIgnored = (properties) => (properties.dtActionIgnore !== undefined &&
-    properties.dtActionIgnore === true) ||
-    properties.dtActionIgnore === 'true';
-exports.isDynatraceIgnored = isDynatraceIgnored;

package/instrumentation/jsx/JsxDevRuntime.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const ReactDevRuntime = require("react/jsx-dev-runtime");
 const Types_1 = require("../model/Types");
 const FunctionalComponent_1 = require("./components/FunctionalComponent");
 const ClassComponent_1 = require("./components/ClassComponent");
 const ElementHelper_1 = require("./ElementHelper");
-const ReactDevRuntime = require("react/jsx-dev-runtime");
 try {
     const jsxDEV = (...args) => {
         if (args[0] !== undefined &&
@@ -38,12 +38,7 @@ try {
                     return ReactDevRuntime.jsxDEV(ClassComponent_1.DynatraceClassComponent, wrapperProps);
                 }
             }
-            if (Array.isArray(args[1].children)) {
-                (0, ElementHelper_1.modifyElement)(args[0], args[1], ...args[1].children);
-            }
-            else {
-                (0, ElementHelper_1.modifyElement)(args[0], args[1], args[1].children);
-            }
+            (0, ElementHelper_1.modifyElement)(args[0], args[1]);
         }
         return ReactDevRuntime.jsxDEV(...args);
     };

package/instrumentation/jsx/JsxRuntime.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const ReactRuntime = require("react/jsx-runtime");
 const Types_1 = require("../model/Types");
 const FunctionalComponent_1 = require("./components/FunctionalComponent");
 const ClassComponent_1 = require("./components/ClassComponent");
 const ElementHelper_1 = require("./ElementHelper");
-const ReactRuntime = require("react/jsx-runtime");
 const instrumentJsxCall = (jsxFunction) => (...args) => {
     if (args[0] !== undefined &&
         args[0]._dtInfo !== undefined &&
@@ -37,12 +37,7 @@ const instrumentJsxCall = (jsxFunction) => (...args) => {
                 return jsxFunction(ClassComponent_1.DynatraceClassComponent, wrapperProps);
             }
         }
-        if (Array.isArray(args[1].children)) {
-            (0, ElementHelper_1.modifyElement)(args[0], args[1], ...args[1].children);
-        }
-        else {
-            (0, ElementHelper_1.modifyElement)(args[0], args[1], args[1].children);
-        }
+        (0, ElementHelper_1.modifyElement)(args[0], args[1]);
     }
     return jsxFunction(...args);
 };

package/instrumentation/jsx/components/ComponentUtil.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getNameFromComponent = void 0;
+exports.isDynatraceIgnored = exports.isDynatraceNaming = exports.getNameFromComponent = void 0;
 const getNameFromComponent = (props) => {
     if (props !== undefined && props.children !== undefined) {
         let child;
@@ -31,3 +31,14 @@ const getNameFromComponent = (props) => {
     }
 };
 exports.getNameFromComponent = getNameFromComponent;
+const isDynatraceNaming = (properties) => typeof properties === 'object' &&
+    properties !== null &&
+    'dtActionName' in properties &&
+    typeof properties.dtActionName === 'string';
+exports.isDynatraceNaming = isDynatraceNaming;
+const isDynatraceIgnored = (properties) => typeof properties === 'object' &&
+    properties !== null &&
+    'dtActionIgnore' in properties &&
+    (properties.dtActionIgnore === true ||
+        properties.dtActionIgnore === 'true');
+exports.isDynatraceIgnored = isDynatraceIgnored;

package/instrumentation/jsx/components/Picker.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PickerHelper = void 0;
-const IDynatraceProperties_1 = require("../IDynatraceProperties");
+const ComponentUtil_1 = require("./ComponentUtil");
 const PickerHelper = (Dynatrace) => ({
     attachOnValueChange: (pickerProps) => {
-        if ((0, IDynatraceProperties_1.isDynatraceIgnored)(pickerProps)) {
+        if ((0, ComponentUtil_1.isDynatraceIgnored)(pickerProps)) {
             return;
         }
         const origOnValueChange = pickerProps.onValueChange;
@@ -31,7 +31,7 @@ const PickerHelper = (Dynatrace) => ({
 exports.PickerHelper = PickerHelper;
 const isPickerItemProps = (props) => props.label !== undefined;
 const _findActionName = (pickerProps) => {
-    if ((0, IDynatraceProperties_1.isDynatraceNaming)(pickerProps)) {
+    if ((0, ComponentUtil_1.isDynatraceNaming)(pickerProps)) {
         return pickerProps.dtActionName;
     }
     else if (pickerProps.accessibilityLabel != null) {

package/instrumentation/jsx/components/RefreshControl.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RefreshControlHelper = void 0;
-const IDynatraceProperties_1 = require("../IDynatraceProperties");
+const ComponentUtil_1 = require("./ComponentUtil");
 const RefreshControlHelper = (Dynatrace) => ({
     attachOnRefresh: (refreshControlProps) => {
-        if ((0, IDynatraceProperties_1.isDynatraceIgnored)(refreshControlProps)) {
+        if ((0, ComponentUtil_1.isDynatraceIgnored)(refreshControlProps)) {
             return;
         }
         const origOnRefresh = refreshControlProps.onRefresh;
@@ -29,7 +29,7 @@ const RefreshControlHelper = (Dynatrace) => ({
 });
 exports.RefreshControlHelper = RefreshControlHelper;
 const _findActionName = (refreshControlProps) => {
-    if ((0, IDynatraceProperties_1.isDynatraceNaming)(refreshControlProps)) {
+    if ((0, ComponentUtil_1.isDynatraceNaming)(refreshControlProps)) {
         return refreshControlProps.dtActionName;
     }
     else if (refreshControlProps.accessibilityLabel != null) {

package/instrumentation/jsx/components/Switch.js

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SwitchHelper = void 0;
-const IDynatraceProperties_1 = require("../IDynatraceProperties");
+const ComponentUtil_1 = require("./ComponentUtil");
 const ConfigurationHandler_1 = require("../../../lib/core/configuration/ConfigurationHandler");
 const SwitchHelper = (Dynatrace) => ({
     attachOnValueChange: (switchProps) => {
-        if ((0, IDynatraceProperties_1.isDynatraceIgnored)(switchProps)) {
+        if ((0, ComponentUtil_1.isDynatraceIgnored)(switchProps)) {
             return;
         }
         const origOnValueChange = switchProps.onValueChange;
@@ -13,7 +13,7 @@ const SwitchHelper = (Dynatrace) => ({
         if (origOnValueChange != null) {
             switchProps.onValueChange = (value) => {
                 const useGenericName = nameOfAction == null ||
-                    (!(0, IDynatraceProperties_1.isDynatraceNaming)(switchProps) &&
+                    (!(0, ComponentUtil_1.isDynatraceNaming)(switchProps) &&
                         ConfigurationHandler_1.ConfigurationHandler.isActionNamePrivacyEnabled());
                 const finalNameOfAction = useGenericName
                     ? `Touch on Switch to ${value}`
@@ -44,7 +44,7 @@ const SwitchHelper = (Dynatrace) => ({
 });
 exports.SwitchHelper = SwitchHelper;
 const _findActionName = (switchProps) => {
-    if ((0, IDynatraceProperties_1.isDynatraceNaming)(switchProps)) {
+    if ((0, ComponentUtil_1.isDynatraceNaming)(switchProps)) {
         return switchProps.dtActionName;
     }
     else if (switchProps.accessibilityLabel != null) {

package/instrumentation/libs/community/gesture-handler/Touchables.js

@@ -1,40 +1,10 @@
 "use strict";
-var _a, _b, _c, _d;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RectButton = exports.TouchableWithoutFeedback = exports.TouchableNativeFeedback = exports.TouchableHighlight = exports.TouchableOpacity = void 0;
-const Types_1 = require("../../../model/Types");
-const gestureHandler = require('react-native-gesture-handler');
-if (gestureHandler !== undefined) {
-    if (typeof gestureHandler.TouchableOpacity !== 'object') {
-        exports.TouchableOpacity = (_a = class TouchableOpacity extends (gestureHandler.TouchableOpacity) {
-            },
-            _a._dtInfo = { type: Types_1.Types.TouchableOpacityGestureHandler },
-            _a);
-    }
-    if (typeof gestureHandler.TouchableHighlight !== 'object') {
-        exports.TouchableHighlight = (_b = class TouchableHighlight extends (gestureHandler.TouchableHighlight) {
-            },
-            _b._dtInfo = { type: Types_1.Types.TouchableHighlightGestureHandler },
-            _b);
-    }
-    if (typeof gestureHandler.TouchableNativeFeedback !== 'object') {
-        exports.TouchableNativeFeedback = (_c = class TouchableNativeFeedback extends (gestureHandler.TouchableNativeFeedback) {
-            },
-            _c._dtInfo = {
-                type: Types_1.Types.TouchableNativeFeedbackGestureHandler,
-            },
-            _c);
-    }
-    if (typeof gestureHandler.TouchableWithoutFeedback === 'object') {
-        exports.TouchableWithoutFeedback = Object.assign({ _dtInfo: { type: Types_1.Types.TouchableWithoutFeedbackGestureHandler } }, gestureHandler.TouchableWithoutFeedback);
-    }
-    if (typeof gestureHandler.RectButton !== 'object') {
-        exports.RectButton = (_d = class RectButton extends gestureHandler.RectButton {
-            },
-            _d._dtInfo = { type: Types_1.Types.RectButtonGestureHandler },
-            _d);
-    }
-    else {
-        exports.RectButton = Object.assign({ _dtInfo: { type: Types_1.Types.RectButtonGestureHandler } }, gestureHandler.RectButton);
-    }
-}
+const GestureHandler = require("react-native-gesture-handler");
+const withOnPressMonitoring_1 = require("../../withOnPressMonitoring");
+exports.TouchableOpacity = (0, withOnPressMonitoring_1.withOnPressMonitoring)(GestureHandler.TouchableOpacity, 'Touchable');
+exports.TouchableHighlight = (0, withOnPressMonitoring_1.withOnPressMonitoring)(GestureHandler.TouchableHighlight, 'Touchable');
+exports.TouchableNativeFeedback = (0, withOnPressMonitoring_1.withOnPressMonitoring)(GestureHandler.TouchableNativeFeedback, 'Touchable');
+exports.TouchableWithoutFeedback = (0, withOnPressMonitoring_1.withOnPressMonitoring)(GestureHandler.TouchableWithoutFeedback, 'Touchable');
+exports.RectButton = (0, withOnPressMonitoring_1.withOnPressMonitoring)(GestureHandler.RectButton, 'Button');

package/instrumentation/libs/react-native/Touchables.js

@@ -1,51 +1,12 @@
 "use strict";
-var _a, _b, _c, _d;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Pressable = exports.Text = exports.TouchableWithoutFeedback = exports.TouchableNativeFeedback = exports.TouchableHighlight = exports.TouchableOpacity = exports.Button = void 0;
 const ReactNative = require("react-native");
-const React = require("react");
-const Types_1 = require("../../model/Types");
-exports.Button = React.forwardRef((props, ref) => (React.createElement(ReactNative.Button, Object.assign({ title: props.title }, props, { ref: ref }))));
-exports.Button._dtInfo = { type: Types_1.Types.Button };
-if (typeof ReactNative.TouchableOpacity === 'object') {
-    exports.TouchableOpacity = Object.assign({ _dtInfo: { type: Types_1.Types.TouchableOpacity } }, ReactNative.TouchableOpacity);
-}
-else {
-    exports.TouchableOpacity = (_a = class TouchableOpacity extends (ReactNative.TouchableOpacity) {
-        },
-        _a._dtInfo = { type: Types_1.Types.TouchableOpacity },
-        _a);
-}
-if (typeof ReactNative.TouchableHighlight === 'object') {
-    exports.TouchableHighlight = Object.assign({ _dtInfo: { type: Types_1.Types.TouchableHighlight } }, ReactNative.TouchableHighlight);
-}
-else {
-    exports.TouchableHighlight = (_b = class TouchableHighlight extends (ReactNative.TouchableHighlight) {
-        },
-        _b._dtInfo = { type: Types_1.Types.TouchableHighlight },
-        _b);
-}
-if (typeof ReactNative.TouchableNativeFeedback === 'object') {
-    exports.TouchableNativeFeedback = Object.assign({ _dtInfo: { type: Types_1.Types.TouchableNativeFeedback } }, ReactNative.TouchableNativeFeedback);
-}
-else {
-    exports.TouchableNativeFeedback = (_c = class TouchableNativeFeedback extends (ReactNative.TouchableNativeFeedback) {
-        },
-        _c._dtInfo = { type: Types_1.Types.TouchableNativeFeedback },
-        _c);
-}
-exports.TouchableWithoutFeedback = React.forwardRef((props, ref) => (React.createElement(ReactNative.TouchableWithoutFeedback, Object.assign({}, props, { ref: ref }))));
-exports.TouchableWithoutFeedback._dtInfo = {
-    type: Types_1.Types.TouchableWithoutFeedback,
-};
-if (typeof ReactNative.Text === 'object') {
-    exports.Text = Object.assign({ _dtInfo: { type: Types_1.Types.Text } }, ReactNative.Text);
-}
-else {
-    exports.Text = (_d = class Text extends ReactNative.Text {
-        },
-        _d._dtInfo = { type: Types_1.Types.Text },
-        _d);
-}
-exports.Pressable = React.forwardRef((props, ref) => (React.createElement(ReactNative.Pressable, Object.assign({}, props, { ref: ref }))));
-exports.Pressable._dtInfo = { type: Types_1.Types.Pressable };
+const withOnPressMonitoring_1 = require("../withOnPressMonitoring");
+exports.Button = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.Button, 'Button');
+exports.TouchableOpacity = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.TouchableOpacity, 'Touchable');
+exports.TouchableHighlight = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.TouchableHighlight, 'Touchable');
+exports.TouchableNativeFeedback = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.TouchableNativeFeedback, 'Touchable');
+exports.TouchableWithoutFeedback = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.TouchableWithoutFeedback, 'Touchable');
+exports.Text = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.Text, 'Text');
+exports.Pressable = (0, withOnPressMonitoring_1.withOnPressMonitoring)(ReactNative.Pressable, 'Pressable');

package/instrumentation/libs/withOnPressMonitoring.js

@@ -0,0 +1,121 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.findTouchableName = exports.chooseTouchableName = exports.wrapOnPress = exports.withOnPressMonitoring = void 0;
+const ReactNative = require("react-native");
+const React = require("react");
+const ConsoleLogger_1 = require("../../lib/core/logging/ConsoleLogger");
+const ConfigurationHandler_1 = require("../../lib/core/configuration/ConfigurationHandler");
+const Dynatrace_1 = require("../../lib/core/Dynatrace");
+const ComponentUtil_1 = require("../jsx/components/ComponentUtil");
+const Logger = new ConsoleLogger_1.ConsoleLogger('TouchableHelper');
+function withOnPressMonitoring(Component, fallbackName) {
+    return React.forwardRef((props, ref) => {
+        const { onPress, onLongPress } = props;
+        const touchableName = (0, exports.chooseTouchableName)(props, fallbackName);
+        const dynatraceIgnored = (0, ComponentUtil_1.isDynatraceIgnored)(props);
+        const propsWithoutRef = Object.assign(Object.assign(Object.assign({}, props), (!dynatraceIgnored &&
+            onPress && {
+            onPress: (0, exports.wrapOnPress)(onPress, touchableName),
+        })), (!dynatraceIgnored &&
+            onLongPress && {
+            onLongPress: (0, exports.wrapOnPress)(onLongPress, touchableName),
+        }));
+        const propsWithRef = Object.assign(Object.assign({}, propsWithoutRef), { ref });
+        return React.createElement(Component, Object.assign({}, propsWithRef));
+    });
+}
+exports.withOnPressMonitoring = withOnPressMonitoring;
+const wrapOnPress = (onPress, touchableName) => {
+    return (...args) => {
+        if (!ConfigurationHandler_1.ConfigurationHandler.isConfigurationAvailable()) {
+            Logger.info('React Native plugin has not been started yet! Touch will not be reported!');
+            onPress(...args);
+        }
+        else {
+            const action = Dynatrace_1.Dynatrace.enterAutoAction(`Touch on ${touchableName}`);
+            let isSync = true;
+            try {
+                const returnValue = onPress(...args);
+                if (returnValue instanceof Promise) {
+                    isSync = false;
+                    return Promise.resolve(returnValue).finally(() => {
+                        action.leaveAction();
+                    });
+                }
+            }
+            finally {
+                if (isSync) {
+                    action.leaveAction();
+                }
+            }
+        }
+    };
+};
+exports.wrapOnPress = wrapOnPress;
+const chooseTouchableName = (props, fallbackName) => {
+    if (props.dtActionName) {
+        return props.dtActionName;
+    }
+    if (ConfigurationHandler_1.ConfigurationHandler.isConfigurationAvailable() &&
+        ConfigurationHandler_1.ConfigurationHandler.isActionNamePrivacyEnabled()) {
+        return fallbackName;
+    }
+    return (0, exports.findTouchableName)(props) || fallbackName;
+};
+exports.chooseTouchableName = chooseTouchableName;
+const findTouchableName = (props) => {
+    if ('title' in props) {
+        return props.title;
+    }
+    if (props.accessibilityLabel !== undefined) {
+        return props.accessibilityLabel;
+    }
+    if (typeof props.children === 'function') {
+        return findTouchableNameRecursive(props.children({ pressed: false }));
+    }
+    return findTouchableNameRecursive(props.children);
+};
+exports.findTouchableName = findTouchableName;
+function findTouchableNameRecursive(node) {
+    if (typeof node === 'string') {
+        return node;
+    }
+    if (isReactNodeIterable(node)) {
+        for (const child of node) {
+            const result = findTouchableNameRecursive(child);
+            if (result !== null)
+                return result;
+        }
+    }
+    if (React.isValidElement(node)) {
+        if (isReactNativeImage(node)) {
+            const uri = getUriFromSource(node.props.source);
+            return uri ? 'Image Button: ' + uri : 'Image Button';
+        }
+        if (isCustomIcon(node)) {
+            return node.props.name;
+        }
+        if (hasReactNodeChildren(node))
+            return findTouchableNameRecursive(node.props.children);
+    }
+    return null;
+}
+function getUriFromSource(source) {
+    if (typeof source === 'object' &&
+        'uri' in source &&
+        source.uri !== undefined) {
+        return source.uri;
+    }
+    return null;
+}
+const isReactNodeIterable = (node) => typeof node === 'object' && node !== null && Symbol.iterator in node;
+const isReactNativeImage = (element) => element.type === ReactNative.Image;
+const isCustomIcon = (element) => typeof element.type === 'function' &&
+    element.type.name === 'Icon' &&
+    typeof element.props === 'object' &&
+    element.props !== null &&
+    'name' in element.props &&
+    typeof element.props.name === 'string';
+const hasReactNodeChildren = (element) => typeof element.props === 'object' &&
+    element.props !== null &&
+    'children' in element.props;

package/instrumentation/model/Types.js

@@ -5,19 +5,7 @@ var Types;
 (function (Types) {
     Types[Types["FunctionalComponent"] = 0] = "FunctionalComponent";
     Types[Types["ClassComponent"] = 1] = "ClassComponent";
-    Types[Types["Button"] = 2] = "Button";
-    Types[Types["TouchableOpacity"] = 3] = "TouchableOpacity";
-    Types[Types["TouchableHighlight"] = 4] = "TouchableHighlight";
-    Types[Types["TouchableNativeFeedback"] = 5] = "TouchableNativeFeedback";
-    Types[Types["TouchableWithoutFeedback"] = 6] = "TouchableWithoutFeedback";
-    Types[Types["Text"] = 7] = "Text";
-    Types[Types["Picker"] = 8] = "Picker";
-    Types[Types["Pressable"] = 9] = "Pressable";
-    Types[Types["TouchableOpacityGestureHandler"] = 10] = "TouchableOpacityGestureHandler";
-    Types[Types["TouchableHighlightGestureHandler"] = 11] = "TouchableHighlightGestureHandler";
-    Types[Types["TouchableNativeFeedbackGestureHandler"] = 12] = "TouchableNativeFeedbackGestureHandler";
-    Types[Types["TouchableWithoutFeedbackGestureHandler"] = 13] = "TouchableWithoutFeedbackGestureHandler";
-    Types[Types["RectButtonGestureHandler"] = 14] = "RectButtonGestureHandler";
-    Types[Types["RefreshControl"] = 15] = "RefreshControl";
-    Types[Types["Switch"] = 16] = "Switch";
+    Types[Types["Picker"] = 2] = "Picker";
+    Types[Types["RefreshControl"] = 3] = "RefreshControl";
+    Types[Types["Switch"] = 4] = "Switch";
 })(Types = exports.Types || (exports.Types = {}));

package/instrumentation/model/TypesUtil.js

@@ -1,48 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getNameForType = exports.isTypeTouchable = exports.isTypeGestureHandlerTouchable = exports.isTypeReactNativeTouchable = void 0;
+exports.getNameForType = void 0;
 const Types_1 = require("./Types");
-const isTypeReactNativeTouchable = (type) => type === Types_1.Types.TouchableHighlight ||
-    type === Types_1.Types.TouchableNativeFeedback ||
-    type === Types_1.Types.TouchableOpacity ||
-    type === Types_1.Types.TouchableWithoutFeedback;
-exports.isTypeReactNativeTouchable = isTypeReactNativeTouchable;
-const isTypeGestureHandlerTouchable = (type) => type === Types_1.Types.TouchableHighlightGestureHandler ||
-    type === Types_1.Types.TouchableNativeFeedbackGestureHandler ||
-    type === Types_1.Types.TouchableOpacityGestureHandler ||
-    type === Types_1.Types.TouchableWithoutFeedbackGestureHandler ||
-    type === Types_1.Types.RectButtonGestureHandler;
-exports.isTypeGestureHandlerTouchable = isTypeGestureHandlerTouchable;
-const isTypeTouchable = (type) => (0, exports.isTypeGestureHandlerTouchable)(type) || (0, exports.isTypeReactNativeTouchable)(type);
-exports.isTypeTouchable = isTypeTouchable;
 const getNameForType = (type) => {
     switch (type) {
-        case Types_1.Types.Button:
-        case Types_1.Types.RectButtonGestureHandler:
-            return 'Button';
-        case Types_1.Types.Text:
-            return 'Text';
-        case Types_1.Types.TouchableHighlight:
-        case Types_1.Types.TouchableNativeFeedback:
-        case Types_1.Types.TouchableOpacity:
-        case Types_1.Types.TouchableWithoutFeedback:
-        case Types_1.Types.TouchableHighlightGestureHandler:
-        case Types_1.Types.TouchableNativeFeedbackGestureHandler:
-        case Types_1.Types.TouchableOpacityGestureHandler:
-        case Types_1.Types.TouchableWithoutFeedbackGestureHandler:
-            return 'Touchable';
-        case Types_1.Types.Pressable:
-            return 'Pressable';
+        case Types_1.Types.FunctionalComponent:
+            return 'Functional Component';
+        case Types_1.Types.ClassComponent:
+            return 'Class Component';
         case Types_1.Types.Picker:
             return 'Picker';
         case Types_1.Types.RefreshControl:
             return 'Refresh Control';
         case Types_1.Types.Switch:
             return 'Switch';
-        case Types_1.Types.ClassComponent:
-            return 'Class Component';
-        case Types_1.Types.FunctionalComponent:
-            return 'Functional Component';
         default:
             return 'Undefined';
     }

package/lib/next/Dynatrace.js

@@ -44,6 +44,7 @@ class DynatraceImpl {
         if (isApiReported) {
             event["characteristics.is_api_reported"] =
                 true;
+            event["dt.support.is_legacy_api_reported"] = true;
         }
         EventPipeline_1.EventPipeline.insertEvent(event);
     }
@@ -54,6 +55,7 @@ class DynatraceImpl {
         if (isApiReported) {
             event["characteristics.is_api_reported"] =
                 true;
+            event["dt.support.is_legacy_api_reported"] = true;
         }
         EventPipeline_1.EventPipeline.insertEvent(event);
     }
@@ -64,6 +66,7 @@ class DynatraceImpl {
         if (isApiReported) {
             event["characteristics.is_api_reported"] =
                 true;
+            event["dt.support.is_legacy_api_reported"] = true;
         }
         EventPipeline_1.EventPipeline.insertEvent(event);
     }

package/lib/next/events/spec/EventSpecContstants.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ALL_APP_START_KEYS = exports.MODIFY_EVENT_WHITELIST_NAMESPACE = exports.MODIFY_EVENT_WHITELIST_FIELDS = exports.SEND_SESSION_PROPERTY_EVENT_WHITELIST_FIELDS = exports.SEND_EVENT_WHITELIST_FIELDS = exports.SEND_SESSION_PROPERTY_EVENT_WHITELIST_NAMESPACES = exports.SEND_EVENT_WHITELIST_NAMESPACES = exports.AllCharacteristicsKeys = exports.KEY_NAME_REGEX = exports.MAX_CUSTOM_EVENT_VALUE_LENGTH = exports.MAX_CUSTOM_EVENT_KEY_LENGTH = exports.MAX_CUSTOM_EVENT_FIELDS = void 0;
-const SPECIFICATION_VERSION = '0.20';
+const SPECIFICATION_VERSION = '0.21';
 exports.MAX_CUSTOM_EVENT_FIELDS = 50;
 exports.MAX_CUSTOM_EVENT_KEY_LENGTH = 100;
 exports.MAX_CUSTOM_EVENT_VALUE_LENGTH = 5000;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynatrace/react-native-plugin",
-  "version": "2.321.2",
+  "version": "2.323.1",
   "description": "This plugin gives you the ability to use the Dynatrace Mobile agent in your react native application.",
   "main": "index.js",
   "types": "typings/react-native-dynatrace.d.ts",
@@ -101,6 +101,7 @@
     "jest-mock": "^30.0.2",
     "npm-check-updates": "^18.0.1",
     "prettier": "^2.6.1",
+    "react-native-gesture-handler": "^2.28.0",
     "shelljs": "^0.10.0",
     "ts-jest": "^29.4.0",
     "typescript": "^4.7.4",
@@ -154,7 +155,8 @@
     "lib/next/events/modifier/*.js",
     "lib/next/events/spec/*.js",
     "lib/next/provider/*.js",
-    "src/lib/core/interface/NativeDynatraceBridge.ts"
+    "src/lib/core/interface/NativeDynatraceBridge.ts",
+    "src/instrumentation/jsx/IDynatraceProperties.ts"
   ],
   "codegenConfig": {
     "name": "DynatraceBridgeSpec",

package/react-native-dynatrace.podspec

@@ -111,7 +111,7 @@ Pod::Spec.new do |s|
   #
   
   s.dependency "React"
-  s.dependency 'Dynatrace', '~> 8.321.1.1007'
+  s.dependency 'Dynatrace', '~> 8.323.1.1009'
 
   # Allows for better compatibility for older and newer versions
   if defined?(install_modules_dependencies)

package/scripts/Ios.js

@@ -186,7 +186,7 @@ const createNewPListIfRequired = (parsedPList, configProps, pathToPList) => {
     const configIncludingFlavor = configProps + getAdditionalInternalPluginKeys() + updatedExcludedStr(configProps);
     if (isPropertyCountEqual(parsedPList, configIncludingFlavor) && comparePListAndConfig(parsedPList, configIncludingFlavor)) {
         Logger_1.default.logMessageSync('Not generating a new plist as the current plist and ' +
-            '   dynatrace.config.js iOS properties are identical!', Logger_1.default.INFO);
+            'dynatrace.config.js iOS properties are identical!', Logger_1.default.INFO);
     }
     else {
         Logger_1.default.logMessageSync('Generating a new plist as the current plist ' +

package/scripts/Logger.js

@@ -41,19 +41,23 @@ const logMessageSync = (_message, _logLevel, _onlyConsole = false) => {
     catch (e) {
     }
     let logString;
+    let prefix = '';
     if (_logLevel === INFO) {
         logString = '#INFO  ';
+        prefix = _prefix.info;
     }
     else if (_logLevel === WARNING) {
         logString = '#WARN  ';
+        prefix = _prefix.warning;
     }
     else if (_logLevel === ERROR) {
         logString = '#ERROR ';
+        prefix = _prefix.error;
     }
     else {
         logString = '#NONE  ';
     }
-    const outputString = logString + '[' + currentDate() + ']: ' + _message;
+    const outputString = logString + '[' + currentDate() + ']: ' + prefix + _message;
     console.log(outputString);
     if (!_onlyConsole) {
         fs.appendFileSync(PathsConstants_1.default.getCurrentLogPath(), outputString + '\r\n');
@@ -67,10 +71,25 @@ const currentDate = () => {
     const localISOTime = (new Date(Date.now() - tzoffset)).toISOString().slice(0, -5);
     return localISOTime.replace('T', ' ');
 };
+const noPrefix = {
+    info: '',
+    warning: '',
+    error: '',
+};
+let _prefix = noPrefix;
 exports.default = {
     ERROR,
     INFO,
     WARNING,
+    withPrefix(prefix, callback) {
+        try {
+            _prefix = Object.assign(Object.assign({}, _prefix), prefix);
+            return callback();
+        }
+        finally {
+            _prefix = noPrefix;
+        }
+    },
     closeLogFile,
     logMessageSync,
     logErrorSync,

package/scripts/core/InstrumentCall.js

@@ -6,14 +6,42 @@ const Logger_1 = require("../Logger");
 const Config_1 = require("../Config");
 const android = require("../Android");
 const PathsConstants_1 = require("../PathsConstants");
+const nodePath = require("path");
 const Ios_1 = require("../Ios");
 const InstrumentUtil_1 = require("../util/InstrumentUtil");
 const CustomArgumentUtil_1 = require("../util/CustomArgumentUtil");
 const Platform_1 = require("../api/model/Platform");
 const SourceMapUtil_1 = require("../util/SourceMapUtil");
 const instrumentCommand = () => {
-    Logger_1.default.logMessageSync('Starting instrumentation of React Native application ..', Logger_1.default.INFO);
-    (0, InstrumentUtil_1.showVersionOfPlugin)();
+    if (process.argv.includes('--help')) {
+        Logger_1.default.logMessageSync(`
+        Usage: npx instrumentDynatrace [options]
+
+        Options:
+            --help                          Show this help message and exit.
+            config="/custom/path/to/dynatrace.config.js"
+                                            Specify a custom path to the Dynatrace configuration file.
+                                            Default: ${PathsConstants_1.default.getConfigFilePath()}
+            gradle="/custom/path/to/build.gradle(.kts)"
+                                            Specify a custom path to the top level build.gradle file of your android project.
+                                            Default: ${PathsConstants_1.default.getAndroidGradleFile(PathsConstants_1.default.getAndroidFolder())}
+            plist="/custom/path/to/Info.plist"
+                                            Specify a custom path to the Info.plist file of your ios project.
+                                            Default: Extracts <appName> from app.json and then tries
+                                            ${nodePath.join(PathsConstants_1.default.getIOSFolder(), "<appName>", 'Info.plist')}
+                                            and ${nodePath.join(PathsConstants_1.default.getIOSFolder(), "<appName>", "Supporting", "Info.plist")}
+                                            in that order
+
+        Examples:
+            npx instrumentDynatrace
+            npx instrumentDynatrace config="/custom/path/to/dynatrace.config.js"
+            npx instrumentDynatrace gradle="/custom/path/to/build.gradle"
+            npx instrumentDynatrace plist="/custom/path/to/Info.plist"
+        `, Logger_1.default.INFO);
+        return;
+    }
+    Logger_1.default.logMessageSync('⏳ Starting instrumentation of React Native application ..', Logger_1.default.INFO);
+    Logger_1.default.withPrefix({ info: '  ℹ️  ', warning: '  ⚠️  ' }, () => (0, InstrumentUtil_1.showVersionOfPlugin)());
     let pathToConfig = PathsConstants_1.default.getConfigFilePath();
     let pathToGradle = PathsConstants_1.default.getAndroidGradleFile(PathsConstants_1.default.getAndroidFolder());
     const pathToAppGradle = PathsConstants_1.default.getAndroidAppGradleFile(PathsConstants_1.default.getAndroidFolder());
@@ -30,69 +58,69 @@ const instrumentCommand = () => {
     if (argv.isCustomConfigurationPathSet()) {
         pathToConfig = argv.getCustomConfigurationPath();
     }
-    if (argv.isCustomGradlePathSet()) {
-        pathToGradle = argv.getCustomGradlePath();
-        androidAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(pathToGradle, Platform_1.Platform.Android);
-    }
-    else {
-        androidAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(PathsConstants_1.default.getAndroidFolder(), Platform_1.Platform.Android);
-    }
-    if (argv.isCustomPlistPathSet()) {
-        pathToPList = (0, path_1.resolve)(argv.getCustomPlistPath());
-        iosAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(pathToPList, Platform_1.Platform.IOS);
-    }
-    else {
-        iosAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(PathsConstants_1.default.getIOSFolder(), Platform_1.Platform.IOS);
-    }
+    Logger_1.default.withPrefix({ info: '  ℹ️  ', warning: '  ⚠️  ', error: '  ❌ ' }, () => {
+        if (argv.isCustomGradlePathSet()) {
+            pathToGradle = argv.getCustomGradlePath();
+            androidAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(pathToGradle, Platform_1.Platform.Android);
+        }
+        else {
+            androidAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(PathsConstants_1.default.getAndroidFolder(), Platform_1.Platform.Android);
+        }
+        if (argv.isCustomPlistPathSet()) {
+            pathToPList = (0, path_1.resolve)(argv.getCustomPlistPath());
+            iosAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(pathToPList, Platform_1.Platform.IOS);
+        }
+        else {
+            iosAvailable = (0, InstrumentUtil_1.isPlatformAvailable)(PathsConstants_1.default.getIOSFolder(), Platform_1.Platform.IOS);
+        }
+    });
     pathToConfig = (0, path_1.resolve)(pathToConfig);
     pathToGradle = (0, path_1.resolve)(pathToGradle);
     if (iosAvailable || androidAvailable) {
         try {
-            Logger_1.default.logMessageSync('Trying to read configuration file: ' + pathToConfig, Logger_1.default.INFO);
+            Logger_1.default.logMessageSync('⏳ Trying to read configuration file: ' + pathToConfig, Logger_1.default.INFO);
             const configAgent = (0, Config_1.readConfig)(pathToConfig);
             if (androidAvailable) {
                 try {
-                    Logger_1.default.logMessageSync('Starting Android Instrumentation with Dynatrace!', Logger_1.default.INFO);
-                    android.instrumentAndroidPlatform(pathToGradle, false);
-                    android.writeGradleConfig(configAgent.android);
-                    android.ensureRuntimeScriptApplied(pathToAppGradle);
+                    Logger_1.default.logMessageSync('⏳ Starting Android Instrumentation with Dynatrace!', Logger_1.default.INFO);
+                    Logger_1.default.withPrefix({ info: '  ℹ️  ', warning: '  ⚠️  ', error: '  ❌ ' }, () => {
+                        android.instrumentAndroidPlatform(pathToGradle, false);
+                        android.writeGradleConfig(configAgent.android);
+                        android.ensureRuntimeScriptApplied(pathToAppGradle);
+                    });
                     android.copyGradleConfigFile(pathToGradle);
+                    Logger_1.default.logMessageSync('  ✅ Finished Android Instrumentation with Dynatrace!', Logger_1.default.INFO);
                 }
                 catch (e) {
                     if (e instanceof Error) {
-                        Logger_1.default.logMessageSync(e.message, Logger_1.default.ERROR);
+                        Logger_1.default.logMessageSync('  ❌ Android Instrumentation failed: ' + e.message, Logger_1.default.ERROR);
                     }
                 }
-                finally {
-                    Logger_1.default.logMessageSync('Finished Android Instrumentation with Dynatrace!', Logger_1.default.INFO);
-                }
             }
             if (iosAvailable) {
                 try {
-                    Logger_1.default.logMessageSync('Starting iOS Instrumentation with Dynatrace!', Logger_1.default.INFO);
-                    Ios_1.default.modifyPListFile(pathToPList, configAgent.ios, false);
+                    Logger_1.default.logMessageSync('⏳ Starting iOS Instrumentation with Dynatrace!', Logger_1.default.INFO);
+                    Logger_1.default.withPrefix({ info: '  ℹ️  ', warning: '  ⚠️  ', error: '  ❌ ' }, () => Ios_1.default.modifyPListFile(pathToPList, configAgent.ios, false));
+                    Logger_1.default.logMessageSync('  ✅ Finished iOS Instrumentation with Dynatrace!', Logger_1.default.INFO);
                 }
                 catch (e) {
                     if (e instanceof Error) {
-                        Logger_1.default.logMessageSync(e.message, Logger_1.default.ERROR);
+                        Logger_1.default.logMessageSync('  ❌ iOS Instrumentation failed: ' + e.message, Logger_1.default.ERROR);
                     }
                 }
-                finally {
-                    Logger_1.default.logMessageSync('Finished iOS Instrumentation with Dynatrace!', Logger_1.default.INFO);
-                }
             }
             (0, SourceMapUtil_1.patchMetroSourceMap)();
+            Logger_1.default.logMessageSync('🎉 Finished instrumentation of React Native application ..', Logger_1.default.INFO);
         }
         catch (e) {
             if (e instanceof Error) {
-                Logger_1.default.logMessageSync(e.message, Logger_1.default.ERROR);
+                Logger_1.default.logMessageSync('❌ Instrumentation failed: ' + e.message, Logger_1.default.ERROR);
             }
         }
     }
     else {
-        Logger_1.default.logMessageSync('Both Android and iOS Folder are not available - Skip instrumentation.', Logger_1.default.WARNING);
+        Logger_1.default.logMessageSync('⚠️  Both Android and iOS Folder are not available - Skip instrumentation.', Logger_1.default.WARNING);
     }
-    Logger_1.default.logMessageSync('Finished instrumentation of React Native application ..', Logger_1.default.INFO);
     Logger_1.default.closeLogFile();
 };
 exports.instrumentCommand = instrumentCommand;

package/scripts/util/SourceMapUtil.js

@@ -8,11 +8,11 @@ const FileOperationHelper_1 = require("../FileOperationHelper");
 exports.SOURCE_MAP_BACKUP_FILE = 'getSourceMapInfoOrig.js';
 exports.SOURCE_MAP_FILE = 'getSourceMapInfo.js';
 const patchMetroSourceMap = () => {
-    Logger_1.default.logMessageSync('Patching SourceMap generation of Metro .. ', Logger_1.default.INFO);
+    Logger_1.default.logMessageSync('⏳ Patching SourceMap generation of Metro .. ', Logger_1.default.INFO);
     const origSourceMapPath = (0, path_1.join)(PathsConstants_1.default.getMetroSouceMapPath(), exports.SOURCE_MAP_BACKUP_FILE);
     try {
         FileOperationHelper_1.default.checkIfFileExistsSync(origSourceMapPath);
-        Logger_1.default.logMessageSync('Patching of SourceMap already happened!', Logger_1.default.INFO);
+        Logger_1.default.logMessageSync('  ℹ️  Patching of SourceMap already happened!', Logger_1.default.INFO);
     }
     catch (e) {
         try {
@@ -20,10 +20,10 @@ const patchMetroSourceMap = () => {
             FileOperationHelper_1.default.checkIfFileExistsSync(currentSourceMapPath);
             FileOperationHelper_1.default.renameFileSync(currentSourceMapPath, origSourceMapPath);
             FileOperationHelper_1.default.copyFileSync(PathsConstants_1.default.getOurSourceMapFile(), currentSourceMapPath);
-            Logger_1.default.logMessageSync('Patching of SourceMap successful!', Logger_1.default.INFO);
+            Logger_1.default.logMessageSync('  ✅ Patching of SourceMap successful!', Logger_1.default.INFO);
         }
         catch (e) {
-            Logger_1.default.logMessageSync('Patching of SourceMap generation failed!', Logger_1.default.ERROR);
+            Logger_1.default.logMessageSync('  ❌ Patching of SourceMap generation failed!', Logger_1.default.ERROR);
         }
     }
 };

package/src/instrumentation/jsx/IDynatraceProperties.ts

@@ -0,0 +1,15 @@
+/**
+ * Interface which is containing the additional properties available for instrumentation.
+ */
+export interface IDynatraceProperties {
+    /**
+     * This string is changing the name of the action. So it is possible to override the action naming.
+     */
+    dtActionName?: string;
+
+    /**
+     * If true is passed the auto instrumentation will skip the action creation. We allow both string
+     * and boolean.
+     */
+    dtActionIgnore?: boolean | 'true' | 'false';
+}

package/typings/react-native-dynatrace.d.ts

@@ -1,3 +1,6 @@
+import 'react'
+import { IDynatraceProperties } from '../src/instrumentation/jsx/IDynatraceProperties';
+
 /**
 * react-native-dynatrace.d.ts
 *
@@ -1717,4 +1720,10 @@ export declare class ConfigurationBuilder {
      * @see https://www.npmjs.com/package/@dynatrace/react-native-plugin#plugin-startup
      */
 	public buildConfiguration(): IConfiguration;
+}
+
+declare module 'react' {
+    namespace JSX {
+		interface IntrinsicAttributes extends IDynatraceProperties {}
+	}
 }

package/instrumentation/jsx/components/Touchable.js

@@ -1,151 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TouchableHelper = void 0;
-const ConfigurationHandler_1 = require("../../../lib/core/configuration/ConfigurationHandler");
-const IDynatraceProperties_1 = require("../IDynatraceProperties");
-const TypesUtil_1 = require("../../model/TypesUtil");
-const TouchableHelper = (Dynatrace, Logger) => ({
-    attachOnPress(longPress, props, children, type) {
-        const origFunction = longPress && this._isLongPress(props)
-            ? props.onLongPress
-            : props.onPress;
-        const nameOfAction = this._findActionName(props, children);
-        const wrappedFunction = (event) => {
-            if (nameOfAction == null) {
-                Logger.debug('Skipping creation of action as no name was found!');
-                if (origFunction != null) {
-                    return origFunction(event);
-                }
-            }
-            else if (origFunction != null &&
-                origFunction._dtWrapped !== undefined &&
-                origFunction._dtWrapped === true) {
-                Logger.debug(`Skip wrapping of ${nameOfAction} onPress as it is already wrapped!`);
-                return origFunction(event);
-            }
-            else if (!ConfigurationHandler_1.ConfigurationHandler.isConfigurationAvailable()) {
-                Logger.info('React Native plugin has not been started yet! Touch will not be reported!');
-                if (origFunction != null) {
-                    return origFunction(event);
-                }
-            }
-            else {
-                let finalNameOfAction = nameOfAction;
-                if (!(0, IDynatraceProperties_1.isDynatraceNaming)(props) &&
-                    ConfigurationHandler_1.ConfigurationHandler.isActionNamePrivacyEnabled()) {
-                    finalNameOfAction = (0, TypesUtil_1.getNameForType)(type);
-                }
-                const action = Dynatrace.enterAutoAction(`Touch on ${finalNameOfAction}`);
-                if (origFunction != null) {
-                    let isSyncError = true;
-                    try {
-                        const returnValue = origFunction(event);
-                        if (_isPromise(returnValue)) {
-                            isSyncError = false;
-                            return Promise.resolve(returnValue).finally(() => {
-                                action.leaveAction();
-                            });
-                        }
-                        else {
-                            action.leaveAction();
-                        }
-                        isSyncError = false;
-                    }
-                    finally {
-                        if (isSyncError) {
-                            action.leaveAction();
-                        }
-                    }
-                }
-                else {
-                    action.leaveAction();
-                }
-            }
-        };
-        wrappedFunction._dtWrapped = true;
-        return wrappedFunction;
-    },
-    _findActionName(props, children) {
-        if ((0, IDynatraceProperties_1.isDynatraceNaming)(props)) {
-            return props.dtActionName;
-        }
-        else if (this._isPropsButton(props) && props.title != null) {
-            return props.title;
-        }
-        else if (props.accessibilityLabel != null) {
-            return props.accessibilityLabel;
-        }
-        else if (children != null && children.length > 0) {
-            if (children.length === 1 && typeof children[0] === 'string') {
-                return children[0];
-            }
-            else {
-                return this._walkChildrenToFindText(children);
-            }
-        }
-        else if (props.children != null) {
-            if (typeof props.children === 'string') {
-                return props.children;
-            }
-            else {
-                return this._walkChildrenToFindText(props.children);
-            }
-        }
-        return null;
-    },
-    _isPropsButton: (props) => props.title != null,
-    _isImageButton: (props) => props.source != null,
-    _isLongPress: (props) => props.onLongPress != null,
-    _isImageURISourceType: (source) => source.uri != null,
-    _isIconButton: (element) => {
-        const type = element.type;
-        return type != null && type.name === 'Icon';
-    },
-    _walkTreeToFindText(element) {
-        if (element == null || element.props == null) {
-            return null;
-        }
-        else if (this._isImageButton(element.props)) {
-            if (this._isImageURISourceType(element.props.source)) {
-                return 'Image Button: ' + element.props.source.uri;
-            }
-            else {
-                return 'Image Button';
-            }
-        }
-        else if (this._isIconButton(element) && element.props.name != null) {
-            return 'Icon Button: ' + element.props.name;
-        }
-        return this._walkChildrenToFindText(element.props.children);
-    },
-    _walkChildrenToFindText(children) {
-        if (typeof children === 'string') {
-            return children;
-        }
-        else if (Array.isArray(children)) {
-            for (const child of children) {
-                if (this._isReactElement(child)) {
-                    const name = this._walkTreeToFindText(child);
-                    if (name != null) {
-                        return name;
-                    }
-                }
-                else if (typeof child === 'string') {
-                    return child;
-                }
-                else if (Array.isArray(child)) {
-                    return this._walkChildrenToFindText(child);
-                }
-            }
-            return null;
-        }
-        else {
-            return this._walkTreeToFindText(children);
-        }
-    },
-    _isReactElement: (node) => node != null && node.props != null,
-});
-exports.TouchableHelper = TouchableHelper;
-const _isPromise = (object) => object != null &&
-    typeof object.then === 'function' &&
-    typeof object.catch === 'function';