### Run Example App on Android and iOS

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Commands to build and run the sample application on Android and iOS devices or emulators after installing dependencies.

```sh
# Run the Android sample
yarn android

# Run the ios sample
yarn ios
```

--------------------------------

### Install Session Replay Yarn Package

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Install the Session Replay package using Yarn.

```sh
yarn add @datadog/mobile-react-native-session-replay
```

--------------------------------

### Install Session Replay NPM Package

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Install the Session Replay package using NPM.

```sh
npm install @datadog/mobile-react-native-session-replay
```

--------------------------------

### Start Feature Operation Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Initiates the tracking of a feature operation. Provide a name, an optional operation key, and any relevant attributes.

```typescript
startFeatureOperation(
    name: string,
    operationKey: string | null,
    attributes: object
): Promise<void>
```

--------------------------------

### Install Project Dependencies

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Run this command in the root directory to install all necessary dependencies for the project's packages.

```sh
yarn install
```

--------------------------------

### Install @datadog/mobile-react-navigation with NPM

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/README.md

Install the package using NPM. Ensure the core mobile-react-native SDK is set up first.

```sh
npm install @datadog/mobile-react-navigation
```

--------------------------------

### Install @datadog/mobile-react-navigation with Yarn

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/README.md

Install the package using Yarn. Ensure the core mobile-react-native SDK is set up first.

```sh
yarn add @datadog/mobile-react-navigation
```

--------------------------------

### Configure Datadog Credentials for Example App

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Create this file within the example app's src directory to provide your Datadog credentials for running the sample application.

```javascript
export const APPLICATION_ID = "<YOUR_APPLICATION_ID>";
export const CLIENT_TOKEN = "<YOUR_CLIENT_TOKEN>";
export const ENVIRONMENT = "<YOUR_ENVIRONMENT_NAME>";
```

--------------------------------

### Install CodePush Package

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/codepush/README.md

Install the Datadog CodePush integration package using NPM or Yarn.

```sh
npm install @datadog/mobile-react-native-code-push
```

```sh
yarn add @datadog/mobile-react-native-code-push
```

--------------------------------

### Install Datadog SDK with NPM

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/core/README.md

Use this command to install the Datadog SDK for React Native using NPM.

```sh
npm install @datadog/mobile-react-native
```

--------------------------------

### Install Datadog SDK with Yarn

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/core/README.md

Use this command to install the Datadog SDK for React Native using Yarn.

```sh
yarn add @datadog/mobile-react-native
```

--------------------------------

### Install @datadog/mobile-react-native-navigation with NPM

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-navigation/README.md

Install the Datadog RUM integration package for react-native-navigation using NPM.

```sh
npm install @datadog/mobile-react-native-navigation
```

--------------------------------

### Start Test Scenario via Deep Link (Android)

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Launch a specific test scenario on Android using an ADB command with deep link parameters.

```bash
adb shell am start -W -a android.intent.action.VIEW -d 'benchmark://start?scenario=navigation\&runType=instrumented' com.benchmarkrunner
```

--------------------------------

### Succeed Feature Operation Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Marks a previously started feature operation as successful. Provide the same name and operation key used to start it, along with any final attributes.

```typescript
succeedFeatureOperation(
    name: string,
    operationKey: string | null,
    attributes: object
): Promise<void>
```

--------------------------------

### Install @datadog/mobile-react-native-navigation with Yarn

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-navigation/README.md

Install the Datadog RUM integration package for react-native-navigation using Yarn.

```sh
yarn add @datadog/mobile-react-native-navigation
```

--------------------------------

### Install TypeScript Preset with NPM

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-babel-plugin/README.md

If using an older React Native version with TypeScript, install the @babel/preset-typescript using NPM.

```sh
npm install @babel/preset-typescript
```

--------------------------------

### CI/CD Workflow for Asset Generation

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Integrate session replay asset generation into your CI/CD pipeline by running the command after installing dependencies and before native builds.

```bash
yarn install
npx datadog-generate-sr-assets
pod install (for iOS)
build your app
```

--------------------------------

### Install Babel Plugin with NPM

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-babel-plugin/README.md

Install the Datadog React Native Babel plugin using NPM. Ensure the Datadog React Native SDK is already integrated.

```sh
npm install @datadog/mobile-react-native-babel-plugin
```

--------------------------------

### Install TypeScript Preset with Yarn

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-babel-plugin/README.md

If using an older React Native version with TypeScript, install the @babel/preset-typescript using Yarn.

```sh
yarn add @babel/preset-typescript
```

--------------------------------

### Enable Old Architecture on iOS

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Use this command to install iOS dependencies with the old architecture enabled.

```bash
RCT_NEW_ARCH_ENABLED=0 pod install
```

--------------------------------

### Install Babel Plugin with Yarn

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-babel-plugin/README.md

Install the Datadog React Native Babel plugin using Yarn. Ensure the Datadog React Native SDK is already integrated.

```sh
yarn add @datadog/mobile-react-native-babel-plugin
```

--------------------------------

