insert-affiliate-react-native-sdk 1.0.0

package/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "insert-affiliate-react-native-sdk",
+  "version": "1.0.0",
+  "description": "A package that will give context having implementation of react-native-branch and react-native-iap and iaptic validate api.",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc"
+  },
+  "keywords": [
+    "react-native",
+    "react-native-branch",
+    "react-native-iap",
+    "iaptic"
+  ],
+  "author": "Haseeb Ahmed",
+  "license": "MIT",
+  "peerDependencies": {
+    "@react-native-async-storage/async-storage": "^2.0.0",
+    "@types/react": "^18.2.6",
+    "axios": "^1.7.7",
+    "react": "^18.3.1",
+    "react-native": "^0.75.3",
+    "react-native-branch": "^6.2.2",
+    "react-native-iap": "^12.15.4",
+    "typescript": "^5.0.4"
+  }
+}

package/readme.md

@@ -0,0 +1,125 @@
+# InsertAffiliateReactNative SDK
+
+## Overview
+
+The **InsertAffiliateReactNative SDK** is designed for React Native applications, providing seamless integration with the [Insert Affiliate platform](https://insertaffiliate.com). This SDK enables functionalities such as managing affiliate links, handling in-app purchases (IAP), and utilising deep links. For more details and to access the Insert Affiliate dashboard, visit [app.insertaffiliate.com](https://app.insertaffiliate.com).
+
+## Features
+
+- **Unique Device Identification**: Generates and stores a short unique device ID to identify users effectively.
+- **Affiliate Identifier Management**: Set and retrieve the affiliate identifier based on user-specific links.
+- **In-App Purchase (IAP) Initialisation**: Easily reinitialise in-app purchases with validation options using the affiliate identifier.
+- **Offer Code Handling**: Fetch offer codes from the Insert Affiliate API and open redeem URLs directly in the App Store.
+
+## Peer Dependencies
+
+Before using this package, ensure you have the following dependencies installed:
+
+- [react-native-iap](https://www.npmjs.com/package/react-native-iap)
+- [react-native-branch](https://www.npmjs.com/package/react-native-branch)
+- [axios](https://www.npmjs.com/package/axios)
+
+## Installation
+
+To integrate the InsertAffiliateReactNative SDK into your project, run:
+
+```bash
+npm install insert-affiliate-react-native-sdk
+```
+
+## Usage
+### Importing the SDK
+Import the provider from the package:
+
+
+```javascript
+import { DeepLinkIapProvider } from 'insert-affiliate-react-native-sdk';
+```
+
+## 1. Integrating the Provider in Your Application (`App.tsx`)
+### Step 1: Wrap Your Application with the Iaptic Provider and Pass Context Properties
+
+- Replace `{{ your_iaptic_app_id }}` with your **Iaptic App ID**. You can find this [here](https://www.iaptic.com/account).
+- Replace `{{ your_iaptic_app_name }}` with your **Iaptic App Name**. You can find this [here](https://www.iaptic.com/account).
+- Replace `{{ your_iaptic_secret_key }}` with your **Iaptic Secret Key**. You can find this [here](https://www.iaptic.com/settings).
+
+Here's the code with placeholders for you to swap out:
+
+```javascript
+const App = () => {
+  return (
+    <DeepLinkIapProvider
+      iapSkus={IAP_SKUS}
+      iapticAppId="{{ your_iaptic_app_id }}"
+      iapticAppName="{{ your_iaptic_app_name }}"
+      iapticAppSecret="{{ your_iaptic_app_id }}">
+      <Child />
+    </DeepLinkIapProvider>
+  );
+};
+```
+
+## 2. When the User Makes a Purchase, Call Our SDK's "handleBuySubscription"
+Here’s a complete example of how to use the SDK:
+
+In the code below, please remember to update your IAP_SKUS with the comma separated list of your in app purchase SKU's.
+
+```javascript
+import React from 'react';
+import { ActivityIndicator, Button, StyleSheet, Text, View } from 'react-native';
+import { DeepLinkIapProvider, useDeepLinkIapProvider } from 'insert-affiliate-react-native-sdk';
+
+const Child = () => {
+  const {
+    referrerLink,
+    subscriptions,
+    iapLoading,
+    handleBuySubscription,
+    userId,
+    userPurchase,
+    isIapticValidated,
+  } = useDeepLinkIapProvider();
+
+  export const IAP_SKUS = Platform.select({
+    android: [''], // Here, put a comma separated list of the In App Purchase SKU's
+    ios: [''], // Here, put a comma separated list of the In App Purchase SKU's
+  }) as string[];
+
+
+  return (
+    <View>
+      {subscriptions.length ? (
+        <Button
+          disabled={iapLoading}
+          title={
+            userPurchase
+              ? `Successfully Purchased`
+              : `Click to Buy (${subscriptions[0].localizedPrice} / ${subscriptions[0].subscriptionPeriodUnitIOS})`
+          }
+          onPress={() => {
+            if (iapLoading) return;
+            if (!userPurchase) handleBuySubscription(subscriptions[0].productId); //
+          }}
+        />
+      ) : null}
+      {iapLoading && <ActivityIndicator size={'small'} color={'black'} />}
+    </View>
+  );
+};
+
+const App = () => {
+  return (
+    // Wrapped application code from the previous step...
+    <DeepLinkIapProvider
+      iapSkus={IAP_SKUS}
+      iapticAppId="IAPTIC_APP_BUNDLE_IDENTIFIER"
+      iapticAppName="IAPTIC_APP_NAME"
+      iapticAppSecret="IAPTIC_APP_SECRET_KEY">
+      <Child />
+    </DeepLinkIapProvider>
+  );
+};
+
+export default App;
+```
+

package/src/DeepLinkIapProvider.tsx

@@ -0,0 +1,367 @@
+import React, { createContext, useEffect, useState } from "react";
+import {
+  Purchase,
+  Subscription,
+  useIAP,
+  requestSubscription,
+  endConnection,
+  withIAPContext,
+} from "react-native-iap";
+import { isPlay } from "react-native-iap/src/internal";
+import branch from "react-native-branch";
+import axios from "axios";
+import AsyncStorage from "@react-native-async-storage/async-storage";
+
+// TYPES USED IN THIS PROVIDER
+type T_DEEPLINK_IAP_PROVIDER = {
+  children: React.ReactNode;
+  iapSkus: string[];
+  iapticAppId: string;
+  iapticAppName: string;
+  iapticAppSecret: string;
+};
+
+type T_DEEPLINK_IAP_CONTEXT = {
+  iapLoading: boolean;
+  alreadyPurchased: boolean;
+  subscriptions: Subscription[];
+  userPurchase: Purchase | null;
+  referrerLink: string;
+  userId: string;
+  isIapticValidated: boolean | undefined;
+  handleBuySubscription: (productId: string, offerToken?: string) => void;
+};
+
+const ASYNC_KEYS = {
+  REFERRER_LINK: "@app_referrer_link",
+  USER_PURCHASE: "@app_user_purchase",
+  USER_ID: "@app_user_id",
+};
+
+// STARTING CONTEXT IMPLEMENTATION
+export const DeepLinkIapContext = createContext<T_DEEPLINK_IAP_CONTEXT>({
+  iapLoading: false,
+  alreadyPurchased: false,
+  isIapticValidated: undefined,
+  subscriptions: [],
+  userPurchase: null,
+  referrerLink: "",
+  userId: "",
+  handleBuySubscription: (productId: string, offerToken?: string) => {},
+});
+
+const DeepLinkIapProvider: React.FC<T_DEEPLINK_IAP_PROVIDER> = ({
+  children,
+  iapSkus,
+  iapticAppId,
+  iapticAppName,
+  iapticAppSecret,
+}) => {
+  // LOCAL STATES
+  const [iapLoading, setIapLoading] = useState<boolean>(false);
+  const [alreadyPurchased, setAlreadyPurchased] = useState<boolean>(false);
+  const [isIapticValidated, setIapticValidated] = useState<boolean | undefined>(
+    undefined
+  );
+  const [userPurchase, setUserPurchase] = useState<Purchase | null>(null);
+  const [referrerLink, setReferrerLink] = useState<string>("");
+  const [userId, setUserId] = useState<string>("");
+
+  const {
+    connected,
+    purchaseHistory,
+    getPurchaseHistory,
+    getSubscriptions,
+    subscriptions,
+    finishTransaction,
+    currentPurchase,
+    currentPurchaseError,
+  } = useIAP();
+
+  // ASYNC FUNCTIONS
+  const saveValueInAsync = async (key: string, value: string) => {
+    await AsyncStorage.setItem(key, value);
+  };
+
+  const getValueFromAsync = async (key: string) => {
+    const response = await AsyncStorage.getItem(key);
+    return response;
+  };
+
+  const clearAsyncStorage = async () => {
+    await AsyncStorage.clear();
+  };
+
+  // EFFECT TO FETCH USER ID AND REF LINK
+  // IF ALREADY EXISTS IN ASYNC STORAGE
+  useEffect(() => {
+    const fetchAsyncEssentials = async () => {
+      try {
+        const uId = await getValueFromAsync(ASYNC_KEYS.USER_ID);
+        const refLink = await getValueFromAsync(ASYNC_KEYS.REFERRER_LINK);
+
+        if (uId && refLink) {
+          setUserId(uId);
+          setReferrerLink(refLink);
+        }
+      } catch (error) {
+        errorLog(`ERROR ~ fetchAsyncEssentials: ${error}`);
+      }
+    };
+
+    fetchAsyncEssentials();
+  }, []);
+
+  //   FUNCTION TO SHOW LOG, ERROR and WARN
+  const errorLog = (message: string, type?: "error" | "warn" | "log") => {
+    switch (type) {
+      case "error":
+        console.error(`ENCOUNTER ERROR ~ ${message}`);
+        break;
+      case "warn":
+        console.warn(`ENCOUNTER WARNING ~ ${message}`);
+        break;
+      default:
+        console.log(`LOGGING ~ ${message}`);
+        break;
+    }
+  };
+
+  //   GENERATING UNIQUE USER ID
+  const generateUserID = () => {
+    const characters =
+      "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+    let uniqueId = "";
+    for (let i = 0; i < 6; i++) {
+      const randomIndex = Math.floor(Math.random() * characters.length);
+      uniqueId += characters[randomIndex];
+    }
+    return uniqueId;
+  };
+
+  //   BRANCH IMPLEMENTATION
+  useEffect(() => {
+    const branchSubscription = branch.subscribe(async ({ error, params }) => {
+      if (error) {
+        errorLog(`branchSubscription: ${JSON.stringify(error)}`, "error");
+        return;
+      } else if (!params) {
+        errorLog(`branchSubscription: params does not exits`, "warn");
+        return;
+      } else if (!params["+clicked_branch_link"]) {
+        errorLog(`branchSubscription: Not a branch link`, "warn");
+        return;
+      } else {
+        if (params["~referring_link"]) {
+          setReferrerLink(params["~referring_link"]);
+          const userId = generateUserID();
+          setUserId(userId);
+          await saveValueInAsync(ASYNC_KEYS.USER_ID, userId);
+          await saveValueInAsync(
+            ASYNC_KEYS.REFERRER_LINK,
+            params["~referring_link"]
+          );
+        } else
+          errorLog(
+            `branchSubscription: Params does't have referring_link`,
+            "warn"
+          );
+      }
+    });
+    return () => {
+      if (branchSubscription) {
+        branchSubscription();
+      }
+    };
+  }, []);
+
+  //   IN APP PURCHASE IMPLEMENTATION STARTS
+
+  /**
+   * This function is responsisble to
+   * fetch the subscriptions
+   */
+  const handleGetSubscriptions = async () => {
+    try {
+      await getSubscriptions({ skus: iapSkus });
+    } catch (error) {
+      errorLog(`handleGetSubscriptions: ${error}`, "error");
+    }
+  };
+
+  /**
+   * This function is responsible to
+   * fetch the purchase history
+   */
+  const handleGetPurchaseHistory = async () => {
+    try {
+      await getPurchaseHistory();
+      if (purchaseHistory.length > 0) {
+        setAlreadyPurchased(true);
+        setUserPurchase(currentPurchase ? currentPurchase : null);
+      }
+    } catch (error) {
+      errorLog(`handleGetPurchaseHistory: ${error}`, "error");
+    }
+  };
+
+  //   Effect to fetch IAP subscriptions + purchase history
+  useEffect(() => {
+    const fetchIapEssentials = async () => {
+      try {
+        await handleGetSubscriptions();
+        await handleGetPurchaseHistory();
+      } catch (error) {
+        errorLog(`fetchIapEssentials: ${error}`);
+      }
+    };
+
+    if (connected) fetchIapEssentials();
+  }, [connected]);
+
+  const handlePurchaseValidation = async (jsonIapPurchase: Purchase) => {
+    try {
+      if (!userId || !referrerLink) {
+        errorLog(
+          `WANR ~ handlePurchaseValidation: No Referrer Link or User ID for validation`
+        );
+
+        await axios({
+          url: `https://validator.iaptic.com/v1/validate`,
+          method: "POST",
+          headers: {
+            Authorization: `Basic ${btoa(iapticAppName + ":" + iapticAppSecret)}`,
+          },
+          data: {
+            id: iapticAppId,
+            type: "application",
+            transaction: {
+              id: iapticAppId,
+              type: "ios-appstore",
+              appStoreReceipt: jsonIapPurchase.transactionReceipt,
+            },
+          },
+        });
+        setIapticValidated(true);
+      } else {
+        await axios({
+          url: `https://validator.iaptic.com/v1/validate`,
+          method: "POST",
+          headers: {
+            Authorization: `Basic ${btoa(iapticAppName + ":" + iapticAppSecret)}`,
+          },
+          data: {
+            id: iapticAppId,
+            type: "application",
+            transaction: {
+              id: iapticAppId,
+              type: "ios-appstore",
+              appStoreReceipt: jsonIapPurchase.transactionReceipt,
+            },
+            additionalData: {
+              applicationUsername: `${referrerLink}/${userId}`,
+            },
+          },
+        });
+      }
+    } catch (error) {
+      errorLog(`handlePurchaseValidation: ${error}`, "error");
+      setIapticValidated(false);
+    }
+  };
+
+  useEffect(() => {
+    const checkCurrentPurchase = async () => {
+      try {
+        if (currentPurchase?.productId) {
+          setUserPurchase(currentPurchase);
+
+          await handlePurchaseValidation(currentPurchase);
+
+          await finishTransaction({
+            purchase: currentPurchase,
+            isConsumable: true,
+          });
+
+          await saveValueInAsync(
+            ASYNC_KEYS.USER_PURCHASE,
+            JSON.stringify(currentPurchase)
+          );
+          setIapLoading(false);
+        }
+      } catch (error) {
+        setIapLoading(false);
+        errorLog(`checkCurrentPurchase: ${error}`, "error");
+      }
+    };
+
+    checkCurrentPurchase();
+  }, [currentPurchase, finishTransaction]);
+
+  useEffect(() => {
+    const checkCurrentPurchaseError = async () => {
+      if (currentPurchaseError) {
+        setIapLoading(false);
+        errorLog(
+          `checkCurrentPurchaseError: ${currentPurchaseError.message}`,
+          "error"
+        );
+      }
+    };
+    checkCurrentPurchaseError();
+  }, [currentPurchaseError]);
+
+  /**
+   * Function is responsible to
+   * buy a subscription
+   * @param {string} productId
+   * @param {string} [offerToken]
+   */
+  const handleBuySubscription = async (
+    productId: string,
+    offerToken?: string
+  ) => {
+    if (isPlay && !offerToken) {
+      console.warn(
+        `There are no subscription Offers for selected product (Only requiered for Google Play purchases): ${productId}`
+      );
+    }
+    try {
+      setIapLoading(true);
+      await requestSubscription({
+        sku: productId,
+        ...(offerToken && {
+          subscriptionOffers: [{ sku: productId, offerToken }],
+        }),
+      });
+    } catch (error) {
+      setIapLoading(false);
+      errorLog(`handleBuySubscription: ${error}`, "error");
+    }
+  };
+
+  useEffect(() => {
+    return () => {
+      endConnection();
+    };
+  }, []);
+
+  return (
+    <DeepLinkIapContext.Provider
+      value={{
+        iapLoading,
+        alreadyPurchased,
+        isIapticValidated,
+        subscriptions,
+        userPurchase,
+        referrerLink,
+        userId,
+        handleBuySubscription,
+      }}
+    >
+      {children}
+    </DeepLinkIapContext.Provider>
+  );
+};
+
+export default withIAPContext(DeepLinkIapProvider);

package/src/index.ts

@@ -0,0 +1,4 @@
+import DeepLinkIapProvider from "./DeepLinkIapProvider";
+import useDeepLinkIapProvider from "./useDeepLinkIapProvider";
+
+export { DeepLinkIapProvider, useDeepLinkIapProvider };

package/src/useDeepLinkIapProvider.tsx

@@ -0,0 +1,28 @@
+import { useContext } from "react";
+import { DeepLinkIapContext } from "./DeepLinkIapProvider";
+
+const useDeepLinkIapProvider = () => {
+  const {
+    alreadyPurchased,
+    handleBuySubscription,
+    iapLoading,
+    referrerLink,
+    isIapticValidated,
+    subscriptions,
+    userId,
+    userPurchase,
+  } = useContext(DeepLinkIapContext);
+
+  return {
+    alreadyPurchased,
+    handleBuySubscription,
+    iapLoading,
+    referrerLink,
+    subscriptions,
+    userId,
+    isIapticValidated,
+    userPurchase,
+  };
+};
+
+export default useDeepLinkIapProvider;

package/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ES6",
+    "module": "commonjs",
+    "outDir": "dist",
+    "declaration": true,
+    "declarationDir": "dist",
+    "sourceMap": true,
+    "strict": true,
+    "esModuleInterop": true,
+    "jsx": "react-native",
+    "lib": ["esnext", "dom"]
+  },
+  "include": ["src/**/*"]
+}