insert-affiliate-react-native-sdk 1.1.7 → 1.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -2
- package/readme.md +114 -49
- package/src/DeepLinkIapProvider.tsx +0 -1
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "insert-affiliate-react-native-sdk",
|
|
3
|
-
"version": "1.1.
|
|
4
|
-
"description": "A package
|
|
3
|
+
"version": "1.1.9",
|
|
4
|
+
"description": "A package for connecting with the Insert Affiliate Platform to add app based affiliate marketing.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"scripts": {
|
package/readme.md
CHANGED
|
@@ -10,18 +10,11 @@ The **InsertAffiliateReactNative SDK** is designed for React Native applications
|
|
|
10
10
|
- **Affiliate Identifier Management**: Set and retrieve the affiliate identifier based on user-specific links.
|
|
11
11
|
- **In-App Purchase (IAP) Initialisation**: Easily reinitialise in-app purchases with the option to validate using an affiliate identifier.
|
|
12
12
|
|
|
13
|
-
## Peer Dependencies
|
|
14
|
-
|
|
15
|
-
Before using this package, ensure you have the following dependencies installed:
|
|
16
|
-
|
|
17
|
-
- [react-native-iap](https://www.npmjs.com/package/react-native-iap)
|
|
18
|
-
- [axios](https://www.npmjs.com/package/axios)
|
|
19
|
-
|
|
20
13
|
## Getting Started
|
|
21
14
|
|
|
22
15
|
To get started with the InsertAffiliateReactNative SDK:
|
|
23
16
|
|
|
24
|
-
1. [Install the
|
|
17
|
+
1. [Install the SDK](#installation)
|
|
25
18
|
2. [Initialise the SDK in App.tsx](#basic-usage)
|
|
26
19
|
3. [Set up in-app purchases (Required)](#in-app-purchase-setup-required)
|
|
27
20
|
4. [Set up deep linking (Required)](#deep-link-setup-required)
|
|
@@ -37,7 +30,9 @@ npm install insert-affiliate-react-native-sdk
|
|
|
37
30
|
|
|
38
31
|
## Basic Usage
|
|
39
32
|
|
|
40
|
-
|
|
33
|
+
Follow the steps below to install the SDK.
|
|
34
|
+
|
|
35
|
+
#### Step 1: Initialisation in `App.tsx`
|
|
41
36
|
|
|
42
37
|
First, wrap your with our provider and call the `initialise` method early in your app's lifecycle:
|
|
43
38
|
|
|
@@ -60,7 +55,6 @@ const Child = () => {
|
|
|
60
55
|
}, [initialize, isInitialized]);
|
|
61
56
|
|
|
62
57
|
// ...
|
|
63
|
-
|
|
64
58
|
}
|
|
65
59
|
|
|
66
60
|
const App = () => {
|
|
@@ -71,20 +65,77 @@ const App = () => {
|
|
|
71
65
|
);
|
|
72
66
|
};
|
|
73
67
|
```
|
|
74
|
-
- Replace `{{ your_iaptic_app_id }}` with your **Iaptic App ID**. You can find this [here](https://www.iaptic.com/account).
|
|
75
|
-
- Replace `{{ your_iaptic_app_name }}` with your **Iaptic App Name**. You can find this [here](https://www.iaptic.com/account).
|
|
76
|
-
- Replace `{{ your_iaptic_public_key }}` with your **Iaptic Public Key**. You can find this [here](https://www.iaptic.com/settings).
|
|
77
68
|
- Replace `{{ your_company_code }}` with the unique company code associated with your Insert Affiliate account. You can find this code in your dashboard under [Settings](http://app.insertaffiliate.com/settings).
|
|
78
69
|
|
|
79
70
|
## In-App Purchase Setup [Required]
|
|
80
71
|
Insert Affiliate requires a Receipt Verification platform to validate in-app purchases. You must choose **one** of our supported partners:
|
|
81
|
-
- [Iaptic](https://www.iaptic.com/account)
|
|
82
72
|
- [RevenueCat](https://www.revenuecat.com/)
|
|
73
|
+
- [Iaptic](https://www.iaptic.com/account)
|
|
74
|
+
|
|
75
|
+
### Option 1: RevenueCat Integration
|
|
76
|
+
#### Step 1. Code Setup
|
|
77
|
+
First, complete the [RevenueCat SDK installation](https://www.revenuecat.com/docs/getting-started/installation/reactnative). Then modify your `App.tsx`:
|
|
78
|
+
|
|
79
|
+
```javascript
|
|
80
|
+
import {
|
|
81
|
+
DeepLinkIapProvider,
|
|
82
|
+
useDeepLinkIapProvider,
|
|
83
|
+
} from 'insert-affiliate-react-native-sdk';
|
|
84
|
+
|
|
85
|
+
// ... //
|
|
86
|
+
const {
|
|
87
|
+
initialize,
|
|
88
|
+
isInitialized,
|
|
89
|
+
returnInsertAffiliateIdentifier
|
|
90
|
+
} = useDeepLinkIapProvider();
|
|
91
|
+
|
|
92
|
+
React.useEffect(() => {
|
|
93
|
+
const handleAffiliateLogin = async () => {
|
|
94
|
+
try {
|
|
95
|
+
if (isInitialized) {
|
|
96
|
+
const affiliateIdentifier = await returnInsertAffiliateIdentifier();
|
|
97
|
+
|
|
98
|
+
if (affiliateIdentifier) {
|
|
99
|
+
console.log('Logging into RevenueCat...');
|
|
100
|
+
const { customerInfo, created } = await Purchases.logIn(affiliateIdentifier);
|
|
101
|
+
|
|
102
|
+
if (created) {
|
|
103
|
+
console.log('New user created in RevenueCat:', customerInfo);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
} catch (error) {
|
|
108
|
+
console.error('Error during affiliate login flow:', error);
|
|
109
|
+
}
|
|
110
|
+
};
|
|
111
|
+
|
|
112
|
+
handleAffiliateLogin();
|
|
113
|
+
}, [isInitialized, returnInsertAffiliateIdentifier]);
|
|
114
|
+
// ... //
|
|
115
|
+
```
|
|
116
|
+
|
|
117
|
+
#### Step 2. Webhook Setup
|
|
118
|
+
|
|
119
|
+
1. Go to RevenueCat and [create a new webhook](https://www.revenuecat.com/docs/integrations/webhooks)
|
|
120
|
+
|
|
121
|
+
2. Configure the webhook with these settings:
|
|
122
|
+
- Webhook URL: `https://api.insertaffiliate.com/v1/api/revenuecat-webhook`
|
|
123
|
+
- Authorization header: Use the value from your Insert Affiliate dashboard (you'll get this in step 4)
|
|
124
|
+
|
|
125
|
+
3. In your [Insert Affiliate dashboard settings](https://app.insertaffiliate.com/settings):
|
|
126
|
+
- Navigate to the verification settings
|
|
127
|
+
- Set the in-app purchase verification method to `RevenueCat`
|
|
128
|
+
|
|
129
|
+
4. Back in your Insert Affiliate dashboard:
|
|
130
|
+
- Locate the `RevenueCat Webhook Authentication Header` value
|
|
131
|
+
- Copy this value
|
|
132
|
+
- Paste it as the Authorization header value in your RevenueCat webhook configuration
|
|
133
|
+
|
|
83
134
|
|
|
84
|
-
### Option
|
|
135
|
+
### Option 2: Iaptic Integration
|
|
85
136
|
First, complete the [Iaptic account setup](https://www.iaptic.com/signup) and code integration.
|
|
86
137
|
|
|
87
|
-
Then after setting up the in app purchase (IAP) with Iaptic, call Insert Affiliate's
|
|
138
|
+
Then after setting up the in app purchase (IAP) with Iaptic, call Insert Affiliate's ```validatePurchaseWithIapticAPI``` on purchase.
|
|
88
139
|
|
|
89
140
|
```javascript
|
|
90
141
|
import React from 'react';
|
|
@@ -96,7 +147,7 @@ const Child = () => {
|
|
|
96
147
|
const {
|
|
97
148
|
initialize,
|
|
98
149
|
isInitialized,
|
|
99
|
-
|
|
150
|
+
validatePurchaseWithIapticAPI,
|
|
100
151
|
} = useDeepLinkIapProvider();
|
|
101
152
|
|
|
102
153
|
const [iapLoading, setIapLoading] = useState(false);
|
|
@@ -117,7 +168,12 @@ const Child = () => {
|
|
|
117
168
|
// Validate the purchase with Iaptic through Insert Affiliate's SDK for Affiliate Tracking
|
|
118
169
|
useEffect(() => {
|
|
119
170
|
if (currentPurchase) {
|
|
120
|
-
|
|
171
|
+
validatePurchaseWithIapticAPI(
|
|
172
|
+
currentPurchase,
|
|
173
|
+
'{{ your_iaptic_app_id }}',
|
|
174
|
+
'{{ your_iaptic_app_name }}',
|
|
175
|
+
'{{ your_iaptic_public_key }}',
|
|
176
|
+
).then((isValid: boolean) => {
|
|
121
177
|
if (isValid) {
|
|
122
178
|
console.log("Purchase validated successfully.");
|
|
123
179
|
} else {
|
|
@@ -155,12 +211,6 @@ export default App;
|
|
|
155
211
|
- Replace `{{ your_iaptic_public_key }}` with your **Iaptic Public Key**. You can find this [here](https://www.iaptic.com/settings).
|
|
156
212
|
- Replace `{{ your_company_code }}` with the unique company code associated with your Insert Affiliate account. You can find this code in your dashboard under [Settings](http://app.insertaffiliate.com/settings).
|
|
157
213
|
|
|
158
|
-
### Option 2: RevenueCat Integration
|
|
159
|
-
<!--#### 1. Code Setup-->
|
|
160
|
-
<!--First, complete the [RevenueCat SDK installation](https://www.revenuecat.com/docs/getting-started/installation/ios). Then modify your `AppDelegate.swift`:-->
|
|
161
|
-
|
|
162
|
-
COMING SOON...
|
|
163
|
-
|
|
164
214
|
## Deep Link Setup [Required]
|
|
165
215
|
|
|
166
216
|
### Step 1: Add the Deep Linking Platform Dependency
|
|
@@ -171,31 +221,46 @@ Any alternative deep linking platform can be used by passing the referring link
|
|
|
171
221
|
|
|
172
222
|
After setting up your Branch integration, add the following code to your ```index.js```
|
|
173
223
|
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
224
|
+
#### Example with RevenueCat
|
|
225
|
+
```javascript
|
|
226
|
+
import { useDeepLinkIapProvider } from 'insert-affiliate-react-native-sdk';
|
|
227
|
+
|
|
228
|
+
const RootComponent = () => {
|
|
229
|
+
const {setInsertAffiliateIdentifier, returnInsertAffiliateIdentifier} = useDeepLinkIapProvider();
|
|
230
|
+
|
|
231
|
+
React.useEffect(() => {
|
|
232
|
+
const branchSubscription = branch.subscribe(async ({error, params}) => {
|
|
233
|
+
if (error) {
|
|
234
|
+
console.error('Error from Branch:', error);
|
|
235
|
+
return;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
if (params['+clicked_branch_link']) {
|
|
239
|
+
const referringLink = params['~referring_link'];
|
|
240
|
+
if (referringLink) {
|
|
241
|
+
try {
|
|
242
|
+
await setInsertAffiliateIdentifier(referringLink);
|
|
243
|
+
|
|
244
|
+
let insertAffiliateIdentifier = await returnInsertAffiliateIdentifier();
|
|
245
|
+
if (insertAffiliateIdentifier) {
|
|
246
|
+
const { customerInfo, created } = await Purchases.logIn(insertAffiliateIdentifier);
|
|
247
|
+
}
|
|
248
|
+
} catch (err) {
|
|
249
|
+
console.error('Error setting affiliate identifier:', err);
|
|
250
|
+
}
|
|
251
|
+
}
|
|
252
|
+
}
|
|
253
|
+
});
|
|
254
|
+
|
|
255
|
+
// Cleanup the subscription on component unmount
|
|
256
|
+
return () => {
|
|
257
|
+
branchSubscription();
|
|
258
|
+
};
|
|
259
|
+
}, [setInsertAffiliateIdentifier]);
|
|
260
|
+
|
|
261
|
+
return <App />;
|
|
262
|
+
};
|
|
263
|
+
```
|
|
199
264
|
|
|
200
265
|
#### Example with Iaptic
|
|
201
266
|
```javascript
|