### Start Test Scenario via Deep Link (iOS)

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Launch a specific test scenario on iOS using a deep link with scenario and run type parameters.

```bash
xcrun simctl openurl booted "benchmark://start?scenario=navigation&runType=instrumented"
```

--------------------------------

### Fail Feature Operation Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Marks a previously started feature operation as failed. Provide the name, operation key, the reason for failure, and any relevant attributes.

```typescript
failFeatureOperation(
    name: string,
    operationKey: string | null,
    reason: FeatureOperationFailure,
    attributes: object
): Promise<void>
```

--------------------------------

### Start RUM Tracking for React Navigation

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

Call `DdRumReactNavigationTracking.start()` within the `onReady` prop of `NavigationContainer` to begin tracking navigation events. Ensure the Datadog SDK is initialized before this.

```typescript
DdRumReactNavigationTracking.start()
```

--------------------------------

### Set Account Information Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `setAccountInfo` to set the user's account information, including an optional name and extra information. This is an asynchronous operation.

```typescript
setAccountInfo = async (accountInfo: {
    id: string;
    name?: string;
    extraInfo?: Record<string, unknown>;
})
```

--------------------------------

### Start Tracking Navigation Events

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-navigation/README.md

Begin tracking navigation events by calling `startTracking`. Optionally, provide a `ViewNamePredicate` to customize view names based on navigation events. Returning `null` from the predicate will prevent a new RUM View from being created.

```typescript
import {
  DdRumReactNativeNavigationTracking,
  ViewNamePredicate
}  from '@datadog/mobile-react-native-navigation';
import { ComponentDidAppearEvent } from 'react-native-navigation';

const viewNamePredicate: ViewNamePredicate = function customViewNamePredicate(event: ComponentDidAppearEvent, trackedName: string) {
  return "My custom View Name"
}

DdRumReactNativeNavigationTracking.startTracking(viewNamePredicate);
```

--------------------------------

### Session Replay SVG Asset Generation Workflow

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Workflow to ensure SVG assets are properly generated for native builds, including dependency installation, asset generation, and native pod installation.

```sh
# 1. Install dependencies
yarn install

# 2. Generate Session Replay SVG assets
npx datadog-generate-sr-assets

# 3. Install iOS pods (if building for iOS)
cd ios && pod install && cd ..

# 4. Run your app
yarn ios
# or
yarn android
```

--------------------------------

### Add Extra Account Information Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `addAccountExtraInfo` to merge additional information into the existing account information. This is an asynchronous operation.

```typescript
addAccountExtraInfo = async (extraAccountInfo: Record<string, unknown>)
```

--------------------------------

### Initialize Datadog RUM for React Navigation

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

Import and initialize the Datadog SDK with RUM enabled. This setup is crucial for tracking navigation events and screen views.

```typescript
import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { DdRumReactNavigationTracking } from '@datadog/mobile-react-navigation';

import AppNavigator from './AppNavigator';

const App = () => {
  return (
    <NavigationContainer
      onReady={() => {
        DdRumReactNavigationTracking.start()
      }}
    >
      <AppNavigator />
    </NavigationContainer>
  );
};

export default App;
```

--------------------------------

### Initialize Datadog SDK with Application Context

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/core/README.md

Configure and initialize the Datadog SDK within your React Native application. Ensure you replace placeholders with your actual client token, environment name, and RUM application ID. This setup enables RUM tracking, resource tracking, frustration tracking, error tracking, and optional native crash reporting.

```javascript
import {
    DatadogProvider,
    DatadogProviderConfiguration
} from '@datadog/mobile-react-native';

const datadogConfiguration = new DatadogProviderConfiguration(
    '<CLIENT_TOKEN>',
    '<ENVIRONMENT_NAME>',
    TrackingConsent.GRANTED,
    {
        rumConfiguration: {
            applicationId: '<RUM_APPLICATION_ID>',
            trackInteractions: true, // track User interactions (e.g.: Tap on buttons. You can use 'accessibilityLabel' element property to give tap action the name, otherwise element type will be reported)
            trackResources: true, // track XHR Resources
            trackFrustrations: true, // track Frustrations
            trackErrors: true, // track errors
            nativeCrashReportEnabled: true, // Optional: enable or disable native crash reports
            sessionSampleRate: 80, // Optional: sample RUM sessions (here, 80% of session will be sent to Datadog. Default = 100%)
            resourceTracingSamplingRate: 80, // Optional: sample tracing integrations for network calls between your app and your backend (here, 80% of calls to your instrumented backend will be linked from the RUM view to the APM view. Default = 20%)
            // You need to specify the hosts of your backends to enable tracing with these backends
            firstPartyHosts: ['example.com'], // matches 'example.com' and subdomains like 'api.example.com'
        },
        logsConfiguration: {
            logEventMapper: (logEvent) => {
                logEvent.message = `[CUSTOM] ${logEvent.message}`;
                return logEvent;
            }
        },
        traceConfiguration: {}
    }
);
// Optional: Select your Datadog website (one of "US1", "US3", "US5", "EU1", "AP1", "AP2", or "US1_FED"). Default is "US1".
datadogConfiguration.site = 'US1';
// Optional: set the reported service name (by default, it'll use the package name / bundleIdentifier of your Android / iOS app respectively)
datadogConfiguration.service = 'com.example.reactnative';
// Optional: let the SDK print internal logs (above or equal to the provided level. Default = undefined (meaning no logs))
datadogConfiguration.verbosity = SdkVerbosity.WARN;

export default function App() {
    return (
        <DatadogProvider configuration={datadogConfiguration}>
            <Navigation />
        </DatadogProvider>
    );
}
```

