2.0 Beta Release

fehergeri13 · Jul 6, 2021 · 26ce6e3 · 26ce6e3
1 parent 68bc0e7
commit 26ce6e3
Show file tree

Hide file tree

Showing 18 changed files with 4,646 additions and 4,157 deletions.
diff --git a/package/.babelrc → .babelrc b/package/.babelrc → .babelrc
@@ -6,4 +6,4 @@
     "@babel/preset-react"
   ],
   "plugins": ["@babel/plugin-proposal-class-properties"]
-}
+}
diff --git a/package/.eslintrc.js → .eslintrc.js b/package/.eslintrc.js → .eslintrc.js
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,21 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+
+# builds
+build
+.rpt2_cache
+
+# misc
+.DS_Store
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+.babelrc;
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/.travis.yml b/.travis.yml
@@ -1,4 +1,3 @@
 language: node_js
 node_js:
-  - 9
-  - 8
+  - 16
diff --git a/README.md b/README.md
@@ -1,22 +1,26 @@
-# React OneSignal
+<p align="center">
+  <img src="https://media.onesignal.com/cms/Website%20Layout/logo-red.svg"/>
+  <br/>
+  <br/>
+  <span style="color: grey !important">Showing web push notifications from Chrome, Safari, and Firefox</span>
+</p>
 
