# @apr/react-native-userreport-sdk

> Running UserReport in React Native applications https://www.userreport.com

Latest version **2.0.6** (published 2020-11-11) · Apache-2.0 license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install @apr/react-native-userreport-sdk
pnpm add @apr/react-native-userreport-sdk
yarn add @apr/react-native-userreport-sdk
bun add @apr/react-native-userreport-sdk
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 2.0.6 |
| Published | 2020-11-11 |
| First published | 2020-03-19 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 630.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | AudienceProject |
| Maintainers | alonabo, apnicolai, andrew.kulta, frstua, johs.kristoffersen, nfap, tech_userreport.com |
| Keywords | react-native |

## Links

- npm: https://www.npmjs.com/package/@apr/react-native-userreport-sdk
- Repository: https://github.com/audienceproject/userreport-react-native-sdk
- Issues: https://github.com/audienceproject/userreport-react-native-sdk/issues
- npm.io page: https://npm.io/package/@apr/react-native-userreport-sdk

## Dependencies (1)

- [react-native-device-info](https://npm.io/package/react-native-device-info.md) ^5.5.3

## Recent versions

- 2.0.6 (latest) — 2020-11-11
- 2.0.5 — 2020-11-09
- 2.0.4 — 2020-11-02
- 2.0.3 — 2020-03-26
- 2.0.2 — 2020-03-24
- 2.0.1 — 2020-03-24
- 2.0.0 — 2020-03-24
- 1.0.1 — 2020-03-19

## README

# Supported plarforms
- iOS
- Android


# Setup dependencies

```bash
npm install --save @apr/react-native-userreport-sdk react-native-device-info
```

#### Android
Update your `AndroidMainfest.xml` and declare that your app is an Ad Manager app, as instructed on [Google's Ad Manager guide](https://developers.google.com/ad-manager/mobile-ads-sdk/android/quick-start#update_your_androidmanifestxml):
```xml
<manifest>
    <application>
        <meta-data
            android:name="com.google.android.gms.ads.AD_MANAGER_APP"
            android:value="true"/>
    </application>
</manifest>
```

## Setup of [react-native-device-info](https://www.npmjs.com/package/react-native-device-info)

### Automatic
```bash
react-native link react-native-device-info
react-native link @apr/react-native-userreport-sdk
cd ios
pod install
```
### Manual 
Follow the link: https://www.npmjs.com/package/react-native-device-info

# Usage for screen/section tracking

Configure the UserReport ReactNative SDK using your `PUBLISHER_ID` and your `MEDIA_ID`.

Your `PUBLISHER_ID` and `MEDIA_ID` can be found on the Media Setting page in UserReport.


```javascript
// Configure
UserReport.configure("PUBLISHER_ID","MEDIA_ID");
```

Note: only Android and iOS supported as a platform. So make sure you invoke `configure` only on these platforms. On other platforms, it will return an error.


Example: 

```javascript
//App.js
import {Platform} from 'react-native';
import UserReport from '@apr/react-native-userreport-sdk'

export default class App extends Component{
    componentDidMount() {
        var mediaId = Platform.OS === 'ios' ?
         "MEDIA_ID_FOR_IOS": "MEDIA_ID_FOR_ANDROID";
      
        UserReport.configure("PUBLISHER_ID",mediaId);
    }
}
```

While development it is recommended to set `debug` flag in the `settings` parameter, so you will be able to understand that it is configured correctly, in case of errors they will be written to the console. 
Example:

```javascript
UserReport.configure("PUBLISHER_ID","MEDIA_ID",  { debug: true });
```

There are two types of tracking:
  - Screen view tracking (`UserReport.trackScreenView()`)
  - Section view tracking (`UserReport.trackSectionScreenView()`)

If a media (website) has one single topic, it can be tracked using `UserReport.trackScreenView()`.

If a website has different sections, for instance *Health*, *World news* and *Local news*, then it should be tracked using `UserReport.trackSectionScreenView(sectionId)`.  The `sectionId` for a particular section can be found on the Media Setting page in UserReport.
Even when `UserReport.trackSectionScreenView(sectionId)` is used `UserReport.trackScreenView()` should be invoked as well.

Example of tracking screen view:
```javascript
export default class ScreenView extends Component {
    componentDidMount() {
        UserReport.trackScreenView();
    }

    render() {...}
}
```


Example of tracking section screen view:
```javascript
export default class ScreenView extends Component {
    componentDidMount() {
        UserReport.trackScreenView();
        UserReport.trackSectionScreenView(sectionId);
    }

    render() {...}
}
```

## Anonymous tracking

You can configure SDK to use anonymous tracking using `setAnonymousTracking` command:

```javascript
import UserReport from '@apr/react-native-userreport-sdk';

UserReport.setAnonymousTracking(true);
```

---
_Source: https://npm.io/package/@apr/react-native-userreport-sdk · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._