--------------------------------

### Track View Navigation with Custom Options

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/README.md

Configure `NavigationContainer`'s `onReady` callback to start tracking views with custom predicates for naming, tracking, and parameter filtering. Only one `NavigationContainer` can be tracked at a time.

```javascript
import * as React from 'react';
import { DdRumReactNavigationTracking, ParamsTrackingPredicate, ViewNamePredicate, ViewTrackingPredicate } from '@datadog/mobile-react-navigation';
import { Route } from "@react-navigation/native";

// Sets a custom name for a tracked view
const viewNamePredicate: ViewNamePredicate = function customViewNamePredicate(route: Route<string, any | undefined>, trackedName: string) {
  return "My custom View Name"
}

// Decides if a view should be tracked or not
const viewTrackingPredicate: ViewTrackingPredicate = function customViewTrackingPredicate(route: Route<string, any | undefined>) { 
  if (route.name === "AlertModal") {
    return false;
  }

  return true;
}

// Allows to define what navigation parameters should be tracked for a specific view
const paramsTrackingPredicate: ParamsTrackingPredicate = function customParamsTrackingPredicate(route: Route<string, any | undefined>) { 
  const filteredParams: any = {};
  if (route.params?.creditCardNumber) {
    filteredParams["creditCardNumber"] = "XXXX XXXX XXXX XXXX";
  }

  if (route.params?.username) {
    filteredParams["username"] = route.params.username;
  }

  return filteredParams;
}

const navigationTrackingOptions: NavigationTrackingOptions = {
  viewNamePredicate,
  viewTrackingPredicate,
  paramsTrackingPredicate,
}

function App() {
  const navigationRef = React.useRef(null);
  return (
    <View>
      <NavigationContainer ref={navigationRef} onReady={() => {
        DdRumReactNavigationTracking.startTrackingViews(navigationRef.current, navigationTrackingOptions)
      }}>
        // …
      </NavigationContainer>
    </View>
  );
}
```

--------------------------------

### Create a Navigation Timeline

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

This class helps in creating a timeline of navigation events, useful for debugging and performance analysis. It records start and end times for navigation actions.

```typescript
export class NavigationTimeline {
  private timeline: Array<{ start: number; end: number; name: string }> = [];

  startNavigation(name: string) {
    this.timeline.push({
      start: Date.now(),
      end: 0,
      name,
    });
  }

  stopNavigation(name: string) {
    const lastNavigation = this.timeline.pop();
    if (lastNavigation && lastNavigation.name === name) {
      lastNavigation.end = Date.now();
      this.timeline.push(lastNavigation);
    }
  }

  getTimeline() {
    return this.timeline;
  }
}
```

--------------------------------

### Manually Track View Navigation

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/core/README.md

Manually start and stop RUM Views using `startView` and `stopView` methods. This is useful when automatic view tracking is not sufficient for your navigation library. Ensure you use matching view keys to correctly pair start and stop actions.

```javascript
import {
    DdSdkReactNative,
    DdSdkReactNativeConfiguration,
    DdLogs,
    DdRum
} from '@datadog/mobile-react-native';

// Start a view with a unique view identifier, a custom view url, and an object to attach additional attributes to the view
DdRum.startView('ViewKey', 'ViewName', Date.now(), {
    'custom.foo': 'something'
});
// Stops a previously started view with the same unique view identifier, and an object to attach additional attributes to the view
DdRum.stopView('ViewKey', Date.now(), { 'custom.bar': 42 });
```

--------------------------------

### Manual Recording Control

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Configure Session Replay to not start recording immediately and manually control recording start and stop times. This allows for recording specific user flows.

```javascript
import { SessionReplay } from "@datadog/mobile-react-native-session-replay";

SessionReplay.enable({
  replaySampleRate: sampleRate,
  startRecordingImmediately: false
});
// Do something
SessionReplay.startRecording();
SessionReplay.stopRecording();
```

--------------------------------

### Clear Account Information Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `clearAccountInfo` to remove all previously set account information. This is an asynchronous operation.

```typescript
clearAccountInfo = async ()
```

--------------------------------

### Navigation Utilities

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

Helper functions for managing navigation state and events within the Datadog RUM integration. Includes utilities for getting the active route and tracking navigation actions.

