@djangocfg/ext-payments 1.0.14 → 1.0.19

package/src/components/index.ts

@@ -0,0 +1,11 @@
+/**
+ * Wallet Components (Apple-style)
+ */
+
+export { BalanceHero } from './BalanceHero';
+export { ActivityList } from './ActivityList';
+export { ActivityItem } from './ActivityItem';
+export { AddFundsSheet } from './AddFundsSheet';
+export { WithdrawSheet } from './WithdrawSheet';
+export { WithdrawalSheet } from './WithdrawalSheet';
+export { PaymentSheet } from './PaymentSheet';

package/src/config.ts

@@ -4,6 +4,7 @@
 
 import { createExtensionConfig } from '@djangocfg/ext-base';
 
+// @ts-ignore - package.json is not typed
 import packageJson from '../package.json';
 
 export const extensionConfig = createExtensionConfig(packageJson, {

package/src/contexts/WalletContext.tsx

@@ -0,0 +1,356 @@
+/**
+ * Wallet Context (Apple-style unified)
+ *
+ * Single context for all wallet operations:
+ * - Balance
+ * - Activity (payments + transactions merged)
+ * - Currencies
+ * - Payment operations
+ */
+
+'use client';
+
+import React, { createContext, ReactNode, useContext, useMemo, useCallback } from 'react';
+
+import { apiPayments } from '../api';
+import {
+  usePaymentsBalanceRetrieve,
+  usePaymentsPaymentsList,
+  usePaymentsTransactionsList,
+  usePaymentsCurrenciesList,
+  usePaymentsWithdrawalsList,
+  useCreatePaymentsPaymentsCreateCreate,
+  useCreatePaymentsWithdrawalsCreateCreate,
+  useCreatePaymentsWithdrawalsCancelCreate,
+} from '../api/generated/ext_payments/_utils/hooks';
+
+import type {
+  Balance,
+  PaymentList,
+  Transaction,
+  PaymentCreateRequest,
+  PaymentDetail,
+  WithdrawalCreateRequest,
+  WithdrawalDetail,
+  WithdrawalList,
+} from '../api/generated/ext_payments/_utils/schemas';
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Types
+// ─────────────────────────────────────────────────────────────────────────────
+
+export type ActivityType = 'payment' | 'deposit' | 'withdrawal';
+
+export interface ActivityItem {
+  id: string;
+  type: ActivityType;
+  amount: string;
+  amountDisplay: string;
+  currency?: string;
+  status: 'pending' | 'completed' | 'failed' | 'expired' | 'confirming';
+  statusDisplay: string;
+  description: string;
+  createdAt: string;
+  // Original data for details
+  payment?: PaymentList;
+  transaction?: Transaction;
+  withdrawal?: WithdrawalList;
+}
+
+export interface Currency {
+  code: string;
+  name: string;
+  token: string;
+  network?: string;
+  enabled: boolean;
+}
+
+export interface WalletContextValue {
+  // Balance
+  balance: Balance | undefined;
+  balanceAmount: number;
+  isLoadingBalance: boolean;
+
+  // Activity (merged payments + transactions)
+  activity: ActivityItem[];
+  isLoadingActivity: boolean;
+  hasMoreActivity: boolean;
+
+  // Currencies
+  currencies: Currency[];
+  isLoadingCurrencies: boolean;
+
+  // Operations
+  addFunds: (data: PaymentCreateRequest) => Promise<PaymentDetail>;
+  withdraw: (data: WithdrawalCreateRequest) => Promise<WithdrawalDetail>;
+  cancelWithdrawal: (id: string) => Promise<void>;
+  getPaymentDetails: (id: string) => Promise<PaymentDetail | undefined>;
+  getWithdrawalDetails: (id: string) => Promise<WithdrawalDetail | undefined>;
+  refreshWallet: () => Promise<void>;
+
+  // Loading state
+  isLoading: boolean;
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Context
+// ─────────────────────────────────────────────────────────────────────────────
+
+const WalletContext = createContext<WalletContextValue | undefined>(undefined);
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Provider
+// ─────────────────────────────────────────────────────────────────────────────
+
+export function WalletProvider({ children }: { children: ReactNode }) {
+  // Fetch balance
+  const {
+    data: balance,
+    isLoading: isLoadingBalance,
+    mutate: mutateBalance,
+  } = usePaymentsBalanceRetrieve(apiPayments);
+
+  // Fetch recent payments
+  const {
+    data: paymentsData,
+    isLoading: isLoadingPayments,
+    mutate: mutatePayments,
+  } = usePaymentsPaymentsList({ page: 1, page_size: 20 }, apiPayments);
+
+  // Fetch recent transactions
+  const {
+    data: transactionsData,
+    isLoading: isLoadingTransactions,
+    mutate: mutateTransactions,
+  } = usePaymentsTransactionsList({ limit: 20 }, apiPayments);
+
+  // Fetch currencies
+  const {
+    data: currenciesData,
+    isLoading: isLoadingCurrencies,
+    mutate: mutateCurrencies,
+  } = usePaymentsCurrenciesList(apiPayments);
+
+  // Fetch recent withdrawals
+  const {
+    data: withdrawalsData,
+    isLoading: isLoadingWithdrawals,
+    mutate: mutateWithdrawals,
+  } = usePaymentsWithdrawalsList({ page: 1, page_size: 20 }, apiPayments);
+
+  // Mutation hooks
+  const createPaymentMutation = useCreatePaymentsPaymentsCreateCreate();
+  const createWithdrawalMutation = useCreatePaymentsWithdrawalsCreateCreate();
+  const cancelWithdrawalMutation = useCreatePaymentsWithdrawalsCancelCreate();
+
+  // Parse balance amount
+  const balanceAmount = useMemo(() => {
+    if (!balance?.balance_usd) return 0;
+    return parseFloat(balance.balance_usd) || 0;
+  }, [balance]);
+
+  // Merge and sort activity (payments + withdrawals + transactions)
+  const activity = useMemo<ActivityItem[]>(() => {
+    const items: ActivityItem[] = [];
+
+    // Add payments (deposits)
+    const payments = paymentsData?.results || [];
+    for (const payment of payments) {
+      items.push({
+        id: `payment-${payment.id}`,
+        type: 'payment',
+        amount: payment.amount_usd,
+        amountDisplay: `+$${parseFloat(payment.amount_usd).toFixed(2)}`,
+        currency: payment.currency_code,
+        status: mapPaymentStatus(payment.status),
+        statusDisplay: payment.status_display,
+        description: `${payment.currency_code} payment`,
+        createdAt: payment.created_at,
+        payment,
+      });
+    }
+
+    // Add withdrawals
+    const withdrawals = withdrawalsData?.results || [];
+    for (const withdrawal of withdrawals) {
+      items.push({
+        id: `withdrawal-${withdrawal.id}`,
+        type: 'withdrawal',
+        amount: withdrawal.amount_usd,
+        amountDisplay: `-$${parseFloat(withdrawal.amount_usd).toFixed(2)}`,
+        currency: withdrawal.currency_code,
+        status: mapWithdrawalStatus(withdrawal.status),
+        statusDisplay: withdrawal.status_display,
+        description: `${withdrawal.currency_code} withdrawal`,
+        createdAt: withdrawal.created_at,
+        withdrawal,
+      });
+    }
+
+    // Add transactions (only if not linked to a payment/withdrawal already shown)
+    const transactions = transactionsData?.results || transactionsData || [];
+    if (Array.isArray(transactions)) {
+      for (const tx of transactions) {
+        // Skip if this transaction is linked to a payment we already have
+        if (tx.payment_id && payments.some(p => p.id === tx.payment_id)) {
+          continue;
+        }
+
+        const isDeposit = tx.transaction_type === 'deposit';
+        items.push({
+          id: `tx-${tx.id}`,
+          type: isDeposit ? 'deposit' : 'withdrawal',
+          amount: tx.amount_usd,
+          amountDisplay: `${isDeposit ? '+' : '-'}$${Math.abs(parseFloat(tx.amount_usd)).toFixed(2)}`,
+          status: 'completed',
+          statusDisplay: 'Completed',
+          description: tx.description || tx.type_display,
+          createdAt: tx.created_at,
+          transaction: tx,
+        });
+      }
+    }
+
+    // Sort by date, newest first
+    items.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
+
+    return items;
+  }, [paymentsData, withdrawalsData, transactionsData]);
+
+  // Parse currencies
+  const currencies = useMemo<Currency[]>(() => {
+    const data = currenciesData?.currencies || currenciesData?.results || currenciesData || [];
+    if (!Array.isArray(data)) return [];
+
+    return data
+      .filter((c: any) => c.is_enabled !== false)
+      .map((c: any) => ({
+        code: c.code || c.currency_code || c.symbol,
+        name: c.name || c.code,
+        token: c.token || c.code, // Token symbol (e.g., USDT, WBTC) with fallback to code
+        network: c.network || undefined,
+        enabled: c.is_enabled !== false,
+      }));
+  }, [currenciesData]);
+
+  // Operations
+  const addFunds = useCallback(async (data: PaymentCreateRequest): Promise<PaymentDetail> => {
+    const response = await createPaymentMutation(data, apiPayments);
+    // Refresh all data
+    await Promise.all([mutateBalance(), mutatePayments(), mutateTransactions()]);
+    // API returns { success, payment, qr_code_url } - extract payment
+    return response.payment;
+  }, [createPaymentMutation, mutateBalance, mutatePayments, mutateTransactions]);
+
+  const withdraw = useCallback(async (data: WithdrawalCreateRequest): Promise<WithdrawalDetail> => {
+    const response = await createWithdrawalMutation(data, apiPayments);
+    // Refresh all data
+    await Promise.all([mutateBalance(), mutateWithdrawals(), mutateTransactions()]);
+    // API returns { success, withdrawal, message } - extract withdrawal
+    return response.withdrawal;
+  }, [createWithdrawalMutation, mutateBalance, mutateWithdrawals, mutateTransactions]);
+
+  const cancelWithdrawal = useCallback(async (id: string): Promise<void> => {
+    await cancelWithdrawalMutation(id, apiPayments);
+    // Refresh all data
+    await Promise.all([mutateBalance(), mutateWithdrawals(), mutateTransactions()]);
+  }, [cancelWithdrawalMutation, mutateBalance, mutateWithdrawals, mutateTransactions]);
+
+  const getPaymentDetails = useCallback(async (id: string): Promise<PaymentDetail | undefined> => {
+    return apiPayments.ext_payments_payments.paymentsRetrieve(id);
+  }, []);
+
+  const getWithdrawalDetails = useCallback(async (id: string): Promise<WithdrawalDetail | undefined> => {
+    return apiPayments.ext_payments_payments.withdrawalsRetrieve(id);
+  }, []);
+
+  const refreshWallet = useCallback(async () => {
+    await Promise.all([
+      mutateBalance(),
+      mutatePayments(),
+      mutateWithdrawals(),
+      mutateTransactions(),
+      mutateCurrencies(),
+    ]);
+  }, [mutateBalance, mutatePayments, mutateWithdrawals, mutateTransactions, mutateCurrencies]);
+
+  // Combined loading state
+  const isLoading = isLoadingBalance || isLoadingPayments || isLoadingWithdrawals || isLoadingTransactions;
+  const isLoadingActivity = isLoadingPayments || isLoadingWithdrawals || isLoadingTransactions;
+
+  const value: WalletContextValue = {
+    balance,
+    balanceAmount,
+    isLoadingBalance,
+    activity,
+    isLoadingActivity,
+    hasMoreActivity: (paymentsData?.count || 0) > 20 || (withdrawalsData?.count || 0) > 20,
+    currencies,
+    isLoadingCurrencies,
+    addFunds,
+    withdraw,
+    cancelWithdrawal,
+    getPaymentDetails,
+    getWithdrawalDetails,
+    refreshWallet,
+    isLoading,
+  };
+
+  return <WalletContext.Provider value={value}>{children}</WalletContext.Provider>;
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Hook
+// ─────────────────────────────────────────────────────────────────────────────
+
+export function useWallet(): WalletContextValue {
+  const context = useContext(WalletContext);
+  if (!context) {
+    throw new Error('useWallet must be used within WalletProvider');
+  }
+  return context;
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Helpers
+// ─────────────────────────────────────────────────────────────────────────────
+
+function mapPaymentStatus(status: string): ActivityItem['status'] {
+  switch (status?.toLowerCase()) {
+    case 'completed':
+    case 'success':
+    case 'finished':
+      return 'completed';
+    case 'pending':
+    case 'waiting':
+      return 'pending';
+    case 'confirming':
+    case 'partially_paid':
+      return 'confirming';
+    case 'expired':
+      return 'expired';
+    case 'failed':
+    case 'error':
+    case 'cancelled':
+      return 'failed';
+    default:
+      return 'pending';
+  }
+}
+
+function mapWithdrawalStatus(status: string): ActivityItem['status'] {
+  switch (status?.toLowerCase()) {
+    case 'completed':
+      return 'completed';
+    case 'pending':
+    case 'approved':
+      return 'pending';
+    case 'processing':
+      return 'confirming';
+    case 'rejected':
+    case 'cancelled':
+      return 'failed';
+    default:
+      return 'pending';
+  }
+}

package/src/contexts/index.ts

@@ -1,45 +1,16 @@
-// Payments
-export {
-  PaymentsProvider,
-  usePaymentsContext
-} from './PaymentsContext';
-export type {
-  PaymentsContextValue,
-} from './PaymentsContext';
-
-// Balances
-export {
-  BalancesProvider,
-  useBalancesContext
-} from './BalancesContext';
-export type {
-  BalancesContextValue,
-} from './BalancesContext';
+/**
+ * Payments Context Exports
+ */
 
-// Currencies
-export {
-  CurrenciesProvider,
-  useCurrenciesContext
-} from './CurrenciesContext';
-export type {
-  CurrenciesContextValue,
-} from './CurrenciesContext';
+// Types (single source of truth)
+export * from './types';
 
-// Overview
+// Context
 export {
-  OverviewProvider,
-  useOverviewContext
-} from './OverviewContext';
-export type {
-  OverviewContextValue,
-} from './OverviewContext';
-
-// Root Payments (Global)
-export {
-  RootPaymentsProvider,
-  useRootPaymentsContext
-} from './RootPaymentsContext';
-export type {
-  RootPaymentsContextValue,
-} from './RootPaymentsContext';
-
+  WalletProvider,
+  useWallet,
+  type WalletContextValue,
+  type ActivityItem,
+  type ActivityType,
+  type Currency,
+} from './WalletContext';

package/src/contexts/types.ts

@@ -1,40 +1,46 @@
 /**
- * Payments Types
- * Centralized type definitions for payments contexts
+ * Payments Context Types
+ *
+ * Re-exports all types and enums from generated API for payments.
+ * This is the single source of truth for payment types.
  */
 
-import type {
-  usePaymentsPaymentsList,
-  usePaymentsPaymentsRetrieve,
-  usePaymentsBalanceRetrieve,
-  usePaymentsCurrenciesList,
-  usePaymentsTransactionsList,
-} from '../api/generated/ext_payments/_utils/hooks';
-
-// ─────────────────────────────────────────────────────────────────────────
-// Payments Types
-// ─────────────────────────────────────────────────────────────────────────
-
-export type PaginatedPaymentListList = NonNullable<Awaited<ReturnType<typeof usePaymentsPaymentsList>>['data']>;
-export type PaymentDetail = NonNullable<Awaited<ReturnType<typeof usePaymentsPaymentsRetrieve>>['data']>;
-export type PaymentList = NonNullable<Awaited<ReturnType<typeof usePaymentsPaymentsList>>['data']> extends { results: infer T } ? T extends Array<infer U> ? U : never : never;
-
-// ─────────────────────────────────────────────────────────────────────────
-// Balance Types
-// ─────────────────────────────────────────────────────────────────────────
-
-export type Balance = NonNullable<Awaited<ReturnType<typeof usePaymentsBalanceRetrieve>>['data']>;
-
-// ─────────────────────────────────────────────────────────────────────────
-// Currency Types
-// ─────────────────────────────────────────────────────────────────────────
-
-export type Currency = NonNullable<Awaited<ReturnType<typeof usePaymentsCurrenciesList>>['data']> extends { results: infer T } ? T extends Array<infer U> ? U : never : never;
-export type PaginatedCurrencyList = NonNullable<Awaited<ReturnType<typeof usePaymentsCurrenciesList>>['data']>;
-
-// ─────────────────────────────────────────────────────────────────────────
-// Transaction Types
-// ─────────────────────────────────────────────────────────────────────────
-
-export type Transaction = NonNullable<Awaited<ReturnType<typeof usePaymentsTransactionsList>>['data']> extends { results: infer T } ? T extends Array<infer U> ? U : never : never;
-export type PaginatedTransactionList = NonNullable<Awaited<ReturnType<typeof usePaymentsTransactionsList>>['data']>;
+// Import and re-export enums
+import * as PaymentsEnums from '../api/generated/ext_payments/enums';
+
+// =============================================================================
+// Payment Enums
+// =============================================================================
+export const PaymentStatus = PaymentsEnums.PaymentDetailStatus;
+export const PaymentListStatus = PaymentsEnums.PaymentListStatus;
+export const TransactionType = PaymentsEnums.TransactionTransactionType;
+export const WithdrawalStatus = PaymentsEnums.WithdrawalDetailStatus;
+export const WithdrawalListStatus = PaymentsEnums.WithdrawalListStatus;
+
+// Type exports for TypeScript
+export type PaymentStatus = PaymentsEnums.PaymentDetailStatus;
+export type PaymentListStatus = PaymentsEnums.PaymentListStatus;
+export type TransactionType = PaymentsEnums.TransactionTransactionType;
+export type WithdrawalStatus = PaymentsEnums.WithdrawalDetailStatus;
+export type WithdrawalListStatus = PaymentsEnums.WithdrawalListStatus;
+
+// =============================================================================
+// Payment Schemas
+// =============================================================================
+export type { Balance } from '../api/generated/ext_payments/_utils/schemas/Balance.schema';
+export type { Currency } from '../api/generated/ext_payments/_utils/schemas/Currency.schema';
+export type { PaymentDetail } from '../api/generated/ext_payments/_utils/schemas/PaymentDetail.schema';
+export type { PaymentList } from '../api/generated/ext_payments/_utils/schemas/PaymentList.schema';
+export type { PaymentCreateRequest } from '../api/generated/ext_payments/_utils/schemas/PaymentCreateRequest.schema';
+export type { PaymentCreateResponse } from '../api/generated/ext_payments/_utils/schemas/PaymentCreateResponse.schema';
+export type { PaginatedPaymentListList } from '../api/generated/ext_payments/_utils/schemas/PaginatedPaymentListList.schema';
+export type { Transaction } from '../api/generated/ext_payments/_utils/schemas/Transaction.schema';
+
+// =============================================================================
+// Withdrawal Schemas
+// =============================================================================
+export type { WithdrawalDetail } from '../api/generated/ext_payments/_utils/schemas/WithdrawalDetail.schema';
+export type { WithdrawalList } from '../api/generated/ext_payments/_utils/schemas/WithdrawalList.schema';
+export type { WithdrawalCreateRequest } from '../api/generated/ext_payments/_utils/schemas/WithdrawalCreateRequest.schema';
+export type { WithdrawalCreateResponse } from '../api/generated/ext_payments/_utils/schemas/WithdrawalCreateResponse.schema';
+export type { PaginatedWithdrawalListList } from '../api/generated/ext_payments/_utils/schemas/PaginatedWithdrawalListList.schema';

package/src/hooks/index.ts

@@ -1,20 +1,3 @@
-'use client';
-
-/**
- * @djangocfg/ext-payments/hooks
- *
- * React hooks for payments extension.
- * Use this entry point in client components.
- */
-
-// Re-export everything from main entry (server-safe code)
-export * from '../index';
-
-// SWR hooks from generated API
-export * from '../api/generated/ext_payments/_utils/hooks';
-
-// Payments contexts (from local contexts)
-export * from '../contexts';
-
-// Layout components (they use hooks internally)
-export * from '../layouts/PaymentsLayout/components';
+export * from './useEstimate';
+export * from './useWithdrawalEstimate';
+export * from './useCurrencyOptions';

package/src/hooks/useCurrencyOptions.ts

@@ -0,0 +1,79 @@
+'use client';
+
+/**
+ * Hooks for currency selection
+ */
+
+import { useMemo, useEffect, useCallback, useRef } from 'react';
+import type { Currency } from '../contexts/WalletContext';
+import type { CurrencyOption } from '../types';
+
+/**
+ * Map currencies to combobox options
+ */
+export function useCurrencyOptions(currencies: Currency[]): CurrencyOption[] {
+  return useMemo(() => {
+    return currencies.map((c) => ({
+      value: c.code,
+      label: c.name,
+      token: c.token,
+      network: c.network,
+    }));
+  }, [currencies]);
+}
+
+interface UseDefaultCurrencyOptions {
+  currencyOptions: CurrencyOption[];
+  savedCurrency: string;
+  currentValue: string;
+  setValue: (value: string) => void;
+}
+
+/**
+ * Set default currency when options load (saved or USDT fallback)
+ */
+export function useDefaultCurrency({
+  currencyOptions,
+  savedCurrency,
+  currentValue,
+  setValue,
+}: UseDefaultCurrencyOptions): void {
+  useEffect(() => {
+    if (currencyOptions.length > 0 && !currentValue) {
+      // Prefer saved currency if it exists in options
+      const savedOption = savedCurrency && currencyOptions.find(c => c.value === savedCurrency);
+      if (savedOption) {
+        setValue(savedOption.value);
+      } else {
+        // Fallback to USDT or first available
+        const usdt = currencyOptions.find(c => c.value.includes('USDT'));
+        setValue(usdt?.value || currencyOptions[0].value);
+      }
+    }
+  }, [currencyOptions, savedCurrency, currentValue, setValue]);
+}
+
+/**
+ * Auto-save value to localStorage when it changes
+ */
+export function useAutoSave<T>(
+  value: T,
+  save: (value: T) => void,
+  validate?: (value: T) => boolean
+): void {
+  // Use refs to avoid infinite loops from unstable function references
+  const saveRef = useRef(save);
+  const validateRef = useRef(validate);
+
+  useEffect(() => {
+    saveRef.current = save;
+    validateRef.current = validate;
+  });
+
+  useEffect(() => {
+    const isValid = validateRef.current ? validateRef.current(value) : Boolean(value);
+    if (isValid) {
+      saveRef.current(value);
+    }
+  }, [value]);
+}