react-native-fpay 0.1.1

package/src/engine/FPEngine.ts

@@ -0,0 +1,370 @@
+// FPay SDK — FPEngine
+// Orchestrates BLEReceiverService, BLESenderService, proximity, and the event bus.
+// This replaces AlwaysOnPaymentListener entirely — all its logic lives here.
+
+import { AppState, type AppStateStatus, Vibration, Platform } from 'react-native';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import Geolocation from '@react-native-community/geolocation';
+import { initClient } from '../core/api/client';
+import { proximityAPI, walletAPI } from '../core/api';
+import type {
+  FPUserInfo, 
+  FPSDKOptions, 
+  FPCallbacks, 
+  FPBluetoothPaymentRequest,
+  FPVirtualAccount, 
+  FPGenerateAccountRequest, 
+  FPError,
+  FintechDevice,
+} from '../core/types';
+import BLEReceiverService, { type BLEPaymentRequest, type BLEPaymentResponse } from './BLEReceiverService';
+import BLESenderService, { type BLESendPaymentRequest, type BLESendPaymentResponse } from './BLESenderService';
+
+// ── Module-level singleton state ──────────────────────────────
+let _apiKey: string | null = null;
+let _user: FPUserInfo | null = null;
+let _callbacks: FPCallbacks = {};
+let _options: FPSDKOptions = {};
+let _isReady = false;
+let _isListening = false;
+let _proximitySessionId: string | null = null;
+let _proximityInterval: ReturnType<typeof setInterval> | null = null;
+let _appStateSub: ReturnType<typeof AppState.addEventListener> | null = null;
+
+// ── Internal event bus ────────────────────────────────────────
+// Used to communicate between FPEngine and the UI layer
+// without any React coupling.
+
+type FPEventName = 'incoming_payment_request' | 'show_send' | 'show_receive';
+const _listeners = new Map<FPEventName, Set<Function>>();
+
+export function _emitEvent(event: FPEventName, data?: unknown): void {
+  _listeners.get(event)?.forEach(fn => fn(data));
+}
+
+export function _onEvent(event: FPEventName, fn: Function): () => void {
+  if (!_listeners.has(event)) _listeners.set(event, new Set());
+  _listeners.get(event)!.add(fn);
+  return () => _listeners.get(event)?.delete(fn);
+}
+
+// ── Proximity helpers ─────────────────────────────────────────
+
+function _clearProximityInterval(): void {
+  if (_proximityInterval) { clearInterval(_proximityInterval); _proximityInterval = null; }
+}
+
+function _getLocation(): Promise<{ lat: number; lng: number }> {
+  return new Promise((resolve, reject) => {
+    Geolocation.getCurrentPosition(
+      p => resolve({ lat: p.coords.latitude, lng: p.coords.longitude }),
+      e => reject({ code: 'LOCATION_DENIED', message: e.message } as FPError),
+      { enableHighAccuracy: true, timeout: 8000, maximumAge: 10000 }
+    );
+  });
+}
+
+async function _startProximityBroadcast(): Promise<void> {
+  if (!_user) return;
+  try {
+    const loc = await _getLocation();
+    const session = await proximityAPI.broadcast({
+      latitude: loc.lat, longitude: loc.lng,
+      accountName:   _user.accountName,
+      accountNumber: _user.accountNumber,
+      bankCode:      _user.bankCode,
+      bankName:      _user.bankName,
+    });
+    _proximitySessionId = session.sessionId;
+    _clearProximityInterval();
+    _proximityInterval = setInterval(async () => {
+      if (!_proximitySessionId) return;
+      try {
+        const l = await _getLocation();
+        await proximityAPI.heartbeat(_proximitySessionId, l.lat, l.lng);
+      } catch { /* silent — heartbeat failure is non-fatal */ }
+    }, 15000);
+    console.log('[FPay Engine] Proximity broadcast active');
+  } catch (err) {
+    // Non-fatal — app still works without proximity
+    console.warn('[FPay Engine] Proximity unavailable:', (err as FPError).message);
+  }
+}
+
+async function _stopProximityBroadcast(): Promise<void> {
+  _clearProximityInterval();
+  if (_proximitySessionId) {
+    await proximityAPI.unregister(_proximitySessionId).catch(() => {});
+    _proximitySessionId = null;
+  }
+}
+
+// ── Security validation ───────────────────────────────────────
+// Ported from AlwaysOnPaymentListener.validatePaymentRequest()
+
+async function _validateRequest(req: BLEPaymentRequest): Promise<boolean> {
+  // 1. Age check — reject requests older than 5 minutes
+  const AGE_LIMIT = 5 * 60 * 1000;
+  if (Date.now() - req.timestamp > AGE_LIMIT) {
+    console.log('[FPay Engine] Rejected: request expired');
+    return false;
+  }
+
+  // 2. Blocked sender check
+  try {
+    const raw = await AsyncStorage.getItem('@fp_blocked_users');
+    const blocked: string[] = raw ? JSON.parse(raw) : [];
+    if (blocked.includes(req.senderId)) {
+      console.log('[FPay Engine] Rejected: sender is blocked');
+      return false;
+    }
+  } catch {}
+
+  // 3. Amount sanity (must be positive; max 10,000,000 kobo = NGN 100,000)
+  if (req.amount <= 0 || req.amount > 10000000) {
+    console.log('[FPay Engine] Rejected: invalid amount', req.amount);
+    return false;
+  }
+
+  // 4. Duplicate detection — prevents replay attacks
+  try {
+    const raw = await AsyncStorage.getItem('@fp_recent_requests');
+    const recent: BLEPaymentRequest[] = raw ? JSON.parse(raw) : [];
+    const isDuplicate = recent.some(r =>
+      r.senderId === req.senderId &&
+      r.amount   === req.amount &&
+      Math.abs(r.timestamp - req.timestamp) < 60000 // within 1 minute
+    );
+    // Store and trim to last 50
+    await AsyncStorage.setItem(
+      '@fp_recent_requests',
+      JSON.stringify([...recent, req].slice(-50))
+    );
+    if (isDuplicate) {
+      console.log('[FPay Engine] Rejected: duplicate request');
+      return false;
+    }
+  } catch {}
+
+  return true;
+}
+
+// ── Incoming BLE payment request handler ─────────────────────
+// This is the core of AlwaysOnPaymentListener.handleIncomingPaymentRequest()
+// It fires automatically when BLEReceiverService receives a write event.
+
+async function _handleIncomingRequest(req: BLEPaymentRequest, deviceId: string): Promise<void> {
+  console.log('[FPay Engine] Incoming payment request from:', req.senderName, req.currency + req.amount);
+
+  const isValid = await _validateRequest(req);
+  if (!isValid) {
+    // Auto-decline invalid requests silently
+    await BLEReceiverService.sendPaymentResponse({ accepted: false, timestamp: Date.now() }).catch(() => {});
+    return;
+  }
+
+  // Vibrate to alert user — same pattern as your original code
+  Vibration.vibrate([0, 200, 100, 200]);
+
+  // Map BLEPaymentRequest → FPBluetoothPaymentRequest (the SDK's public type)
+  const fpRequest: FPBluetoothPaymentRequest = {
+    requestId: req.senderId + '_' + req.timestamp,
+    sender: {
+      accountName: req.senderName,
+      deviceId,
+      deviceName: req.senderName,
+    },
+    amount:    req.amount,
+    currency:  req.currency,
+    timestamp: new Date(req.timestamp).toISOString(),
+  };
+
+  // 1. Fire host app callback (optional — host may want to log, update state, etc.)
+  _callbacks.onPaymentRequest?.(fpRequest);
+
+  // 2. Fire internal event → FPPaymentRequestModal will render the Accept/Decline UI
+  _emitEvent('incoming_payment_request', fpRequest);
+}
+
+// ── FPEngine public API ───────────────────────────────────────
+
+export const FPEngine = {
+
+  // Called by pay.initializeSDK()
+  // Mirrors AlwaysOnPaymentListener.initializeAlwaysOnService()
+  async initialize(
+    apiKey: string,
+    user: FPUserInfo,
+    options: FPSDKOptions = {},
+    callbacks: FPCallbacks = {}
+  ): Promise<void> {
+    _apiKey    = apiKey;
+    _user      = user;
+    _options   = options;
+    _callbacks = callbacks;
+
+    // Boot the HTTP client
+    initClient(apiKey, { baseUrl: options.baseUrl, environment: options.environment });
+
+    // Initialize BLE receiver with this user's info
+    const displayName = options.bluetoothDisplayName ?? user.accountName;
+    await BLEReceiverService.initializeWithUserInfo(
+      user.userId ?? user.accountNumber,
+      displayName,
+      'FountainPay'
+    );
+
+    // Start BLE advertising + proximity broadcast in parallel.
+    // Both are non-fatal — SDK still works if either fails.
+    await Promise.allSettled([
+      BLEReceiverService.startAdvertising(),
+      _startProximityBroadcast(),
+    ]);
+
+    // Initialize BLE sender (central) — used when user sends payments via BT
+    await BLESenderService.initialize().catch(err =>
+      console.warn('[FPay Engine] BLE sender init failed (non-fatal):', err)
+    );
+
+    // Resume broadcasting when app returns to foreground
+    _appStateSub = AppState.addEventListener('change', (next: AppStateStatus) => {
+      if (next === 'active' && _isReady) {
+        _startProximityBroadcast();
+        BLEReceiverService.startAdvertising().catch(() => {});
+      } else if (next === 'background') {
+        _clearProximityInterval();
+      }
+    });
+
+    _isReady = true;
+    console.log('[FPay Engine] Initialized. Advertising as:', displayName);
+  },
+
+  async deviceConnection (deviceId: string): Promise<void>{
+    await BLESenderService.connectToDevice(deviceId);
+  },
+
+  // Called by pay.listen()
+  // Registers the BLE write callback — same as your:
+  //   BLEReceiverService.listenForPaymentRequests(handleIncomingPaymentRequest)
+  startListening(): void {
+    if (_isListening) return;
+    _isListening = true;
+    BLEReceiverService.listenForPaymentRequests(_handleIncomingRequest);
+    console.log('[FPay Engine] Listening for BLE payment requests');
+  },
+
+  stopListening(): void {
+    _isListening = false;
+    // Replace with a no-op so the peripheral write handler doesn't crash
+    BLEReceiverService.listenForPaymentRequests(() => {});
+  },
+
+  // Called by FPPaymentRequestModal when user taps "Accept"
+  // Mirrors AlwaysOnPaymentListener.handleAcceptPayment()
+  async acceptPaymentRequest(request: FPBluetoothPaymentRequest): Promise<void> {
+    try {
+      const transactionId = 'txn_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);
+
+      // Build response — same shape as your original:
+      // { accepted, transactionId, timestamp, accountDetails, requestTimestamp }
+      const response: BLEPaymentResponse = {
+        accepted: true,
+        transactionId,
+        timestamp: Date.now(),
+        accountDetails: _user ? {
+          accountName:   _user.accountName,
+          accountNumber: _user.accountNumber,
+          bankName:      _user.bankName,
+          bankCode:      _user.bankCode,
+        } : undefined,
+        // requestTimestamp is echoed back so the sender's polling can match it
+        requestTimestamp: new Date(request.timestamp).getTime(),
+      };
+
+      // Write response to the BLE characteristic — sender is polling this
+      await BLEReceiverService.sendPaymentResponse(response);
+      console.log('[FPay Engine] Acceptance response sent to sender');
+
+      // Notify host app
+      const tx = {
+        id:        transactionId,
+        reference: transactionId,
+        type:      'credit' as const,
+        channel:   'bluetooth' as const,
+        amount:    request.amount,
+        currency:  request.currency,
+        status:    'successful' as const,
+        sender:    request.sender,
+        createdAt: new Date().toISOString(),
+      };
+      _callbacks.onPaymentReceived?.(tx);
+    } catch (err) {
+      _callbacks.onError?.(err as FPError);
+    }
+  },
+
+  // Called by FPPaymentRequestModal when user taps "Decline"
+  // Mirrors AlwaysOnPaymentListener.handleDeclinePayment()
+  async declinePaymentRequest(request: FPBluetoothPaymentRequest): Promise<void> {
+    try {
+      await BLEReceiverService.sendPaymentResponse({ accepted: false, timestamp: Date.now() });
+      console.log('[FPay Engine] Decline response sent to sender');
+    } catch {
+      // Non-fatal — decline even if response send fails
+    }
+    _callbacks.onPaymentDeclined?.(request);
+  },
+
+  // ── Used by BluetoothSubScreen (Send side) ─────────────────
+
+  // Scan for nearby FPay BLE devices
+  async scanForBluetoothDevices(
+    onDeviceFound: (device: FintechDevice) => void,
+    durationMs = 7000
+  ): Promise<void> {
+    return BLESenderService.scanForDevices(onDeviceFound, durationMs);
+  },
+
+  // Send a BLE payment request to a discovered device.
+  // Returns the response which contains the receiver's accountDetails
+  // if accepted — the calling screen then calls transferAPI to move the money.
+  async sendBluetoothPaymentRequest(
+    deviceId: string,
+    request: BLESendPaymentRequest
+  ): Promise<BLESendPaymentResponse> {
+    return BLESenderService.sendPaymentRequest(deviceId, request);
+  },
+
+  // ── Other SDK actions ──────────────────────────────────────
+
+  async generateAccount(req: FPGenerateAccountRequest): Promise<FPVirtualAccount> {
+    return walletAPI.generate(req);
+  },
+
+  showSend(amount: number, currency: string): void {
+    _emitEvent('show_send', { amount, currency });
+  },
+
+  showReceive(amount?: number, currency?: string): void {
+    _emitEvent('show_receive', { amount, currency });
+  },
+
+  getUser:      () => _user,
+  isReady:      () => _isReady,
+  getCallbacks: () => _callbacks,
+
+  async destroy(): Promise<void> {
+    _clearProximityInterval();
+    await _stopProximityBroadcast();
+    await BLEReceiverService.stopAdvertising();
+    BLESenderService.destroy();
+    _isListening = false;
+    _appStateSub?.remove();
+    _isReady = false;
+    _user = null;
+    _proximitySessionId = null;
+    _listeners.clear();
+    console.log('[FPay Engine] Destroyed');
+  },
+};