```typescript
import {
  NavigationAction,
  NavigationState,
} from '@react-navigation/native';
import { DdRum } from '@datadog/mobile-rum';
import { Route } from '@react-navigation/routers';

const getActiveRouteInfo = (state: NavigationState | undefined): Route<string, object | undefined> | undefined => {
  if (!state || !state.routes || state.index === undefined) {
    return undefined;
  }

  const route = state.routes[state.index];

  if (route.state) {
    return getActiveRouteInfo(route.state as unknown as NavigationState);
  }

  return route;
};

export const trackNavigation = (state: NavigationState | undefined, action: NavigationAction) => {
  if (!state) {
    return;
  }

  const currentRoute = getActiveRouteInfo(state);
  if (!currentRoute) {
    return;
  }

  const { name, params } = currentRoute;
  const routeName = name;
  const attributes = {
    ...params,
    action: action.type,
  };

  DdRum.startView(routeName, attributes);
  DdRum.stopView(routeName);
};
```

--------------------------------

### Add Multiple View Attributes Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `addViewAttributes` to add multiple key-value attributes to the current RUM View simultaneously. This is useful for setting up batch attributes.

```typescript
addViewAttributes = (attributes: Attributes)
```

--------------------------------

### Navigator Component for React Navigation v6

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

A sample navigator component using React Navigation v6. This showcases the API differences and structure for v6, including potential changes in stack navigator setup.

```tsx
import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();

const NavigatorsV6 = () => {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Home" component={Home} />
      <Stack.Screen name="Details" component={Details} />
    </Stack.Navigator>
  );
};

const Home = () => <></>;
const Details = () => <></>;

export default NavigatorsV6;
```

--------------------------------

### Initialize Core SDK with RUM, Logs, and Trace

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Configure the SDK with RUM, Logs, and Trace features enabled. Ensure clientToken, environment, and trackingConsent are provided. ApplicationID is mandatory for RUM.

```javascript
const config = new CoreConfiguration(
    CLIENT_TOKEN,
    ENVIRONMENT,
    TrackingConsent.GRANTED,
    {
    rumConfiguration: {
        applicationId: APPLICATION_ID,
        trackInteractions: true,
        trackResources: true,
        trackFrustrations: true,
        sessionSampleRate: 100,
        telemetrySampleRate: 100
    }
    },
    logsConfiguration: {
        logEventMapper: (logEvent) => {
            logEvent.message = `[CUSTOM] ${logEvent.message}`;
            return logEvent;
        }
    },
    traceConfiguration: {}
);

... 

await DdSdkReactNative.initialize(config);
```

--------------------------------

### Enable Session Replay with Configuration

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Import and enable Session Replay with optional configuration for sampling rate and privacy levels. All configuration properties are optional.

```javascript
import { SessionReplay } from "@datadog/mobile-react-native-session-replay";

SessionReplay.enable({
    replaySampleRate: sampleRate, // The percentage of sampled replays, in the range 0.0 - 100.0 (Default: 100.0).
    textAndInputPrivacyLevel: TextAndInputPrivacyLevel.MASK_ALL, // Defines the way text and input (e.g text fields, checkboxes) should be masked (Default: `MASK_ALL`).
    imagePrivacyLevel: ImagePrivacyLevel.MASK_ALL, // Defines the way images should be masked (Default: `MASK_ALL`).
    touchPrivacyLevel: TouchPrivacyLevel.HIDE  // Defines the way user touches (e.g tap) should be masked (Default: `HIDE`).
});
```

--------------------------------

### Run Benchmark App with Alternate ENV File (Android)

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Execute the benchmark app on Android using an alternate .env file.

```bash
$ ENVFILE=.env.alternate yarn android
```

--------------------------------

### Run Benchmark App with Alternate ENV File (iOS)

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Execute the benchmark app on iOS using an alternate .env file.

```bash
$ ENVFILE=.env.alternate yarn ios
```

--------------------------------

### Initialize DatadogProvider with RUM, Logs, and Trace

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Configure the DatadogProvider wrapper with RUM, Logs, and Trace features. This approach simplifies SDK initialization within a React component tree.

```javascript
const configuration = new DatadogProviderConfiguration(
    CLIENT_TOKEN,
    ENVIRONMENT,
    TrackingConsent.GRANTED,
    {
        batchSize: BatchSize.SMALL,
        uploadFrequency: UploadFrequency.FREQUENT,
        batchProcessingLevel: BatchProcessingLevel.MEDIUM,
        additionalConfiguration: {
            customProperty: "sdk-example-app"
        },
        rumConfiguration: {
            applicationId: APPLICATION_ID,
            trackInteractions: true,
            trackResources: true,
            trackErrors: true,
            sessionSampleRate: 100,
            nativeCrashReportEnabled: true
        },
        logsConfiguration: {
            logEventMapper: (logEvent) => {
                logEvent.message = `[CUSTOM] ${logEvent.message}`;
                return logEvent;
            }
        },
        traceConfiguration: {}
    }
);

... 

<DatadogProvider configuration={configuration} onInitialization={onDatadogInitialization}>
```

--------------------------------

### Initialize Datadog SDK in React Native

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Initialize the Datadog SDK with core configuration, including RUM, logs, and traces. Ensure all required configuration parameters are provided.

