@coralogix/react-native-plugin 0.1.6 → 0.1.7

package/CHANGELOG.md

@@ -1,3 +1,12 @@
+## 0.1.7 (2025-11-02)
+
+### 🚀 Features
+
+- added automatic navigation detection using the @react-navigation/native package
+
+### Patch
+- Bump android native version to 2.5.6
+
 ## 0.1.6 (2025-10-26)
 ### Patch
 - Bump android native version to 2.5.51

package/README.md

@@ -78,15 +78,16 @@ CoralogixRum.setViewContext({
 ```
 
 You can automatically track view changes by using [react-navigation](https://reactnavigation.org/docs/navigation-container/#onstatechange).
+Wrap your navigation ref with our `attachReactNavigationObserver` hook like so:
 
 ```javascript
+const navigationRef = createNavigationContainerRef();
+const navHooks = attachReactNavigationObserver(navigationRef);
+
 <NavigationContainer
   ref={navigationRef}
-  onStateChange={() => {
-    const currentRouteName = navigationRef.current.getCurrentRoute().name;
-
-    CoralogixRum.setViewContext({ view: currentRouteName });
-  }}
+  onReady={navHooks.onReady}
+  onStateChange={navHooks.onStateChange}
 >
   >{/* ... */}
 </NavigationContainer>

package/android/build.gradle

@@ -75,7 +75,7 @@ dependencies {
   implementation "com.facebook.react:react-android"
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
 
-  implementation "com.coralogix:android-sdk:2.5.51"
+  implementation "com.coralogix:android-sdk:2.5.6"
 }
 
 react {

package/index.cjs.js

@@ -219,7 +219,7 @@ function stopJsRefreshRateSampler() {
   appStateSub = null;
 }
 
-var version = "0.1.6";
+var version = "0.1.7";
 var pkg = {
 	version: version};
 
@@ -373,6 +373,34 @@ class CoralogixFetchInstrumentation extends instrumentationFetch.FetchInstrument
   }
 }
 
+let lastRouteName;
+function getLastNavigationRouteDetected() {
+  return lastRouteName;
+}
+function attachReactNavigationObserver(ref) {
+  const report = () => {
+    const route = ref.getCurrentRoute();
+    if (!route) return;
+    const name = route.name;
+    if (name !== lastRouteName) {
+      if (CoralogixRum.isInited) {
+        CoralogixRum.setViewContext({
+          view: name
+        });
+      }
+      lastRouteName = name;
+    }
+  };
+  const onReady = () => {
+    // Wait a tick to ensure the route is initialized
+    setTimeout(report, 0);
+  };
+  return {
+    onReady,
+    onStateChange: report
+  };
+}
+
 let CoralogixDomain = /*#__PURE__*/function (CoralogixDomain) {
   CoralogixDomain["EU1"] = "EU1";
   CoralogixDomain["EU2"] = "EU2";
@@ -418,7 +446,18 @@ const CoralogixRum = {
       return;
     }
     await registerCoralogixInstrumentations(resolvedOptions);
-    await CxSdk.initialize(_extends({}, resolvedOptions, {
+    let finalOptions;
+    const lastNavRoute = getLastNavigationRouteDetected();
+    if (lastNavRoute) {
+      finalOptions = _extends({}, resolvedOptions, {
+        view_context: {
+          view: lastNavRoute
+        }
+      });
+    } else {
+      finalOptions = resolvedOptions;
+    }
+    await CxSdk.initialize(_extends({}, finalOptions, {
       frameworkVersion: pkg.version
     }));
     isInited = true;
@@ -690,3 +729,4 @@ const subscription = eventEmitter.addListener('onBeforeSend', events => {
 exports.CoralogixDomain = CoralogixDomain;
 exports.CoralogixLogSeverity = CoralogixLogSeverity;
 exports.CoralogixRum = CoralogixRum;
+exports.attachReactNavigationObserver = attachReactNavigationObserver;

package/index.esm.js

@@ -217,7 +217,7 @@ function stopJsRefreshRateSampler() {
   appStateSub = null;
 }
 
-var version = "0.1.6";
+var version = "0.1.7";
 var pkg = {
 	version: version};
 
@@ -371,6 +371,34 @@ class CoralogixFetchInstrumentation extends FetchInstrumentation {
   }
 }
 
+let lastRouteName;
+function getLastNavigationRouteDetected() {
+  return lastRouteName;
+}
+function attachReactNavigationObserver(ref) {
+  const report = () => {
+    const route = ref.getCurrentRoute();
+    if (!route) return;
+    const name = route.name;
+    if (name !== lastRouteName) {
+      if (CoralogixRum.isInited) {
+        CoralogixRum.setViewContext({
+          view: name
+        });
+      }
+      lastRouteName = name;
+    }
+  };
+  const onReady = () => {
+    // Wait a tick to ensure the route is initialized
+    setTimeout(report, 0);
+  };
+  return {
+    onReady,
+    onStateChange: report
+  };
+}
+
 let CoralogixDomain = /*#__PURE__*/function (CoralogixDomain) {
   CoralogixDomain["EU1"] = "EU1";
   CoralogixDomain["EU2"] = "EU2";
@@ -416,7 +444,18 @@ const CoralogixRum = {
       return;
     }
     await registerCoralogixInstrumentations(resolvedOptions);
-    await CxSdk.initialize(_extends({}, resolvedOptions, {
+    let finalOptions;
+    const lastNavRoute = getLastNavigationRouteDetected();
+    if (lastNavRoute) {
+      finalOptions = _extends({}, resolvedOptions, {
+        view_context: {
+          view: lastNavRoute
+        }
+      });
+    } else {
+      finalOptions = resolvedOptions;
+    }
+    await CxSdk.initialize(_extends({}, finalOptions, {
       frameworkVersion: pkg.version
     }));
     isInited = true;
@@ -685,4 +724,4 @@ const subscription = eventEmitter.addListener('onBeforeSend', events => {
   }
 });
 
-export { CoralogixDomain, CoralogixLogSeverity, CoralogixRum };
+export { CoralogixDomain, CoralogixLogSeverity, CoralogixRum, attachReactNavigationObserver };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coralogix/react-native-plugin",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Official Coralogix React Native plugin",
   "license": "Apache-2.0",
   "author": "Coralogix",
@@ -25,8 +25,8 @@
   },
   "main": "./index.cjs.js",
   "dependencies": {
-    "@opentelemetry/instrumentation-fetch": "0.203.0",
     "@opentelemetry/instrumentation": "0.48.0",
+    "@opentelemetry/instrumentation-fetch": "0.203.0",
     "@opentelemetry/sdk-trace-web": "1.30.1"
   },
   "module": "./index.esm.js",

package/src/index.d.ts

@@ -9,3 +9,4 @@ export { type CoralogixOtelWebOptionsInstrumentations } from './model/CoralogixO
 export { type CustomMeasurement } from './model/CustomMeasurement';
 export { type NetworkRequestDetails } from './model/NetworkRequestDetails';
 export { type CoralogixMobileVitals } from './model/CoralogixMobileVitals';
+export { attachReactNavigationObserver } from './instrumentations/navigation/NavigationInstrumentation';

package/src/instrumentations/navigation/NavigationInstrumentation.d.ts

@@ -0,0 +1,8 @@
+export declare function getLastNavigationRouteDetected(): string | undefined;
+export type CurrentRouteProvider = {
+    getCurrentRoute: any;
+};
+export declare function attachReactNavigationObserver(ref: CurrentRouteProvider): {
+    onReady: () => void;
+    onStateChange: () => void;
+};