package/src/engine/NearbyUsersService.ts

@@ -0,0 +1,106 @@
+// NearbyUsersService.ts
+import Geolocation from '@react-native-community/geolocation';
+
+interface NearbyUser {
+  userId: string;
+  userName: string;
+  distance: number; // meters
+  lastSeen: number; // timestamp
+}
+
+class NearbyUsersService {
+  private locationUpdateInterval: any;
+  private readonly API_URL = 'https://api.tapit.app/v1/near-by-users';
+
+  // Start broadcasting your location
+  async startBroadcasting() {
+    // Update location every 5 seconds
+    this.locationUpdateInterval = setInterval(() => {
+      this.sendLocationToServer();
+    }, 5000);
+  }
+
+  private async sendLocationToServer() {
+    Geolocation.getCurrentPosition(
+      async (position) => {
+        const { latitude, longitude } = position.coords;
+        
+        const authToken = await this.getAuthToken();
+        
+        await fetch(`${this.API_URL}/api/users/location`, {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'Authorization': `Bearer ${authToken}`,
+          },
+          body: JSON.stringify({
+            latitude,
+            longitude,
+            timestamp: Date.now(),
+          }),
+        });
+      },
+      (error) => console.error('Location error:', error),
+      { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
+    );
+  }
+
+  // Get list of nearby users from server
+  async getNearbyUsers(): Promise<NearbyUser[]> {
+    const authToken = await this.getAuthToken();
+    
+    const response = await fetch(`${this.API_URL}/api/users/nearby?radius=50`, {
+      headers: {
+        'Authorization': `Bearer ${authToken}`,
+      },
+    });
+
+    if (!response.ok) {
+      throw new Error('Failed to get nearby users');
+    }
+
+    return response.json();
+  }
+
+  // Send payment request through server
+  async sendPaymentRequest(
+    receiverId: string,
+    amount: number,
+    currency: string = 'USD'
+  ) {
+    const authToken = await this.getAuthToken();
+    
+    const response = await fetch(`${this.API_URL}/api/payments/request`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${authToken}`,
+      },
+      body: JSON.stringify({
+        receiverId,
+        amount,
+        currency,
+        timestamp: Date.now(),
+      }),
+    });
+
+    if (!response.ok) {
+      throw new Error('Failed to send payment request');
+    }
+
+    return response.json();
+  }
+
+  stopBroadcasting() {
+    if (this.locationUpdateInterval) {
+      clearInterval(this.locationUpdateInterval);
+    }
+  }
+
+  private async getAuthToken(): Promise<string> {
+    // Get from your auth system
+    return 'your_jwt_token';
+  }
+}
+
+export default new NearbyUsersService();

package/src/index.ts

@@ -0,0 +1,30 @@
+// ─────────────────────────────────────────────
+// react-native-fountainpay-sdk
+// Public API — this is everything the host app
+// needs to import. Nothing else.
+// ─────────────────────────────────────────────
+
+// The one hook
+export { useFountainPay }       from './useFountainPay';
+
+// The one provider (mount at app root)
+export { FountainPayProvider }  from './FountainPayProvider';
+
+// All TypeScript types (for type-safe usage)
+export type {
+  FPInstance,
+  FPUserInfo,
+  FPSDKOptions,
+  FPCallbacks,
+  FPCurrency,
+  FPTransaction,
+  FPVirtualAccount,
+  FPGenerateAccountRequest,
+  FPBluetoothPaymentRequest,
+  FPProximityPeer,
+  FPNQRData,
+  FPBankItem,
+  FPError,
+  FPTxStatus,
+  FPChannel,
+} from './core/types';

package/src/ui/components/FPButton.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+import { TouchableOpacity, Text, ActivityIndicator, StyleSheet, type ViewStyle } from 'react-native';
+import { C, R, F } from '../theme';
+
+interface Props {
+  label: string;
+  onPress: () => void;
+  variant?: 'primary' | 'outline' | 'ghost' | 'danger';
+  loading?: boolean;
+  disabled?: boolean;
+  style?: ViewStyle;
+}
+
+export function FPButton({ label, onPress, variant = 'primary', loading, disabled, style }: Props) {
+  return (
+    <TouchableOpacity
+      style={[styles.base, styles[variant], (disabled || loading) && styles.disabled, style]}
+      onPress={onPress}
+      disabled={disabled || loading}
+      activeOpacity={0.75}
+    >
+      {loading
+        ? <ActivityIndicator color={variant === 'primary' || variant === 'danger' ? C.white : C.ink} size="small" />
+        : <Text style={[styles.label, styles[variant + 'Label' as keyof typeof styles]]}>{label}</Text>
+      }
+    </TouchableOpacity>
+  );
+}
+
+const styles = StyleSheet.create({
+  base: { height: 52, borderRadius: R.md, alignItems: 'center', justifyContent: 'center', paddingHorizontal: 20 },
+  primary: { backgroundColor: C.brand },
+  outline: { backgroundColor: 'transparent', borderWidth: 1.5, borderColor: C.brand },
+  ghost: { backgroundColor: 'transparent' },
+  danger: { backgroundColor: C.red },
+  disabled: { opacity: 0.45 },
+  label: { fontSize: F.md, fontWeight: '700' },
+  primaryLabel: { color: C.white },
+  outlineLabel: { color: C.brand },
+  ghostLabel: { color: C.ink },
+  dangerLabel: { color: C.white },
+});

package/src/ui/components/LoadingAnimation/InLoading.tsx

@@ -0,0 +1,88 @@
+import React, { useEffect, useRef, useState } from 'react';
+import { Modal } from 'react-native';
+import styled from 'styled-components/native';
+import { Animated, Easing } from "react-native";
+import Svg, { Circle, G } from "react-native-svg";
+
+
+type Props = {
+    size?: number,
+    text?: string;
+};
+
+const Overlay = styled.View`
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+
+  align-items: center;
+  justify-content: center;
+
+  background-color: rgba(100, 100, 100, 0.2);
+`;
+
+const IndicatorContainer = styled.View`
+  padding: 12px;
+  background-color: #ffffff;
+  border-radius: 12px;
+  align-items: center;
+`;
+
+const IndicatorText = styled.Text`
+  font-size: 18px;
+  margin-top: 12px;
+  color: #003333;
+`;
+
+
+const AnimatedSvg = Animated.createAnimatedComponent(Svg);
+
+const InLoading = ({ size=40, text = 'Loading...' }: Props) => {
+  const [color, setColor] = useState<'teal' | 'royalblue'>('teal');
+
+  const rotate = useRef(new Animated.Value(0)).current;
+
+  useEffect(() => {
+    Animated.loop(
+      Animated.timing(rotate, {
+        toValue: 1,
+        duration: 800,
+        easing: Easing.linear,
+        useNativeDriver: true,
+      })
+    ).start();
+  }, [rotate]);
+
+  const spin = rotate.interpolate({
+    inputRange: [0, 1],
+    outputRange: ["0deg", "360deg"],
+  });
+
+
+
+  return (
+    <AnimatedSvg
+        width={size}
+        height={size}
+        viewBox="0 0 100 100"
+        style={{ transform: [{ rotate: spin }] }}
+        >
+        <G>
+            <Circle
+            cx="50"
+            cy="50"
+            r="33"
+            stroke="#0a3d2e"
+            strokeWidth="4"
+            strokeLinecap="round"
+            strokeDasharray="52 52"
+            fill="none"
+            />
+        </G>
+    </AnimatedSvg>
+  );
+};
+
+export default InLoading;