notifly-sdk 2.0.0 → 2.1.1

package/.eslintrc.cjs

@@ -0,0 +1,40 @@
+module.exports = {
+    root: true,
+    env: {
+        es6: true,
+        jest: true,
+        node: true,
+        'react-native/react-native': true,
+    },
+    parser: '@babel/eslint-parser',
+    plugins: ['react', 'react-native'],
+    extends: ['eslint:recommended', 'plugin:react/recommended'],
+    rules: {
+        'react/prop-types': 'off',
+        'react/react-in-jsx-scope': 'off',
+        'no-console': 'off',
+        'no-unused-vars': 'warn',
+        'react-native/no-unused-styles': 'warn',
+        'react-native/split-platform-components': 'warn',
+        'react-native/no-inline-styles': 'warn',
+        'react-native/no-color-literals': 'warn',
+        'react-native/no-raw-text': 'warn',
+    },
+    settings: {
+        react: {
+            version: 'detect',
+        },
+    },
+    parserOptions: {
+        requireConfigFile: false,
+        ecmaVersion: 2021,
+        sourceType: 'module',
+        ecmaFeatures: {
+            jsx: true,
+        },
+        babelOptions: {
+            presets: ['@babel/preset-env', '@babel/preset-react'],
+            plugins: ['@babel/plugin-syntax-import-assertions'],
+        },
+    },
+};

package/README.md

