iidrak-analytics-react 1.6.0 → 1.7.0

package/README.md

@@ -1,17 +1,21 @@
 # Iidrak Analytics (React Native)
 
+**NPM Package**: [iidrak-analytics-react](https://www.npmjs.com/package/iidrak-analytics-react)
+
+
 A powerful, offline-first analytics SDK for React Native applications that includes **Session Replay**. Track events, manage shopping carts, record user sessions (screens & touches), and persist data reliably even when the network is down.
 
 ## Features
 
 - 📊 **Event Tracking**: Log custom events with arbitrary parameters.
-- 🚀 **Optimized Bandwidth**: Uses a Minimal Payload architecture for auto-clicks to save battery, data, and database costs, only sending full telemetry on session starts.
+- ⚡ **Automatic Interaction Tracking**: All screen taps/clicks are automatically captured with zero manual instrumentation.
+- 🚀 **Optimized Bandwidth**: Uses a Minimal Payload architecture for auto-clicks to save battery, data, and database costs, only sending full telemetry on session starts and custom events.
 - 🎥 **Session Replay**: Record screen interactions and touch events for playback analysis.
-- 🎯 **Advanced Touch Context**: Automatically maps React Fiber tree to extract clicked text, component paths (e.g. `TouchableOpacity > Text`), and testing IDs without manual instrumentation.
+- 🎯 **Advanced Touch Context**: Automatically maps React Fiber tree to extract clicked text, component paths (e.g. `TouchableOpacity > Text`), and testing IDs.
 - 🛒 **Cart Management**: Built-in shopping cart state management.
 - 📴 **Offline Support**: Automatically queues events when offline and flushes them when connection is restored.
 - 🆔 **User & Session Management**: Auto-generates session IDs and supports user identification.
-- ⚡ **Lightweight**: Minimal performance overhead.
+- ⚡ **Zero Performance Impact**: Minimal overhead due to payload optimization and background processing.
 
 ## Installation
 
@@ -154,7 +158,20 @@ tracker.trackEvent({
 ```
 *Note: `eventParameters` creates a flexible dictionary of data associated with the event.*
 
-### 3. Screen Tracking
+### 3. Automatic Event Tracking (Zero Config)
+
+The SDK automatically tracks all user interactions (clicks/taps) without any manual coding. When a user interacts with the app, the SDK captures:
+
+- **Component Path**: The hierarchy of the clicked element (e.g., `TouchableOpacity > View > Text`).
+- **Text Content**: Any text visible within the clicked element.
+- **Test ID**: The `testID` prop, if defined (ideal for automated testing analysis).
+- **Coordinates**: The exact `x, y` position of the tap.
+- **Metadata**: Component type, accessibility labels, and timestamps.
+
+**Performance Optimization (Minimal Payload):**
+To ensure high performance and low data usage, `auto_click` events use a "Minimal Payload" architecture. They omit redundant device and application metadata, which is instead captured once during the `session_start` event.
+
+### 4. Screen Tracking
 
 Though `MetaStreamProvider` captures the video, you can manually log screen views for analytics:
 
@@ -162,7 +179,7 @@ Though `MetaStreamProvider` captures the video, you can manually log screen view
 tracker.screen("HomeScreen", {});
 ```
 
-### 4. Privacy & Redaction
+### 5. Privacy & Redaction
 
 To protect sensitive user data (PII) like passwords or credit card numbers during session replay, wrap your sensitive components with the `<Redact>` component.
 
@@ -180,7 +197,29 @@ import { Redact } from 'iidrak-analytics-react';
 
 This ensures the wrapped area is covered by a privacy mask in the recorded video, while remaining fully functional for the user.
 
-### 5. Shopping Cart
+### 6. Suppressing Auto-Capture
+
+By default, the SDK captures every tap on the application as an `auto_click` event. To prevent this for a specific component (e.g., when you are already manually tracking a custom event on that button), add the `autoTrack={false}` prop.
+
+**Example:**
+
+```javascript
+/* 
+   This button will trigger 'login_success' but will NOT trigger 
+   a redundant 'auto_click' event.
+*/
+<TouchableOpacity 
+  onPress={handleLogin} 
+  autoTrack={false}
+>
+  <Text>Sign In</Text>
+</TouchableOpacity>
+```
+
+This ensures your server doesn't receive duplicate data for the same interaction.
+
+
+### 6. Shopping Cart
 
 Manage a persistent shopping cart state:
 

package/metastreamio/metastreamio.provider.js

@@ -35,11 +35,33 @@ class MetaStreamProvider extends Component {
             let componentPath = [];
             
             // Traverse the React Fiber tree to extract component names, text, and testIDs
+            let suppressAutoClick = false;
             try {
                 let fiber = e._targetInst;
                 while (fiber) {
+                    const name = typeof fiber.elementType === 'string' ? fiber.elementType : (fiber.elementType?.name || fiber.elementType?.displayName || fiber.type?.name || 'Unknown');
+                    
+                    const p1 = fiber.memoizedProps || {};
+                    const p2 = fiber.pendingProps || {};
+                    
+                    const suppressValue = 
+                        p1['autoTrack'] ?? p1['auto-track'] ?? p1['data-auto-track'] ??
+                        p2['autoTrack'] ?? p2['auto-track'] ?? p2['data-auto-track'];
+
+                    if (suppressValue !== undefined) {
+                        if (String(suppressValue) === 'false' || suppressValue === false) {
+                            suppressAutoClick = true;
+                        }
+                    }
+
                     if (fiber.memoizedProps) {
-                        if (testID === 'none' && fiber.memoizedProps.testID) testID = fiber.memoizedProps.testID;
+                        const tid = fiber.memoizedProps.testID || fiber.memoizedProps.accessibilityLabel;
+                        if (testID === 'none' && tid) testID = tid;
+                        
+                        // FAIL-SAFE: If we see 'no-track' in the testID or Label, suppress it!
+                        if (typeof tid === 'string' && tid.toLowerCase().includes('no-track')) {
+                            suppressAutoClick = true;
+                        }
                         if (accessibilityLabel === 'none' && fiber.memoizedProps.accessibilityLabel) accessibilityLabel = fiber.memoizedProps.accessibilityLabel;
                         
                         // Extract text content if available
@@ -54,7 +76,6 @@ class MetaStreamProvider extends Component {
                     
                     // Try to get the component's name (e.g., 'Text', 'RCTImageView', 'Button')
                     if (fiber.elementType) {
-                        let name = typeof fiber.elementType === 'string' ? fiber.elementType : (fiber.elementType.name || fiber.elementType.displayName);
                         if (name) {
                             if (name !== 'View' && name !== 'RCTView' && componentType === 'unknown') {
                                 componentType = name;
@@ -71,6 +92,10 @@ class MetaStreamProvider extends Component {
                 // Ignore any errors if structure changes in future RN versions
             }
             
+            if (suppressAutoClick) {
+                return;
+            }
+            
             this.tracker.trackEvent({
                 eventName: 'auto_click',
                 eventParameters: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iidrak-analytics-react",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "react native client for metastreamio",
   "peerDependencies": {
     "react-native-mmkv": ">=4.0.0",