```typescript
import { DdSdkReactNative, CoreConfiguration, TrackingConsent } from '@datadog/mobile-react-native';

const App: () => React$Node = () => {
  const config = new CoreConfiguration(
    "<CLIENT_TOKEN>",
    "<ENVIRONMENT_NAME>",
    TrackingConsent.GRANTED,
    {
        rumConfiguration: {
            applicationId: APPLICATION_ID,
            trackInteractions: true,
            trackResources: true,
            trackFrustrations: true,
            trackErrors: true,
        },
        logsConfiguration: {},
        traceConfiguration: {}
    }
  )

  DdSdkReactNative.initialize(config);
  ...
```

--------------------------------

### Publish Packages

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Execute this command to publish the updated packages to the registry and add gitHead information to package.json files.

```sh
yarn run lerna publish from-package
```

--------------------------------

### Initialize Datadog SDK

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-navigation/release-content.txt

Initialize the Datadog SDK with your application's configuration. This is a prerequisite for using any Datadog features.

```typescript
import React from 'react';
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
import {DatadogProvider} from '@datadog/datadog-react-native';

const AppWithDatadog = () => (
  <DatadogProvider 
    config={{
      clientToken: 'CLIENT_TOKEN',
      env: 'env',
      service: 'service',
      // ... other configuration options
    }}>
    <App />
  </DatadogProvider>
);

AppRegistry.registerComponent(appName, () => AppWithDatadog);

```

--------------------------------

### Initialize Datadog SDK and OpenFeature Provider

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-openfeature/README.md

Initialize the Datadog SDK, enable the Feature Flags feature, and set the Datadog OpenFeature provider. This can be done programmatically or using the `<DatadogProvider />` component.

```tsx
import { CoreConfiguration, DatadogProvider, DdFlags } from '@datadog/mobile-react-native';
import { DatadogOpenFeatureProvider } from '@datadog/mobile-react-native-openfeature';
import { OpenFeature } from '@openfeature/react-sdk';

(async () => {
    // Follow the core Datadog SDK initialization guide.
    const config = new CoreConfiguration(
        // ...
    );
    await DdSdkReactNative.initialize(config);

    // Enable Datadog Flags feature after the core SDK has been initialized.
    await DdFlags.enable();

    // Set the Datadog provider with OpenFeature.
    const provider = new DatadogOpenFeatureProvider();
    OpenFeature.setProvider(provider);
})();

// Alternatively, if using `<DatadogProvider />` for core SDK initialization.

<DatadogProvider
    configuration={coreConfiguration}
    onInitialized={async () => {
        await DdFlags.enable();

        const provider = new DatadogOpenFeatureProvider();
        OpenFeature.setProvider(provider);
    }}
>
    {/* ... */}
</DatadogProvider>
```

--------------------------------

### Remove View Attribute Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `removeViewAttribute` to remove a previously added key-value attribute from the current RUM View.

```typescript
removeViewAttribute = (key: string)
```

--------------------------------

### Build Release App with Alternate Scheme (iOS)

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Build a release app for iOS using an alternate Xcode scheme.

```bash
xcodebuild -scheme alternate
```

--------------------------------

### Build Release APK with Alternate ENV File (Android)

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Build a release APK for Android using an alternate .env file.

```bash
$ENVFILE=.env.alternate ./gradlew assembleRelease
```

--------------------------------

### Remove Multiple View Attributes Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `removeViewAttributes` to remove multiple key-value attributes from the current RUM View by providing an array of keys.

```typescript
removeViewAttributes = (keys: string[])
```

--------------------------------

### Add View Attribute Example

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

Use `addViewAttribute` to add a key-value pair to the current RUM View. This attribute will be propagated to all related child events.

```typescript
addViewAttribute = (key: string, value: unknown)
```

--------------------------------

### Add Initialization Callback to DatadogProvider

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/docs/migrating_to_datadog_provider.md

Pass a callback function to the `onInitialization` prop of `DatadogProvider` to execute code after the SDK has been initialized.

```javascript
export default function App() {
    return (
        <DatadogProvider
            configuration={config}
            onInitialization={() => callback()}
        >
            <Navigation />
        </DatadogProvider>
    );
}
```

--------------------------------

### Get Active Route Information

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

A helper function to extract details about the currently active route from the navigation state. It recursively finds the deepest active route.

```typescript
const getActiveRouteInfo = (state: NavigationState | undefined): Route<string, object | undefined> | undefined => {
  if (!state || !state.routes || state.index === undefined) {
    return undefined;
  }

  const route = state.routes[state.index];

  if (route.state) {
    return getActiveRouteInfo(route.state as unknown as NavigationState);
  }

  return route;
};
```

--------------------------------

### Run Project Linters and Tests

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Execute these commands to ensure code quality and run unit tests for the project.

```sh
# Run the Unit Tests
yarn test

# Run the linter
yarn lint
```

--------------------------------

### React Navigation Instrumentation

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

