@affiliateo/react-native 0.1.0

package/README.md

@@ -0,0 +1,55 @@
+# @affiliateo/react-native
+
+Affiliateo SDK for React Native — mobile affiliate attribution and screen tracking.
+
+## Install
+
+```bash
+npm install @affiliateo/react-native
+```
+
+## Setup
+
+Wrap your app with `AffiliateoProvider`:
+
+```tsx
+import { AffiliateoProvider } from '@affiliateo/react-native';
+
+export default function App() {
+  return (
+    <AffiliateoProvider campaignId="YOUR_CAMPAIGN_ID">
+      <YourApp />
+    </AffiliateoProvider>
+  );
+}
+```
+
+## Track Screens (optional)
+
+```tsx
+import { useAffiliateoScreen } from '@affiliateo/react-native';
+
+function PricingScreen() {
+  useAffiliateoScreen('Pricing');
+  return <View>...</View>;
+}
+```
+
+## Get Affiliate Ref
+
+```tsx
+import { useAffiliateRef } from '@affiliateo/react-native';
+
+function MyComponent() {
+  const { refCode, isMatched, isLoading } = useAffiliateRef();
+  // ...
+}
+```
+
+## How It Works
+
+1. On first app open, the SDK sends a device fingerprint to Affiliateo
+2. Affiliateo matches it against recent affiliate link clicks using IP + device signals
+3. If matched, the SDK auto-sets the `affiliateo_ref` attribute on RevenueCat (if installed)
+4. Screen views are batched and sent every 30s for funnel analytics
+5. Events are persisted offline and flushed when connectivity returns

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@affiliateo/react-native",
+  "version": "0.1.0",
+  "description": "Affiliateo SDK for React Native — mobile affiliate attribution and screen tracking",
+  "main": "src/index.ts",
+  "types": "src/index.ts",
+  "scripts": {
+    "build": "tsc",
+    "typecheck": "tsc --noEmit"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-native": ">=0.70.0"
+  },
+  "peerDependenciesMeta": {
+    "react-native-purchases": {
+      "optional": true
+    }
+  },
+  "keywords": ["affiliateo", "affiliate", "attribution", "react-native", "mobile"],
+  "license": "MIT",
+  "files": ["src"]
+}

package/src/client.ts

@@ -0,0 +1,55 @@
+import type { DeviceInfo, IdentifyResponse, MobileEvent } from './types'
+
+const DEFAULT_API_URL = 'https://affiliateo.com'
+
+export class AffiliateoClient {
+  private apiUrl: string
+
+  constructor(apiUrl?: string) {
+    this.apiUrl = (apiUrl || DEFAULT_API_URL).replace(/\/$/, '')
+  }
+
+  async identify(
+    campaignId: string,
+    deviceId: string,
+    deviceInfo: DeviceInfo
+  ): Promise<IdentifyResponse> {
+    const res = await fetch(`${this.apiUrl}/api/v1/mobile/identify`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        campaign_id: campaignId,
+        device_id: deviceId,
+        ...deviceInfo,
+      }),
+    })
+
+    if (!res.ok) {
+      throw new Error(`Identify failed: ${res.status}`)
+    }
+
+    return res.json()
+  }
+
+  async sendEvents(
+    campaignId: string,
+    deviceId: string,
+    events: MobileEvent[]
+  ): Promise<void> {
+    if (events.length === 0) return
+
+    const res = await fetch(`${this.apiUrl}/api/v1/mobile/event`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        campaign_id: campaignId,
+        device_id: deviceId,
+        events,
+      }),
+    })
+
+    if (!res.ok) {
+      throw new Error(`Event send failed: ${res.status}`)
+    }
+  }
+}

package/src/device.ts

@@ -0,0 +1,25 @@
+import { Platform, Dimensions } from 'react-native'
+import type { DeviceInfo } from './types'
+
+export function getDeviceInfo(): DeviceInfo {
+  const { width, height } = Dimensions.get('window')
+
+  return {
+    device_model: Platform.select({
+      ios: 'iPhone',
+      android: 'Android Device',
+      default: 'Unknown',
+    }) || 'Unknown',
+    os: Platform.OS === 'ios' ? 'iOS' : Platform.OS === 'android' ? 'Android' : Platform.OS,
+    os_version: String(Platform.Version),
+    app_version: '1.0.0', // Override via config if needed
+    screen_width: Math.round(width),
+    screen_height: Math.round(height),
+    timezone: Intl.DateTimeFormat().resolvedOptions().timeZone || 'Unknown',
+    language: Platform.select({
+      ios: 'en',
+      android: 'en',
+      default: 'en',
+    }) || 'en',
+  }
+}

package/src/index.ts

