Overview
This page lists integrated libraries you can use for the following applications:
- Android & Android TV Monitoring
- React Native
- Flutter
Android & Android TV Monitoring
Coil
If you use Coil to load images in your application, see Datadog’s dedicated Coil library.
Fresco
If you use Fresco to load images in your application, see Datadog’s dedicated Fresco library.
Glide
If you use Glide to load images in your application, see Datadog’s dedicated Glide library.
Jetpack Compose
If you use Jetpack Compose in your application, see Datadog’s dedicated Jetpack Compose library.
RxJava
If you use RxJava in your application, see Datadog’s dedicated RxJava library.
Picasso
If you use Picasso, use it with the OkHttpClient
that’s been instrumented with the Datadog SDK for RUM and APM information about network requests made by Picasso.
val picasso = Picasso.Builder(context)
.downloader(OkHttp3Downloader(okHttpClient))
// …
.build()
Picasso.setSingletonInstance(picasso)
final Picasso picasso = new Picasso.Builder(context)
.downloader(new OkHttp3Downloader(okHttpClient))
// …
.build();
Picasso.setSingletonInstance(picasso);
Retrofit
If you use Retrofit, use it with the OkHttpClient
that’s been instrumented with the Datadog SDK for RUM and APM information about network requests made with Retrofit.
val retrofitClient = Retrofit.Builder()
.client(okHttpClient)
// …
.build()
final Retrofit retrofitClient = new Retrofit.Builder()
.client(okHttpClient)
// …
.build();
SQLDelight
If you use SQLDelight in your application, see Datadog’s dedicated SQLDelight library.
SQLite
Following SQLiteOpenHelper’s generated API documentation, you only have to provide the implementation of the
DatabaseErrorHandler
-> DatadogDatabaseErrorHandler
in the constructor.
Doing this detects whenever a database is corrupted and sends a relevant
RUM error event for it.
class <YourOwnSqliteOpenHelper>: SqliteOpenHelper(
<Context>,
<DATABASE_NAME>,
<CursorFactory>,
<DATABASE_VERSION>,
DatadogDatabaseErrorHandler()) {
// …
}
public class <YourOwnSqliteOpenHelper> extends SqliteOpenHelper {
public <YourOwnSqliteOpenHelper>(){
super(<Context>,
<DATABASE_NAME>,
<CursorFactory>,
<DATABASE_VERSION>,
new DatadogDatabaseErrorHandler());
}
}
Apollo (GraphQL)
If you use Apollo, use it with the OkHttpClient
that’s been instrumented with the Datadog SDK for RUM and APM information about all the queries performed through Apollo client.
val apolloClient = ApolloClient.builder()
.okHttpClient(okHttpClient)
.serverUrl(<APOLLO_SERVER_URL>)
.build()
ApolloClient apolloClient = new ApolloClient.builder()
.okHttpClient(okHttpClient)
.serverUrl(<APOLLO_SERVER_URL>)
.build();
Android TV (Leanback)
If you use the Leanback API to add actions into your Android TV application, see Datadog’s dedicated Android TV library.
Kotlin Coroutines
If you use Kotlin Coroutines, see Datadog’s dedicated library with extensions for RUM and with extensions for Trace.
React Native
React Navigation
Setup
Note: This package is an integration for react-navigation
library, please make sure you first install and setup the core mobile-react-native
SDK.
To install with NPM, run:
npm install @datadog/mobile-react-navigation
To install with Yarn, run:
yarn add @datadog/mobile-react-navigation
Track view navigation
To track changes in navigation as RUM Views, set the onready
callback of your NavigationContainer
component as follow. You can use the optional ViewNamePredicate
parameter to replace the automatically detected View name with something more relevant to your use case.
Returning null
in the ViewNamePredicate
prevents the new RUM View from being created. The previous RUM View remains active.
import * as React from 'react';
import { DdRumReactNavigationTracking, ViewNamePredicate } from '@datadog/mobile-react-navigation';
import { Route } from "@react-navigation/native";
const viewNamePredicate: ViewNamePredicate = function customViewNamePredicate(route: Route<string, any | undefined>, trackedName: string) {
return "My custom View Name"
}
function App() {
const navigationRef = React.useRef(null);
return (
<View>
<NavigationContainer ref={navigationRef} onReady={() => {
DdRumReactNavigationTracking.startTrackingViews(navigationRef.current, viewNamePredicate)
}}>
// …
</NavigationContainer>
</View>
);
}
Note: Only one NavigationContainer
can be tracked at the time. If you need to track another container, stop tracking the previous one first, using DdRumReactNavigationTracking.stopTrackingViews()
.
React Native Navigation
Note: This package is an integration for react-native-navigation
library. Please make sure you first install and setup the core mobile-react-native
SDK.
Setup
To install with NPM, run:
npm install @datadog/mobile-react-native-navigation
To install with Yarn, run:
yarn add @datadog/mobile-react-native-navigation
Track view navigation
To start tracking your navigation events, add the following lines before setting up your navigation. You can use the optional ViewNamePredicate
callback to replace the automatically detected View name with something more relevant to your use case, based on the ComponentDidAppearEvent
.
Returning null in the ViewNamePredicate
prevents the new RUM View from being created. The previous RUM View remains active.
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);
Apollo Client
Note: This package is an integration for the @apollo/client
library. Please make sure you first install and set up the core mobile-react-native
SDK.
Setup
To install with NPM, run:
npm install @datadog/mobile-react-native-apollo-client
To install with Yarn, run:
yarn add @datadog/mobile-react-native-apollo-client
Migrate to HttpLink
If you initialize your ApolloClient
with the uri
parameter, initialize it with a HttpLink
:
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' })
});
Import DatadogLink
from @datadog/mobile-react-native-apollo-client
and use it in your ApolloClient
initialization:
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
])
});
For more information on Apollo Client Links, see the official documentation.
Use a resourceEventMapper
in your Datadog configuration to remove sensitive data from GraphQL variables:
const datadogConfiguration = new DatadogProviderConfiguration(
'<CLIENT_TOKEN>',
'<ENVIRONMENT_NAME>',
'<RUM_APPLICATION_ID>',
true,
true,
true
);
datadogConfiguration.resourceEventMapper = event => {
// Variables are stored in event.context['_dd.graphql.variables'] as a JSON string when present
if (event.context['_dd.graphql.variables']) {
const variables = JSON.parse(event.context['_dd.graphql.variables']);
if (variables.password) {
variables.password = '***';
}
event.context['_dd.graphql.variables'] = JSON.stringify(variables);
}
return event;
};
Flutter
GraphQL (gql_link)
Datadog provides datadog_gql_link
for use with most GraphQL Flutter libraries, including graphql_flutter
and ferry
.
Setup
Add datadog_gql_link
to your pubspec.yaml
or by running flutter pub add datadog_gql_link
from your terminal:
dependencies:
# Other dependencies
datadog_gql_link: ^1.0.0
When creating your GraphQL link, add the DatadogGqlLink
above your terminating link. For example:
final graphQlUrl = "https://example.com/graphql";
final link = Link.from([
DatadogGqlLink(DatadogSdk.instance, Uri.parse(graphQlUrl)),
HttpLink(graphQlUrl),
]);
If you are tracking non-GraphQL network calls with datadog_tracking_http_client
, you need to configure the tracking plugin to ignore requests to your GraphQL endpoint. Otherwise, GraphQL resources will be reported twice, and APM traces may be broken. Ignore your GraphQL endpoint by using the ignoreUrlPatterns
parameter added to datadog_tracking_http_client
version 2.1.0.
final datadogConfig = DatadogConfiguration(
// Your configuration
)..enableHttpTracking(
ignoreUrlPatterns: [
RegExp('example.com/graphql'),
],
);
Further Reading
Additional helpful documentation, links, and articles: