Skip to content

Commit 2da6e5a

Browse files
unnaticleverpushcpandya25
unnaticleverpush
and
cpandya25
authored
feature/cp-9713-create-doc-for-expo-plugin (#93)
* feature/cp-9713-create-doc-for-expo-plugin Added Expo Plugin Doc * feature/cp-9713-create-doc-for-expo-plugin * feature/cp-9713-create-doc-for-expo-plugin * feature/cp-9713-create-doc-for-expo-plugin Added Expo Plugin Doc * feature/cp-9713-create-doc-for-expo-plugin --------- Co-authored-by: cpandya25 <c.pandya@cleverpush.com>
1 parent 137b32e commit 2da6e5a

94 files changed

Lines changed: 8901 additions & 2610 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎docs/sdks/expo/methods.md‎

Lines changed: 326 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,326 @@
1+
---
2+
id: methods
3+
title: Methods
4+
---
5+
6+
## Basic Usage
7+
8+
To initialize the CleverPush SDK, use the following method.
9+
10+
**CLEVERPUSH_CHANNEL_ID (String)**: Your unique CleverPush channel ID. This ID is required to link the app with your CleverPush account.
11+
12+
**received**: A listener that handles the event when a notification is received. The notificationReceived method is triggered with a NotificationOpenedResult object containing the details of the received notification. It fires when notifications have been received.
13+
14+
**opened**: A listener that handles the event when a notification is opened. The notificationOpened method is triggered with a NotificationOpenedResult object containing the details of the opened notification. It fires when notifications have been opened.
15+
16+
**subscribed**: A listener that handles the event when a user subscribes. The subscribed method is triggered with the subscriptionId. it fires when the user has successfully been subscribed.
17+
18+
**appBannerOpened**: A listener that handles banner interactions. This event is triggered when a user clicks on an image or button within a CleverPush App Banner.
19+
20+
Basic Example:
21+
22+
```jsx
23+
import React, { useEffect, useState } from 'react';
24+
import CleverPush from 'cleverpush-react-native';
25+
import { View, Text, Button } from 'react-native';
26+
27+
const App = () => {
28+
const [pushId, setPushId] = useState<string | null>(null);
29+
const [isSubscribedStatus, setIsSubscribedStatus] = useState<boolean | null>(null);
30+
const [lastNotificationId, setLastNotificationId] = useState<string | null>(null);
31+
32+
useEffect(() => {
33+
34+
CleverPush.init('CLEVERPUSH_CHANNEL_ID');
35+
36+
// optionally, you can disable the automatic push prompt with 'autoRegister: false':
37+
/*
38+
CleverPush.init('CLEVERPUSH_CHANNEL_ID', {
39+
autoRegister: false
40+
});
41+
*/
42+
43+
const onOpened = (openResult: any) => {
44+
console.log('Notification opened:', openResult);
45+
};
46+
47+
const onReceived = (receivedResult: any) => {
48+
console.log('Notification received:', receivedResult);
49+
const notificationId = receivedResult?.notification?.id;
50+
if (notificationId) {
51+
setLastNotificationId(notificationId);
52+
console.log('notification received ID:', notificationId);
53+
}
54+
};
55+
56+
const onSubscribed = (res: { id: string }) => {
57+
setPushId(res ? res.id : null);
58+
console.log('Subscription Id:', res.id);
59+
};
60+
61+
const onAppBannerOpened = (bannerResult: any) => {
62+
console.log('App Banner Clicked (Perform Action)');
63+
console.log('AppBannerAction type:', bannerResult.type);
64+
console.log('AppBannerAction name:', bannerResult.name);
65+
console.log('AppBannerAction URL:', bannerResult.url);
66+
console.log('AppBannerAction type:', bannerResult.urlType);
67+
};
68+
69+
CleverPush.addEventListener('opened', onOpened);
70+
CleverPush.addEventListener('received', onReceived);
71+
CleverPush.addEventListener('subscribed', onSubscribed);
72+
CleverPush.addEventListener('appBannerOpened', onAppBannerOpened);
73+
74+
return () => {
75+
CleverPush.removeEventListener('opened', onOpened);
76+
CleverPush.removeEventListener('received', onReceived);
77+
CleverPush.removeEventListener('subscribed', onSubscribed);
78+
CleverPush.removeEventListener('appBannerOpened', onAppBannerOpened);
79+
};
80+
}, []);
81+
82+
return (
83+
<View style={{ flex: 1, alignItems: 'center', paddingTop: 100 }}>
84+
<Text style={{ fontSize: 18, marginBottom: 20 }}>CleverPush Example App</Text>
85+
<Text style={{ fontSize: 16 }}>CleverPush ID: {pushId ?? 'Not available'}</Text>
86+
</View>
87+
);
88+
};
89+
90+
export default App;
91+
```
92+
93+
94+
### Show/Hide Foreground Notifications
95+
96+
(Available from version 1.7.5)
97+
98+
```javascript
99+
CleverPush.setShowNotificationsInForeground(true);
100+
```
101+
102+
103+
## Subscribe / Unsubscribe
104+
105+
Subscribe:
106+
107+
```javascript
108+
CleverPush.subscribe();
109+
```
110+
111+
Unsubscribe:
112+
113+
```javascript
114+
CleverPush.unsubscribe();
115+
```
116+
117+
Get Subscription status:
118+
119+
```javascript
120+
CleverPush.isSubscribed((err, isSubscribed) => {
121+
console.log(isSubscribed); // true
122+
});
123+
```
124+
125+
Get SubscriptionId:
126+
127+
```javascript
128+
CleverPush.getSubscriptionId((err, subscriptionId) => {
129+
console.log('Subscription ID:', subscriptionId);
130+
});
131+
```
132+
133+
134+
## Auto Resubscribe
135+
136+
You can perform auto resubscribe whenever app open if the user has given notification permission and subscriptionId is null.
137+
138+
Default `autoResubscribe` value is `false`. By seting `autoResubscribe` value to `true` whenever app open it checks that the user has given notification permission and subscriptionId is null then perform subscribe.
139+
140+
```javascript
141+
CleverPush.setAutoResubscribe(true);
142+
```
143+
144+
145+
## Check notification permission
146+
147+
Check if notification permission is given:
148+
149+
```javascript
150+
CleverPush.areNotificationsEnabled((err, notificationsEnabled) => {
151+
console.log(notificationsEnabled); // true
152+
});
153+
```
154+
155+
156+
## Topics
157+
158+
```javascript
159+
CleverPush.showTopicsDialog();
160+
161+
CleverPush.getAvailableTopics((err, topics) => {
162+
if (err) {
163+
console.error('Error fetching available topics:', err);
164+
} else {
165+
console.log('Available Topics:', topics);
166+
}
167+
});
168+
169+
CleverPush.getSubscriptionTopics((err, subscribedTopics) => {
170+
if (err) {
171+
console.error('Error fetching subscribed topics:', err);
172+
} else {
173+
console.log('Subscribed Topics:', subscribedTopics);
174+
}
175+
});
176+
177+
CleverPush.setSubscriptionTopics(['TOPIC_ID1', 'TOPIC_ID2']);
178+
179+
CleverPush.addSubscriptionTopic('TOPIC_ID');
180+
181+
CleverPush.removeSubscriptionTopic('TOPIC_ID');
182+
```
183+
184+
185+
## Tags
186+
187+
```javascript
188+
CleverPush.getAvailableTags((err, channelTags) => {
189+
console.log(channelTags); // [{ id: "tag1", name: "Tag 1" }]
190+
});
191+
192+
CleverPush.getSubscriptionTags((err, tagIds) => {
193+
console.log(tagIds); // ["tag_id_1", "tag_id_2"]
194+
});
195+
196+
CleverPush.addSubscriptionTag("tag_id");
197+
198+
CleverPush.removeSubscriptionTag("tag_id");
199+
200+
CleverPush.hasSubscriptionTag("tag_id", (err, hasTag) => {
201+
console.log(hasTag); // false
202+
});
203+
```
204+
205+
206+
## Attributes
207+
208+
```javascript
209+
CleverPush.getAvailableAttributes((err, customAttributes) => {
210+
console.log(customAttributes); // [{ id: "attribute1", name: "Attribute 1" }]
211+
});
212+
213+
CleverPush.getSubscriptionAttributes((err, attributes) => {
214+
console.log(attributes); // { attribute1: "value1", attribute2: "value2" }
215+
});
216+
217+
CleverPush.setSubscriptionAttribute("user_id", "1");
218+
219+
CleverPush.getSubscriptionAttribute("user_id", (err, attributeValue) => {
220+
console.log(attributeValue); // "value"
221+
});
222+
```
223+
224+
225+
## Country & Language
226+
227+
You can optionally override the country & language which is automatically detected from the system and can be used for targeting / translations.
228+
229+
```javascript
230+
CleverPush.setSubscriptionLanguage("de"); // iso language code
231+
232+
CleverPush.setSubscriptionCountry("DE"); // iso country code
233+
```
234+
235+
236+
## Automatic Tag Assignment
237+
238+
The SDK can also automatically assign tags by using the `trackPageView` method. In simple cases you can just give the method a URL. In the CleverPush backoffice you can then set trigger the tags by matching URL Pathname RegExes. You can optionally also set combinations of min. visits, seconds or sessions for this tag.
239+
240+
Let's say you have created a tag with the URL pathname regex "/sports". This would trigger the tag for a subscriber:
241+
242+
```javascript
243+
CleverPush.trackPageView("https://example.com/sports/article-123123");
244+
```
245+
246+
We can also have more advanced use cases here by using Javascript functions for matching. For example you created a tag with the following function in the CleverPush backend: `params.category === "sports"`. This would then trigger the tag for a subscriber:
247+
248+
```javascript
249+
CleverPush.trackPageView("https://example.com/anything", { "category", "sports" });
250+
```
251+
252+
Once the `trackPageView` method has been implemented you can set up all the tags dynamically in the CleverPush backend without touching your code.
253+
254+
255+
## Event Tracking
256+
257+
Events can be used to track conversions or trigger app banners.
258+
259+
```javascript
260+
CleverPush.trackEvent("EVENT NAME");
261+
262+
// Track an event with custom properties
263+
CleverPush.trackEvent('EVENT NAME', {
264+
'property_1': 'value',
265+
'property_2': 'value',
266+
});
267+
```
268+
269+
270+
## Get received notifications:
271+
272+
```javascript
273+
CleverPush.getNotifications((err, notifications) => {
274+
console.log(notifications);
275+
});
276+
```
277+
278+
279+
## Development mode
280+
281+
You can enable the development mode to disable caches for app banners, so you always see the most up to date version.
282+
283+
```javascript
284+
CleverPush.enableDevelopmentMode();
285+
```
286+
287+
288+
## Geo Fencing
289+
290+
For using Geo Fencing you need to request the location permission from the user.
291+
292+
```javascript
293+
CleverPush.requestLocationPermission();
294+
```
295+
296+
## Remove Notification from Notification Center
297+
298+
Clear all delivered notifications from the Notification Center
299+
300+
```javascript
301+
CleverPush.clearNotificationsFromNotificationCenter();
302+
```
303+
304+
## Remove Notification
305+
306+
You can remove notification stored locally using Notification ID
307+
308+
```javascript
309+
CleverPush.removeNotification("Notification_ID");
310+
```
311+
312+
You can remove a notification both stored locally and from the Notification Center
313+
314+
```javascript
315+
CleverPush.removeNotification("Notification_ID", true);
316+
```
317+
318+
## Disabling App Banners
319+
320+
You can also disable app banners temporarily, e.g. during a splash screen. Banners are enabled by default.
321+
If a banner would show during this time, it is added to an internal queue and shown when calling `enableAppBanners`.
322+
323+
```javascript
324+
CleverPush.disableAppBanners();
325+
CleverPush.enableAppBanners();
326+
```

0 commit comments

Comments
 (0)