This module provides the core functionality for integrating Datadog RUM with React Navigation. It includes functions to start, stop, and manage the tracking of navigation events.

```typescript
import {
  NavigationContainerRef,
  NavigationAction,
  NavigationState,
} from '@react-navigation/native';
import { DdRum } from '@datadog/mobile-rum';
import { Route } from '@react-navigation/routers';

let navigationRef: NavigationContainerRef<any> | null = null;

export const setNavigationRef = (ref: NavigationContainerRef<any>) => {
  navigationRef = ref;
};

export const startRumTracking = () => {
  if (navigationRef) {
    DdRumReactNavigationTracking.start();
  }
};

export const stopRumTracking = () => {
  if (navigationRef) {
    DdRumReactNavigationTracking.stop();
  }
};

const getActiveRouteInfo = (state: NavigationState | undefined): Route<string, object | undefined> | undefined => {
  if (!state || !state.routes || state.index === undefined) {
    return undefined;
  }

  const route = state.routes[state.index];

  if (route.state) {
    return getActiveRouteInfo(route.state as unknown as NavigationState);
  }

  return route;
};

export const trackNavigation = (state: NavigationState | undefined, action: NavigationAction) => {
  if (!state) {
    return;
  }

  const currentRoute = getActiveRouteInfo(state);
  if (!currentRoute) {
    return;
  }

  const { name, params } = currentRoute;
  const routeName = name;
  const attributes = {
    ...params,
    action: action.type,
  };

  DdRum.startView(routeName, attributes);
  DdRum.stopView(routeName);
};

export const DdRumReactNavigationTracking = {
  start: () => {
    if (navigationRef) {
      const state = navigationRef.getRootState();
      trackNavigation(state, { type: '@@INIT' } as NavigationAction);
    }
  },
  stop: () => {
    // Implementation for stopping tracking if needed
  },
};

```

--------------------------------

### Instrument Datadog SDK in Scenario

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Use the `instrument()` helper to initialize the Datadog SDK within your scenario component, conditionally based on `runType`.

```typescript
useEffect(() => {
  if (props.testConfig?.runType !== RunType.BASELINE) {
    instrument().then(() => {
      // Datadog is initialized
    });
  }
}, []);
```

--------------------------------

### Mock Legacy AppState for Testing

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

A mock implementation of the legacy AppState API for testing. This is useful for maintaining compatibility with older testing setups or libraries that rely on the previous AppState structure.

```typescript
import { AppState, AppStateStatus } from 'react-native';

export class AppStateMockLegacy {
  private currentState: AppStateStatus;
  private listeners: Array<{ type: 'change'; handler: (state: AppStateStatus) => void }> = [];

  constructor(initialState: AppStateStatus = 'active') {
    this.currentState = initialState;
  }

  currentStateValue(): AppStateStatus {
    return this.currentState;
  }

  addEventListener(type: 'change', handler: (state: AppStateStatus) => void) {
    this.listeners.push({ type, handler });
    return {
      remove: () => {
        this.listeners = this.listeners.filter(listener => listener.handler !== handler);
      }
    };
  }

  sendState(state: AppStateStatus) {
    this.currentState = state;
    this.listeners.forEach(listener => listener.handler(state));
  }
}

```

--------------------------------

### Configure DatadogProvider in Scenario

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Retrieve Datadog SDK configuration using `getDatadogProviderConfig()` for use with the `DatadogProvider` component.

```typescript
return (
  <DatadogProvider
    config={getDatadogProviderConfig()}
    onInitialization={onDatadogInitialization}>
    ...
  </DatadogProvider>
);
```

--------------------------------

### Specify Scan Path

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Set the root directory to scan for assets using the --path option. If not provided, it defaults to the current working directory.

```bash
npx datadog-generate-sr-assets --path ./src
```

--------------------------------

### Configure DatadogLink Options

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-apollo-client/README.md

Customize the data collected by `DatadogLink` by passing configuration options to its constructor.

```javascript
new DatadogLink({
    trackVariables: true, // track GraphQL operation variables (default: true)
    trackPayload: false, // track the GraphQL query payload (default: false)
    trackErrors: false // track GraphQL errors from the response (default: false)
});
```

--------------------------------

### Configure WebView with Allowed Hosts

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-webview/README.md

When using the Datadog `WebView` component, provide a list of hosts to be tracked by Datadog using the `allowedHosts` prop. This prop ensures that only specified domains are monitored.

```javascript
<WebView
    source={{ uri: 'https://www.example.com' }}
    allowedHosts={['example.com']}
/>
```

--------------------------------

### Set BENCH_SCENARIO in .env File

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Alternatively, set the new scenario using the BENCH_SCENARIO variable in your .env file.

```env
BENCH_SCENARIO="newScenario"
```

--------------------------------

### Change Configuration Class

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/docs/migrating_to_datadog_provider.md

Replace `DdSdkReactNativeConfiguration` with `DatadogProviderConfiguration` when initializing the Datadog SDK.

```git
- const config = new DdSdkReactNativeConfiguration(
+ const config = new DatadogProviderConfiguration(
```

