Skip to content

Commit bb4c00a

Browse files
Split the React Native Expo documentation sections
1 parent d8dd1fe commit bb4c00a

File tree

4 files changed

+300
-315
lines changed

4 files changed

+300
-315
lines changed
Lines changed: 6 additions & 315 deletions
Original file line numberDiff line numberDiff line change
@@ -1,318 +1,9 @@
1-
This section describes the process of integrating the DevRev SDK with your React Native Expo app.
1+
# DevRev SDK for React Native (Expo)
22

3-
## Prerequisites
3+
This section provides documentation for integrating and using the DevRev SDK in your React Native Expo app.
44

5-
Ensure you have the following installed:
6-
- `expo` (any version)
7-
- `react-native` (compatible with Expo version)
8-
- `@devrev/sdk-react-native` (version 1.0.2 or higher)
5+
## Documentation Sections
96

10-
## Installation
11-
12-
1. Install the Expo config plugin:
13-
```bash
14-
npx expo install @devrev/sdk-react-native-expo-plugin
15-
```
16-
17-
2. Configure the plugin in your `app.json` or `app.config.js`:
18-
```json
19-
{
20-
"expo": {
21-
"plugins": [
22-
"@devrev/sdk-react-native-expo-plugin"
23-
]
24-
}
25-
}
26-
```
27-
28-
3. Rebuild your app:
29-
```bash
30-
npx expo prebuild --clean
31-
```
32-
33-
## Setting up the DevRev SDK
34-
35-
### Step 1: Credentials
36-
37-
1. Open the DevRev web app at [https://app.devrev.ai](https://app.devrev.ai).
38-
2. Navigate to the **Settings** page.
39-
3. Open the **PLuG Settings** page and copy the value under **Your Unique App ID**.
40-
41-
### Step 2: Configuration
42-
43-
<Callout intent="note">
44-
The SDK must be configured before you can use any of its features.
45-
</Callout>
46-
47-
Once you have the credentials, configure the DevRev SDK in your app. The SDK will be ready to use after calling the configuration method:
48-
49-
```typescript
50-
DevRevSDK.configure(appID: string)
51-
```
52-
53-
## Features
54-
55-
### Identification
56-
57-
Certain features of the DevRev SDK require user identification. You can identify users in the following ways:
58-
- **Anonymous users**: Creates an anonymous user with an optional user identifier.
59-
- **Unverified users**: Identifies the user with a unique identifier but does not verify the user's identity with the DevRev backend.
60-
- **Verified users**: Identifies the user with a unique identifier and verifies their identity with the DevRev backend.
61-
62-
The identification functions should be placed appropriately in your app after the user logs in. If you have the user information at app launch, call the function after the `DevRevSDK.configure(appID:)` method.
63-
64-
<Callout intent="note">
65-
If you haven't previously identified the user, the DevRev SDK will automatically create an anonymous user for you immediately after the SDK is configured.
66-
</Callout>
67-
68-
<Callout intent="note">
69-
The `Identity` structure allows for custom fields in the user, organization, and account traits. These fields must be configured through the DevRev app before they can be utilized. For more information, refer to [Object customization](https://devrev.ai/docs/product/object-customization).
70-
</Callout>
71-
72-
#### Anonymous identification
73-
74-
The anonymous identification method creates an anonymous user with an optional user identifier.
75-
76-
```typescript
77-
DevRevSDK.identifyAnonymousUser(userID: string)
78-
```
79-
80-
#### Unverified identification
81-
82-
The unverified identification method identifies the user with a unique identifier but does not verify their identity with the DevRev backend.
83-
84-
```typescript
85-
DevRevSDK.identifyUnverifiedUser(userID: string, organizationID?: string)
86-
```
87-
88-
#### Verified identification
89-
90-
The verified identification method identifies the user with a unique identifier and verifies their identity with the DevRev backend.
91-
92-
```typescript
93-
DevRevSDK.identifyVerifiedUser(userID: string, sessionToken: string)
94-
```
95-
96-
#### Updating the user
97-
98-
You can update the user's information using the following method:
99-
100-
```typescript
101-
DevRevSDK.updateUser(identity: Identity)
102-
```
103-
104-
<Callout intent="note">
105-
The `userID` property cannot be updated.
106-
</Callout>
107-
108-
### PLuG support chat
109-
110-
The support chat feature can be shown as a modal screen from the top-most screen.
111-
112-
<Callout intent="note">
113-
This feature requires the SDK to be configured and the user to be identified (unverified or anonymous users).
114-
</Callout>
115-
116-
```typescript
117-
DevRevSDK.showSupport()
118-
```
119-
120-
#### Creating a new support conversation
121-
122-
You can create a new conversation directly from your app. This method displays the support chat screen and simultaneously creates a new conversation.
123-
124-
```typescript
125-
DevRevSDK.createSupportConversation()
126-
```
127-
128-
## In-app link handling
129-
130-
The DevRev SDK provides a mechanism to handle links opened from within any screen that is part of the DevRev SDK.
131-
132-
You can fully customize the link handling behavior by setting the specialized in-app link handler. That way you can decide what should happen when a link is opened from within the app.
133-
134-
<Callout intent="note">
135-
This feature is for Android only.
136-
</Callout>
137-
138-
```typescript
139-
DevRevSDK.setInAppLinkHandler((url) => {
140-
// Perform an action here.
141-
});
142-
```
143-
144-
You can further customize the behavior by setting the `setShouldDismissModalsOnOpenLink` boolean flag. This flag controls whether the DevRev SDK should dismiss the top-most modal screen when a link is opened.
145-
146-
```typescript
147-
DevRevSDK.setShouldDismissModalsOnOpenLink(value: boolean)
148-
```
149-
150-
### Analytics
151-
152-
The DevRev SDK supports sending custom analytic events using a properties map.
153-
154-
<Callout intent="note">
155-
This feature requires the SDK to be configured and the user to be identified (unverified or anonymous users).
156-
</Callout>
157-
158-
```typescript
159-
DevRevSDK.trackEvent(name: string, properties?: Map<string, string>)
160-
```
161-
162-
### Observability
163-
164-
The DevRev SDK provides observability features to help you understand how users interact with your app.
165-
166-
#### Opting in/out
167-
168-
Observability features are opted-in by default. You can opt-out by calling the following method:
169-
170-
```typescript
171-
DevRevSDK.stopAllMonitoring()
172-
```
173-
174-
To opt back in, use the following method:
175-
176-
```typescript
177-
DevRevSDK.resumeAllMonitoring()
178-
```
179-
180-
#### Session recording
181-
182-
You can enable session recording to capture user interactions with your app.
183-
184-
<Callout intent="note">
185-
The session recording feature is opt-out and is enabled by default.
186-
</Callout>
187-
188-
The session recording feature includes the following methods:
189-
190-
- `DevRevSDK.startRecording()`: Starts the session recording.
191-
- `DevRevSDK.stopRecording()`: Stops the session recording and uploads it to the portal.
192-
- `DevRevSDK.pauseRecording()`: Pauses the ongoing session recording.
193-
- `DevRevSDK.resumeRecording()`: Resumes a paused session recording.
194-
- `DevRevSDK.processAllOnDemandSessions()`: Stops the ongoing session recording and uploads all offline sessions on demand.
195-
196-
#### Session properties
197-
198-
You can add custom properties to the session recording to help you understand the context of the session. The properties are defined as a map of string values.
199-
200-
```typescript
201-
DevRevSDK.addSessionProperties(properties: Map<string, string>)
202-
```
203-
204-
To clear the session properties, use the following method:
205-
206-
```typescript
207-
DevRevSDK.clearSessionProperties()
208-
```
209-
210-
#### Masking sensitive data
211-
212-
To protect sensitive data, the DevRev SDK provides an auto-masking feature that masks data before sending it to the server. Input views such as text fields, text views, and web views are automatically masked.
213-
214-
You can manually mark additional views as sensitive using the following method:
215-
216-
```typescript
217-
DevRevSDK.markSensitiveViews(tags: any[])
218-
```
219-
220-
If any previously masked views need to be unmasked, use the following method:
221-
222-
```typescript
223-
DevRevSDK.unmarkSensitiveViews(tags: any[])
224-
```
225-
226-
#### Timers
227-
228-
The DevRev SDK provides a timer mechanism to measure the time spent on specific tasks. Events such as response time, loading time, or any other time-based event can be measured using the timer.
229-
230-
To start a timer, use the following method:
231-
232-
```typescript
233-
DevRevSDK.startTimer(name: string, properties: Map<string, string>)
234-
```
235-
236-
To stop a timer, use the following method:
237-
238-
```typescript
239-
DevRevSDK.stopTimer(name: string, properties: Map<string, string>)
240-
```
241-
242-
#### Screen tracking
243-
244-
The DevRev SDK provides automatic screen tracking to help you understand how users navigate through your app. You can also manually track screens using the following method:
245-
246-
```typescript
247-
DevRevSDK.trackScreen(name: string)
248-
```
249-
250-
### Push notifications
251-
252-
You can configure your app to receive push notifications from the DevRev SDK. The SDK is designed to handle push notifications and execute actions based on the notification's content.
253-
254-
#### Configuration
255-
256-
To receive push notifications, configure your DevRev organization by following the [Push Notifications integration guide](#).
257-
258-
#### Registering for push notifications
259-
260-
<Callout intent="note">
261-
Push notifications require the SDK to be configured and the user to be identified (unverified or anonymous users).
262-
</Callout>
263-
264-
Register your device for receiving push notifications using the following method:
265-
266-
```typescript
267-
DevRevSDK.registerDeviceToken(deviceToken: string, deviceID: string)
268-
```
269-
270-
#### Unregistering from push notifications
271-
272-
If your app no longer needs to receive push notifications, unregister the device using the following method:
273-
274-
```typescript
275-
DevRevSDK.unregisterDevice(deviceID: string)
276-
```
277-
278-
#### Processing push notifications
279-
280-
##### Android
281-
282-
To handle notification clicks, intercept the click event, extract the payload, and pass it to the following method:
283-
284-
```typescript
285-
DevRevSDK.processPushNotification(payload: string)
286-
```
287-
288-
###### Example
289-
290-
```typescript
291-
const notificationPayload = {
292-
"message": {
293-
"title": "New Message",
294-
"body": "You have received a new message.",
295-
"data": {
296-
"messageId": "12345",
297-
"sender": "John Doe"
298-
}
299-
}
300-
};
301-
302-
const messageJson = notificationPayload["message"];
303-
DevRevSDK.processPushNotification(JSON.stringify(messageJson));
304-
```
305-
306-
##### iOS
307-
308-
On iOS devices, pass the received push notification payload to the SDK for processing:
309-
310-
```typescript
311-
DevRevSDK.processPushNotification(payload: string)
312-
```
313-
314-
###### Example
315-
316-
```typescript
317-
DevRevSDK.processPushNotification(JSON.stringify(payload));
318-
```
7+
- [Quickstart Guide](./react-native-expo/quickstart)
8+
- [Features](./react-native-expo/features)
9+
- [Troubleshooting](./react-native-expo/troubleshooting)

0 commit comments

Comments
 (0)