-[![NPM](https://img.shields.io/npm/v/react-onesignal.svg?style=flat-square)](https://www.npmjs.com/package/react-onesignal)
-[![Issues](https://img.shields.io/github/issues/pedro-lb/react-onesignal?style=flat-square)](https://github.com/pedro-lb/react-onesignal/issues)
-[![Stars](https://img.shields.io/github/stars/pedro-lb/react-onesignal?style=flat-square)](https://github.com/pedro-lb/react-onesignal/stargazers)
-[![Forks](https://img.shields.io/github/forks/pedro-lb/react-onesignal?style=flat-square)](https://github.com/pedro-lb/react-onesignal/network/members)
-[![Contributors](https://img.shields.io/github/contributors/pedro-lb/react-onesignal?style=flat-square)](https://github.com/pedro-lb/react-onesignal/graphs/contributors)
-[![Languages](https://img.shields.io/github/languages/count/pedro-lb/react-onesignal?style=flat-square)](https://github.com/pedro-lb/react-onesignal)
+# React OneSignal
+---
 
 This is a JavaScript module that can be used to easily include [OneSignal](https://onesignal.com/) code in a website or app that uses React for its front-end codebase.
 
 OneSignal is the world's leader for Mobile Push Notifications, Web Push, and In-App Messaging. It is trusted by 800k businesses to send 5 billion Push Notifications per day.
 
 You can find more information on OneSignal [here](https://onesignal.com/).
 
-## Notice
-
-This is now the official OneSignal package for React. More details [here](https://github.com/OneSignal/react-onesignal/issues/38).
+## Contents
+- [Install](#install)
+- [Usage](#usage)
+- [API](#onesignal-api)
+- [Advanced Usage](#advanced-usage)
 
+---
 ## Install
 
 You can use `yarn` or `npm`.
@@ -34,136 +38,129 @@ yarn add react-onesignal
 npm install --save react-onesignal
 ```
 
+---
 ## Usage
 
-Simply initialize OneSignal with your token:
+Initialize OneSignal with your app id:
 
 ```js
 import OneSignal from 'react-onesignal';
 
-OneSignal.initialize('xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx', options);
-```
-
-Where options is:
-
-```ts
-safari_web_id?: string;
-subdomainName?: string;
-allowLocalhostAsSecureOrigin?: boolean;
-requiresUserPrivacyConsent?: boolean;
-persistNotification?: boolean;
-autoResubscribe?: boolean;
-autoRegister?: boolean;
-notificationClickHandlerMatch?: string;
-notificationClickHandlerAction?: string;
-notifyButton?: {
-  enable?: boolean;
-  size?: 'small' | 'medium' | 'large';
-  position?: 'bottom-left' | 'bottom-right';
-  showCredit?: boolean;
-  prenotify?: boolean;
-    theme?: 'default' | 'inverse';
-    offset?: {
-      bottom?: string;
-      right?: string;
-      left?: string;
-    },
-    text?: {
-      [key: string]: string;
-    };
-    colors?: {
-      [key: string]: string;
-    };
-}
-```
-
-And `OneSignal` object contains:
-
-```ts
-notificationPermission: string[];
-registerForPushNotifications: () => Promise<any>;
-getNotificationPermission: () => Promise<string>;
-isPushNotificationsEnabled: () => Promise<boolean>;
-isPushNotificationsSupported: () => boolean;
-setSubscription: (unmute: boolean) => Promise<any>;
-setEmail: (email: string) => Promise<string>;
-logoutEmail: () => Promise<void>;
-getEmailId: () => Promise<string>;
-getUserId: () => Promise<string>;
-setExternalUserId: (externalUserId: string | number) => Promise<void>;
-removeExternalUserId: () => Promise<void>;
-getExternalUserId: () => Promise<any>;
-initialized: boolean;
-sendTag: (key: string, val: string) => Promise<string>;
-sendTags: (keyValues: object) => Promise<any>;
+OneSignal.initialize('xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx');
 ```
 
-## Advanced Usage
-
-### Player ID
-
-Player ID is an important information on OneSignal.
-
-You can use `getPlayerId` to obtain it.
+The `initialize` function returns a promise that resolves when OneSignal is loaded.
 
+**Examples**
 ```js
-// Obtains the current playerId from the browser
-const playerId = await OneSignal.getPlayerId();
+await OneSignal.initialize('xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx');
+// do other stuff
 ```
-
-### Notification Permission Management
-
-To manage notifications:
-
-- Use `notificationPermission` to see all possible states.
-- Use `getNotificationPermission` to check current notification permissions.
-- Use `registerForPushNotifications` to ask for notification permissions.
+---
 
 ```js
-// Check all possible permission states
-const permissions = OneSignal.notificationPermission;
-
-// Check current permission state
-const currentState = await OneSignal.getNotificationPermission();
-
-// Ask the user for notification permissions, if not granted yet
-await OneSignal.registerForPushNotifications();
+const [initialized, setInitialized] = useState(false);
+OneSignal.initialize('xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx').then(() => {
+  setInitialized(true);
+  OneSignal.showSlidedownPrompt().then(() => {
+    // do other stuff
+  });
+})
 ```
 
-### User Email Tracking
-
-You can use `setEmail`, `getEmailId` and `logoutEmail` to track user email.
+### Options
+You can pass an `options` object as the second parameter to the `initialize` function.
 
-```js
-// Set email to track & notify specific users
-OneSignal.setEmail('[email protected]');
-
-// Check which email is configured in this browser
-const emailId = await OneSignal.getEmailId();
+Where options are:
 
-// Remove email tracking
-OneSignal.logoutEmail();
+```ts
+interface Options {
+  safari_web_id?: string;
+  subdomainName?: string;
+  allowLocalhostAsSecureOrigin?: boolean;
+  requiresUserPrivacyConsent?: boolean;
+  persistNotification?: boolean;
+  autoResubscribe?: boolean;
+  autoRegister?: boolean;
+  notificationClickHandlerMatch?: string;
+  notificationClickHandlerAction?: string;
+  notifyButton?: {
+    enable?: boolean;
+    size?: 'small' | 'medium' | 'large';
+    position?: 'bottom-left' | 'bottom-right';
+    showCredit?: boolean;
+    prenotify?: boolean;
+      theme?: 'default' | 'inverse';
+      offset?: {
+        bottom?: string;
+        right?: string;
+        left?: string;
+      },
+      text?: {
+        [key: string]: string;
+      };
+      colors?: {
+        [key: string]: string;
+      };
+  }
+}
 ```
 
-### External User ID
-
-You can use `setExternalUserId`, `getExternalUserId` and `removeExternalUserId` to track external user ID.
+---
+## OneSignal API
+See the [OneSignal Web SDK reference](https://documentation.onesignal.com/docs/web-push-sdk) for more info.
 
-```js
-// Set external user ID
-OneSignal.setExternalUserId('your_id');
+```ts
+interface OneSignal {
+  initialize(appId: string, options?: any, events?: Array<IOneSignalEvent>): Promise<void>
+  isPushNotificationsEnabled(callback?: Action<boolean>): Promise<boolean>
+  showHttpPrompt(options?: AutoPromptOptions): void
+  registerForPushNotifications(options?: RegisterOptions): Promise<void>
+  setDefaultNotificationUrl(url: string): void
+  setDefaultTitle(title: string): void
+  getTags(callback?: Action<any>): void
+  sendTag(key: string,  value: any,  callback?: Action<Object>): Promise<Object | null>
+  sendTags(tags: TagsObject<any>,  callback?: Action<Object>): Promise<Object | null>
+  deleteTag(tag: string): Promise<Array<string>>
+  deleteTags(tags: Array<string>,  callback?: Action<Array<string>>): Promise<Array<string>>
+  addListenerForNotificationOpened(callback?: Action<Notification>): void
+  setSubscription(newSubscription: boolean): Promise<void>
+  showHttpPermissionRequest(options?: AutoPromptOptions): Promise<any>
+  showNativePrompt(): Promise<void>
+  showSlidedownPrompt(options?: AutoPromptOptions): Promise<void>
+  showCategorySlidedown(options?: AutoPromptOptions): Promise<void>
+  showSmsSlidedown(options?: AutoPromptOptions): Promise<void>
+  showEmailSlidedown(options?: AutoPromptOptions): Promise<void>
+  showSmsAndEmailSlidedown(options?: AutoPromptOptions): Promise<void>
+  getNotificationPermission(onComplete?: Function): Promise<NotificationPermission>
+  getUserId(callback?: Action<string | undefined | null>): Promise<string | undefined | null>
+  getSubscription(callback?: Action<boolean>): Promise<boolean>
+  setEmail(email: string,  options?: SetEmailOptions): Promise<string|null>
+  setSMSNumber(smsNumber: string,  options?: SetSMSOptions): Promise<string | null>
+  logoutEmail(): void
+  logoutSMS(): void
+  setExternalUserId(externalUserId: string | undefined | null,  authHash?: string): Promise<void>
+  removeExternalUserId(): Promise<void>
+  getExternalUserId(): Promise<string | undefined | null>
+  provideUserConsent(consent: boolean): Promise<void>
+  getEmailId(callback?: Action<string | undefined>): Promise<string | null | undefined>
+  getSMSId(callback?: Action<string | undefined>): Promise<string | null | undefined>
+  sendOutcome(outcomeName: string,  outcomeWeight?: number | undefined): Promise<void>
+}
+```
 
-// Get external user ID
-const externalUserId = await OneSignal.getExternalUserId();
+### OneSignal API
+See the official [OneSignal WebSDK reference](https://documentation.onesignal.com/docs/web-push-sdk) for information on all available SDK functions.
 
-// Remove external user ID
-OneSignal.removeExternalUserId();
-```
+### Typescript
+This package includes Typescript support.
 
-## Events and Event Listeners
+---
+## Advanced Usage
+### Events and Event Listeners
 You can also listen for native OneSignal events like `subscriptionChange`.
 
-To add an event listener to the `OneSignal.push()` array, pass an array of events to the `ReactOneSignal.initialize()` function as the third parameter.
+To add an event listener to the `OneSignal.push()` array, pass an array of events to the `initialize()` function as the third parameter.
 
 Each object in the array should contain:
 * `listener` -- (optional) Default value: `'on'`.
@@ -205,59 +202,12 @@ const events = [
 ];
 
 
-ReactOneSignal.initialize(applicationId, options, events);
+OneSignal.initialize(applicationId, options, events);
 ```
 
-### OneSignal Tags and Audience Segmenting
-
-You can use `sendTag` and `sendTags` to set OneSignal tags for segment filtering.
-```js
-// Send a tag to OneSignal for the current player
-OneSignal.sendTag('tag', 'tagValue');
-
-// Send multiple tags to OneSignal for the current player
-const keyValues = {
-  'tag1': 'value1',
-  'tag2': 'value2',
-  'tag3': 'value3',
-};
-OneSignal.sendTags(keyValues);
-```
-
-### Setup hook
-
-To avoid error due to OneSignal not initialized, you can use useOneSignalSetup hook, passing a callback to be called when OneSignal is ready
-
-```ts
-import OneSignal, { useOneSignalSetup } from 'react-onesignal';
-
-type AppProps = {
-  user: {
-    id: string;
-    Email: string;
-  };
-};
-
-function App(props: AppProps) {
-  const { user } = props;
-
-  useOneSignalSetup(() => {
-    OneSignal.setEmail(user.Email);
-    OneSignal.setExternalUserId(user.id);
-  });
-}
-```
-
-## Contributing
-
-Pull requests are welcome! If you have any feedback, issue or suggestion, feel free to open [a new issue](https://github.com/pedro-lb/react-onesignal/issues/new) so we can talk about it 💬.
-
-## Made possible by
-
-<a href="https://github.com/pedro-lb/react-onesignal/graphs/contributors">
-  <img src="https://contributors-img.web.app/image?repo=pedro-lb/react-onesignal" />
-</a>
-
-## License
-
-MIT © [pedro-lb](https://github.com/pedro-lb)
+---
+## Thanks
+Special thanks to [pedro-lb](https://github.com/pedro-lb) and others for work on the project this package is [based on](https://github.com/pedro-lb/react-onesignal).
+<a href="https://github.com/onesignal/react-onesignal/graphs/contributors">
+  <img src="https://user-images.githubusercontent.com/11739227/119415383-1d354700-bcb7-11eb-946d-01c40cd07010.png" />
+</a>
-Original file line number
+Diff line change
@@ Expand Up / @@ -6,4 +6,4 @@ @@
         "@babel/preset-react"
       ],
       "plugins": ["@babel/plugin-proposal-class-properties"]
-    }
+    }