Skip to content

Commit

Permalink
Document Apollo client link
Browse files Browse the repository at this point in the history
  • Loading branch information
louiszawadzki committed Sep 22, 2023
1 parent c72d31b commit dad2621
Showing 1 changed file with 66 additions and 0 deletions.
66 changes: 66 additions & 0 deletions packages/react-native-apollo-client/README.md
Original file line number Diff line number Diff line change
@@ -1 +1,67 @@
# React-Native Monitoring for @apollo/client

## Overview

Real User Monitoring (RUM) allows you to monitor your GraphQL resources.

You can perform the following:

- Identify GraphQL queries and mutations
- Identify GraphQL variables used in queries and mutations

RUM supports GraphQL requests created using [@apollo/client][2].

## Setup

### Prerequisites

Set up the RUM Browser SDK on the web page you want rendered on your mobile React Native application. For more information, see [RUM Browser Monitoring][1].

Add `@apollo/client` to your application following the [official installation documentation][3].

### Instrument your ApolloClient

#### Migrate to HttpLink

If you initialize your ApolloClient with the `uri` parameter, initialize it with a `HttpLink`:

```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' })
});
```

#### Use the Datadog Apollo Client Link to collect information

Import `DatadogLink` from `@datadog/mobile-react-native-apollo-client` and use it in your ApolloClient initialization:

```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
])
});
```

For more information on Apollo Client Links, refer to the [official documentation][4].

## Access your GraphQL resources information

The information is not yet surfaced on the Datadog platform.

[1]: https://docs.datadoghq.com/real_user_monitoring/browser/#npm
[2]: https://www.apollographql.com/docs/react/
[3]: https://www.apollographql.com/docs/react/get-started
[4]: https://www.apollographql.com/docs/react/api/link/introduction/

0 comments on commit dad2621

Please sign in to comment.