zips-react-native-sdk-test/src/types/index.ts

Lightweight ZIPS Payment Gateway SDK for React Native - Complete payment solution with card payments, wallet payments (AfrMoney & ZApp), netbanking, and native UI design

import { ReactNode } from 'react';

export interface PaymentDetails {
  name: string;
  quantity: number;
  amount: number;
  description: string;
  projectId: string;
  currency?: string; // Made optional with default
  country: string;
  firstName: string;
  middleName?: string;
  lastName: string;
  phoneNumber: string;
  merchantAccountId: string;
}

// Alias for compatibility with TypeScript SDK
export type PaymentParams = PaymentDetails;

export interface WalletData {
  walletProvider: string;
  phoneNumber: string;
  pin?: string; // Optional PIN for some wallets
}

export interface ZipsConfig {
  apiKey: string;
  environment?: 'sandbox' | 'production';
  baseUrl?: string;
}

export interface ApiResponse<T> {
  success: boolean;
  data?: T;
  error?: string;
  code?: string;
}

export interface PaymentRequest {
  name: string;
  quantity: number;
  amount: number;
  description: string;
  projectId: string;
  currency?: string; // Made optional with default
  country: string;
  firstName: string;
  middleName?: string;
  lastName: string;
  phoneNumber: string;
  merchantAccountId: string;
  selectedBank?: string;
  accountNumber?: string;
}

export interface PaymentResponse {
  referenceNumber: string;
  status: string;
  message: string;
  transaction?: Transaction;
  paymentUrl?: string;
}

export interface PaymentButtonProps {
  paymentDetails: PaymentDetails;
  onSuccess: (transaction: Transaction) => void;
  onError: (error: PaymentError) => void;
  onCancel?: () => void;
  buttonText?: string;
  customStyles?: PaymentButtonStyles;
  disabled?: boolean;
}

export interface PaymentButtonStyles {
  container?: any;
  text?: any;
  loadingText?: any;
  disabledContainer?: any;
  disabledText?: any;
}

export interface ZipsProviderProps {
  apiKey: string;
  children: ReactNode;
  environment?: 'sandbox' | 'production';
  baseUrl?: string;
}

export interface Payment {
  data: string;
  success: boolean;
  referenceNumber: string;
  message: string;
}

export interface Transaction {
  status: string;
  success: boolean;
  message: string;
  data: Order;
  url: string;
}

export interface Order {
  id: string;
  projectId: string;
  orderId: string;
  amount: string;
  status: string;
  country: string;
  reference: string;
  fees: number;
  createdAt: string;
  updatedAt: string;
  projectTransaction?: string;
  isSettled?: boolean;
  merchantId?: string;
  bankName?: string;
}

export interface PaymentError {
  message: string;
  code?: string;
  details?: any;
}

export interface Bank {
  id: string;
  bankName: string;
  code: string;
  bankLogo: string;
  isActive: boolean;
  location: string;
  createdAt: string;
  updatedAt: string;
  // Legacy properties for backward compatibility
  name?: string;
  logo?: string;
}

export interface PaymentMethod {
  id: 'bank-selection' | 'card-input' | 'wallet-selection';
  title: string;
  subtitle: string;
  icon: string;
}

export interface CardData {
  cardNumber: string;
  expiryMonth: string;
  expiryYear: string;
  cvv: string;
  cardholderName: string;
}

export interface WalletData {
  walletProvider: string;
  phoneNumber: string;
  pin?: string;
}

export interface Wallet {
  id: string;
  name: string;
  logo: string;
  description: string;
  isActive: boolean;
}

export interface AccountVerificationRequest {
  accountNumber: string;
  bankCode: string;
}

export interface AccountVerificationResponse {
  accountName: string;
  accountNumber: string;
  bankName: string;
  isValid: boolean;
}

export interface OTPRequest {
  referenceNumber: string;
  otp: string;
}

export interface OTPResponse {
  success: boolean;
  message: string;
  transactionStatus?: string;
}

export interface PaymentModalProps {
  visible: boolean;
  onClose: () => void;
  onSuccess: (transaction: Transaction) => void;
  onError: (error: PaymentError) => void;
}

export interface SelectedBank {
  code: string;
  name: string;
  logo: string;
  abbreviation: string;
}

export type PaymentStep =
  | 'method-selection'
  | 'bank-selection'
  | 'account-input'
  | 'otp-verification'
  | 'processing'
  | 'success'
  | 'error';

export type PaymentFlowStep =
  | 'method-selection'
  | 'bank-account-input'
  | 'account-details'
  | 'otp-input'
  | 'payment-success'
  | 'payment-failed'
  | 'card-input'
  | 'card-confirmation'
  | 'wallet-selection'
  | 'wallet-input'
  | 'wallet-confirmation'
  | 'otp-verification'
  | 'bank-selection';

export interface PaymentState {
  step: PaymentStep;
  selectedMethod?: PaymentMethod;
  selectedBank?: Bank;
  accountNumber?: string;
  accountName?: string;
  referenceNumber?: string;
  transaction?: Transaction;
  error?: PaymentError;
  isLoading: boolean;
}