--------------------------------

### Execute Workspace-Specific Commands

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Use this command to run a specific command within a particular workspace, such as the core SDK package.

```sh
# Run a command for the particular workspace (ex. @datadog/mobile-react-native)
yarn workspace @datadog/mobile-react-native <command>
```

--------------------------------

### Add DatadogProvider to App Component

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/docs/migrating_to_datadog_provider.md

Wrap your application's root component with `DatadogProvider` and pass the configuration object.

```javascript
// App.js

const config = new DatadogProviderConfiguration();
//...

export default function App() {
    return (
        <DatadogProvider configuration={config}>
            <Navigation />
        </DatadogProvider>
    );
}
```

--------------------------------

### FileBasedConfiguration Changes

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

FileBasedConfiguration in v3 requires a path to a configuration JSON file, unlike v2 which looked for a default file at the app's root.

```APIDOC
## FileBasedConfiguration Changes

### Description
FileBasedConfiguration now requires an explicit path to a configuration JSON file. Previously, it would attempt to find a default `datadog-configuration.json` at the application's root level.
```

--------------------------------

### Enable Verbose Output

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Use the --verbose flag to enable detailed output, which is helpful for debugging the asset generation process.

```bash
npx datadog-generate-sr-assets --verbose
```

--------------------------------

### Generate Session Replay Assets CLI

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Use this command to generate session replay assets. It supports various options to customize the scanning and generation process.

```bash
npx datadog-generate-sr-assets [options]
```

--------------------------------

### Advanced Babel Configuration with Options

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-babel-plugin/README.md

Configure the Datadog React Native Babel plugin with advanced options for action naming, session replay, and component tracking.

```javascript
module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: [
    [
      '@datadog/mobile-react-native-babel-plugin',
      {
        actionNameAttribute: 'custom-prop-value',
        sessionReplay: {
          svgTracking: true
        },
        components: {
          useContent: true,
          useNamePrefix: true,
          tracked: [
            {
              name: 'CustomButton',
              contentProp: 'text'
              handlers: [{event: 'onPress', action: 'TAP'}],
            },
            {
              name: 'CustomTextInput',
              handlers: [{event: 'onFocus', action: 'TAP'}],
            },
            {
              useNamePrefix: false,
              useContent: false,
              name: 'Tab',
              handlers: [{event: 'onChange', action: 'TAP'}],
            },
          ],
        },
      },
    ],
  ],
};
```

--------------------------------

### Follow Symbolic Links

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Enable the --followSymlinks option to traverse symbolic links during directory scanning. By default, symlinks are ignored.

```bash
npx datadog-generate-sr-assets --followSymlinks
```

--------------------------------

### Update SDK Version

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Run this script to update the SDK version across lerna.json and package.json files, and commit the changes.

```sh
./update-version x.y.z
```

--------------------------------

### Main Entry Point for React Native App

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

The root component of the React Native application. It sets up navigation and integrates with Datadog RUM tracking.

```tsx
import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { DdRumReactNavigationTracking } from '@datadog/mobile-react-navigation';
import AppNavigator from './AppNavigator';

const App = () => {
  return (
    <NavigationContainer
      onReady={() => {
        DdRumReactNavigationTracking.start();
      }}
    >
      <AppNavigator />
    </NavigationContainer>
  );
};

export default App;
```

--------------------------------

### Configure Datadog Credentials for New Architecture

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/CONTRIBUTING.md

Create this file at the root of the app to provide your Datadog credentials when developing with the new React Native architecture.

```javascript
export const APPLICATION_ID = '<APP_ID>';
export const CLIENT_TOKEN = '<CLIENT_TOKEN>';
export const ENVIRONMENT = '<ENVIRONMENT>';
```

--------------------------------

### Define New Scenario Component

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/benchmarks/README.md

Define the main component for your new scenario.

```typescript
import { NewScenarioProps } from "./types";

function NewScenario(props: NewScenarioProps): React.JSX.Element {
  (...)
}

export default NewScenario;
```

--------------------------------

### Basic Babel Configuration

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-babel-plugin/README.md

Add the Datadog React Native Babel plugin to your Babel configuration file (e.g., babel.config.js).

```javascript
module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: ['@datadog/mobile-react-native-babel-plugin'] // <-- Add here
};
```

--------------------------------

### AccountInfo API

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

The AccountInfo API from native SDKs is now exposed, allowing setting, clearing, and adding extra information to account details.

```APIDOC
## AccountInfo API

### Description
The `AccountInfo` API, previously available in native Datadog SDKs, is now exposed in React Native. It allows for managing account-related information.

### Methods
- `setAccountInfo = async (accountInfo: { id: string; name?: string; extraInfo?: Record<string, unknown>; })`: Sets the account information, including ID, optional name, and optional extra information.
- `clearAccountInfo = async ()`: Clears all account information.
- `addAccountExtraInfo = async (extraAccountInfo: Record<string, unknown>)`: Adds or updates extra information for the account.
```

--------------------------------

### Mock AppState for Testing

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-navigation/release-content.txt

