React Native Usage

How to use the Linkrunner SDK in your React Native app

Using the React Native SDK

This guide will help you implement Linkrunner functionality in your React Native application.

Initialization

To initialize the Linkrunner SDK, add this code to your App.tsx component:

You can find your project token here.

import linkrunner from "rn-linkrunner";

// Inside your React component
useEffect(() => {
    init();
}, []); // Empty dependency array ensures it runs only once

const init = async () => {
    const initData = await linkrunner.init("YOUR_PROJECT_TOKEN");
    console.log("Linkrunner initialized:", initData);
};

Response from linkrunner.init

The initialization method returns useful data including:

{
    ip_location_data: {
        ip: string;
        city: string;
        countryLong: string;
        countryShort: string;
        latitude: number;
        longitude: number;
        region: string;
        timeZone: string;
        zipCode: string;
    }
    deeplink: string;
    root_domain: boolean;
    campaign_data: {
        id: string;
        name: string;
        type: "ORGANIC" | "INORGANIC";
        ad_network: "META" | "GOOGLE" | null;
        group_name: string | null;
        asset_group_name: string | null;
        asset_name: string | null;
    }
}

User Registration

Call the signup method once after the user has completed your app’s onboarding process:

It is strongly recommended to use the integrated platform’s identify function to set a persistent user_id once it becomes available (typically after signup or login).

• Mixpanel - ID Management & User Identification
• PostHog - How User Identification Works
• Amplitude - Identify Users Documentation

If the platform’s identifier function is not called, you must provide a user identifier for Mixpanel, PostHog, and Amplitude integration.

• mixpanel_distinct_id for Mixpanel
• posthog_distinct_id for PostHog
• amplitude_device_id for Amplitude

const onSignup = async () => {
    const result = await linkrunner.signup({
        user_data: {
            id: "123", // Required: User ID
            name: "John Doe", // Optional
            phone: "9876543210", // Optional
            email: "[e-mail]", // Optional
            // These properties are used to track reinstalls
            user_created_at: "2024-01-01T00:00:00Z", // Optional
            is_first_time_user: true, // Optional
            mixpanel_distinct_id: "mixpanel_distinct_id", // Optional - Mixpanel Distinct ID
            amplitude_device_id: "amplitude_device_id", // Optional - Amplitude User ID
            posthog_distinct_id: "posthog_distinct_id", // Optional - PostHog Distinct ID
        },
        data: {}, // Optional: Any additional data
    });
};

Setting User Data

Call setUserData each time the app opens and the user is logged in:

const setUserData = async () => {
    await linkrunner.setUserData({
        user_data: {
            id: "123", // Required: User ID
            name: "John Doe", // Optional
            phone: "9876543210", // Optional
            email: "[e-mail]", // Optional
            mixpanel_distinct_id: "mixpanel_distinct_id", // Optional - Mixpanel Distinct ID
            amplitude_device_id: "amplitude_device_id", // Optional - Amplitude User ID
            posthog_distinct_id: "posthog_distinct_id", // Optional - PostHog Distinct ID
        },
    });
};

Handling Deferred Deep Links

triggerDeeplink is an optional function which has to be called once after the user onboards and the main stack is ready for navigation. This function handles deferred deep links (links that led to app installation):

const triggerDeeplink = async () => {
    linkrunner.triggerDeeplink();
};

// Call this in your app after navigation is ready
useEffect(() => {
    if (navigationIsReady) {
        triggerDeeplink();
    }
}, [navigationIsReady]);

Tracking Custom Events

Track custom events in your app:

const trackEvent = async () => {
    await linkrunner.trackEvent(
        "purchase_initiated", // Event name
        { product_id: "12345", category: "electronics" } // Optional: Event data
    );
};

Revenue Tracking

Capture Payment

Use this method to capture payment information:

const capturePayment = async () => {
    await linkrunner.capturePayment({
        amount: 100, // Payment amount
        userId: "user123", // User identifier
        paymentId: "payment456", // Optional: Unique payment identifier
        type: "FIRST_PAYMENT", // Optional: Payment type
        status: "PAYMENT_COMPLETED", // Optional: Payment status
    });
};

Parameters for linkrunner.capturePayment

• amount: number (required) - The payment amount
• userId: string (required) - Identifier for the user making the payment
• paymentId: string (optional) - Unique identifier for the payment
• type: string (optional) - Type of payment. Available options:
  • FIRST_PAYMENT - First payment made by the user
  • WALLET_TOPUP - Adding funds to a wallet
  • FUNDS_WITHDRAWAL - Withdrawing funds
  • SUBSCRIPTION_CREATED - New subscription created
  • SUBSCRIPTION_RENEWED - Subscription renewal
  • ONE_TIME - One-time payment
  • RECURRING - Recurring payment
  • DEFAULT - Default type (used if not specified)
• status: string (optional) - Status of the payment. Available options:
  • PAYMENT_INITIATED - Payment has been initiated
  • PAYMENT_COMPLETED - Payment completed successfully (default if not specified)
  • PAYMENT_FAILED - Payment attempt failed
  • PAYMENT_CANCELLED - Payment was cancelled

Removing Payments

Remove payment records (for refunds or cancellations):

const removePayment = async () => {
    await linkrunner.removePayment({
        userId: "user123", // User identifier
        paymentId: "payment456", // Optional: Unique payment identifier
    });
};

Parameters for Linkrunner.removePayment

• userId: String (required) - Identifier for the user whose payment is being removed
• paymentId: String (optional) - Unique identifier for the payment to be removed

Note: Either paymentId or userId must be provided when calling removePayment. If only userId is provided, all payments for that user will be removed.

Function Placement Guide

Function	Where to Place	When to Call
linkrunner.init	App.tsx within useEffect	Once when app starts
linkrunner.signup	Onboarding flow	Once after user completes onboarding
linkrunner.setUserData	Authentication logic	Every time app opens with logged-in user
linkrunner.triggerDeeplink	After navigation init	Once after navigation is ready
linkrunner.trackEvent	Throughout app	When specific user actions occur
linkrunner.capturePayment	Payment processing	When user makes a payment
linkrunner.removePayment	Refund flow	When payment needs to be removed

Support

If you encounter issues during integration, contact us at [e-mail].