@@ -1 +1,33 @@
-# notifly-node-package
+# Notifly React Native SDK
+
+![npm](https://img.shields.io/npm/v/notifly-sdk)
+![Downloads](https://img.shields.io/npm/dt/notifly-sdk)
+
+_Notifly SDK for React Native_ is an easy-to-use package for integrating Notifly with your React Native applications. It supports both Android and iOS platforms.
+
+## Installation
+
+To install the package, run the following command:
+
+```
+npm install notifly-sdk@latest --save
+```
+
+or
+
+```
+yarn add notifly-sdk@latest
+```
+
+Also, please install the peer dependencies manually:
+
+```
+npm install @react-native-async-storage/async-storage@^1.17.11 @react-native-firebase/app@^16.4.3 @react-native-firebase/messaging@^16.4.3 react-native-device-info@^8.1.4 react-native-modal@^13.0.1 react-native-root-siblings@^4.1.1 react-native-webview@^11.26.1 uuid@^8.3.0
+```
+
+## Usage
+
+Please refer to our official documentation: 
+
+* [English documentation](https://docs.notifly.tech/client-sdk/react-native)
+* [Korean documentation](https://docs.notifly.tech/ko/client-sdk/react-native)

package/index.js

@@ -1,269 +1,117 @@
-import messaging from "@react-native-firebase/messaging";
-import { Linking, PermissionsAndroid, Platform } from 'react-native';
+import { Linking } from 'react-native';
+import RootSiblings from 'react-native-root-siblings';
 import AsyncStorage from '@react-native-async-storage/async-storage';
-import rnDeviceInfo from 'react-native-device-info';
-import { v5 } from 'uuid';
-import { NAMESPACE } from './namespace';
+import messaging from '@react-native-firebase/messaging';
+import logEvent from './src/log_event';
+import { setUserProperties, removeUserId } from './src/user';
+import { clickHandler, sessionStart } from './src/utils';
+import { showInAppMessage } from './src/in_app_message';
 
 exports.trackEvent = logEvent;
-
-exports.setUserProperties = _setUserProperties
-
-exports.clickHandler = _clickHandler
-
+exports.setUserProperties = setUserProperties;
+exports.clickHandler = clickHandler;
+
+/**
+ * Sets the external user ID for the user.
+ *
+ * @async
+ * @param {string} userID - The external user ID for the user.
+ * @returns {Promise<void>} - A promise that resolves when the user ID is set.
+ *
+ * @example
+ * await setUserId('123456789');
+ */
 exports.setUserId = async function (userID) {
     try {
         if (userID) {
-            await _setUserProperties({
+            await setUserProperties({
                 external_user_id: userID,
-            })
+            });
             return;
         }
-        await _removeUserId();
+        await removeUserId();
         return;
     } catch (err) {
-        console.warn('[Notifly] setUserId Failed.');
+        console.warn('[Notifly] setUserId failed.');
     }
-}
-
+};
+
+/**
+ * Initializes the Notifly SDK with the given project ID, user name, and password.
+ *
+ * @async
+ * @param {string} prjId - The project ID to use for initialization.
+ * @param {string} userName - The user name to use for authentication.
+ * @param {string} password - The password to use for authentication.
+ * @param {boolean} [useCustomClickHandler=false] - A flag indicating whether to use a custom click handler for push notifications.
+ * @returns {Promise<void>} A promise that resolves when initialization is complete, or rejects with an error.
+ *
+ * @example
+ * await initialize('myProjectId', 'myUserName', 'myPassword');
+ */
 exports.initialize = async function (prjId, userName, password, useCustomClickHandler = false) {
     try {
         await messaging().requestPermission();
 
-        messaging().onNotificationOpenedApp(async (remoteMessage) => {
-            const link = remoteMessage.data?.link
-            if (link) {
-                Linking.openURL(link);
-            }
-            await logEvent("push_click", { "campaign_id": remoteMessage.data.campaign_id, "status": "background" }, null, true);
+        // in-app-message
+        const openedInAppWebViewCount = { count: 0 };
+        messaging().onMessage((remoteMessage) => {
+            new RootSiblings(null).destroy();
+            handleInAppMessage(remoteMessage, openedInAppWebViewCount);
         });
 
+        // push
+        messaging().onNotificationOpenedApp(handleNotificationOpened);
+
+        // custom push click handler
         if (!useCustomClickHandler) {
-            messaging()
-                .getInitialNotification()
-                .then(async (remoteMessage) => {
-                    if (remoteMessage) {
-                        await _clickHandler(remoteMessage)
-                    }
-                });
+            const initialNotification = await messaging().getInitialNotification();
+            if (initialNotification) {
+                await clickHandler(initialNotification);
+            }
         }
 
-        messaging().getToken()
+        messaging().getToken();
 
         await Promise.all([
             AsyncStorage.setItem('notiflyProjectId', prjId),
             AsyncStorage.setItem('notiflyUserName', userName),
             AsyncStorage.setItem('notiflyUserPassword', password),
-        ])
-        await _sessionStart();
+        ]);
+        await sessionStart();
     } catch (err) {
-        console.warn("[Notifly]: ", err);
-    }
-}
-
-async function _sessionStart() {
-    const apiLevel = rnDeviceInfo.getApiLevel(); // only android
-    const brand = rnDeviceInfo.getBrand(); // apple samsung
-    const model = rnDeviceInfo.getModel(); // 기종 SM-G960N or iPhone 8
-    const userAgent = rnDeviceInfo.getUserAgent() // User Agent String
-    const platform = Platform.OS;
-    const deviceInfo = await Promise.all([model, brand, apiLevel, userAgent]);
-    const openAppEventParams = {
-        "platform": platform,
-        "device_model": deviceInfo[0],
-        "properties": {
-            "device_brand": deviceInfo[1],
-            "api_level": deviceInfo[2],
-            "user_agent": deviceInfo[3],
-        },
-    }
-    await logEvent("session_start", openAppEventParams, null, true)
-}
-
-async function getCognitoIdToken(userName, password) {
-    const myHeaders = new Headers();
-    myHeaders.append("X-Amz-Target", "AWSCognitoIdentityProviderService.InitiateAuth");
-    myHeaders.append("Content-Type", "application/x-amz-json-1.1");
-
-    const raw = `{\n    \"AuthFlow\":\"USER_PASSWORD_AUTH\",\n    \"AuthParameters\": {\n        \"PASSWORD\": \"${password}\",\n        \"USERNAME\":\"${userName}\"\n    },\n    \"ClientId\":\"2pc5pce21ec53csf8chafknqve\"\n}`;
-
-    const requestOptions = {
-        method: 'POST',
-        headers: myHeaders,
-        body: raw,
-        redirect: 'follow'
-    };
-
-    const token = fetch("https://cognito-idp.ap-northeast-2.amazonaws.com/", requestOptions)
-        .then(response => response.text())
-        .then(result => {
-            const tokens = JSON.parse(result).AuthenticationResult.IdToken
-            return tokens;
-        })
-        .catch(error => console.warn('[Notifly]: ', error));
-
-    return token;
-}
-
-async function _getNotiflyUserId() {
-    const encodedUserId = await AsyncStorage.getItem('notiflyUserId');
-    if (encodedUserId) {
-        return encodedUserId;
+        console.warn('[Notifly]: ', err);
     }
-    const [prjId, externalUserId] = await Promise.all([AsyncStorage.getItem('notiflyProjectId'), AsyncStorage.getItem('notiflyExternalUserId')])
-    let notiflyUserId
-    if (externalUserId) {
-        notiflyUserId = v5(`${prjId}${externalUserId}`, NAMESPACE.REGISTERED_USERID).replace(/-/g, '');
-    } else {
-        notiflyUserId = v5(`${prjId}${await messaging().getToken()}`, NAMESPACE.UNREGISTERED_USERID).replace(/-/g, '');
-    }
-    return notiflyUserId;
-}
+};
 
-async function _setUserProperties(params) {
+async function handleInAppMessage(remoteMessage, openedInAppWebViewCount) {
     try {
-        if (params.external_user_id) {
-            const [previousNotiflyUserID, previousExternalUserID] = await Promise.all([
-                _getNotiflyUserId(),
-                AsyncStorage.getItem('notiflyExternalUserId')
-            ]);
-            params['previous_notifly_user_id'] = previousNotiflyUserID
-            params['previous_external_user_id'] = previousExternalUserID
-            await Promise.all([
-                AsyncStorage.setItem('notiflyExternalUserId', params.external_user_id),
-                AsyncStorage.removeItem('notiflyUserId'),
-            ]);
+        if (remoteMessage.data?.notifly_message_type === 'in-app-message' && remoteMessage.data.url) {
+            showInAppMessage(remoteMessage.data, openedInAppWebViewCount);
         }
-        return (await logEvent("set_user_properties", params, null, true));
-    } catch (err) {
-        console.warn('[Notifly] Failed to remove userID');
-    }
-}
-
-async function _removeUserId() {
-    try {
-        await Promise.all([AsyncStorage.removeItem('notiflyExternalUserId'), AsyncStorage.removeItem('notiflyUserId')]);
-        return await logEvent('remove_external_user_id', {}, null, true);
     } catch (err) {
-        console.warn('[Notifly] Failed to remove userID');
+        console.warn('[Notifly] In-app message handling failed:', err);
     }
 }
 
-async function logEvent(eventName, eventParams, segmentation_event_param_keys = null, isInternalEvent = false) {
+async function handleNotificationOpened(remoteMessage) {
     try {
-        if (!eventName) {
-            console.warn('[Notifly]event_name must be provided.');
-            return;
-        }
-        let token;
-        const [savedCognitoToken, notiflyUserId, externalUserId, prjId, externalDeviceId, osVersion, appVersion] = await Promise.all([
-            AsyncStorage.getItem('notiflyCognitoIdToken'),
-            _getNotiflyUserId(),
-            AsyncStorage.getItem('notiflyExternalUserId'),
-            AsyncStorage.getItem('notiflyProjectId'),
-            rnDeviceInfo.getUniqueId(),
-            rnDeviceInfo.getSystemVersion(),
-            rnDeviceInfo.getVersion(),
-        ]);
-
-        const [eventId, notiflyDeviceId, deviceToken] = await Promise.all([
-            v5(`${notiflyUserId}${eventName}${new Date().valueOf()}`, NAMESPACE.EVENTID).replace(/-/g, ''),
-            v5(externalDeviceId, NAMESPACE.DEVICEID).replace(/-/g, ''),
-            messaging().getToken(),
-        ]);
-
-        if (!savedCognitoToken) {
-            const [userName, password] = await Promise.all([AsyncStorage.getItem('notiflyUserName'), AsyncStorage.getItem('notiflyUserPassword')])
-            newToken = await getCognitoIdToken(userName, password);
-            await AsyncStorage.setItem("notiflyCognitoIdToken", newToken);
-            token = newToken;
-        } else {
-            token = savedCognitoToken;
-        }
-
-        if (!token || !notiflyUserId || !prjId || !eventId || !externalDeviceId || !notiflyDeviceId || !deviceToken) {
-            throw new Error("null value");
-        }
-        const myHeaders = new Headers();
-        myHeaders.append("Authorization", token);
-        myHeaders.append("Content-Type", "application/json");
-
-        const eventDataWithoutExternalUserId = {
-            "event_params": eventParams,
-            "id": eventId,
-            "name": eventName,
-            "notifly_user_id": notiflyUserId,
-            "time": parseInt(new Date().valueOf() / 1000),
-            "notifly_device_id": notiflyDeviceId,
-            "external_device_id": externalDeviceId,
-            "device_token": deviceToken,
-            "is_internal_event": isInternalEvent,
-            "segmentation_event_param_keys": segmentation_event_param_keys,
-            "project_id": prjId,
-            "platform": Platform.OS,
-            "os_version": osVersion,
-            "app_version": appVersion,
+        const link = remoteMessage.data?.link;
+        if (link) {
+            Linking.openURL(link);
         }
-        const eventData = JSON.stringify(
-            externalUserId ?
-                {
-                    ...eventDataWithoutExternalUserId,
-                    "external_user_id": externalUserId,
-                }
-                :
-                eventDataWithoutExternalUserId
+        await logEvent(
+            'push_click',
+            {
+                type: 'message_event',
+                channel: 'push-notification',
+                campaign_id: remoteMessage.data.campaign_id,
+                status: 'background',
+            },
+            null,
+            true
         );
-
-        const body = JSON.stringify({
-            "records": [{
-                "data": eventData,
-                "partitionKey": notiflyUserId,
-            }]
-        })
-
-        const requestOptions = {
-            method: 'POST',
-            headers: myHeaders,
-            body: body,
-            redirect: 'follow'
-        };
-
-        const response = await _apiCall("https://12lnng07q2.execute-api.ap-northeast-2.amazonaws.com/prod/records", requestOptions);
-        const result = JSON.parse(response)
-        if (result.message == "The incoming token has expired") {
-            const [userName, password] = await Promise.all([AsyncStorage.getItem('notiflyUserName'), AsyncStorage.getItem('notiflyUserPassword')])
-            const newToken = await getCognitoIdToken(userName, password);
-            await AsyncStorage.setItem("notiflyCognitoIdToken", newToken);
-            await logEvent(eventName, eventParams, segmentation_event_param_keys, isInternalEvent)
-        }
-
     } catch (err) {
-        console.warn('[Notifly]Error: err')
-        if (err == 'Error: null value') {
-            throw new Error("[Notifly] Fail to log the event. Please retry the initialization.");
-        }
+        console.warn('[Notifly] Notification opened handling failed:', err);
     }
 }
-
-async function _clickHandler(remoteMessage) {
-    try {
-        if (remoteMessage) {
-            const link = remoteMessage.data?.link
-            if (link) {
-                Linking.openURL(link);
-            }
-            await logEvent("push_click", { "campaign_id": remoteMessage.data?.campaign_id, "status": "quit" }, null, true);
-            return;
-        }
-        console.warn('[Notifly] clickHandler receives a null remoteMessage.');
-        return;
-    } catch (err) {
-        console.warn('[Notifly] custom click handler registration failed.');
-    }
-}
-
-async function _apiCall(apiUrl, requestOptions) {
-    const result = fetch(apiUrl, requestOptions)
-        .then(response => response.text());
-    return result;
-}

package/package.json

@@ -1,19 +1,35 @@
 {
   "name": "notifly-sdk",
-  "version": "2.0.0",
+  "version": "2.1.1",
   "description": "",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "pretty": "prettier --write \"**/*.{js,jsx,json}\"",
+    "lint": "eslint ."
   },
   "peerDependencies": {
     "@react-native-async-storage/async-storage": "^1.17.11",
     "@react-native-firebase/app": "^16.4.3",
     "@react-native-firebase/messaging": "^16.4.3",
     "react-native-device-info": "^8.1.4",
+    "react-native-modal": "^13.0.1",
+    "react-native-root-siblings": "^4.1.1",
+    "react-native-webview": "^11.26.1",
     "uuid": "^8.3.0"
   },
   "author": "daeseongKim",
   "license": "ISC",
-  "type": "module"
+  "type": "module",
+  "devDependencies": {
+    "@babel/core": "^7.21.4",
+    "@babel/eslint-parser": "^7.21.3",
+    "@babel/plugin-syntax-import-assertions": "^7.20.0",
+    "@babel/preset-env": "^7.21.4",
+    "@babel/preset-react": "^7.18.6",
+    "eslint": "^8.38.0",
+    "eslint-plugin-react": "^7.32.2",
+    "eslint-plugin-react-native": "^4.0.0",
+    "prettier": "^2.8.7"
+  }
 }

package/src/auth.js

@@ -0,0 +1,42 @@
+/**
+ * Fetches a Cognito ID token for the given user name and password.
+ *
+ * @async
+ * @param {string} userName - The user name to use for authentication.
+ * @param {string} password - The password to use for authentication.
+ * @returns {Promise<string>} A promise that resolves with the Cognito ID token, or rejects with an error.
+ *
+ * @example
+ * const token = await getCognitoIdToken('myUserName', 'myPassword');
+ */
+export async function getCognitoIdToken(userName, password) {
+    const headers = new Headers({
+        'X-Amz-Target': 'AWSCognitoIdentityProviderService.InitiateAuth',
+        'Content-Type': 'application/x-amz-json-1.1',
+    });
+
+    const body = JSON.stringify({
+        AuthFlow: 'USER_PASSWORD_AUTH',
+        AuthParameters: {
+            PASSWORD: password,
+            USERNAME: userName,
+        },
+        ClientId: '2pc5pce21ec53csf8chafknqve',
+    });
+
+    const requestOptions = {
+        method: 'POST',
+        headers,
+        body,
+        redirect: 'follow',
+    };
+
+    try {
+        const response = await fetch('https://cognito-idp.ap-northeast-2.amazonaws.com/', requestOptions);
+        const result = await response.text();
+        const token = JSON.parse(result).AuthenticationResult.IdToken;
+        return token;
+    } catch (error) {
+        console.warn('[Notifly]: ', error);
+    }
+}

package/src/constant.js

@@ -0,0 +1,8 @@
+export const SDK_VERSION = '2.1.1';
+
+export const NAMESPACE = {
+    'EVENTID': '830b5f7b-e392-43db-a17b-d835f0bcab2b',
+    'REGISTERED_USERID': 'ce7c62f9-e8ae-4009-8fd6-468e9581fa21',
+    'UNREGISTERED_USERID': 'a6446dcf-c057-4de7-a360-56af8659d52f',
+    'DEVICEID': '830848b3-2444-467d-9cd8-3430d2738c57',
+};

package/src/in_app_message.js

@@ -0,0 +1,225 @@
+import { View, Linking, Dimensions } from 'react-native';
+import RootSiblings from 'react-native-root-siblings';
+import Modal from 'react-native-modal';
+import WebView from 'react-native-webview';
+import logEvent from './log_event';
+import { setUserProperties } from './user';
+
+/**
+ * Displays an in-app message in a modal WebView.
+ *
+ * @async
+ * @param {Object} data - An object containing information about the in-app message to display.
+ * @param {Object} openedInAppWebViewCount - An object containing the count of opened in-app web views.
+ * @returns {Promise<void>} A promise that resolves when the in-app message has been displayed, or rejects with an error.
+ *
+ * @example
+ * const data = { campaign_id: 'myCampaign', url: 'https://example.com' };
+ * const openedInAppWebViewCount = { count: 0 };
+ * await showInAppMessage(data, openedInAppWebViewCount);
+ */
+export async function showInAppMessage(data, openedInAppWebViewCount) {
+    if (openedInAppWebViewCount.count > 0) {
+        return;
+    }
+    if (!(data?.url && data?.modal_properties)) {
+        return;
+    }
+    const modalProperties = JSON.parse(data.modal_properties || '{}');
+    const screenWidth = Dimensions.get('window').width;
+    const screenHeight = Dimensions.get('window').height;
+    const webViewProps = _translateWebviewProps(modalProperties, screenWidth, screenHeight);
+    const link = data.url; // default html link for only testing.
+    const injectedJavaScript = `
+        const button_trigger = document.getElementById('notifly-button-trigger');
+        button_trigger.addEventListener('click', function(event){
+            if (!event.notifly_button_click_type) return;
+            window.ReactNativeWebView.postMessage(JSON.stringify({
+                type: event.notifly_button_click_type,
+                button_name: event.notifly_button_name,
+                link: event.notifly_button_click_link,
+            }));
+        });
+    `;
+
+    const webviewMessageHandler = (e) => {
+        const message = JSON.parse(e.nativeEvent.data);
+        if (message.type === 'close') {
+            modal.destroy();
+            openedInAppWebViewCount.count = openedInAppWebViewCount.count - 1;
+            logEvent(
+                'close_button_click',
+                {
+                    type: 'message_event',
+                    channel: 'in-app-message',
+                    button_name: message.button_name,
+                    campaign_id: data.campaign_id,
+                },
+                null,
+                true
+            );
+        } else if (message.type === 'main_button') {
+            logEvent(
+                'main_button_click',
+                {
+                    type: 'message_event',
+                    channel: 'in-app-message',
+                    button_name: message.button_name,
+                    campaign_id: data.campaign_id,
+                },
+                null,
+                true
+            );
+            if (message.link) {
+                modal.destroy();
+                openedInAppWebViewCount.count = openedInAppWebViewCount.count - 1;
+                Linking.openURL(message.link);
+            }
+        } else if (message.type === 'hide_in_app_message') {
+            modal.destroy();
+            openedInAppWebViewCount.count = openedInAppWebViewCount.count - 1;
+            logEvent(
+                'hide_in_app_message_button_click',
+                {
+                    type: 'message_event',
+                    channel: 'in-app-message',
+                    button_name: message.button_name,
+                    campaign_id: data.campaign_id,
+                },
+                null,
+                true
+            );
+            if (modalProperties.template_name) {
+                const key = `hide_in_app_message_${modalProperties.template_name}`;
+                setUserProperties({
+                    [key]: true,
+                });
+            }
+        }
+    };
+
+    openedInAppWebViewCount.count = openedInAppWebViewCount.count + 1;
+    logEvent(
+        'in_app_message_show',
+        { type: 'message_event', channel: 'in-app-message', campaign: data.campaign_id },
+        null,
+        true
+    ); // logging in app messaging delivered
+    const modal = new RootSiblings(
+        (
+            <Modal
+                isVisible={true}
+                transparent={true}
+                onBackdropPress={() => {
+                    openedInAppWebViewCount.count = openedInAppWebViewCount.count - 1;
+                    modal.destroy();
+                }}
+                onBackButtonPress={() => {
+                    openedInAppWebViewCount.count = openedInAppWebViewCount.count - 1;
+                    modal.destroy();
+                }}
+                backdropOpacity={0}
+                style={webViewProps.modalStyle}
+            >
+                <View>
+                    <View style={webViewProps.viewStyle}>
+                        <WebView
+                            originWhitelist={['*']}
+                            source={{
+                                uri: link,
+                            }}
+                            style={{
+                                width: screenWidth,
+                                height: screenHeight,
+                            }}
+                            onMessage={webviewMessageHandler}
+                            javaScriptEnabled={true}
+                            injectedJavaScript={injectedJavaScript}
+                        />
+                    </View>
+                </View>
+            </Modal>
+        )
+    );
+}
+
+function _translateWebviewProps(modalProps, screenWidth, screenHeight) {
+    const modalStyle = {
+        margin: 0,
+        justifyContent: 'center',
+        alignItems: 'center',
+        ...(modalProps?.position === 'bottom' && {
+            position: 'absolute',
+            bottom: 0,
+        }),
+    };
+
+    const viewStyle = {
+        borderTopLeftRadius: modalProps?.borderTopLeftRadius || 0,
+        borderTopRightRadius: modalProps?.borderTopRightRadius || 0,
+        borderBottomLeftRadius: modalProps?.borderBottomLeftRadius || 0,
+        borderBottomRightRadius: modalProps?.borderBottomRightRadius || 0,
+        overflow: 'hidden',
+        width: _getViewWidth(modalProps, screenWidth, screenHeight),
+        height: _getViewHeight(modalProps, screenWidth, screenHeight),
+        justifyContent: 'center',
+        alignItems: 'center',
+    };
+
+    return {
+        modalStyle,
+        viewStyle,
+    };
+}
+
+function _getViewWidth(modalProps, screenWidth, screenHeight) {
+    let viewWidth;
+
+    if (modalProps.width) {
+        viewWidth = modalProps.width;
+    } else if (!screenWidth) {
+        console.error('screenWidth is not defined');
+        viewWidth = '100%';
+    } else if (modalProps.width_vw) {
+        viewWidth = screenWidth * (modalProps.width_vw / 100);
+    } else if (modalProps.width_vh && screenHeight) {
+        viewWidth = screenHeight * (modalProps.width_vh / 100);
+    } else {
+        viewWidth = '100%';
+    }
+
+    if (modalProps.min_width && viewWidth < modalProps.min_width) {
+        viewWidth = modalProps.minWidth;
+    }
+    if (modalProps.max_width && viewWidth > modalProps.max_width) {
+        viewWidth = modalProps.maxWidth;
+    }
+
+    return viewWidth;
+}
+
+function _getViewHeight(modalProps, screenWidth, screenHeight) {
+    let viewHeight;
+
+    if (modalProps.height) {
+        viewHeight = modalProps.height;
+    } else if (!screenHeight) {
+        console.error('screenHeight is not defined');
+        viewHeight = '100%';
+    } else if (modalProps.height_vh) {
+        viewHeight = screenHeight * (modalProps.height_vh / 100);
+    } else if (modalProps.height_vw && screenWidth) {
+        viewHeight = screenWidth * (modalProps.height_vw / 100);
+    } else {
+        viewHeight = '100%';
+    }
+
+    if (modalProps.min_height && viewHeight < modalProps.min_height) {
+        viewHeight = modalProps.min_height;
+    }
+    if (modalProps.max_height && viewHeight > modalProps.max_height) {
+        viewHeight = modalProps.max_height;
+    }
+
+    return viewHeight;
+}

package/src/log_event.js

@@ -0,0 +1,184 @@
+import { Platform } from 'react-native';
+import rnDeviceInfo from 'react-native-device-info';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import messaging from '@react-native-firebase/messaging';
+import { v5 as uuidv5 } from 'uuid';
+import { NAMESPACE, SDK_VERSION } from './constant';
+import { getNotiflyUserId } from './utils';
+import { getCognitoIdToken } from './auth';
+
+const NOTIFLY_LOG_EVENT_URL = 'https://12lnng07q2.execute-api.ap-northeast-2.amazonaws.com/prod/records';
+
+/**
+ * Logs an event to Notifly for the current user.
+ *
+ * @async
+ * @param {string} eventName - The name of the event to log.
+ * @param {Object} eventParams - The parameters to include in the event log.
+ * @param {string[]} [segmentation_event_param_keys=null] - The segmentation event parameter keys.
+ * @param {boolean} [isInternalEvent=false] - A flag indicating whether the event is for Notifly internal use.
+ * @returns {Promise<void>} A promise that resolves when the event has been logged, or rejects with an error.
+ *
+ * @example
+ * await logEvent('button_clicked', { 'button_name': 'myButton' });
+ */
+export default async function logEvent(
+    eventName,
+    eventParams,
+    segmentation_event_param_keys = null,
+    isInternalEvent = false
+) {
+    if (!eventName) {
+        console.warn('[Notifly] eventName must be provided.');
+        return;
+    }
+
+    try {
+        const [
+            cognitoToken,
+            notiflyUserId,
+            externalUserId,
+            prjId,
+            externalDeviceId,
+            osVersion,
+            appVersion,
+            deviceToken,
+        ] = await Promise.all([
+            AsyncStorage.getItem('notiflyCognitoIdToken'),
+            getNotiflyUserId(),
+            AsyncStorage.getItem('notiflyExternalUserId'),
+            AsyncStorage.getItem('notiflyProjectId'),
+            rnDeviceInfo.getUniqueId(),
+            rnDeviceInfo.getSystemVersion(),
+            rnDeviceInfo.getVersion(),
+            messaging().getToken(),
+        ]);
+
+        const eventId = uuidv5(`${notiflyUserId}${eventName}${new Date().valueOf()}`, NAMESPACE.EVENTID).replace(
+            /-/g,
+            ''
+        );
+        const notiflyDeviceId = uuidv5(externalDeviceId, NAMESPACE.DEVICEID).replace(/-/g, '');
+
+        let token = cognitoToken;
+        if (!token) {
+            const [userName, password] = await Promise.all([
+                AsyncStorage.getItem('notiflyUserName'),
+                AsyncStorage.getItem('notiflyUserPassword'),
+            ]);
+            token = await getCognitoIdToken(userName, password);
+            await AsyncStorage.setItem('notiflyCognitoIdToken', token);
+        }
+
+        if (!token || !notiflyUserId || !prjId || !eventId || !externalDeviceId || !notiflyDeviceId || !deviceToken) {
+            const requiredParams = [
+                'token',
+                'notiflyUserId',
+                'prjId',
+                'eventId',
+                'externalDeviceId',
+                'notiflyDeviceId',
+                'deviceToken',
+            ];
+            const missingParam = requiredParams.find((param) => !eval(param));
+            throw new Error(`[Notifly] Missing required parameter in logEvent: ${missingParam}`);
+        }
+
+        const body = _getBodyForLogEvent(
+            notiflyUserId,
+            eventId,
+            eventName,
+            notiflyDeviceId,
+            externalDeviceId,
+            deviceToken,
+            isInternalEvent,
+            segmentation_event_param_keys,
+            prjId,
+            osVersion,
+            appVersion,
+            externalUserId,
+            eventParams
+        );
+        const requestOptions = _getRequestOptionsForLogEvent(token, body);
+
+        const response = await _apiCall(NOTIFLY_LOG_EVENT_URL, requestOptions);
+        const result = JSON.parse(response);
+
+        // If the token is expired, get a new token and retry the logEvent.
+        if (result.message == 'The incoming token has expired') {
+            const [userName, password] = await Promise.all([
+                AsyncStorage.getItem('notiflyUserName'),
+                AsyncStorage.getItem('notiflyUserPassword'),
+            ]);
+            const newToken = await getCognitoIdToken(userName, password);
+            await AsyncStorage.setItem('notiflyCognitoIdToken', newToken);
+            await logEvent(eventName, eventParams, segmentation_event_param_keys, isInternalEvent);
+        }
+    } catch (err) {
+        console.warn('[Notifly] Failed logging the event. Please retry the initialization. ', err);
+    }
+}
+
+async function _apiCall(apiUrl, requestOptions) {
+    const result = fetch(apiUrl, requestOptions).then((response) => response.text());
+    return result;
+}
+
+function _getRequestOptionsForLogEvent(token, body) {
+    const myHeaders = new Headers();
+    myHeaders.append('Authorization', token);
+    myHeaders.append('Content-Type', 'application/json');
+
+    const requestOptions = {
+        method: 'POST',
+        headers: myHeaders,
+        body: body,
+        redirect: 'follow',
+    };
+    return requestOptions;
+}
+
+function _getBodyForLogEvent(
+    notiflyUserId,
+    eventId,
+    eventName,
+    notiflyDeviceId,
+    externalDeviceId,
+    deviceToken,
+    isInternalEvent,
+    segmentation_event_param_keys,
+    prjId,
+    osVersion,
+    appVersion,
+    externalUserId,
+    eventParams
+) {
+    const eventData = JSON.stringify({
+        event_params: eventParams,
+        id: eventId,
+        name: eventName,
+        notifly_user_id: notiflyUserId,
+        time: parseInt(new Date().valueOf() / 1000),
+        notifly_device_id: notiflyDeviceId,
+        external_device_id: externalDeviceId,
+        device_token: deviceToken,
+        is_internal_event: isInternalEvent,
+        segmentation_event_param_keys: segmentation_event_param_keys,
+        project_id: prjId,
+        platform: Platform.OS,
+        os_version: osVersion,
+        app_version: appVersion,
+        sdk_version: SDK_VERSION,
+        external_user_id: externalUserId || undefined,
+    });
+
+    const body = JSON.stringify({
+        'records': [
+            {
+                'data': eventData,
+                'partitionKey': notiflyUserId,
+            },
+        ],
+    });
+    return body;
+}

package/src/user.js

@@ -0,0 +1,51 @@
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { getNotiflyUserId } from './utils';
+import logEvent from './log_event';
+
+/**
+ * Sets user properties for the current user.
+ *
+ * @async
+ * @param {Object} params - An object containing the user properties to set.
+ * @returns {Promise<void>} A promise that resolves when the user properties have been set, or rejects with an error.
+ *
+ * @example
+ * await setUserProperties({ external_user_id: 'myUserID' });
+ */
+export async function setUserProperties(params) {
+    try {
+        if (params.external_user_id) {
+            const [previousNotiflyUserID, previousExternalUserID] = await Promise.all([
+                getNotiflyUserId(),
+                AsyncStorage.getItem('notiflyExternalUserId'),
+            ]);
+            await Promise.all([
+                AsyncStorage.setItem('notiflyExternalUserId', params.external_user_id),
+                AsyncStorage.removeItem('notiflyUserId'),
+            ]);
+            params['previous_notifly_user_id'] = previousNotiflyUserID;
+            params['previous_external_user_id'] = previousExternalUserID;
+        }
+        return await logEvent('set_user_properties', params, null, true);
+    } catch (err) {
+        console.warn('[Notifly] Failed to set user properties');
+    }
+}
+
+/**
+ * Removes the external user ID and Notifly user ID from storage.
+ *
+ * @async
+ * @returns {Promise<void>} A promise that resolves when the user IDs have been removed, or rejects with an error.
+ *
+ * @example
+ * await removeUserId();
+ */
+export async function removeUserId() {
+    try {
+        await Promise.all([AsyncStorage.removeItem('notiflyExternalUserId'), AsyncStorage.removeItem('notiflyUserId')]);
+        return await logEvent('remove_external_user_id', {}, null, true);
+    } catch (err) {
+        console.warn('[Notifly] Failed to remove userID');
+    }
+}

package/src/utils.js

@@ -0,0 +1,114 @@
+import { Platform, Linking } from 'react-native';
+import rnDeviceInfo from 'react-native-device-info';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import messaging from '@react-native-firebase/messaging';
+import { v5 as uuidv5 } from 'uuid';
+import { NAMESPACE } from './constant';
+import logEvent from './log_event';
+
+/**
+ * Gets the Notifly user ID for the current user.
+ *
+ * @async
+ * @returns {Promise<string>} A promise that resolves with the Notifly user ID, or rejects with an error.
+ *
+ * @example
+ * const notiflyUserId = await getNotiflyUserId();
+ */
+export async function getNotiflyUserId() {
+    const encodedUserId = await AsyncStorage.getItem('notiflyUserId');
+    if (encodedUserId) {
+        return encodedUserId;
+    }
+    const [prjId, externalUserId] = await Promise.all([
+        AsyncStorage.getItem('notiflyProjectId'),
+        AsyncStorage.getItem('notiflyExternalUserId'),
+    ]);
+    let notiflyUserId;
+    if (externalUserId) {
+        notiflyUserId = uuidv5(`${prjId}${externalUserId}`, NAMESPACE.REGISTERED_USERID).replace(/-/g, '');
+    } else {
+        notiflyUserId = uuidv5(`${prjId}${await messaging().getToken()}`, NAMESPACE.UNREGISTERED_USERID).replace(
+            /-/g,
+            ''
+        );
+    }
+    return notiflyUserId;
+}
+
+/**
+ * Logs a 'session_start' event with device information.
+ *
+ * @async
+ * @returns {Promise<void>} A promise that resolves when the event is logged, or rejects with an error.
+ *
+ * @example
+ * await sessionStart();
+ */
+export async function sessionStart() {
+    const platform = Platform.OS;
+    const apiLevelPromise = rnDeviceInfo.getApiLevel();
+    const brandPromise = rnDeviceInfo.getBrand();
+    const modelPromise = rnDeviceInfo.getModel();
+    const userAgentPromise = rnDeviceInfo.getUserAgent();
+
+    const [deviceModel, deviceBrand, apiLevel, userAgent] = await Promise.all([
+        modelPromise,
+        brandPromise,
+        apiLevelPromise,
+        userAgentPromise,
+    ]);
+
+    const openAppEventParams = {
+        platform,
+        type: 'session_start_event',
+        device_model: deviceModel,
+        properties: {
+            device_brand: deviceBrand,
+            api_level: apiLevel,
+            user_agent: userAgent,
+        },
+    };
+    await logEvent('session_start', openAppEventParams, null, true);
+}
+
+/**
+ * Handles a click event on a push notification.
+ *
+ * @async
+ * @function
+ * @param {Object} remoteMessage - The remote message object containing the notification data.
+ * @returns {Promise<void>} - A promise that resolves when the click event is handled.
+ *
+ * @example
+ * // Usage:
+ * const remoteMessage = {
+ *     data: {
+ *         link: 'https://example.com',
+ *         campaign_id: '1234'
+ *     }
+ * };
+ * await clickHandler(remoteMessage);
+ */
+export async function clickHandler(remoteMessage) {
+    if (!remoteMessage) {
+        console.warn('[Notifly] clickHandler receives a null remoteMessage.');
+        return;
+    }
+
+    try {
+        const { data: { link, campaign_id } = {} } = remoteMessage;
+
+        if (link) {
+            Linking.openURL(link);
+        }
+        await logEvent(
+            'push_click',
+            { channel: 'push-notification', type: 'message_event', campaign_id, status: 'quit' },
+            null,
+            true
+        );
+    } catch (err) {
+        console.warn('[Notifly] custom click handler registration failed.');
+    }
+}

package/namespace.js

@@ -1,6 +0,0 @@
-export const NAMESPACE = {
-    "EVENTID": "830b5f7b-e392-43db-a17b-d835f0bcab2b",
-    "REGISTERED_USERID": "ce7c62f9-e8ae-4009-8fd6-468e9581fa21",
-    "UNREGISTERED_USERID": "a6446dcf-c057-4de7-a360-56af8659d52f",
-    "DEVICEID": "830848b3-2444-467d-9cd8-3430d2738c57",
-}