A mock implementation of AppState for testing purposes. This allows simulating different application states (active, background, inactive) without affecting the actual device state.

```typescript
import { AppState, AppStateStatus } from 'react-native';

export class AppStateMock {
  private currentState: AppStateStatus;
  private listeners: Array<(state: AppStateStatus) => void> = [];

  constructor(initialState: AppStateStatus = 'active') {
    this.currentState = initialState;
  }

  getCurrentState(): AppStateStatus {
    return this.currentState;
  }

  sendState(state: AppStateStatus) {
    this.currentState = state;
    this.listeners.forEach(listener => listener(state));
  }

  addEventListener(type: 'change', handler: (state: AppStateStatus) => void) {
    this.listeners.push(handler);
    return {
      remove: () => {
        this.listeners = this.listeners.filter(listener => listener !== handler);
      }
    };
  }
}

```

--------------------------------

### Instrument ApolloClient with DatadogLink

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-apollo-client/README.md

Integrate `DatadogLink` into your ApolloClient initialization to enable data collection for RUM.

```javascript
import { ApolloClient, from, HttpLink } from '@apollo/client';
import { DatadogLink } from '@datadog/mobile-react-native-apollo-client';

const apolloClient = new ApolloClient({
    link: from([
        new DatadogLink(),
        new HttpLink({ uri: 'https://my.api.com/graphql' }) // always in last position
    ])
});
```

--------------------------------

### SessionReplay Configuration Changes

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

The `defaultPrivacyLevel` option for SessionReplay has been removed in favor of more granular controls: `imagePrivacyLevel`, `touchPrivacyLevel`, and `textAndInputPrivacyLevel`.

```APIDOC
## SessionReplay Configuration Changes

### Description
The `defaultPrivacyLevel` option for SessionReplay configuration has been removed. It is replaced by more granular options: `imagePrivacyLevel`, `touchPrivacyLevel`, and `textAndInputPrivacyLevel`.
```

--------------------------------

### Migrate ApolloClient to HttpLink

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-apollo-client/README.md

If your ApolloClient is initialized with the `uri` parameter, migrate to using `HttpLink` for proper integration.

```javascript
import { ApolloClient, HttpLink } from '@apollo/client';

// before
const apolloClient = new ApolloClient({
    uri: 'https://my.api.com/graphql'
});

// after
const apolloClient = new ApolloClient({
    link: new HttpLink({ uri: 'https://my.api.com/graphql' })
});
```

--------------------------------

### Initialize Datadog SDK for CodePush

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/codepush/README.md

Initialize the Datadog React Native SDK for RUM using DatadogCodepush.initialize. This sets the reported version to match the one used by the datadog-ci command.

```js
import { DdSdkReactNativeConfiguration } from '@datadog/mobile-react-native';
import { DatadogCodepush } from '@datadog/mobile-react-native-code-push';

const config = new DdSdkReactNativeConfiguration(
    '<CLIENT_TOKEN>',
    '<ENVIRONMENT_NAME>',
    '<RUM_APPLICATION_ID>',
    true, // track user interactions (such as a tap on buttons). You can use the 'accessibilityLabel' element property to give the tap action a name, otherwise the element type is reported
    true, // track XHR resources
    true // track errors
);

await DatadogCodepush.initialize(config);
```

--------------------------------

### Configure Metro Plugin for SVG Asset Bundling

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/packages/react-native-session-replay/README.md

Configure the Metro plugin in `metro.config.js` to automatically bundle SVG assets for Session Replay.

```javascript
const { withSessionReplayAssetBundler } = require('@datadog/mobile-react-native-session-replay/metro');

module.exports = withSessionReplayAssetBundler({
  /* your existing Metro config */
});
```

--------------------------------

### firstPartyHosts Configuration Change

Source: https://github.com/datadog/dd-sdk-reactnative/blob/develop/MIGRATION.md

In v3, `firstPartyHosts` is moved to `rumConfiguration` and requires an array of objects with `match` and `propagatorTypes`.

```APIDOC
## Configuration Change: firstPartyHosts

### Description
In v2, `firstPartyHosts` accepted an array of strings. In v3, it has been moved to `rumConfiguration` and now requires an array of objects specifying the host and propagator types.

### Before (v2)
```typescript
const config = {
    firstPartyHosts: ['example.com', 'api.myapp.com']
};
```

### After (v3)
```typescript
import { PropagatorType } from '@datadog/mobile-react-native';

const config = new CoreConfiguration(
    CLIENT_TOKEN,
    ENVIRONMENT,
    TrackingConsent.GRANTED,
    {
        rumConfiguration: {
            applicationId: APPLICATION_ID,
            firstPartyHosts: [
                {
                    match: 'example.com',
                    propagatorTypes: [
                        PropagatorType.DATADOG,
                        PropagatorType.TRACECONTEXT
                    ]
                },
                {
                    match: 'api.myapp.com',
                    propagatorTypes: [PropagatorType.DATADOG]
                }
            ]
        }
    }
);
```
```