@@ -0,0 +1,8 @@
+export { AffiliateoProvider, useAffiliateRef } from './provider'
+export type {
+  AffiliateoConfig,
+  AffiliateoContextValue,
+  DeviceInfo,
+  IdentifyResponse,
+  MobileEvent,
+} from './types'

package/src/provider.tsx

@@ -0,0 +1,119 @@
+import React, { createContext, useContext, useEffect, useRef, useState } from 'react'
+import { AppState, Platform } from 'react-native'
+import type { AffiliateoConfig, AffiliateoContextValue } from './types'
+import { AffiliateoClient } from './client'
+import { getDeviceInfo } from './device'
+
+// Generate a simple device ID using platform info + random values
+// Persists for the app session, regenerates on reinstall
+let cachedDeviceId: string | null = null
+
+function getDeviceId(): string {
+  if (cachedDeviceId) return cachedDeviceId
+  const random = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
+    const r = (Math.random() * 16) | 0
+    const v = c === 'x' ? r : (r & 0x3) | 0x8
+    return v.toString(16)
+  })
+  cachedDeviceId = `${Platform.OS}-${random}`
+  return cachedDeviceId
+}
+
+export const AffiliateoContext = createContext<AffiliateoContextValue>({
+  refCode: null,
+  isMatched: false,
+  isLoading: true,
+  visitorId: null,
+})
+
+/**
+ * Returns the affiliate ref code and match status.
+ */
+export function useAffiliateRef(): AffiliateoContextValue {
+  return useContext(AffiliateoContext)
+}
+
+export function AffiliateoProvider({
+  campaignId,
+  apiUrl,
+  children,
+}: AffiliateoConfig & { children: React.ReactNode }) {
+  const [state, setState] = useState<AffiliateoContextValue>({
+    refCode: null,
+    isMatched: false,
+    isLoading: true,
+    visitorId: null,
+  })
+
+  const clientRef = useRef(new AffiliateoClient(apiUrl))
+  const deviceIdRef = useRef(getDeviceId())
+
+  useEffect(() => {
+    let cancelled = false
+    const client = clientRef.current
+    const deviceId = deviceIdRef.current
+
+    async function init() {
+      // Send session_start immediately
+      client.sendEvents(campaignId, deviceId, [
+        { type: 'session_start', timestamp: new Date().toISOString() },
+      ]).catch(() => {})
+
+      // Identify
+      try {
+        const deviceInfo = getDeviceInfo()
+        const result = await client.identify(campaignId, deviceId, deviceInfo)
+
+        if (cancelled) return
+
+        setState({
+          refCode: result.ref_code,
+          isMatched: result.matched,
+          isLoading: false,
+          visitorId: result.visitor_id,
+        })
+
+        // Auto-set RevenueCat attribute if available
+        if (result.ref_code) {
+          try {
+            const Purchases = require('react-native-purchases').default
+            if (Purchases?.setAttributes) {
+              await Purchases.setAttributes({ affiliateo_ref: result.ref_code })
+            }
+          } catch {
+            // react-native-purchases not installed — that's fine
+          }
+        }
+      } catch {
+        if (cancelled) return
+        setState((s) => ({ ...s, isLoading: false }))
+      }
+    }
+
+    init()
+
+    // AppState listener — send session events immediately
+    const subscription = AppState.addEventListener('change', (nextState) => {
+      if (nextState === 'active') {
+        client.sendEvents(campaignId, deviceId, [
+          { type: 'session_start', timestamp: new Date().toISOString() },
+        ]).catch(() => {})
+      } else if (nextState === 'background' || nextState === 'inactive') {
+        client.sendEvents(campaignId, deviceId, [
+          { type: 'session_end', timestamp: new Date().toISOString() },
+        ]).catch(() => {})
+      }
+    })
+
+    return () => {
+      cancelled = true
+      subscription.remove()
+    }
+  }, [campaignId, apiUrl])
+
+  return (
+    <AffiliateoContext.Provider value={state}>
+      {children}
+    </AffiliateoContext.Provider>
+  )
+}

package/src/types.ts

@@ -0,0 +1,36 @@
+export interface AffiliateoConfig {
+  campaignId: string
+  /** Base URL for the API. Defaults to https://affiliateo.com */
+  apiUrl?: string
+}
+
+export interface DeviceInfo {
+  device_model: string
+  os: string
+  os_version: string
+  app_version: string
+  screen_width: number
+  screen_height: number
+  timezone: string
+  language: string
+}
+
+export interface IdentifyResponse {
+  visitor_id: string
+  ref_code: string | null
+  matched: boolean
+}
+
+export interface MobileEvent {
+  type: 'screen_view' | 'session_start' | 'session_end' | 'custom'
+  screen?: string
+  timestamp: string
+  metadata?: Record<string, unknown>
+}
+
+export interface AffiliateoContextValue {
+  refCode: string | null
+  isMatched: boolean
+  isLoading: boolean
+  visitorId: string | null
+}