@burdenoff/microfe-billing 2026.915.2 → 2026.916.1

package/dist/billing/modules/checkout/hooks/useCheckout.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCheckout.js","names":[],"sources":["../../../../../src/billing/modules/checkout/hooks/useCheckout.ts"],"sourcesContent":["/**\n * Main checkout hook for managing checkout state and payment processing\n */\n\nimport { useState, useCallback, useMemo, useEffect } from 'react';\nimport {\n  useInitiatePaymentCheckoutMutation,\n  useSpendCreditsCheckoutMutation,\n  useConvertCurrencyLazyQuery,\n  useValidateCouponLazyQuery,\n} from '../../../../generated/global-operations';\nimport { useBilling } from '../../../providers/BillingProvider';\nimport { useEnsureStoreOrderBillingOrder } from './useStoreShipping';\nimport type {\n  CheckoutItem,\n  CheckoutBillingAccount,\n  PaymentProvider,\n  Currency,\n  CheckoutState,\n  PaymentInitResponse,\n  PromoCodeResult,\n  PurchaseType,\n} from '../types';\n\n/**\n * Credit conversion rate: How many credits equal 1 USD\n * This should match the backend creditRate.rateUSD (default 0.01 means 100 credits = $1)\n */\n// Exported so callers that need a per-item (rather than aggregate) credits\n// amount — e.g. the success page's itemized \"Items Purchased\" list — convert\n// consistently with creditsRequired/hasEnoughCredits below, instead of each\n// re-declaring their own copy of this rate.\nexport const CREDITS_PER_USD = 100;\n\ninterface UseCheckoutOptions {\n  billingAccountId?: string;\n  defaultCurrency?: Currency;\n  defaultSaveCard?: boolean;\n  upgradeFromSubscriptionId?: string;\n  /** For plan downgrades — old sub auto-renewal cancelled, runs to natural expiry */\n  downgradeFromSubscriptionId?: string;\n  /** For addon purchases - pre-selected subscription ID */\n  defaultSubscriptionId?: string;\n}\n\ninterface UseCheckoutResult {\n  // State\n  items: CheckoutItem[];\n  billingAccount: CheckoutBillingAccount | null;\n  selectedProvider: PaymentProvider;\n  selectedCurrency: Currency;\n  promoCode: string;\n  promoDiscount: number;\n  promoDiscountType: 'PERCENTAGE' | 'FIXED';\n  useCredits: boolean;\n  creditsToUse: number;\n  checkoutState: CheckoutState;\n  error: string | null;\n\n  // Saved card state\n  selectedPaymentMethodId: string | null;\n  saveCard: boolean;\n\n  // Auto-pay state (for subscription purchases)\n  autoRenew: boolean;\n  autoRenewPaymentMethodId: string | null;\n\n  // Subscription state (for addon purchases)\n  selectedSubscriptionId: string | null;\n\n  // Computed values\n  subtotal: number;\n  subtotalUSD: number;\n  discountAmount: number;\n  taxAmount: number;\n  taxRate: number;\n  taxType: string;\n  total: number;\n  totalInSelectedCurrency: number;\n  availableCredits: number;\n  /** subtotalUSD converted to credits (CREDITS_PER_USD) — the actual amount a\n   * CREDITS-provider purchase charges, in credits. total/totalInSelectedCurrency\n   * are in the selected display currency and must never be shown/used as a\n   * credits amount (they're a different number). */\n  creditsRequired: number;\n  hasEnoughCredits: boolean;\n  canPayWithCredits: boolean;\n  isLoading: boolean;\n  isProcessing: boolean;\n  isCalculatingTax: boolean;\n\n  // Currency conversion\n  conversionRate: number;\n  convertedAmount: number | null;\n\n  // Actions\n  addItem: (item: CheckoutItem) => void;\n  removeItem: (itemId: string) => void;\n  updateItemQuantity: (itemId: string, quantity: number) => void;\n  updateItemPrice: (itemId: string, price: number, currency?: Currency) => void;\n  clearItems: () => void;\n  setBillingAccount: (account: CheckoutBillingAccount | null) => void;\n  setPaymentProvider: (provider: PaymentProvider) => void;\n  setCurrency: (currency: Currency) => void;\n  setPromoCode: (code: string) => void;\n  validatePromoCode: () => Promise<PromoCodeResult>;\n  clearPromoCode: () => void;\n  setUseCredits: (use: boolean) => void;\n  setCreditsToUse: (amount: number) => void;\n  setSelectedPaymentMethodId: (id: string | null) => void;\n  setSaveCard: (save: boolean) => void;\n  setAutoRenew: (enabled: boolean) => void;\n  setAutoRenewPaymentMethodId: (id: string | null) => void;\n  setSelectedSubscriptionId: (id: string | null) => void;\n  initiatePayment: () => Promise<PaymentInitResponse>;\n  reset: () => void;\n}\n\nexport function useCheckout(options: UseCheckoutOptions = {}): UseCheckoutResult {\n  const { currentUser } = useBilling();\n  const {\n    defaultCurrency = 'USD',\n    defaultSaveCard = false, // CRITICAL: Never save cards without explicit user consent\n    upgradeFromSubscriptionId,\n    downgradeFromSubscriptionId,\n    defaultSubscriptionId,\n  } = options;\n\n  // Core state\n  const [items, setItems] = useState<CheckoutItem[]>([]);\n  const [billingAccount, setBillingAccount] = useState<CheckoutBillingAccount | null>(null);\n  const [selectedProvider, setSelectedProvider] = useState<PaymentProvider>('AUTO');\n  const [selectedCurrency, setSelectedCurrency] = useState<Currency>(defaultCurrency);\n  const [promoCode, setPromoCode] = useState('');\n  const [promoDiscount, setPromoDiscount] = useState(0);\n  const [promoDiscountType, setPromoDiscountType] = useState<'PERCENTAGE' | 'FIXED'>('PERCENTAGE');\n  const [useCredits, setUseCredits] = useState(false);\n  const [creditsToUse, setCreditsToUse] = useState(0);\n  const [checkoutState, setCheckoutState] = useState<CheckoutState>('idle');\n  const [error, setError] = useState<string | null>(null);\n  const [taxAmount, setTaxAmount] = useState(0);\n  const [taxRate, setTaxRate] = useState(0);\n  const [taxType, setTaxType] = useState<string>('NONE');\n\n  // Saved card state\n  const [selectedPaymentMethodId, setSelectedPaymentMethodId] = useState<string | null>(null);\n  const [saveCard, setSaveCard] = useState(defaultSaveCard);\n\n  // Auto-pay state (for subscription purchases)\n  const [autoRenew, setAutoRenew] = useState(false);\n  const [autoRenewPaymentMethodId, setAutoRenewPaymentMethodId] = useState<string | null>(null);\n\n  // Subscription state (for addon purchases)\n  const [selectedSubscriptionId, setSelectedSubscriptionId] = useState<string | null>(\n    defaultSubscriptionId ?? null\n  );\n\n  // GraphQL mutations and queries\n  const [initiatePaymentMutation] = useInitiatePaymentCheckoutMutation();\n  const [ensureStoreOrderBillingOrderMutation] = useEnsureStoreOrderBillingOrder();\n  const [spendCreditsMutation] = useSpendCreditsCheckoutMutation();\n  const [convertCurrency, { data: currencyData, loading: currencyLoading }] =\n    useConvertCurrencyLazyQuery();\n  // Separate lazy query (not the display-currency one above) for converting a\n  // non-USD native-currency subtotal into USD for the credits check — see the\n  // itemsNeedUsdConversion effect below for why this can't reuse convertCurrency.\n  const [convertNativeSubtotalToUsd, { data: usdSubtotalData }] = useConvertCurrencyLazyQuery();\n  const [validateCoupon] = useValidateCouponLazyQuery();\n\n  // Computed values\n\n  // The currency `total`/`subtotal` are actually denominated in. Plans,\n  // addons, and credits are priced in USD; store orders are priced in the\n  // order's own currency (item.currency), which may not be USD. Converting\n  // `total` to the selected currency must pivot FROM this currency, not\n  // always assume USD — see BOFF-7127 (a ₹50 item was shown as $4,748.50\n  // because the conversion always requested a USD→X rate and multiplied,\n  // which is only correct when the source amount actually is in USD).\n  const nativeCurrency = useMemo<Currency>(() => items[0]?.currency ?? 'USD', [items]);\n\n  const subtotal = useMemo(() => {\n    return items.reduce((sum, item) => sum + item.price * item.quantity, 0);\n  }, [items]);\n\n  // Plans/addons always carry a real priceUSD (from the catalog's currencyPrices.USD\n  // — see CheckoutPage's addon/plan item construction). Store-order items only\n  // get priceUSD when their native currency already IS USD (buildStoreOrderCheckoutItems);\n  // when a store order is natively priced in, say, INR, there is no catalog USD\n  // price to fall back on — it has to be looked up live.\n  const itemsNeedLiveUsdConversion = useMemo(\n    () => items.length > 0 && nativeCurrency !== 'USD' && items.some((item) => item.priceUSD === undefined),\n    [items, nativeCurrency]\n  );\n\n  // Fetches the USD equivalent of the native-currency subtotal for the credits\n  // check. This is intentionally separate from the display-currency conversion\n  // effect further below: that effect is skipped whenever nativeCurrency ===\n  // selectedCurrency (the common case — e.g. an INR-priced store item viewed\n  // with INR selected), which is exactly when this conversion is still needed.\n  // Without it, subtotalUSD previously fell back to the raw native-currency\n  // number treated as if it were already USD (₹349 read as $349), inflating\n  // the credits requirement ~100x (BOFF-7192: \"need 34,900 credits\" for a\n  // ₹349 item that should need well under 500).\n  useEffect(() => {\n    if (!itemsNeedLiveUsdConversion || subtotal <= 0) return;\n    void convertNativeSubtotalToUsd({\n      variables: { amount: subtotal, toCurrency: 'USD', fromCurrency: nativeCurrency },\n    });\n  }, [itemsNeedLiveUsdConversion, subtotal, nativeCurrency, convertNativeSubtotalToUsd]);\n\n  const liveUsdSubtotal = usdSubtotalData?.convertCurrency?.amount ?? null;\n\n  // USD subtotal — always use priceUSD (base price) for credit calculations.\n  // item.price may be in a local currency (INR, EUR, etc.) when currencyPrices is set.\n  const subtotalUSD = useMemo(() => {\n    if (itemsNeedLiveUsdConversion) {\n      // 0 while the live rate is loading (rather than the un-converted native\n      // amount) keeps hasEnoughCredits conservatively false instead of\n      // briefly showing a wildly wrong credits-required figure.\n      return liveUsdSubtotal ?? 0;\n    }\n    return items.reduce((sum, item) => sum + (item.priceUSD ?? item.price) * item.quantity, 0);\n  }, [items, itemsNeedLiveUsdConversion, liveUsdSubtotal]);\n\n  const discountAmount = useMemo(() => {\n    if (!promoDiscount) return 0;\n    // promoDiscount now contains the actual discount amount from backend validation\n    // (not the percentage value), so use it directly\n    return Math.min(promoDiscount, subtotal);\n  }, [subtotal, promoDiscount]);\n\n  // Total includes tax (calculated via calculateTax query)\n  const total = useMemo(() => {\n    const afterDiscount = subtotal - discountAmount;\n    const withCredits = useCredits ? Math.max(0, afterDiscount - creditsToUse) : afterDiscount;\n    return withCredits + taxAmount;\n  }, [subtotal, discountAmount, useCredits, creditsToUse, taxAmount]);\n\n  const availableCredits = billingAccount?.creditAmount ?? 0;\n\n  // Use subtotalUSD so this works correctly for any display currency\n  const creditsRequired = useMemo(() => subtotalUSD * CREDITS_PER_USD, [subtotalUSD]);\n\n  const hasEnoughCredits = useMemo(\n    () => availableCredits >= creditsRequired,\n    [availableCredits, creditsRequired]\n  );\n\n  // Can only pay with credits if not buying credits\n  const canPayWithCredits = useMemo(() => {\n    const hasCreditsPurchase = items.some((item) => item.type === 'CREDITS');\n    return !hasCreditsPurchase && availableCredits > 0;\n  }, [items, availableCredits]);\n\n  // Currency conversion result\n  const convertedAmount = currencyData?.convertCurrency?.amount ?? null;\n  const conversionRate = currencyData?.convertCurrency?.exchangeRate ?? 1;\n  const totalInSelectedCurrency = convertedAmount ?? total;\n\n  const isLoading = checkoutState === 'loading' || currencyLoading;\n  const isProcessing = checkoutState === 'processing';\n\n  // Effect to trigger currency conversion when total or currency changes\n  // This ensures the converted amount is always up-to-date\n  useEffect(() => {\n    // Skip conversion for credit payments (no currency conversion needed)\n    if (selectedProvider === 'CREDITS') {\n      return;\n    }\n\n    // Skip if no items yet (cart is still loading)\n    if (items.length === 0) {\n      return;\n    }\n\n    // Skip conversion if items already have prices in selected currency\n    // (Plans/Addons with multi-currency pricing have currencyPrices stored)\n    const allItemsHaveLocalizedPrices = items.every(\n      (item) => item.currency === selectedCurrency || item.type === 'CREDITS'\n    );\n\n    if (allItemsHaveLocalizedPrices) {\n      // Items are already priced in the selected currency (from currencyPrices)\n      // No conversion needed - subtotal and total are already correct!\n      return;\n    }\n\n    // Only fetch if we have a valid total and it needs converting at all.\n    if (total > 0 && nativeCurrency !== selectedCurrency) {\n      // For INR, wait until tax has been calculated (taxAmount > 0 or taxRate is set)\n      // This prevents double API calls - one before tax, one after\n      if (selectedCurrency === 'INR' && taxAmount === 0 && subtotal > 0) {\n        // Tax hasn't been calculated yet, skip this conversion\n        // The effect will run again when taxAmount changes\n        return;\n      }\n\n      convertCurrency({\n        variables: {\n          amount: total,\n          toCurrency: selectedCurrency,\n          fromCurrency: nativeCurrency,\n        },\n      });\n    }\n  }, [\n    total,\n    selectedCurrency,\n    selectedProvider,\n    convertCurrency,\n    taxAmount,\n    subtotal,\n    items,\n    nativeCurrency,\n  ]);\n\n  // Effect to calculate tax when billing account, subtotal, or currency changes\n  // Tax is only applied for INR payments (18% GST)\n  useEffect(() => {\n    // Only calculate tax if we have a billing account and items\n    if (!billingAccount || subtotal <= 0) {\n      // Reset tax if no billing account or empty cart\n      setTaxAmount(0);\n      setTaxRate(0);\n      setTaxType('NONE');\n      return;\n    }\n\n    // Skip if paying with credits (no tax on credit payments)\n    if (selectedProvider === 'CREDITS') {\n      setTaxAmount(0);\n      setTaxRate(0);\n      setTaxType('NONE');\n      return;\n    }\n\n    // Only apply tax for INR payments\n    if (selectedCurrency !== 'INR') {\n      setTaxAmount(0);\n      setTaxRate(0);\n      setTaxType('NONE');\n      return;\n    }\n\n    // For INR: Calculate 18% GST on the USD amount, then we'll convert for display\n    const afterDiscount = subtotal - discountAmount;\n    const GST_RATE = 0.18;\n    const taxInUSD = afterDiscount * GST_RATE;\n\n    setTaxAmount(taxInUSD);\n    setTaxRate(GST_RATE);\n    setTaxType('GST');\n  }, [billingAccount, subtotal, discountAmount, selectedCurrency, selectedProvider]);\n\n  // Actions\n  const addItem = useCallback((item: CheckoutItem) => {\n    setItems((prev) => {\n      // Plans can only be purchased once - quantity is always 1\n      if (item.type === 'PLAN') {\n        // Check if any plan already exists in cart\n        const existingPlan = prev.find((i) => i.type === 'PLAN');\n        if (existingPlan) {\n          // Replace existing plan with new one (can only have 1 plan)\n          return prev.map((i) => (i.type === 'PLAN' ? { ...item, quantity: 1 } : i));\n        }\n        // Add new plan with quantity forced to 1\n        return [...prev, { ...item, quantity: 1 }];\n      }\n\n      // For addons and credits, allow quantity increment\n      const existing = prev.find((i) => i.id === item.id);\n      if (existing) {\n        return prev.map((i) =>\n          i.id === item.id ? { ...i, quantity: i.quantity + item.quantity } : i\n        );\n      }\n      return [...prev, item];\n    });\n  }, []);\n\n  const removeItem = useCallback((itemId: string) => {\n    setItems((prev) => prev.filter((i) => i.id !== itemId));\n  }, []);\n\n  const updateItemQuantity = useCallback(\n    (itemId: string, quantity: number) => {\n      if (quantity <= 0) {\n        removeItem(itemId);\n        return;\n      }\n      setItems((prev) =>\n        prev.map((i) => {\n          if (i.id !== itemId) return i;\n          // Plans can only have quantity 1\n          if (i.type === 'PLAN') {\n            return { ...i, quantity: 1 };\n          }\n          return { ...i, quantity };\n        })\n      );\n    },\n    [removeItem]\n  );\n\n  const updateItemPrice = useCallback((itemId: string, price: number, currency?: Currency) => {\n    setItems((prev) =>\n      prev.map((i) => {\n        if (i.id !== itemId) return i;\n        // Update price and optionally currency\n        const updates: Partial<CheckoutItem> = { price };\n        if (currency) {\n          updates.currency = currency;\n        }\n        return { ...i, ...updates };\n      })\n    );\n  }, []);\n\n  const clearItems = useCallback(() => {\n    setItems([]);\n  }, []);\n\n  const handleSetBillingAccount = useCallback((account: CheckoutBillingAccount | null) => {\n    setBillingAccount(account);\n    // Reset credits usage when billing account changes — different accounts\n    // carry different credit balances, so a CREDITS selection made against\n    // the previous account may no longer be valid (or even offered) for\n    // this one. Without also resetting the provider, the order summary kept\n    // displaying amounts in Credits (and checkout could still submit with\n    // provider: 'CREDITS') even after the Credits option had disappeared\n    // from the payment method list for the new account.\n    setUseCredits(false);\n    setCreditsToUse(0);\n    setSelectedProvider((prev) => (prev === 'CREDITS' ? 'AUTO' : prev));\n  }, []);\n\n  const handleSetCurrency = useCallback(\n    (currency: Currency) => {\n      setSelectedCurrency(currency);\n      // Skip conversion if items already have localized prices\n      // (Plans/Addons with multi-currency pricing don't need conversion)\n      const allItemsHaveLocalizedPrices = items.every(\n        (item) => item.currency === currency || item.type === 'CREDITS'\n      );\n\n      // Only fetch conversion rate if items don't have localized prices\n      if (total > 0 && nativeCurrency !== currency && !allItemsHaveLocalizedPrices) {\n        convertCurrency({\n          variables: {\n            amount: total,\n            toCurrency: currency,\n            fromCurrency: nativeCurrency,\n          },\n        });\n      }\n    },\n    [total, convertCurrency, items, nativeCurrency]\n  );\n\n  const handleSetPaymentProvider = useCallback(\n    (provider: PaymentProvider) => {\n      setSelectedProvider(provider);\n      // Razorpay only supports INR\n      if (provider === 'RAZORPAY' && selectedCurrency !== 'INR') {\n        setSelectedCurrency('INR');\n      }\n      // Credits purchases don't support coupons yet (BOFF-7192) — clear any\n      // promo applied under a card provider so it can't leak into the\n      // credits success screen's displayed total.\n      if (provider === 'CREDITS') {\n        setPromoCode('');\n        setPromoDiscount(0);\n        setPromoDiscountType('PERCENTAGE');\n      }\n    },\n    [selectedCurrency]\n  );\n\n  const validatePromoCode = useCallback(async (): Promise<PromoCodeResult> => {\n    if (!promoCode.trim()) {\n      return {\n        valid: false,\n        code: '',\n        discountType: 'PERCENTAGE',\n        discountValue: 0,\n        error: 'Please enter a promo code',\n      };\n    }\n\n    try {\n      setCheckoutState('loading');\n\n      // Build validation input\n      const validationInput = {\n        code: promoCode.trim().toUpperCase(),\n        userId: currentUser?.id ?? '',\n        userEmail: currentUser?.email,\n        amount: subtotal,\n        currency: selectedCurrency,\n      };\n\n      const { data, error: queryError } = await validateCoupon({\n        variables: {\n          input: validationInput,\n        },\n      });\n\n      if (queryError || !data?.validateCoupon) {\n        setPromoDiscount(0);\n        setCheckoutState('idle');\n        return {\n          valid: false,\n          code: promoCode,\n          discountType: 'PERCENTAGE',\n          discountValue: 0,\n          error: 'Failed to validate coupon',\n        };\n      }\n\n      const response = data.validateCoupon;\n\n      if (!response.valid) {\n        setPromoDiscount(0);\n        setCheckoutState('idle');\n        return {\n          valid: false,\n          code: promoCode,\n          discountType: 'PERCENTAGE',\n          discountValue: 0,\n          error: response.error || 'Invalid coupon code',\n        };\n      }\n\n      // Extract discount details from coupon\n      const coupon = response.coupon;\n      if (!coupon) {\n        setPromoDiscount(0);\n        setCheckoutState('idle');\n        return {\n          valid: false,\n          code: promoCode,\n          discountType: 'PERCENTAGE',\n          discountValue: 0,\n          error: 'Coupon data not found',\n        };\n      }\n\n      // Use the ACTUAL discount amount from validation (includes caps and currency conversion)\n      const actualDiscountAmount = response.discountAmount || 0;\n\n      const discountType = coupon.type === 'FIXED_AMOUNT' ? 'FIXED' : 'PERCENTAGE';\n      setPromoDiscount(actualDiscountAmount); // Use actual discount, not coupon.value\n      setPromoDiscountType(discountType);\n      setCheckoutState('idle');\n\n      return {\n        valid: true,\n        code: coupon.code,\n        discountType,\n        discountValue: actualDiscountAmount, // Use actual discount, not coupon.value\n      };\n    } catch {\n      setPromoDiscount(0);\n      setCheckoutState('idle');\n      return {\n        valid: false,\n        code: promoCode,\n        discountType: 'PERCENTAGE',\n        discountValue: 0,\n        error: 'Failed to validate coupon',\n      };\n    }\n  }, [currentUser?.email, currentUser?.id, promoCode, selectedCurrency, subtotal, validateCoupon]);\n\n  const clearPromoCode = useCallback(() => {\n    setPromoCode('');\n    setPromoDiscount(0);\n    setPromoDiscountType('PERCENTAGE');\n  }, []);\n\n  const handleSetCreditsToUse = useCallback(\n    (amount: number) => {\n      const maxCredits = Math.min(amount, availableCredits, subtotal - discountAmount);\n      setCreditsToUse(Math.max(0, maxCredits));\n    },\n    [availableCredits, subtotal, discountAmount]\n  );\n\n  const initiatePayment = useCallback(async (): Promise<PaymentInitResponse> => {\n    if (!billingAccount) {\n      return {\n        success: false,\n        provider: 'AUTO',\n        subtotal: 0,\n        taxAmount: 0,\n        taxRate: 0,\n        total: 0,\n        taxType: 'NONE',\n        jurisdiction: 'UNKNOWN',\n        currency: selectedCurrency,\n        error: 'Please select a billing account',\n      };\n    }\n\n    if (items.length === 0) {\n      return {\n        success: false,\n        provider: 'AUTO',\n        subtotal: 0,\n        taxAmount: 0,\n        taxRate: 0,\n        total: 0,\n        taxType: 'NONE',\n        jurisdiction: 'UNKNOWN',\n        currency: selectedCurrency,\n        error: 'No items in checkout',\n      };\n    }\n\n    try {\n      setCheckoutState('processing');\n      setError(null);\n\n      // Determine purchase type from first item\n      const firstItem = items[0];\n      let purchaseType: PurchaseType = firstItem.type;\n\n      // Check if this is a store order checkout (detect early)\n      const storeOrderItem = items.find((item) => item.metadata?.storeOrderId);\n      const storeOrderId = storeOrderItem?.metadata?.storeOrderId as string | undefined;\n      let billingOrderId =\n        (items.find((item) => item.metadata?.billingOrderId)?.metadata?.billingOrderId as\n          string | undefined) || undefined;\n\n      // For store orders, use 'ORDER' purchase type\n      if (storeOrderId) {\n        purchaseType = 'ORDER' as PurchaseType;\n      }\n\n      // Calculate amount to charge\n      const chargeAmount = subtotal - discountAmount;\n\n      // Determine provider\n      let provider = selectedProvider;\n      if (provider === 'AUTO') {\n        provider = selectedCurrency === 'INR' ? 'RAZORPAY' : 'STRIPE';\n      }\n\n      // If this is a store order without a billing order yet, let the store service\n      // create it from its authoritative order snapshot. This persists the billing\n      // order ID and registers the signed callback on the same service that owns\n      // the order; browser line-item prices and shipping values are never sent to\n      // billing as the order snapshot.\n      if (purchaseType === 'ORDER' && !billingOrderId && storeOrderId && billingAccount) {\n        const { data: billingOrderResult } = await ensureStoreOrderBillingOrderMutation({\n          variables: {\n            storeOrderId,\n            billingAccountId: billingAccount.id,\n            currency: selectedCurrency,\n          },\n        });\n        const ensureResult = billingOrderResult?.ensureStoreOrderBillingOrder;\n\n        if (ensureResult?.success && ensureResult.billingOrderId) {\n          billingOrderId = ensureResult.billingOrderId;\n        } else {\n          const errMsg = ensureResult?.error ?? 'Failed to create billing order';\n          setCheckoutState('error');\n          setError(errMsg);\n          return {\n            success: false,\n            provider,\n            subtotal: chargeAmount,\n            taxAmount: 0,\n            taxRate: 0,\n            total: chargeAmount,\n            taxType: 'NONE',\n            jurisdiction: 'UNKNOWN',\n            currency: selectedCurrency,\n            error: errMsg,\n          };\n        }\n      }\n\n      // ========================================\n      // CREDITS PAYMENT - use spendCredits mutation\n      // Supports multiple addons\n      // ========================================\n      if (provider === 'CREDITS') {\n        const addonItems = items.filter((item) => item.type === 'ADDON');\n        const planItem = items.find((item) => item.type === 'PLAN');\n\n        const { data } = await spendCreditsMutation({\n          variables: {\n            input: {\n              billingAccountId: billingAccount.id,\n              // Store order purchase: the only one of planId/addOnIds/orderId\n              // spendCredits actually needs for this purchase type. Without\n              // it, the mutation has nothing to charge and the backend\n              // rejects it outright (BOFF-7192).\n              orderId: purchaseType === 'ORDER' ? billingOrderId : undefined,\n              planId: planItem ? (planItem.metadata?.planId as string) || planItem.id : undefined,\n              // Multiple addons supported via addOnIds array\n              addOnIds:\n                addonItems.length > 0\n                  ? addonItems.map((item) => ({\n                      id: (item.metadata?.addonId as string) || item.id,\n                      quantity: item.quantity,\n                    }))\n                  : undefined,\n              isAnnual: planItem?.metadata?.duration === 'yearly',\n              // Include upgrade context if changing plans\n              upgradeFromSubscriptionId: upgradeFromSubscriptionId || undefined,\n              // Include downgrade context if downgrading\n              downgradeFromSubscriptionId: downgradeFromSubscriptionId || undefined,\n              // For addon purchases - subscription to attach to\n              subscriptionId: addonItems.length > 0 ? selectedSubscriptionId : undefined,\n              // For PER_SEAT plans - pass seat count for credit calculation + subscription storage\n              seatCount: planItem?.metadata?.seatCount as number | undefined,\n            },\n          },\n        });\n\n        const response = data?.spendCredits;\n\n        if (!response?.creditTransactionID) {\n          setCheckoutState('error');\n          setError('Failed to process credit payment');\n          return {\n            success: false,\n            provider: 'CREDITS',\n            subtotal: chargeAmount,\n            taxAmount: 0,\n            taxRate: 0,\n            total: chargeAmount,\n            taxType: 'NONE',\n            jurisdiction: 'UNKNOWN',\n            currency: selectedCurrency,\n            error: 'Failed to process credit payment',\n          };\n        }\n\n        setCheckoutState('success');\n        return {\n          success: true,\n          provider: 'CREDITS',\n          subtotal: chargeAmount,\n          taxAmount: 0,\n          taxRate: 0,\n          total: chargeAmount,\n          taxType: 'NONE',\n          jurisdiction: 'UNKNOWN',\n          currency: selectedCurrency,\n          // Return transaction ID for success handling\n          orderId: response.creditTransactionID,\n        };\n      }\n\n      // ========================================\n      // CARD PAYMENT (Stripe/Razorpay) - use initiatePayment\n      // Supports single or multiple addons\n      // Supports store orders (via orderId parameter)\n      // ========================================\n      const addonItems = items.filter((item) => item.type === 'ADDON');\n\n      // Build addon IDs and quantities for the mutation\n      const addonIds =\n        addonItems.length > 0\n          ? addonItems.map((item) => (item.metadata?.addonId as string) || item.id)\n          : undefined;\n      const quantities =\n        addonItems.length > 0 ? addonItems.map((item) => item.quantity) : undefined;\n\n      // Determine if this is an annual plan purchase\n      const planItem = items.find((item) => item.type === 'PLAN');\n      const isAnnualPlan = planItem?.metadata?.duration === 'yearly';\n\n      // Determine auto-renew payment method\n      const autoRenewPMId =\n        purchaseType === 'PLAN' && autoRenew\n          ? autoRenewPaymentMethodId || selectedPaymentMethodId || undefined\n          : undefined;\n\n      const { data } = await initiatePaymentMutation({\n        variables: {\n          input: {\n            billingAccountId: billingAccount.id,\n            amount: chargeAmount, // Note: Backend IGNORES this and calculates from DB\n            currency: selectedCurrency,\n            purchaseType,\n            provider: provider,\n            // Store order - use orderId parameter (billing order ID)\n            orderId: billingOrderId || undefined,\n            creditAmount: purchaseType === 'CREDITS' ? firstItem.quantity : undefined,\n            planId:\n              purchaseType === 'PLAN'\n                ? (firstItem.metadata?.planId as string) || firstItem.id\n                : undefined,\n            // Single addon (backwards compatible) - skip if store order\n            addonId:\n              purchaseType === 'ADDON' && addonItems.length === 1 && !billingOrderId\n                ? (addonItems[0].metadata?.addonId as string) || addonItems[0].id\n                : undefined,\n            quantity:\n              purchaseType === 'ADDON' && addonItems.length === 1 && !billingOrderId\n                ? addonItems[0].quantity\n                : undefined,\n            // Multiple addons (cart checkout) - skip if store order\n            addonIds:\n              purchaseType === 'ADDON' && addonItems.length > 1 && !billingOrderId\n                ? addonIds\n                : undefined,\n            quantities:\n              purchaseType === 'ADDON' && addonItems.length > 1 && !billingOrderId\n                ? quantities\n                : undefined,\n            // For addon purchases - subscription to attach to (skip for store orders)\n            subscriptionId:\n              purchaseType === 'ADDON' && !billingOrderId ? selectedSubscriptionId : undefined,\n            // Saved card support\n            paymentMethodId: selectedPaymentMethodId || undefined,\n            // Save card if: user checked save card OR auto-renewal is enabled (which requires a saved card)\n            // Only save if not using existing card (selectedPaymentMethodId is null)\n            saveCard: !selectedPaymentMethodId ? saveCard || autoRenew : undefined,\n            // Include upgrade context if changing plans\n            upgradeFromSubscriptionId: upgradeFromSubscriptionId || undefined,\n            // Include downgrade context if downgrading\n            downgradeFromSubscriptionId: downgradeFromSubscriptionId || undefined,\n            // Annual plan flag (for pricing calculation)\n            isAnnual: isAnnualPlan || undefined,\n            // Promo code (validated and applied on backend)\n            promoCode: promoCode || undefined,\n            // Auto-renewal (for plan purchases only)\n            autoRenew: purchaseType === 'PLAN' && autoRenew ? true : undefined,\n            autoRenewPaymentMethodId: autoRenewPMId,\n          },\n        },\n      });\n\n      const response = data?.initiatePayment;\n\n      if (!response?.success) {\n        setCheckoutState('error');\n        setError(response?.error ?? 'Payment initiation failed');\n        return {\n          success: false,\n          provider: provider,\n          subtotal: chargeAmount,\n          taxAmount: 0,\n          taxRate: 0,\n          total: chargeAmount,\n          taxType: 'NONE',\n          jurisdiction: 'UNKNOWN',\n          currency: selectedCurrency,\n          error: response?.error ?? 'Payment initiation failed',\n        };\n      }\n\n      // Note: Tax is already calculated upfront in the effect, don't overwrite\n      // The response tax is in converted currency which would mess up display\n      setCheckoutState('success');\n\n      return response;\n    } catch (err) {\n      const errorMessage = err instanceof Error ? err.message : 'An error occurred';\n      setCheckoutState('error');\n      setError(errorMessage);\n      return {\n        success: false,\n        provider: 'AUTO',\n        subtotal: 0,\n        taxAmount: 0,\n        taxRate: 0,\n        total: 0,\n        taxType: 'NONE',\n        jurisdiction: 'UNKNOWN',\n        currency: selectedCurrency,\n        error: errorMessage,\n      };\n    }\n  }, [\n    billingAccount,\n    items,\n    selectedCurrency,\n    selectedProvider,\n    subtotal,\n    discountAmount,\n    promoCode,\n    selectedPaymentMethodId,\n    saveCard,\n    autoRenew,\n    autoRenewPaymentMethodId,\n    selectedSubscriptionId,\n    upgradeFromSubscriptionId,\n    downgradeFromSubscriptionId,\n    initiatePaymentMutation,\n    ensureStoreOrderBillingOrderMutation,\n    spendCreditsMutation,\n  ]);\n\n  const reset = useCallback(() => {\n    setItems([]);\n    setBillingAccount(null);\n    setSelectedProvider('AUTO');\n    setSelectedCurrency(defaultCurrency);\n    setPromoCode('');\n    setPromoDiscount(0);\n    setPromoDiscountType('PERCENTAGE');\n    setUseCredits(false);\n    setCreditsToUse(0);\n    setCheckoutState('idle');\n    setError(null);\n    setTaxAmount(0);\n    setTaxRate(0);\n    setTaxType('NONE');\n    setSelectedPaymentMethodId(null);\n    setSaveCard(defaultSaveCard);\n    setAutoRenew(false);\n    setAutoRenewPaymentMethodId(null);\n    setSelectedSubscriptionId(defaultSubscriptionId ?? null);\n  }, [defaultCurrency, defaultSaveCard, defaultSubscriptionId]);\n\n  return {\n    // State\n    items,\n    billingAccount,\n    selectedProvider,\n    selectedCurrency,\n    promoCode,\n    promoDiscount,\n    promoDiscountType,\n    useCredits,\n    creditsToUse,\n    checkoutState,\n    error,\n\n    // Saved card state\n    selectedPaymentMethodId,\n    saveCard,\n\n    // Auto-pay state\n    autoRenew,\n    autoRenewPaymentMethodId,\n\n    // Subscription state (for addon purchases)\n    selectedSubscriptionId,\n\n    // Computed\n    subtotal,\n    subtotalUSD,\n    discountAmount,\n    taxAmount,\n    taxRate,\n    taxType,\n    total,\n    totalInSelectedCurrency,\n    availableCredits,\n    creditsRequired,\n    hasEnoughCredits,\n    canPayWithCredits,\n    isLoading,\n    isProcessing,\n    isCalculatingTax: false, // Tax is calculated synchronously now\n    conversionRate,\n    convertedAmount,\n\n    // Actions\n    addItem,\n    removeItem,\n    updateItemQuantity,\n    updateItemPrice,\n    clearItems,\n    setBillingAccount: handleSetBillingAccount,\n    setPaymentProvider: handleSetPaymentProvider,\n    setCurrency: handleSetCurrency,\n    setPromoCode,\n    validatePromoCode,\n    clearPromoCode,\n    setUseCredits,\n    setCreditsToUse: handleSetCreditsToUse,\n    setSelectedPaymentMethodId,\n    setSaveCard,\n    setAutoRenew,\n    setAutoRenewPaymentMethodId,\n    setSelectedSubscriptionId,\n    initiatePayment,\n    reset,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"useCheckout.js","names":[],"sources":["../../../../../src/billing/modules/checkout/hooks/useCheckout.ts"],"sourcesContent":["/**\n * Main checkout hook for managing checkout state and payment processing\n */\n\nimport { useState, useCallback, useMemo, useEffect } from 'react';\nimport {\n  useInitiatePaymentCheckoutMutation,\n  useSpendCreditsCheckoutMutation,\n  useConvertCurrencyLazyQuery,\n  useValidateCouponLazyQuery,\n} from '../../../../generated/global-operations';\nimport { useBilling } from '../../../providers/BillingProvider';\nimport { useEnsureStoreOrderBillingOrder } from './useStoreShipping';\nimport type {\n  CheckoutItem,\n  CheckoutBillingAccount,\n  PaymentProvider,\n  Currency,\n  CheckoutState,\n  PaymentInitResponse,\n  PromoCodeResult,\n  PurchaseType,\n} from '../types';\n\n/**\n * Credit conversion rate: How many credits equal 1 USD\n * This should match the backend creditRate.rateUSD (default 0.01 means 100 credits = $1)\n */\n// Exported so callers that need a per-item (rather than aggregate) credits\n// amount — e.g. the success page's itemized \"Items Purchased\" list — convert\n// consistently with creditsRequired/hasEnoughCredits below, instead of each\n// re-declaring their own copy of this rate.\nexport const CREDITS_PER_USD = 100;\n\ninterface UseCheckoutOptions {\n  billingAccountId?: string;\n  defaultCurrency?: Currency;\n  defaultSaveCard?: boolean;\n  upgradeFromSubscriptionId?: string;\n  /** For plan downgrades — old sub auto-renewal cancelled, runs to natural expiry */\n  downgradeFromSubscriptionId?: string;\n  /** For addon purchases - pre-selected subscription ID */\n  defaultSubscriptionId?: string;\n}\n\ninterface UseCheckoutResult {\n  // State\n  items: CheckoutItem[];\n  billingAccount: CheckoutBillingAccount | null;\n  selectedProvider: PaymentProvider;\n  selectedCurrency: Currency;\n  promoCode: string;\n  promoDiscount: number;\n  promoDiscountType: 'PERCENTAGE' | 'FIXED';\n  useCredits: boolean;\n  creditsToUse: number;\n  checkoutState: CheckoutState;\n  error: string | null;\n\n  // Saved card state\n  selectedPaymentMethodId: string | null;\n  saveCard: boolean;\n\n  // Auto-pay state (for subscription purchases)\n  autoRenew: boolean;\n  autoRenewPaymentMethodId: string | null;\n\n  // Subscription state (for addon purchases)\n  selectedSubscriptionId: string | null;\n\n  // Computed values\n  subtotal: number;\n  subtotalUSD: number;\n  discountAmount: number;\n  taxAmount: number;\n  taxRate: number;\n  taxType: string;\n  total: number;\n  totalInSelectedCurrency: number;\n  availableCredits: number;\n  /** subtotalUSD converted to credits (CREDITS_PER_USD) — the actual amount a\n   * CREDITS-provider purchase charges, in credits. total/totalInSelectedCurrency\n   * are in the selected display currency and must never be shown/used as a\n   * credits amount (they're a different number). */\n  creditsRequired: number;\n  hasEnoughCredits: boolean;\n  canPayWithCredits: boolean;\n  isLoading: boolean;\n  isProcessing: boolean;\n  isCalculatingTax: boolean;\n\n  // Currency conversion\n  conversionRate: number;\n  convertedAmount: number | null;\n\n  // Actions\n  addItem: (item: CheckoutItem) => void;\n  removeItem: (itemId: string) => void;\n  updateItemQuantity: (itemId: string, quantity: number) => void;\n  updateItemPrice: (itemId: string, price: number, currency?: Currency) => void;\n  clearItems: () => void;\n  setBillingAccount: (account: CheckoutBillingAccount | null) => void;\n  setPaymentProvider: (provider: PaymentProvider) => void;\n  setCurrency: (currency: Currency) => void;\n  setPromoCode: (code: string) => void;\n  validatePromoCode: () => Promise<PromoCodeResult>;\n  clearPromoCode: () => void;\n  setUseCredits: (use: boolean) => void;\n  setCreditsToUse: (amount: number) => void;\n  setSelectedPaymentMethodId: (id: string | null) => void;\n  setSaveCard: (save: boolean) => void;\n  setAutoRenew: (enabled: boolean) => void;\n  setAutoRenewPaymentMethodId: (id: string | null) => void;\n  setSelectedSubscriptionId: (id: string | null) => void;\n  initiatePayment: () => Promise<PaymentInitResponse>;\n  reset: () => void;\n}\n\nexport function useCheckout(options: UseCheckoutOptions = {}): UseCheckoutResult {\n  const { currentUser } = useBilling();\n  const {\n    defaultCurrency = 'USD',\n    defaultSaveCard = false, // CRITICAL: Never save cards without explicit user consent\n    upgradeFromSubscriptionId,\n    downgradeFromSubscriptionId,\n    defaultSubscriptionId,\n  } = options;\n\n  // Core state\n  const [items, setItems] = useState<CheckoutItem[]>([]);\n  const [billingAccount, setBillingAccount] = useState<CheckoutBillingAccount | null>(null);\n  const [selectedProvider, setSelectedProvider] = useState<PaymentProvider>('AUTO');\n  const [selectedCurrency, setSelectedCurrency] = useState<Currency>(defaultCurrency);\n  const [promoCode, setPromoCode] = useState('');\n  const [promoDiscount, setPromoDiscount] = useState(0);\n  const [promoDiscountType, setPromoDiscountType] = useState<'PERCENTAGE' | 'FIXED'>('PERCENTAGE');\n  const [useCredits, setUseCredits] = useState(false);\n  const [creditsToUse, setCreditsToUse] = useState(0);\n  const [checkoutState, setCheckoutState] = useState<CheckoutState>('idle');\n  const [error, setError] = useState<string | null>(null);\n  const [taxAmount, setTaxAmount] = useState(0);\n  const [taxRate, setTaxRate] = useState(0);\n  const [taxType, setTaxType] = useState<string>('NONE');\n\n  // Saved card state\n  const [selectedPaymentMethodId, setSelectedPaymentMethodId] = useState<string | null>(null);\n  const [saveCard, setSaveCard] = useState(defaultSaveCard);\n\n  // Auto-pay state (for subscription purchases)\n  const [autoRenew, setAutoRenew] = useState(false);\n  const [autoRenewPaymentMethodId, setAutoRenewPaymentMethodId] = useState<string | null>(null);\n\n  // Subscription state (for addon purchases)\n  const [selectedSubscriptionId, setSelectedSubscriptionId] = useState<string | null>(\n    defaultSubscriptionId ?? null\n  );\n\n  // GraphQL mutations and queries\n  const [initiatePaymentMutation] = useInitiatePaymentCheckoutMutation();\n  const [ensureStoreOrderBillingOrderMutation] = useEnsureStoreOrderBillingOrder();\n  const [spendCreditsMutation] = useSpendCreditsCheckoutMutation();\n  const [convertCurrency, { data: currencyData, loading: currencyLoading }] =\n    useConvertCurrencyLazyQuery();\n  // Separate lazy query (not the display-currency one above) for converting a\n  // non-USD native-currency subtotal into USD for the credits check — see the\n  // itemsNeedUsdConversion effect below for why this can't reuse convertCurrency.\n  const [convertNativeSubtotalToUsd, { data: usdSubtotalData }] = useConvertCurrencyLazyQuery();\n  const [validateCoupon] = useValidateCouponLazyQuery();\n\n  // Computed values\n\n  // The currency `total`/`subtotal` are actually denominated in. Plans,\n  // addons, and credits are priced in USD; store orders are priced in the\n  // order's own currency (item.currency), which may not be USD. Converting\n  // `total` to the selected currency must pivot FROM this currency, not\n  // always assume USD — see BOFF-7127 (a ₹50 item was shown as $4,748.50\n  // because the conversion always requested a USD→X rate and multiplied,\n  // which is only correct when the source amount actually is in USD).\n  const nativeCurrency = useMemo<Currency>(() => items[0]?.currency ?? 'USD', [items]);\n\n  const subtotal = useMemo(() => {\n    return items.reduce((sum, item) => sum + item.price * item.quantity, 0);\n  }, [items]);\n\n  // Plans/addons always carry a real priceUSD (from the catalog's currencyPrices.USD\n  // — see CheckoutPage's addon/plan item construction). Store-order items only\n  // get priceUSD when their native currency already IS USD (buildStoreOrderCheckoutItems);\n  // when a store order is natively priced in, say, INR, there is no catalog USD\n  // price to fall back on — it has to be looked up live.\n  const itemsNeedLiveUsdConversion = useMemo(\n    () =>\n      items.length > 0 &&\n      nativeCurrency !== 'USD' &&\n      items.some((item) => item.priceUSD === undefined),\n    [items, nativeCurrency]\n  );\n\n  // Fetches the USD equivalent of the native-currency subtotal for the credits\n  // check. This is intentionally separate from the display-currency conversion\n  // effect further below: that effect is skipped whenever nativeCurrency ===\n  // selectedCurrency (the common case — e.g. an INR-priced store item viewed\n  // with INR selected), which is exactly when this conversion is still needed.\n  // Without it, subtotalUSD previously fell back to the raw native-currency\n  // number treated as if it were already USD (₹349 read as $349), inflating\n  // the credits requirement ~100x (BOFF-7192: \"need 34,900 credits\" for a\n  // ₹349 item that should need well under 500).\n  useEffect(() => {\n    if (!itemsNeedLiveUsdConversion || subtotal <= 0) return;\n    void convertNativeSubtotalToUsd({\n      variables: { amount: subtotal, toCurrency: 'USD', fromCurrency: nativeCurrency },\n    });\n  }, [itemsNeedLiveUsdConversion, subtotal, nativeCurrency, convertNativeSubtotalToUsd]);\n\n  const liveUsdSubtotal = usdSubtotalData?.convertCurrency?.amount ?? null;\n\n  // USD subtotal — always use priceUSD (base price) for credit calculations.\n  // item.price may be in a local currency (INR, EUR, etc.) when currencyPrices is set.\n  const subtotalUSD = useMemo(() => {\n    if (itemsNeedLiveUsdConversion) {\n      // 0 while the live rate is loading (rather than the un-converted native\n      // amount) keeps hasEnoughCredits conservatively false instead of\n      // briefly showing a wildly wrong credits-required figure.\n      return liveUsdSubtotal ?? 0;\n    }\n    return items.reduce((sum, item) => sum + (item.priceUSD ?? item.price) * item.quantity, 0);\n  }, [items, itemsNeedLiveUsdConversion, liveUsdSubtotal]);\n\n  const discountAmount = useMemo(() => {\n    if (!promoDiscount) return 0;\n    // promoDiscount now contains the actual discount amount from backend validation\n    // (not the percentage value), so use it directly\n    return Math.min(promoDiscount, subtotal);\n  }, [subtotal, promoDiscount]);\n\n  // Total includes tax (calculated via calculateTax query)\n  const total = useMemo(() => {\n    const afterDiscount = subtotal - discountAmount;\n    const withCredits = useCredits ? Math.max(0, afterDiscount - creditsToUse) : afterDiscount;\n    return withCredits + taxAmount;\n  }, [subtotal, discountAmount, useCredits, creditsToUse, taxAmount]);\n\n  const availableCredits = billingAccount?.creditAmount ?? 0;\n\n  // Use subtotalUSD so this works correctly for any display currency\n  const creditsRequired = useMemo(() => subtotalUSD * CREDITS_PER_USD, [subtotalUSD]);\n\n  const hasEnoughCredits = useMemo(\n    () => availableCredits >= creditsRequired,\n    [availableCredits, creditsRequired]\n  );\n\n  // Can only pay with credits if not buying credits\n  const canPayWithCredits = useMemo(() => {\n    const hasCreditsPurchase = items.some((item) => item.type === 'CREDITS');\n    return !hasCreditsPurchase && availableCredits > 0;\n  }, [items, availableCredits]);\n\n  // Currency conversion result\n  const convertedAmount = currencyData?.convertCurrency?.amount ?? null;\n  const conversionRate = currencyData?.convertCurrency?.exchangeRate ?? 1;\n  const totalInSelectedCurrency = convertedAmount ?? total;\n\n  const isLoading = checkoutState === 'loading' || currencyLoading;\n  const isProcessing = checkoutState === 'processing';\n\n  // Effect to trigger currency conversion when total or currency changes\n  // This ensures the converted amount is always up-to-date\n  useEffect(() => {\n    // Skip conversion for credit payments (no currency conversion needed)\n    if (selectedProvider === 'CREDITS') {\n      return;\n    }\n\n    // Skip if no items yet (cart is still loading)\n    if (items.length === 0) {\n      return;\n    }\n\n    // Skip conversion if items already have prices in selected currency\n    // (Plans/Addons with multi-currency pricing have currencyPrices stored)\n    const allItemsHaveLocalizedPrices = items.every(\n      (item) => item.currency === selectedCurrency || item.type === 'CREDITS'\n    );\n\n    if (allItemsHaveLocalizedPrices) {\n      // Items are already priced in the selected currency (from currencyPrices)\n      // No conversion needed - subtotal and total are already correct!\n      return;\n    }\n\n    // Only fetch if we have a valid total and it needs converting at all.\n    if (total > 0 && nativeCurrency !== selectedCurrency) {\n      // For INR, wait until tax has been calculated (taxAmount > 0 or taxRate is set)\n      // This prevents double API calls - one before tax, one after\n      if (selectedCurrency === 'INR' && taxAmount === 0 && subtotal > 0) {\n        // Tax hasn't been calculated yet, skip this conversion\n        // The effect will run again when taxAmount changes\n        return;\n      }\n\n      convertCurrency({\n        variables: {\n          amount: total,\n          toCurrency: selectedCurrency,\n          fromCurrency: nativeCurrency,\n        },\n      });\n    }\n  }, [\n    total,\n    selectedCurrency,\n    selectedProvider,\n    convertCurrency,\n    taxAmount,\n    subtotal,\n    items,\n    nativeCurrency,\n  ]);\n\n  // Effect to calculate tax when billing account, subtotal, or currency changes\n  // Tax is only applied for INR payments (18% GST)\n  useEffect(() => {\n    // Only calculate tax if we have a billing account and items\n    if (!billingAccount || subtotal <= 0) {\n      // Reset tax if no billing account or empty cart\n      setTaxAmount(0);\n      setTaxRate(0);\n      setTaxType('NONE');\n      return;\n    }\n\n    // Skip if paying with credits (no tax on credit payments)\n    if (selectedProvider === 'CREDITS') {\n      setTaxAmount(0);\n      setTaxRate(0);\n      setTaxType('NONE');\n      return;\n    }\n\n    // Only apply tax for INR payments\n    if (selectedCurrency !== 'INR') {\n      setTaxAmount(0);\n      setTaxRate(0);\n      setTaxType('NONE');\n      return;\n    }\n\n    // For INR: Calculate 18% GST on the USD amount, then we'll convert for display\n    const afterDiscount = subtotal - discountAmount;\n    const GST_RATE = 0.18;\n    const taxInUSD = afterDiscount * GST_RATE;\n\n    setTaxAmount(taxInUSD);\n    setTaxRate(GST_RATE);\n    setTaxType('GST');\n  }, [billingAccount, subtotal, discountAmount, selectedCurrency, selectedProvider]);\n\n  // Actions\n  const addItem = useCallback((item: CheckoutItem) => {\n    setItems((prev) => {\n      // Plans can only be purchased once - quantity is always 1\n      if (item.type === 'PLAN') {\n        // Check if any plan already exists in cart\n        const existingPlan = prev.find((i) => i.type === 'PLAN');\n        if (existingPlan) {\n          // Replace existing plan with new one (can only have 1 plan)\n          return prev.map((i) => (i.type === 'PLAN' ? { ...item, quantity: 1 } : i));\n        }\n        // Add new plan with quantity forced to 1\n        return [...prev, { ...item, quantity: 1 }];\n      }\n\n      // For addons and credits, allow quantity increment\n      const existing = prev.find((i) => i.id === item.id);\n      if (existing) {\n        return prev.map((i) =>\n          i.id === item.id ? { ...i, quantity: i.quantity + item.quantity } : i\n        );\n      }\n      return [...prev, item];\n    });\n  }, []);\n\n  const removeItem = useCallback((itemId: string) => {\n    setItems((prev) => prev.filter((i) => i.id !== itemId));\n  }, []);\n\n  const updateItemQuantity = useCallback(\n    (itemId: string, quantity: number) => {\n      if (quantity <= 0) {\n        removeItem(itemId);\n        return;\n      }\n      setItems((prev) =>\n        prev.map((i) => {\n          if (i.id !== itemId) return i;\n          // Plans can only have quantity 1\n          if (i.type === 'PLAN') {\n            return { ...i, quantity: 1 };\n          }\n          return { ...i, quantity };\n        })\n      );\n    },\n    [removeItem]\n  );\n\n  const updateItemPrice = useCallback((itemId: string, price: number, currency?: Currency) => {\n    setItems((prev) =>\n      prev.map((i) => {\n        if (i.id !== itemId) return i;\n        // Update price and optionally currency\n        const updates: Partial<CheckoutItem> = { price };\n        if (currency) {\n          updates.currency = currency;\n        }\n        return { ...i, ...updates };\n      })\n    );\n  }, []);\n\n  const clearItems = useCallback(() => {\n    setItems([]);\n  }, []);\n\n  const handleSetBillingAccount = useCallback((account: CheckoutBillingAccount | null) => {\n    setBillingAccount(account);\n    // Reset credits usage when billing account changes — different accounts\n    // carry different credit balances, so a CREDITS selection made against\n    // the previous account may no longer be valid (or even offered) for\n    // this one. Without also resetting the provider, the order summary kept\n    // displaying amounts in Credits (and checkout could still submit with\n    // provider: 'CREDITS') even after the Credits option had disappeared\n    // from the payment method list for the new account.\n    setUseCredits(false);\n    setCreditsToUse(0);\n    setSelectedProvider((prev) => (prev === 'CREDITS' ? 'AUTO' : prev));\n  }, []);\n\n  const handleSetCurrency = useCallback(\n    (currency: Currency) => {\n      setSelectedCurrency(currency);\n      // Skip conversion if items already have localized prices\n      // (Plans/Addons with multi-currency pricing don't need conversion)\n      const allItemsHaveLocalizedPrices = items.every(\n        (item) => item.currency === currency || item.type === 'CREDITS'\n      );\n\n      // Only fetch conversion rate if items don't have localized prices\n      if (total > 0 && nativeCurrency !== currency && !allItemsHaveLocalizedPrices) {\n        convertCurrency({\n          variables: {\n            amount: total,\n            toCurrency: currency,\n            fromCurrency: nativeCurrency,\n          },\n        });\n      }\n    },\n    [total, convertCurrency, items, nativeCurrency]\n  );\n\n  const handleSetPaymentProvider = useCallback(\n    (provider: PaymentProvider) => {\n      setSelectedProvider(provider);\n      // Razorpay only supports INR\n      if (provider === 'RAZORPAY' && selectedCurrency !== 'INR') {\n        setSelectedCurrency('INR');\n      }\n      // Credits purchases don't support coupons yet (BOFF-7192) — clear any\n      // promo applied under a card provider so it can't leak into the\n      // credits success screen's displayed total.\n      if (provider === 'CREDITS') {\n        setPromoCode('');\n        setPromoDiscount(0);\n        setPromoDiscountType('PERCENTAGE');\n      }\n    },\n    [selectedCurrency]\n  );\n\n  const validatePromoCode = useCallback(async (): Promise<PromoCodeResult> => {\n    if (!promoCode.trim()) {\n      return {\n        valid: false,\n        code: '',\n        discountType: 'PERCENTAGE',\n        discountValue: 0,\n        error: 'Please enter a promo code',\n      };\n    }\n\n    try {\n      setCheckoutState('loading');\n\n      // Build validation input\n      const validationInput = {\n        code: promoCode.trim().toUpperCase(),\n        userId: currentUser?.id ?? '',\n        userEmail: currentUser?.email,\n        amount: subtotal,\n        currency: selectedCurrency,\n      };\n\n      const { data, error: queryError } = await validateCoupon({\n        variables: {\n          input: validationInput,\n        },\n      });\n\n      if (queryError || !data?.validateCoupon) {\n        setPromoDiscount(0);\n        setCheckoutState('idle');\n        return {\n          valid: false,\n          code: promoCode,\n          discountType: 'PERCENTAGE',\n          discountValue: 0,\n          error: 'Failed to validate coupon',\n        };\n      }\n\n      const response = data.validateCoupon;\n\n      if (!response.valid) {\n        setPromoDiscount(0);\n        setCheckoutState('idle');\n        return {\n          valid: false,\n          code: promoCode,\n          discountType: 'PERCENTAGE',\n          discountValue: 0,\n          error: response.error || 'Invalid coupon code',\n        };\n      }\n\n      // Extract discount details from coupon\n      const coupon = response.coupon;\n      if (!coupon) {\n        setPromoDiscount(0);\n        setCheckoutState('idle');\n        return {\n          valid: false,\n          code: promoCode,\n          discountType: 'PERCENTAGE',\n          discountValue: 0,\n          error: 'Coupon data not found',\n        };\n      }\n\n      // Use the ACTUAL discount amount from validation (includes caps and currency conversion)\n      const actualDiscountAmount = response.discountAmount || 0;\n\n      const discountType = coupon.type === 'FIXED_AMOUNT' ? 'FIXED' : 'PERCENTAGE';\n      setPromoDiscount(actualDiscountAmount); // Use actual discount, not coupon.value\n      setPromoDiscountType(discountType);\n      setCheckoutState('idle');\n\n      return {\n        valid: true,\n        code: coupon.code,\n        discountType,\n        discountValue: actualDiscountAmount, // Use actual discount, not coupon.value\n      };\n    } catch {\n      setPromoDiscount(0);\n      setCheckoutState('idle');\n      return {\n        valid: false,\n        code: promoCode,\n        discountType: 'PERCENTAGE',\n        discountValue: 0,\n        error: 'Failed to validate coupon',\n      };\n    }\n  }, [currentUser?.email, currentUser?.id, promoCode, selectedCurrency, subtotal, validateCoupon]);\n\n  const clearPromoCode = useCallback(() => {\n    setPromoCode('');\n    setPromoDiscount(0);\n    setPromoDiscountType('PERCENTAGE');\n  }, []);\n\n  const handleSetCreditsToUse = useCallback(\n    (amount: number) => {\n      const maxCredits = Math.min(amount, availableCredits, subtotal - discountAmount);\n      setCreditsToUse(Math.max(0, maxCredits));\n    },\n    [availableCredits, subtotal, discountAmount]\n  );\n\n  const initiatePayment = useCallback(async (): Promise<PaymentInitResponse> => {\n    if (!billingAccount) {\n      return {\n        success: false,\n        provider: 'AUTO',\n        subtotal: 0,\n        taxAmount: 0,\n        taxRate: 0,\n        total: 0,\n        taxType: 'NONE',\n        jurisdiction: 'UNKNOWN',\n        currency: selectedCurrency,\n        error: 'Please select a billing account',\n      };\n    }\n\n    if (items.length === 0) {\n      return {\n        success: false,\n        provider: 'AUTO',\n        subtotal: 0,\n        taxAmount: 0,\n        taxRate: 0,\n        total: 0,\n        taxType: 'NONE',\n        jurisdiction: 'UNKNOWN',\n        currency: selectedCurrency,\n        error: 'No items in checkout',\n      };\n    }\n\n    try {\n      setCheckoutState('processing');\n      setError(null);\n\n      // Determine purchase type from first item\n      const firstItem = items[0];\n      let purchaseType: PurchaseType = firstItem.type;\n\n      // Check if this is a store order checkout (detect early)\n      const storeOrderItem = items.find((item) => item.metadata?.storeOrderId);\n      const storeOrderId = storeOrderItem?.metadata?.storeOrderId as string | undefined;\n      let billingOrderId =\n        (items.find((item) => item.metadata?.billingOrderId)?.metadata?.billingOrderId as\n          string | undefined) || undefined;\n\n      // For store orders, use 'ORDER' purchase type\n      if (storeOrderId) {\n        purchaseType = 'ORDER' as PurchaseType;\n      }\n\n      // Calculate amount to charge\n      const chargeAmount = subtotal - discountAmount;\n\n      // Determine provider\n      let provider = selectedProvider;\n      if (provider === 'AUTO') {\n        provider = selectedCurrency === 'INR' ? 'RAZORPAY' : 'STRIPE';\n      }\n\n      // If this is a store order without a billing order yet, let the store service\n      // create it from its authoritative order snapshot. This persists the billing\n      // order ID and registers the signed callback on the same service that owns\n      // the order; browser line-item prices and shipping values are never sent to\n      // billing as the order snapshot.\n      if (purchaseType === 'ORDER' && !billingOrderId && storeOrderId && billingAccount) {\n        const { data: billingOrderResult } = await ensureStoreOrderBillingOrderMutation({\n          variables: {\n            storeOrderId,\n            billingAccountId: billingAccount.id,\n            currency: selectedCurrency,\n          },\n        });\n        const ensureResult = billingOrderResult?.ensureStoreOrderBillingOrder;\n\n        if (ensureResult?.success && ensureResult.billingOrderId) {\n          billingOrderId = ensureResult.billingOrderId;\n        } else {\n          const errMsg = ensureResult?.error ?? 'Failed to create billing order';\n          setCheckoutState('error');\n          setError(errMsg);\n          return {\n            success: false,\n            provider,\n            subtotal: chargeAmount,\n            taxAmount: 0,\n            taxRate: 0,\n            total: chargeAmount,\n            taxType: 'NONE',\n            jurisdiction: 'UNKNOWN',\n            currency: selectedCurrency,\n            error: errMsg,\n          };\n        }\n      }\n\n      // ========================================\n      // CREDITS PAYMENT - use spendCredits mutation\n      // Supports multiple addons\n      // ========================================\n      if (provider === 'CREDITS') {\n        const addonItems = items.filter((item) => item.type === 'ADDON');\n        const planItem = items.find((item) => item.type === 'PLAN');\n\n        const { data } = await spendCreditsMutation({\n          variables: {\n            input: {\n              billingAccountId: billingAccount.id,\n              // Store order purchase: the only one of planId/addOnIds/orderId\n              // spendCredits actually needs for this purchase type. Without\n              // it, the mutation has nothing to charge and the backend\n              // rejects it outright (BOFF-7192).\n              orderId: purchaseType === 'ORDER' ? billingOrderId : undefined,\n              planId: planItem ? (planItem.metadata?.planId as string) || planItem.id : undefined,\n              // Multiple addons supported via addOnIds array\n              addOnIds:\n                addonItems.length > 0\n                  ? addonItems.map((item) => ({\n                      id: (item.metadata?.addonId as string) || item.id,\n                      quantity: item.quantity,\n                    }))\n                  : undefined,\n              isAnnual: planItem?.metadata?.duration === 'yearly',\n              // Include upgrade context if changing plans\n              upgradeFromSubscriptionId: upgradeFromSubscriptionId || undefined,\n              // Include downgrade context if downgrading\n              downgradeFromSubscriptionId: downgradeFromSubscriptionId || undefined,\n              // For addon purchases - subscription to attach to\n              subscriptionId: addonItems.length > 0 ? selectedSubscriptionId : undefined,\n              // For PER_SEAT plans - pass seat count for credit calculation + subscription storage\n              seatCount: planItem?.metadata?.seatCount as number | undefined,\n            },\n          },\n        });\n\n        const response = data?.spendCredits;\n\n        if (!response?.creditTransactionID) {\n          setCheckoutState('error');\n          setError('Failed to process credit payment');\n          return {\n            success: false,\n            provider: 'CREDITS',\n            subtotal: chargeAmount,\n            taxAmount: 0,\n            taxRate: 0,\n            total: chargeAmount,\n            taxType: 'NONE',\n            jurisdiction: 'UNKNOWN',\n            currency: selectedCurrency,\n            error: 'Failed to process credit payment',\n          };\n        }\n\n        setCheckoutState('success');\n        return {\n          success: true,\n          provider: 'CREDITS',\n          subtotal: chargeAmount,\n          taxAmount: 0,\n          taxRate: 0,\n          total: chargeAmount,\n          taxType: 'NONE',\n          jurisdiction: 'UNKNOWN',\n          currency: selectedCurrency,\n          // Return transaction ID for success handling\n          orderId: response.creditTransactionID,\n        };\n      }\n\n      // ========================================\n      // CARD PAYMENT (Stripe/Razorpay) - use initiatePayment\n      // Supports single or multiple addons\n      // Supports store orders (via orderId parameter)\n      // ========================================\n      const addonItems = items.filter((item) => item.type === 'ADDON');\n\n      // Build addon IDs and quantities for the mutation\n      const addonIds =\n        addonItems.length > 0\n          ? addonItems.map((item) => (item.metadata?.addonId as string) || item.id)\n          : undefined;\n      const quantities =\n        addonItems.length > 0 ? addonItems.map((item) => item.quantity) : undefined;\n\n      // Determine if this is an annual plan purchase\n      const planItem = items.find((item) => item.type === 'PLAN');\n      const isAnnualPlan = planItem?.metadata?.duration === 'yearly';\n\n      // Determine auto-renew payment method\n      const autoRenewPMId =\n        purchaseType === 'PLAN' && autoRenew\n          ? autoRenewPaymentMethodId || selectedPaymentMethodId || undefined\n          : undefined;\n\n      const { data } = await initiatePaymentMutation({\n        variables: {\n          input: {\n            billingAccountId: billingAccount.id,\n            amount: chargeAmount, // Note: Backend IGNORES this and calculates from DB\n            currency: selectedCurrency,\n            purchaseType,\n            provider: provider,\n            // Store order - use orderId parameter (billing order ID)\n            orderId: billingOrderId || undefined,\n            creditAmount: purchaseType === 'CREDITS' ? firstItem.quantity : undefined,\n            planId:\n              purchaseType === 'PLAN'\n                ? (firstItem.metadata?.planId as string) || firstItem.id\n                : undefined,\n            // Single addon (backwards compatible) - skip if store order\n            addonId:\n              purchaseType === 'ADDON' && addonItems.length === 1 && !billingOrderId\n                ? (addonItems[0].metadata?.addonId as string) || addonItems[0].id\n                : undefined,\n            quantity:\n              purchaseType === 'ADDON' && addonItems.length === 1 && !billingOrderId\n                ? addonItems[0].quantity\n                : undefined,\n            // Multiple addons (cart checkout) - skip if store order\n            addonIds:\n              purchaseType === 'ADDON' && addonItems.length > 1 && !billingOrderId\n                ? addonIds\n                : undefined,\n            quantities:\n              purchaseType === 'ADDON' && addonItems.length > 1 && !billingOrderId\n                ? quantities\n                : undefined,\n            // For addon purchases - subscription to attach to (skip for store orders)\n            subscriptionId:\n              purchaseType === 'ADDON' && !billingOrderId ? selectedSubscriptionId : undefined,\n            // Saved card support\n            paymentMethodId: selectedPaymentMethodId || undefined,\n            // Save card if: user checked save card OR auto-renewal is enabled (which requires a saved card)\n            // Only save if not using existing card (selectedPaymentMethodId is null)\n            saveCard: !selectedPaymentMethodId ? saveCard || autoRenew : undefined,\n            // Include upgrade context if changing plans\n            upgradeFromSubscriptionId: upgradeFromSubscriptionId || undefined,\n            // Include downgrade context if downgrading\n            downgradeFromSubscriptionId: downgradeFromSubscriptionId || undefined,\n            // Annual plan flag (for pricing calculation)\n            isAnnual: isAnnualPlan || undefined,\n            // Promo code (validated and applied on backend)\n            promoCode: promoCode || undefined,\n            // Auto-renewal (for plan purchases only)\n            autoRenew: purchaseType === 'PLAN' && autoRenew ? true : undefined,\n            autoRenewPaymentMethodId: autoRenewPMId,\n          },\n        },\n      });\n\n      const response = data?.initiatePayment;\n\n      if (!response?.success) {\n        setCheckoutState('error');\n        setError(response?.error ?? 'Payment initiation failed');\n        return {\n          success: false,\n          provider: provider,\n          subtotal: chargeAmount,\n          taxAmount: 0,\n          taxRate: 0,\n          total: chargeAmount,\n          taxType: 'NONE',\n          jurisdiction: 'UNKNOWN',\n          currency: selectedCurrency,\n          error: response?.error ?? 'Payment initiation failed',\n        };\n      }\n\n      // Note: Tax is already calculated upfront in the effect, don't overwrite\n      // The response tax is in converted currency which would mess up display\n      setCheckoutState('success');\n\n      return response;\n    } catch (err) {\n      const errorMessage = err instanceof Error ? err.message : 'An error occurred';\n      setCheckoutState('error');\n      setError(errorMessage);\n      return {\n        success: false,\n        provider: 'AUTO',\n        subtotal: 0,\n        taxAmount: 0,\n        taxRate: 0,\n        total: 0,\n        taxType: 'NONE',\n        jurisdiction: 'UNKNOWN',\n        currency: selectedCurrency,\n        error: errorMessage,\n      };\n    }\n  }, [\n    billingAccount,\n    items,\n    selectedCurrency,\n    selectedProvider,\n    subtotal,\n    discountAmount,\n    promoCode,\n    selectedPaymentMethodId,\n    saveCard,\n    autoRenew,\n    autoRenewPaymentMethodId,\n    selectedSubscriptionId,\n    upgradeFromSubscriptionId,\n    downgradeFromSubscriptionId,\n    initiatePaymentMutation,\n    ensureStoreOrderBillingOrderMutation,\n    spendCreditsMutation,\n  ]);\n\n  const reset = useCallback(() => {\n    setItems([]);\n    setBillingAccount(null);\n    setSelectedProvider('AUTO');\n    setSelectedCurrency(defaultCurrency);\n    setPromoCode('');\n    setPromoDiscount(0);\n    setPromoDiscountType('PERCENTAGE');\n    setUseCredits(false);\n    setCreditsToUse(0);\n    setCheckoutState('idle');\n    setError(null);\n    setTaxAmount(0);\n    setTaxRate(0);\n    setTaxType('NONE');\n    setSelectedPaymentMethodId(null);\n    setSaveCard(defaultSaveCard);\n    setAutoRenew(false);\n    setAutoRenewPaymentMethodId(null);\n    setSelectedSubscriptionId(defaultSubscriptionId ?? null);\n  }, [defaultCurrency, defaultSaveCard, defaultSubscriptionId]);\n\n  return {\n    // State\n    items,\n    billingAccount,\n    selectedProvider,\n    selectedCurrency,\n    promoCode,\n    promoDiscount,\n    promoDiscountType,\n    useCredits,\n    creditsToUse,\n    checkoutState,\n    error,\n\n    // Saved card state\n    selectedPaymentMethodId,\n    saveCard,\n\n    // Auto-pay state\n    autoRenew,\n    autoRenewPaymentMethodId,\n\n    // Subscription state (for addon purchases)\n    selectedSubscriptionId,\n\n    // Computed\n    subtotal,\n    subtotalUSD,\n    discountAmount,\n    taxAmount,\n    taxRate,\n    taxType,\n    total,\n    totalInSelectedCurrency,\n    availableCredits,\n    creditsRequired,\n    hasEnoughCredits,\n    canPayWithCredits,\n    isLoading,\n    isProcessing,\n    isCalculatingTax: false, // Tax is calculated synchronously now\n    conversionRate,\n    convertedAmount,\n\n    // Actions\n    addItem,\n    removeItem,\n    updateItemQuantity,\n    updateItemPrice,\n    clearItems,\n    setBillingAccount: handleSetBillingAccount,\n    setPaymentProvider: handleSetPaymentProvider,\n    setCurrency: handleSetCurrency,\n    setPromoCode,\n    validatePromoCode,\n    clearPromoCode,\n    setUseCredits,\n    setCreditsToUse: handleSetCreditsToUse,\n    setSelectedPaymentMethodId,\n    setSaveCard,\n    setAutoRenew,\n    setAutoRenewPaymentMethodId,\n    setSelectedSubscriptionId,\n    initiatePayment,\n    reset,\n  };\n}\n"],"mappings":"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"}

package/dist/billing/modules/credits/pages/CreditWithdrawalPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreditWithdrawalPage.js","names":[],"sources":["../../../../../src/billing/modules/credits/pages/CreditWithdrawalPage.tsx"],"sourcesContent":["/**\n * Credits Module - Credit Withdrawal Page\n * Allows users to withdraw withdrawable credits (purchased + earned) to a payout account.\n */\n\nimport { useState, useEffect, type FC } from 'react';\nimport {\n  CreditWithdrawalHistoryDocument,\n  GetCreditBalanceByTypeDocument,\n  RequestCreditWithdrawalDocument,\n  useGetCostOfCreditsCheckoutQuery,\n} from '../../../../generated/global-operations';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport { useBillingEventEmitter } from '../../../hooks/useBillingEventEmitter';\nimport { useBilling } from '../../../providers/BillingProvider';\nimport {\n  useBillingAccount,\n  useBillingAccounts,\n  useDefaultBillingAccount,\n} from '../../subscriptions/hooks';\nimport { directBillingGraphqlRequest } from '../../../shared/utils';\nimport {\n  fetchPayoutAccounts,\n  addPayoutAccount,\n  type PayoutAccount,\n  type PayoutRequest,\n} from '../../earnings/api';\nimport { formatDate, formatRelativeTime } from '../../../shared/utils/format';\nimport { statusTokens } from '../../../shared/utils/tokens';\nimport type { CreditBalanceByType } from '../../../shared/types';\nimport { PagePurpose, EmphasisPanel, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\n\n// ============================================================================\n// API helpers (credit-specific)\n// ============================================================================\n\ninterface GatewayContext {\n  apiGatewayUrl?: string;\n  authToken?: string;\n  orgId?: string;\n}\n\nasync function fetchCreditBalanceByType(\n  billingAccountId: string,\n  ctx: GatewayContext\n): Promise<CreditBalanceByType> {\n  const data = await directBillingGraphqlRequest<\n    { getCreditBalanceByType: CreditBalanceByType },\n    { billingAccountId: string }\n  >({\n    ...ctx,\n    query: GetCreditBalanceByTypeDocument,\n    variables: { billingAccountId },\n  });\n  return data.getCreditBalanceByType;\n}\n\nasync function requestCreditWithdrawal(\n  input: {\n    billingAccountId: string;\n    creditAmount: number;\n    payoutAccountId: string;\n    currency?: string;\n    notes?: string;\n  },\n  ctx: GatewayContext\n): Promise<{ id: string; status: string; requestedAmount: number; currency: string }> {\n  const data = await directBillingGraphqlRequest<\n    {\n      requestCreditWithdrawal: {\n        id: string;\n        status: string;\n        requestedAmount: number;\n        currency: string;\n      };\n    },\n    { input: typeof input }\n  >({\n    ...ctx,\n    query: RequestCreditWithdrawalDocument,\n    variables: { input },\n  });\n  return data.requestCreditWithdrawal;\n}\n\nasync function fetchCreditWithdrawalHistory(\n  billingAccountId: string,\n  ctx: GatewayContext\n): Promise<PayoutRequest[]> {\n  const data = await directBillingGraphqlRequest<\n    { myPayoutRequests: { items: PayoutRequest[] } },\n    { billingAccountId: string }\n  >({\n    ...ctx,\n    query: CreditWithdrawalHistoryDocument,\n    variables: { billingAccountId },\n  });\n  return data.myPayoutRequests.items;\n}\n\n// ============================================================================\n// Sub-components\n// ============================================================================\n\ninterface BalanceCardProps {\n  label: string;\n  value: number;\n  description?: string;\n  highlight?: boolean;\n}\n\nconst BalanceCard: FC<BalanceCardProps> = ({ label, value, description, highlight }) => {\n  const body = (\n    <>\n      <p className=\"text-sm text-text-secondary\">{label}</p>\n      <p\n        className={`text-2xl font-bold mt-1 ${highlight ? 'text-text-link' : 'text-text-primary'}`}\n      >\n        {value.toLocaleString()} <span className=\"text-base font-normal\">credits</span>\n      </p>\n      {description && <p className=\"text-xs text-text-secondary mt-1\">{description}</p>}\n    </>\n  );\n  // The withdrawable balance is the single most important figure on this page —\n  // render it as the page's one emphasis zone.\n  if (highlight) {\n    return <EmphasisPanel className=\"p-5\">{body}</EmphasisPanel>;\n  }\n  return <div className=\"border border-border-subtle rounded-lg p-5 bg-bg-surface\">{body}</div>;\n};\n\nfunction getWithdrawalStatusColor(status: string): string {\n  switch (status.toUpperCase()) {\n    case 'PAID':\n      return statusTokens.success.text;\n    case 'APPROVED':\n    case 'PROCESSING':\n      return statusTokens.info.text;\n    case 'REQUESTED':\n      return statusTokens.warning.text;\n    case 'REJECTED':\n    case 'FAILED':\n    case 'CANCELED':\n      return statusTokens.error.text;\n    default:\n      return 'text-text-secondary';\n  }\n}\n\nfunction getWithdrawalStatusBg(status: string): string {\n  switch (status.toUpperCase()) {\n    case 'PAID':\n      return `${statusTokens.success.bg} ${statusTokens.success.text}`;\n    case 'APPROVED':\n    case 'PROCESSING':\n      return `${statusTokens.info.bg} ${statusTokens.info.text}`;\n    case 'REQUESTED':\n      return `${statusTokens.warning.bg} ${statusTokens.warning.text}`;\n    case 'REJECTED':\n    case 'FAILED':\n    case 'CANCELED':\n      return `${statusTokens.error.bg} ${statusTokens.error.text}`;\n    default:\n      return 'bg-bg-sunken text-text-secondary';\n  }\n}\n\n// ============================================================================\n// Main Page\n// ============================================================================\n\nexport const CreditWithdrawalPage: FC = () => {\n  const permissions = useBillingPermissions();\n  const { billingAccounts } = useBillingAccounts();\n  const [selectedBillingAccountId, setSelectedBillingAccountId] = useState<string | undefined>(\n    undefined\n  );\n  const { billingAccount: defaultBillingAccount, isLoading: isLoadingDefaultAccount } =\n    useDefaultBillingAccount();\n  const { billingAccount: explicitBillingAccount, isLoading: isLoadingExplicitAccount } =\n    useBillingAccount(selectedBillingAccountId);\n  const billingAccount = selectedBillingAccountId ? explicitBillingAccount : defaultBillingAccount;\n  const isLoadingAccount = selectedBillingAccountId\n    ? isLoadingExplicitAccount\n    : isLoadingDefaultAccount;\n  const { apiGatewayUrl, authToken, orgId } = useBilling();\n  const { emit } = useBillingEventEmitter();\n\n  // Balance state\n  const [balance, setBalance] = useState<CreditBalanceByType | null>(null);\n  const [isLoadingBalance, setIsLoadingBalance] = useState(false);\n  const [balanceError, setBalanceError] = useState<string | null>(null);\n\n  // Payout accounts state\n  const [payoutAccounts, setPayoutAccounts] = useState<PayoutAccount[]>([]);\n  const [isLoadingAccounts, setIsLoadingAccounts] = useState(false);\n\n  // Withdrawal history state\n  const [history, setHistory] = useState<PayoutRequest[]>([]);\n  const [isLoadingHistory, setIsLoadingHistory] = useState(false);\n\n  // Withdrawal form state\n  const [selectedAccountId, setSelectedAccountId] = useState<string>('');\n  const [creditAmount, setCreditAmount] = useState<string>('');\n  const [notes, setNotes] = useState<string>('');\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitError, setSubmitError] = useState<string | null>(null);\n  const [submitSuccess, setSubmitSuccess] = useState(false);\n\n  // New payout account form state\n  const [showAddAccount, setShowAddAccount] = useState(false);\n  const [accountForm, setAccountForm] = useState({\n    label: '',\n    type: 'BANK_ACCOUNT' as 'BANK_ACCOUNT' | 'UPI',\n    accountHolderName: '',\n    accountNumber: '',\n    ifscCode: '',\n    routingNumber: '',\n    upiId: '',\n    country: '',\n    currency: 'USD',\n  });\n  const [isAddingAccount, setIsAddingAccount] = useState(false);\n  const [addAccountError, setAddAccountError] = useState<string | null>(null);\n\n  const billingAccountId = billingAccount?.id;\n\n  const getCtx = (): GatewayContext => ({\n    apiGatewayUrl,\n    authToken,\n    orgId,\n  });\n\n  const loadBalance = async () => {\n    if (!billingAccountId) return;\n    setIsLoadingBalance(true);\n    setBalanceError(null);\n    try {\n      const b = await fetchCreditBalanceByType(billingAccountId, getCtx());\n      setBalance(b);\n    } catch (e) {\n      setBalanceError(e instanceof Error ? e.message : 'Failed to load balance');\n    } finally {\n      setIsLoadingBalance(false);\n    }\n  };\n\n  const loadAccounts = async () => {\n    if (!billingAccountId) return;\n    setIsLoadingAccounts(true);\n    try {\n      const accounts = await fetchPayoutAccounts(billingAccountId, getCtx());\n      setPayoutAccounts(accounts);\n      const defaultAcc = accounts.find((a) => a.isDefault) ?? accounts[0];\n      if (defaultAcc) setSelectedAccountId(defaultAcc.id);\n    } catch {\n      // silently fail - user will see empty state\n    } finally {\n      setIsLoadingAccounts(false);\n    }\n  };\n\n  const loadHistory = async () => {\n    if (!billingAccountId) return;\n    setIsLoadingHistory(true);\n    try {\n      const items = await fetchCreditWithdrawalHistory(billingAccountId, getCtx());\n      setHistory(items);\n    } catch {\n      // silently fail\n    } finally {\n      setIsLoadingHistory(false);\n    }\n  };\n\n  useEffect(() => {\n    if (billingAccountId) {\n      void loadBalance();\n      void loadAccounts();\n      void loadHistory();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [billingAccountId]);\n\n  // Sync payout account currency to billing account currency when it loads\n  useEffect(() => {\n    if (billingAccount?.currency) {\n      setAccountForm((f) => ({ ...f, currency: billingAccount.currency ?? 'USD' }));\n    }\n  }, [billingAccount?.currency]);\n\n  const handleAddAccount = async () => {\n    if (!billingAccountId) return;\n    setAddAccountError(null);\n    setIsAddingAccount(true);\n    try {\n      const isIndia =\n        accountForm.country.trim().toUpperCase() === 'IN' ||\n        accountForm.country.trim().toLowerCase() === 'india';\n\n      await addPayoutAccount(\n        {\n          billingAccountId,\n          label: accountForm.label,\n          type: accountForm.type,\n          accountHolderName: accountForm.accountHolderName,\n          country: accountForm.country || undefined,\n          currency: accountForm.currency,\n          ...(accountForm.type === 'BANK_ACCOUNT' && {\n            accountNumber: accountForm.accountNumber,\n            ...(isIndia\n              ? { ifsc: accountForm.ifscCode }\n              : { routingNumber: accountForm.routingNumber }),\n          }),\n          ...(accountForm.type === 'UPI' && { upiId: accountForm.upiId }),\n        },\n        getCtx()\n      );\n      emit('billing.payout_account.added', {\n        route: '/billing/credits/withdraw',\n        entityId: billingAccountId,\n        source: 'credit-withdrawal',\n      });\n      await loadAccounts();\n      setShowAddAccount(false);\n      setAccountForm({\n        label: '',\n        type: 'BANK_ACCOUNT' as 'BANK_ACCOUNT' | 'UPI',\n        accountHolderName: '',\n        accountNumber: '',\n        ifscCode: '',\n        routingNumber: '',\n        upiId: '',\n        country: '',\n        currency: 'USD',\n      });\n    } catch (e) {\n      setAddAccountError(e instanceof Error ? e.message : 'Failed to add account');\n    } finally {\n      setIsAddingAccount(false);\n    }\n  };\n\n  const handleWithdraw = async () => {\n    if (!billingAccountId || !selectedAccountId) return;\n    const amount = parseFloat(creditAmount);\n    if (!amount || amount <= 0) return;\n\n    setSubmitError(null);\n    setIsSubmitting(true);\n    try {\n      const withdrawal = await requestCreditWithdrawal(\n        {\n          billingAccountId,\n          creditAmount: amount,\n          payoutAccountId: selectedAccountId,\n          notes: notes || undefined,\n        },\n        getCtx()\n      );\n      emit('billing.credits.withdrawal_requested', {\n        route: '/billing/credits/withdraw',\n        entityId: withdrawal.id,\n        source: 'credit-withdrawal',\n        amount,\n      });\n      setSubmitSuccess(true);\n      setCreditAmount('');\n      setNotes('');\n      await loadBalance();\n      await loadHistory();\n    } catch (e) {\n      setSubmitError(e instanceof Error ? e.message : 'Withdrawal request failed');\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  const accountCurrency = billingAccount?.currency ?? 'USD';\n  const withdrawAmount = parseFloat(creditAmount) || 0;\n\n  const { data: costData, loading: isFetchingCost } = useGetCostOfCreditsCheckoutQuery({\n    variables: { creditAmount: withdrawAmount, currency: accountCurrency },\n    skip: withdrawAmount <= 0 || !billingAccount,\n  });\n\n  const estimatedPayout = costData?.getCostOfCredits?.amount;\n\n  // Permission check\n  if (!permissions.canWithdrawCredits) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <div className=\"size-12 mx-auto rounded-full bg-bg-sunken flex items-center justify-center\">\n            <svg\n              className=\"size-6 text-text-secondary\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-lg font-semibold text-text-primary\">Access Denied</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You don&apos;t have permission to withdraw credits.\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  if (!isLoadingAccount && !billingAccount) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <h2 className=\"text-lg font-semibold text-text-primary\">No Billing Account</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You need a billing account to withdraw credits.\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  if (isLoadingAccount && !billingAccount) {\n    return (\n      <div className=\"space-y-6 px-6 lg:px-8 py-6\">\n        <div className=\"h-8 w-64 bg-bg-sunken animate-pulse rounded\" />\n        <div className=\"grid grid-cols-2 lg:grid-cols-4 gap-4\">\n          {[1, 2, 3, 4].map((i) => (\n            <div key={i} className=\"border border-border-subtle rounded-lg p-5\">\n              <div className=\"h-4 w-24 bg-bg-sunken animate-pulse rounded mb-2\" />\n              <div className=\"h-8 w-32 bg-bg-sunken animate-pulse rounded\" />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n  const withdrawable = balance?.withdrawable ?? 0;\n  // Small epsilon so a Decimal→number conversion on the server (e.g.\n  // 34.999999999999997) can never make \"the exact max\" silently fail this\n  // check with no visible reason (BOFF-7192).\n  const AMOUNT_EPSILON = 0.005;\n  const amountValid = withdrawAmount > 0 && withdrawAmount <= withdrawable + AMOUNT_EPSILON;\n  const activeAccounts = payoutAccounts.filter((a) => a.status !== 'ARCHIVED');\n\n  // Exactly which condition is currently blocking the request — shown next to\n  // the button instead of just disabling it silently (BOFF-7192).\n  const withdrawBlockedReason = isSubmitting\n    ? null\n    : activeAccounts.length === 0\n      ? 'Add a payout method above before requesting a withdrawal.'\n      : !selectedAccountId\n        ? 'Select a payout method above.'\n        : !(withdrawAmount > 0)\n          ? 'Enter an amount to withdraw.'\n          : withdrawAmount > withdrawable + AMOUNT_EPSILON\n            ? `Amount exceeds your withdrawable balance of ${withdrawable.toLocaleString()} credits.`\n            : null;\n\n  return (\n    <div className=\"space-y-6 px-6 lg:px-8 py-6\">\n      {/* Header */}\n      <div className=\"flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4\">\n        <div>\n          <h1 className=\"text-2xl md:text-3xl font-semibold tracking-tight text-text-primary\">\n            Withdraw Credits\n          </h1>\n          <p className=\"text-sm text-text-secondary mt-1\">\n            Convert your withdrawable credits (purchased &amp; earned) to a payout\n          </p>\n          <PagePurpose className=\"mt-3\">\n            Turn the credits you bought or earned (from sales and referrals) back into real money. Add\n            a bank account or UPI as a payout destination, request a withdrawal for any amount up to\n            your withdrawable balance, and track each request here until it is paid. Granted credits\n            (coupons, admin grants) are not withdrawable.\n          </PagePurpose>\n        </div>\n\n        {/* Billing Account Switcher — only shown when the org has more than one account */}\n        {billingAccounts.length > 1 && (\n          <select\n            value={billingAccount?.id ?? ''}\n            onChange={(e) => setSelectedBillingAccountId(e.target.value)}\n            aria-label=\"Switch billing account\"\n            className=\"px-3 py-2 text-sm border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] w-full sm:min-w-[200px] sm:w-auto\"\n          >\n            {billingAccounts.map((account) => (\n              <option key={account.id} value={account.id}>\n                {account.name}\n              </option>\n            ))}\n          </select>\n        )}\n      </div>\n\n      {/* Balance breakdown */}\n      <div className=\"grid grid-cols-2 lg:grid-cols-4 gap-4\">\n        {isLoadingBalance ? (\n          [1, 2, 3, 4].map((i) => (\n            <div key={i} className=\"border border-border-subtle rounded-lg p-5\">\n              <div className=\"h-4 w-20 bg-bg-sunken animate-pulse rounded mb-2\" />\n              <div className=\"h-8 w-28 bg-bg-sunken animate-pulse rounded\" />\n            </div>\n          ))\n        ) : balanceError ? (\n          <div className=\"col-span-4 text-sm text-status-error-text\">{balanceError}</div>\n        ) : (\n          <>\n            <BalanceCard\n              label=\"Purchased\"\n              value={balance?.purchased ?? 0}\n              description=\"From credit purchases\"\n            />\n            <BalanceCard\n              label=\"Earned\"\n              value={balance?.earned ?? 0}\n              description=\"From sales & referrals\"\n            />\n            <BalanceCard\n              label=\"Granted\"\n              value={balance?.granted ?? 0}\n              description=\"Coupons & admin grants — non-withdrawable\"\n            />\n            <BalanceCard\n              label=\"Withdrawable\"\n              value={withdrawable}\n              description=\"Purchased + earned\"\n              highlight\n            />\n          </>\n        )}\n      </div>\n\n      {/* Success banner */}\n      {submitSuccess && (\n        <div className=\"flex items-center gap-3 p-4 rounded-lg bg-status-success-bg-subtle border border-status-success-border text-status-success-text\">\n          <svg className=\"size-5 shrink-0\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 13l4 4L19 7\" />\n          </svg>\n          <div>\n            <p className=\"font-medium\">Withdrawal request submitted</p>\n            <p className=\"text-sm opacity-80\">Our team will review and process your request.</p>\n          </div>\n          <button\n            type=\"button\"\n            onClick={() => setSubmitSuccess(false)}\n            className=\"ml-auto text-current opacity-60 hover:opacity-100\"\n          >\n            <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M6 18L18 6M6 6l12 12\"\n              />\n            </svg>\n          </button>\n        </div>\n      )}\n\n      {/* Main two-column layout */}\n      <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-6\">\n        {/* Left: Payout account management */}\n        <div className=\"space-y-4\">\n          <div className=\"flex items-center justify-between\">\n            <h2 className=\"text-base font-semibold text-text-primary\">Payout Account</h2>\n            <button\n              type=\"button\"\n              onClick={() => setShowAddAccount((v) => !v)}\n              className=\"text-sm text-text-link hover:underline\"\n            >\n              {showAddAccount ? 'Cancel' : '+ Add new'}\n            </button>\n          </div>\n\n          {/* Add account form */}\n          {showAddAccount && (\n            <div className=\"border border-border-subtle rounded-lg p-4 space-y-3 bg-bg-sunken\">\n              <h3 className=\"text-sm font-medium text-text-primary\">New Payout Account</h3>\n\n              <div>\n                <label className=\"block text-xs text-text-secondary mb-1\">Label</label>\n                <input\n                  type=\"text\"\n                  value={accountForm.label}\n                  onChange={(e) => setAccountForm((f) => ({ ...f, label: e.target.value }))}\n                  placeholder=\"e.g. My Bank Account\"\n                  className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                />\n              </div>\n\n              <div>\n                <label className=\"block text-xs text-text-secondary mb-1\">\n                  Account Holder Name\n                </label>\n                <input\n                  type=\"text\"\n                  value={accountForm.accountHolderName}\n                  onChange={(e) =>\n                    setAccountForm((f) => ({ ...f, accountHolderName: e.target.value }))\n                  }\n                  placeholder=\"Full name as on bank account\"\n                  className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                />\n              </div>\n\n              <div className=\"grid grid-cols-2 gap-3\">\n                <div>\n                  <label className=\"block text-xs text-text-secondary mb-1\">Type</label>\n                  <select\n                    value={accountForm.type}\n                    onChange={(e) =>\n                      setAccountForm((f) => ({\n                        ...f,\n                        type: e.target.value as typeof accountForm.type,\n                      }))\n                    }\n                    className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  >\n                    <option value=\"BANK_ACCOUNT\">Bank Account</option>\n                    <option value=\"UPI\">UPI</option>\n                  </select>\n                </div>\n\n                <div>\n                  <label className=\"block text-xs text-text-secondary mb-1\">Country</label>\n                  <input\n                    type=\"text\"\n                    value={accountForm.country}\n                    onChange={(e) => setAccountForm((f) => ({ ...f, country: e.target.value }))}\n                    placeholder=\"e.g. India, US, UK\"\n                    className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              </div>\n\n              {accountForm.type === 'BANK_ACCOUNT' && (\n                <>\n                  <div>\n                    <label className=\"block text-xs text-text-secondary mb-1\">Account Number</label>\n                    <input\n                      type=\"text\"\n                      value={accountForm.accountNumber}\n                      onChange={(e) =>\n                        setAccountForm((f) => ({ ...f, accountNumber: e.target.value }))\n                      }\n                      placeholder=\"Account number\"\n                      className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                  {accountForm.country.trim().toUpperCase() === 'IN' ||\n                  accountForm.country.trim().toLowerCase() === 'india' ? (\n                    <div>\n                      <label className=\"block text-xs text-text-secondary mb-1\">IFSC Code</label>\n                      <input\n                        type=\"text\"\n                        value={accountForm.ifscCode}\n                        onChange={(e) =>\n                          setAccountForm((f) => ({ ...f, ifscCode: e.target.value.toUpperCase() }))\n                        }\n                        placeholder=\"e.g. SBIN0001234\"\n                        className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  ) : (\n                    <div>\n                      <label className=\"block text-xs text-text-secondary mb-1\">\n                        Routing Number\n                      </label>\n                      <input\n                        type=\"text\"\n                        value={accountForm.routingNumber}\n                        onChange={(e) =>\n                          setAccountForm((f) => ({ ...f, routingNumber: e.target.value }))\n                        }\n                        placeholder=\"Routing / sort code\"\n                        className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  )}\n                </>\n              )}\n\n              {accountForm.type === 'UPI' && (\n                <div>\n                  <label className=\"block text-xs text-text-secondary mb-1\">UPI ID</label>\n                  <input\n                    type=\"text\"\n                    value={accountForm.upiId}\n                    onChange={(e) => setAccountForm((f) => ({ ...f, upiId: e.target.value }))}\n                    placeholder=\"yourname@upi\"\n                    className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              )}\n\n              {addAccountError && (\n                <p className=\"text-xs text-status-error-text\">{addAccountError}</p>\n              )}\n\n              <button\n                type=\"button\"\n                onClick={() => void handleAddAccount()}\n                disabled={isAddingAccount || !accountForm.label || !accountForm.accountHolderName}\n                className=\"w-full py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n              >\n                {isAddingAccount ? 'Saving…' : 'Save Account'}\n              </button>\n            </div>\n          )}\n\n          {/* Existing accounts */}\n          {isLoadingAccounts ? (\n            <div className=\"space-y-2\">\n              {[1, 2].map((i) => (\n                <div\n                  key={i}\n                  className=\"h-16 border border-border-subtle rounded-lg bg-bg-sunken animate-pulse\"\n                />\n              ))}\n            </div>\n          ) : activeAccounts.length === 0 && !showAddAccount ? (\n            <IllustratedEmptyState\n              illustration=\"empty-generic\"\n              title=\"No payout accounts yet\"\n              description=\"Add a bank account or UPI to receive your withdrawn credits.\"\n              action={\n                <button\n                  type=\"button\"\n                  onClick={() => setShowAddAccount(true)}\n                  className=\"px-4 py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors\"\n                >\n                  Add a bank account or UPI\n                </button>\n              }\n            />\n          ) : (\n            <div className=\"space-y-2\">\n              {activeAccounts.map((account) => (\n                <button\n                  type=\"button\"\n                  key={account.id}\n                  onClick={() => setSelectedAccountId(account.id)}\n                  className={`w-full text-left p-4 border rounded-lg transition-colors ${\n                    selectedAccountId === account.id\n                      ? 'border-border-strong bg-[var(--color-accent-soft)]'\n                      : 'border-border-subtle bg-bg-surface hover:border-border-strong'\n                  }`}\n                >\n                  <div className=\"flex items-center justify-between\">\n                    <div>\n                      <p className=\"text-sm font-medium text-text-primary\">{account.label}</p>\n                      <p className=\"text-xs text-text-secondary mt-0.5\">\n                        {account.type.replaceAll('_', ' ')}\n                        {account.displayName ? ` · ${account.displayName}` : ''}\n                        {account.accountLast4 ? ` ···${account.accountLast4}` : ''}\n                        {account.country ? ` · ${account.country}` : ''}\n                      </p>\n                    </div>\n                    <div className=\"flex items-center gap-2\">\n                      {account.isDefault && (\n                        <span className=\"text-xs px-2 py-0.5 rounded bg-[var(--color-accent-soft)] text-text-link font-medium\">\n                          Default\n                        </span>\n                      )}\n                      <span\n                        className={`text-xs px-2 py-0.5 rounded font-medium ${\n                          account.status === 'ACTIVE'\n                            ? `${statusTokens.success.bg} ${statusTokens.success.text}`\n                            : account.status === 'PENDING_VERIFICATION'\n                              ? `${statusTokens.warning.bg} ${statusTokens.warning.text}`\n                              : `${statusTokens.error.bg} ${statusTokens.error.text}`\n                        }`}\n                      >\n                        {account.status.replaceAll('_', ' ').toLowerCase()}\n                      </span>\n                      {selectedAccountId === account.id && (\n                        <svg\n                          className=\"size-4 text-text-link shrink-0\"\n                          fill=\"none\"\n                          viewBox=\"0 0 24 24\"\n                          stroke=\"currentColor\"\n                        >\n                          <path\n                            strokeLinecap=\"round\"\n                            strokeLinejoin=\"round\"\n                            strokeWidth={2}\n                            d=\"M5 13l4 4L19 7\"\n                          />\n                        </svg>\n                      )}\n                    </div>\n                  </div>\n                </button>\n              ))}\n            </div>\n          )}\n        </div>\n\n        {/* Right: Withdrawal request form */}\n        <div className=\"space-y-4\">\n          <h2 className=\"text-base font-semibold text-text-primary\">Request Withdrawal</h2>\n\n          <div className=\"border border-border-subtle rounded-lg p-5 bg-bg-surface space-y-4\">\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                Credits to Withdraw\n              </label>\n              <input\n                type=\"number\"\n                min={1}\n                max={withdrawable}\n                step={1}\n                value={creditAmount}\n                onChange={(e) => setCreditAmount(e.target.value)}\n                placeholder=\"Enter credit amount\"\n                className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n              />\n              <p className=\"text-xs text-text-secondary mt-1\">\n                Max withdrawable:{' '}\n                <span className=\"font-medium\">{withdrawable.toLocaleString()} credits</span>\n              </p>\n              {withdrawAmount > 0 && withdrawAmount <= withdrawable + AMOUNT_EPSILON && (\n                <p className=\"text-xs text-text-secondary mt-1\">\n                  {isFetchingCost ? (\n                    'Calculating…'\n                  ) : estimatedPayout != null ? (\n                    <>\n                      Estimated payout:{' '}\n                      <span className=\"font-semibold text-text-primary\">\n                        {estimatedPayout.toLocaleString(undefined, {\n                          style: 'currency',\n                          currency: accountCurrency,\n                          minimumFractionDigits: 2,\n                          maximumFractionDigits: 2,\n                        })}\n                      </span>{' '}\n                      at the current credit rate\n                    </>\n                  ) : null}\n                </p>\n              )}\n              {withdrawAmount > 0 && withdrawAmount > withdrawable + AMOUNT_EPSILON && (\n                <p className=\"text-xs text-status-error-text mt-1\">\n                  Amount exceeds your withdrawable balance\n                </p>\n              )}\n            </div>\n\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                Notes <span className=\"text-text-secondary font-normal\">(optional)</span>\n              </label>\n              <textarea\n                value={notes}\n                onChange={(e) => setNotes(e.target.value)}\n                placeholder=\"Any notes for this withdrawal request\"\n                rows={2}\n                className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n              />\n            </div>\n\n            {submitError && (\n              <div className=\"p-3 rounded-button bg-status-error-bg-subtle border border-status-error-border\">\n                <p className=\"text-sm text-status-error-text\">{submitError}</p>\n              </div>\n            )}\n\n            <div className=\"pt-1 border-t border-border-subtle\">\n              <p className=\"text-xs text-text-secondary mb-3\">\n                Credits will be converted to {accountCurrency} at the current credit rate.\n                Withdrawals are reviewed before processing and may take 3–5 business days.\n              </p>\n              {/* Always say exactly why the button is disabled — never just gray it\n                  out with no explanation (BOFF-7192). */}\n              {withdrawBlockedReason && (\n                <p className=\"text-xs text-status-warning-text mb-2\">{withdrawBlockedReason}</p>\n              )}\n              <button\n                type=\"button\"\n                onClick={() => void handleWithdraw()}\n                disabled={\n                  isSubmitting || !amountValid || !selectedAccountId || activeAccounts.length === 0\n                }\n                className=\"w-full py-2.5 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n              >\n                {isSubmitting ? 'Submitting…' : 'Request Withdrawal'}\n              </button>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      {/* Withdrawal history */}\n      <div className=\"space-y-3\">\n        <div className=\"flex items-center justify-between\">\n          <h2 className=\"text-base font-semibold text-text-primary\">Withdrawal History</h2>\n          <button\n            type=\"button\"\n            onClick={() => void loadHistory()}\n            className=\"text-sm text-text-secondary hover:text-text-primary transition-colors\"\n            aria-label=\"Refresh withdrawal history\"\n          >\n            <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\"\n              />\n            </svg>\n          </button>\n        </div>\n\n        {isLoadingHistory ? (\n          <div className=\"space-y-2\">\n            {[1, 2, 3].map((i) => (\n              <div\n                key={i}\n                className=\"h-16 border border-border-subtle rounded-lg bg-bg-sunken animate-pulse\"\n              />\n            ))}\n          </div>\n        ) : history.length === 0 ? (\n          <IllustratedEmptyState\n            illustration=\"empty-data\"\n            title=\"No withdrawal requests yet\"\n            description=\"Once you request a withdrawal, its status will appear here.\"\n          />\n        ) : (\n          <div className=\"border border-border-subtle rounded-lg overflow-hidden\">\n            <table className=\"w-full text-sm\">\n              <thead className=\"bg-bg-sunken border-b border-border-subtle\">\n                <tr>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide\">\n                    Amount\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide\">\n                    Status\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden sm:table-cell\">\n                    Payout Account\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden md:table-cell\">\n                    Requested\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden md:table-cell\">\n                    Completed\n                  </th>\n                </tr>\n              </thead>\n              <tbody className=\"divide-y divide-border-subtle\">\n                {history.map((req) => (\n                  <tr key={req.id} className=\"hover:bg-bg-sunken transition-colors\">\n                    <td className=\"px-4 py-3 font-medium text-text-primary\">\n                      {req.requestedAmount.toLocaleString()} {req.currency}\n                    </td>\n                    <td className=\"px-4 py-3\">\n                      <span\n                        className={`inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${getWithdrawalStatusBg(req.status)}`}\n                      >\n                        {req.status.charAt(0) + req.status.slice(1).toLowerCase()}\n                      </span>\n                      {req.failureReason && (\n                        <p\n                          className=\"text-xs text-status-error-text mt-0.5 max-w-[180px] truncate\"\n                          title={req.failureReason}\n                        >\n                          {req.failureReason}\n                        </p>\n                      )}\n                    </td>\n                    <td className=\"px-4 py-3 text-text-secondary hidden sm:table-cell\">\n                      {req.payoutAccount ? (\n                        <span>\n                          {req.payoutAccount.label}\n                          {req.payoutAccount.accountLast4\n                            ? ` ···${req.payoutAccount.accountLast4}`\n                            : ''}\n                        </span>\n                      ) : (\n                        '—'\n                      )}\n                    </td>\n                    <td className=\"px-4 py-3 text-text-secondary hidden md:table-cell\">\n                      <span title={formatDate(req.createdAt, 'long')}>\n                        {formatRelativeTime(req.createdAt)}\n                      </span>\n                    </td>\n                    <td className=\"px-4 py-3 text-text-secondary hidden md:table-cell\">\n                      {req.paidAt ? (\n                        <span className={getWithdrawalStatusColor('PAID')}>\n                          {formatDate(req.paidAt, 'short')}\n                        </span>\n                      ) : (\n                        '—'\n                      )}\n                    </td>\n                  </tr>\n                ))}\n              </tbody>\n            </table>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"CreditWithdrawalPage.js","names":[],"sources":["../../../../../src/billing/modules/credits/pages/CreditWithdrawalPage.tsx"],"sourcesContent":["/**\n * Credits Module - Credit Withdrawal Page\n * Allows users to withdraw withdrawable credits (purchased + earned) to a payout account.\n */\n\nimport { useState, useEffect, type FC } from 'react';\nimport {\n  CreditWithdrawalHistoryDocument,\n  GetCreditBalanceByTypeDocument,\n  RequestCreditWithdrawalDocument,\n  useGetCostOfCreditsCheckoutQuery,\n} from '../../../../generated/global-operations';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport { useBillingEventEmitter } from '../../../hooks/useBillingEventEmitter';\nimport { useBilling } from '../../../providers/BillingProvider';\nimport {\n  useBillingAccount,\n  useBillingAccounts,\n  useDefaultBillingAccount,\n} from '../../subscriptions/hooks';\nimport { directBillingGraphqlRequest } from '../../../shared/utils';\nimport {\n  fetchPayoutAccounts,\n  addPayoutAccount,\n  type PayoutAccount,\n  type PayoutRequest,\n} from '../../earnings/api';\nimport { formatDate, formatRelativeTime } from '../../../shared/utils/format';\nimport { statusTokens } from '../../../shared/utils/tokens';\nimport type { CreditBalanceByType } from '../../../shared/types';\nimport { PagePurpose, EmphasisPanel, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\n\n// ============================================================================\n// API helpers (credit-specific)\n// ============================================================================\n\ninterface GatewayContext {\n  apiGatewayUrl?: string;\n  authToken?: string;\n  orgId?: string;\n}\n\nasync function fetchCreditBalanceByType(\n  billingAccountId: string,\n  ctx: GatewayContext\n): Promise<CreditBalanceByType> {\n  const data = await directBillingGraphqlRequest<\n    { getCreditBalanceByType: CreditBalanceByType },\n    { billingAccountId: string }\n  >({\n    ...ctx,\n    query: GetCreditBalanceByTypeDocument,\n    variables: { billingAccountId },\n  });\n  return data.getCreditBalanceByType;\n}\n\nasync function requestCreditWithdrawal(\n  input: {\n    billingAccountId: string;\n    creditAmount: number;\n    payoutAccountId: string;\n    currency?: string;\n    notes?: string;\n  },\n  ctx: GatewayContext\n): Promise<{ id: string; status: string; requestedAmount: number; currency: string }> {\n  const data = await directBillingGraphqlRequest<\n    {\n      requestCreditWithdrawal: {\n        id: string;\n        status: string;\n        requestedAmount: number;\n        currency: string;\n      };\n    },\n    { input: typeof input }\n  >({\n    ...ctx,\n    query: RequestCreditWithdrawalDocument,\n    variables: { input },\n  });\n  return data.requestCreditWithdrawal;\n}\n\nasync function fetchCreditWithdrawalHistory(\n  billingAccountId: string,\n  ctx: GatewayContext\n): Promise<PayoutRequest[]> {\n  const data = await directBillingGraphqlRequest<\n    { myPayoutRequests: { items: PayoutRequest[] } },\n    { billingAccountId: string }\n  >({\n    ...ctx,\n    query: CreditWithdrawalHistoryDocument,\n    variables: { billingAccountId },\n  });\n  return data.myPayoutRequests.items;\n}\n\n// ============================================================================\n// Sub-components\n// ============================================================================\n\ninterface BalanceCardProps {\n  label: string;\n  value: number;\n  description?: string;\n  highlight?: boolean;\n}\n\nconst BalanceCard: FC<BalanceCardProps> = ({ label, value, description, highlight }) => {\n  const body = (\n    <>\n      <p className=\"text-sm text-text-secondary\">{label}</p>\n      <p\n        className={`text-2xl font-bold mt-1 ${highlight ? 'text-text-link' : 'text-text-primary'}`}\n      >\n        {value.toLocaleString()} <span className=\"text-base font-normal\">credits</span>\n      </p>\n      {description && <p className=\"text-xs text-text-secondary mt-1\">{description}</p>}\n    </>\n  );\n  // The withdrawable balance is the single most important figure on this page —\n  // render it as the page's one emphasis zone.\n  if (highlight) {\n    return <EmphasisPanel className=\"p-5\">{body}</EmphasisPanel>;\n  }\n  return <div className=\"border border-border-subtle rounded-lg p-5 bg-bg-surface\">{body}</div>;\n};\n\nfunction getWithdrawalStatusColor(status: string): string {\n  switch (status.toUpperCase()) {\n    case 'PAID':\n      return statusTokens.success.text;\n    case 'APPROVED':\n    case 'PROCESSING':\n      return statusTokens.info.text;\n    case 'REQUESTED':\n      return statusTokens.warning.text;\n    case 'REJECTED':\n    case 'FAILED':\n    case 'CANCELED':\n      return statusTokens.error.text;\n    default:\n      return 'text-text-secondary';\n  }\n}\n\nfunction getWithdrawalStatusBg(status: string): string {\n  switch (status.toUpperCase()) {\n    case 'PAID':\n      return `${statusTokens.success.bg} ${statusTokens.success.text}`;\n    case 'APPROVED':\n    case 'PROCESSING':\n      return `${statusTokens.info.bg} ${statusTokens.info.text}`;\n    case 'REQUESTED':\n      return `${statusTokens.warning.bg} ${statusTokens.warning.text}`;\n    case 'REJECTED':\n    case 'FAILED':\n    case 'CANCELED':\n      return `${statusTokens.error.bg} ${statusTokens.error.text}`;\n    default:\n      return 'bg-bg-sunken text-text-secondary';\n  }\n}\n\n// ============================================================================\n// Main Page\n// ============================================================================\n\nexport const CreditWithdrawalPage: FC = () => {\n  const permissions = useBillingPermissions();\n  const { billingAccounts } = useBillingAccounts();\n  const [selectedBillingAccountId, setSelectedBillingAccountId] = useState<string | undefined>(\n    undefined\n  );\n  const { billingAccount: defaultBillingAccount, isLoading: isLoadingDefaultAccount } =\n    useDefaultBillingAccount();\n  const { billingAccount: explicitBillingAccount, isLoading: isLoadingExplicitAccount } =\n    useBillingAccount(selectedBillingAccountId);\n  const billingAccount = selectedBillingAccountId ? explicitBillingAccount : defaultBillingAccount;\n  const isLoadingAccount = selectedBillingAccountId\n    ? isLoadingExplicitAccount\n    : isLoadingDefaultAccount;\n  const { apiGatewayUrl, authToken, orgId } = useBilling();\n  const { emit } = useBillingEventEmitter();\n\n  // Balance state\n  const [balance, setBalance] = useState<CreditBalanceByType | null>(null);\n  const [isLoadingBalance, setIsLoadingBalance] = useState(false);\n  const [balanceError, setBalanceError] = useState<string | null>(null);\n\n  // Payout accounts state\n  const [payoutAccounts, setPayoutAccounts] = useState<PayoutAccount[]>([]);\n  const [isLoadingAccounts, setIsLoadingAccounts] = useState(false);\n\n  // Withdrawal history state\n  const [history, setHistory] = useState<PayoutRequest[]>([]);\n  const [isLoadingHistory, setIsLoadingHistory] = useState(false);\n\n  // Withdrawal form state\n  const [selectedAccountId, setSelectedAccountId] = useState<string>('');\n  const [creditAmount, setCreditAmount] = useState<string>('');\n  const [notes, setNotes] = useState<string>('');\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitError, setSubmitError] = useState<string | null>(null);\n  const [submitSuccess, setSubmitSuccess] = useState(false);\n\n  // New payout account form state\n  const [showAddAccount, setShowAddAccount] = useState(false);\n  const [accountForm, setAccountForm] = useState({\n    label: '',\n    type: 'BANK_ACCOUNT' as 'BANK_ACCOUNT' | 'UPI',\n    accountHolderName: '',\n    accountNumber: '',\n    ifscCode: '',\n    routingNumber: '',\n    upiId: '',\n    country: '',\n    currency: 'USD',\n  });\n  const [isAddingAccount, setIsAddingAccount] = useState(false);\n  const [addAccountError, setAddAccountError] = useState<string | null>(null);\n\n  const billingAccountId = billingAccount?.id;\n\n  const getCtx = (): GatewayContext => ({\n    apiGatewayUrl,\n    authToken,\n    orgId,\n  });\n\n  const loadBalance = async () => {\n    if (!billingAccountId) return;\n    setIsLoadingBalance(true);\n    setBalanceError(null);\n    try {\n      const b = await fetchCreditBalanceByType(billingAccountId, getCtx());\n      setBalance(b);\n    } catch (e) {\n      setBalanceError(e instanceof Error ? e.message : 'Failed to load balance');\n    } finally {\n      setIsLoadingBalance(false);\n    }\n  };\n\n  const loadAccounts = async () => {\n    if (!billingAccountId) return;\n    setIsLoadingAccounts(true);\n    try {\n      const accounts = await fetchPayoutAccounts(billingAccountId, getCtx());\n      setPayoutAccounts(accounts);\n      const defaultAcc = accounts.find((a) => a.isDefault) ?? accounts[0];\n      if (defaultAcc) setSelectedAccountId(defaultAcc.id);\n    } catch {\n      // silently fail - user will see empty state\n    } finally {\n      setIsLoadingAccounts(false);\n    }\n  };\n\n  const loadHistory = async () => {\n    if (!billingAccountId) return;\n    setIsLoadingHistory(true);\n    try {\n      const items = await fetchCreditWithdrawalHistory(billingAccountId, getCtx());\n      setHistory(items);\n    } catch {\n      // silently fail\n    } finally {\n      setIsLoadingHistory(false);\n    }\n  };\n\n  useEffect(() => {\n    if (billingAccountId) {\n      void loadBalance();\n      void loadAccounts();\n      void loadHistory();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [billingAccountId]);\n\n  // Sync payout account currency to billing account currency when it loads\n  useEffect(() => {\n    if (billingAccount?.currency) {\n      setAccountForm((f) => ({ ...f, currency: billingAccount.currency ?? 'USD' }));\n    }\n  }, [billingAccount?.currency]);\n\n  const handleAddAccount = async () => {\n    if (!billingAccountId) return;\n    setAddAccountError(null);\n    setIsAddingAccount(true);\n    try {\n      const isIndia =\n        accountForm.country.trim().toUpperCase() === 'IN' ||\n        accountForm.country.trim().toLowerCase() === 'india';\n\n      await addPayoutAccount(\n        {\n          billingAccountId,\n          label: accountForm.label,\n          type: accountForm.type,\n          accountHolderName: accountForm.accountHolderName,\n          country: accountForm.country || undefined,\n          currency: accountForm.currency,\n          ...(accountForm.type === 'BANK_ACCOUNT' && {\n            accountNumber: accountForm.accountNumber,\n            ...(isIndia\n              ? { ifsc: accountForm.ifscCode }\n              : { routingNumber: accountForm.routingNumber }),\n          }),\n          ...(accountForm.type === 'UPI' && { upiId: accountForm.upiId }),\n        },\n        getCtx()\n      );\n      emit('billing.payout_account.added', {\n        route: '/billing/credits/withdraw',\n        entityId: billingAccountId,\n        source: 'credit-withdrawal',\n      });\n      await loadAccounts();\n      setShowAddAccount(false);\n      setAccountForm({\n        label: '',\n        type: 'BANK_ACCOUNT' as 'BANK_ACCOUNT' | 'UPI',\n        accountHolderName: '',\n        accountNumber: '',\n        ifscCode: '',\n        routingNumber: '',\n        upiId: '',\n        country: '',\n        currency: 'USD',\n      });\n    } catch (e) {\n      setAddAccountError(e instanceof Error ? e.message : 'Failed to add account');\n    } finally {\n      setIsAddingAccount(false);\n    }\n  };\n\n  const handleWithdraw = async () => {\n    if (!billingAccountId || !selectedAccountId) return;\n    const amount = parseFloat(creditAmount);\n    if (!amount || amount <= 0) return;\n\n    setSubmitError(null);\n    setIsSubmitting(true);\n    try {\n      const withdrawal = await requestCreditWithdrawal(\n        {\n          billingAccountId,\n          creditAmount: amount,\n          payoutAccountId: selectedAccountId,\n          notes: notes || undefined,\n        },\n        getCtx()\n      );\n      emit('billing.credits.withdrawal_requested', {\n        route: '/billing/credits/withdraw',\n        entityId: withdrawal.id,\n        source: 'credit-withdrawal',\n        amount,\n      });\n      setSubmitSuccess(true);\n      setCreditAmount('');\n      setNotes('');\n      await loadBalance();\n      await loadHistory();\n    } catch (e) {\n      setSubmitError(e instanceof Error ? e.message : 'Withdrawal request failed');\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  const accountCurrency = billingAccount?.currency ?? 'USD';\n  const withdrawAmount = parseFloat(creditAmount) || 0;\n\n  const { data: costData, loading: isFetchingCost } = useGetCostOfCreditsCheckoutQuery({\n    variables: { creditAmount: withdrawAmount, currency: accountCurrency },\n    skip: withdrawAmount <= 0 || !billingAccount,\n  });\n\n  const estimatedPayout = costData?.getCostOfCredits?.amount;\n\n  // Permission check\n  if (!permissions.canWithdrawCredits) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <div className=\"size-12 mx-auto rounded-full bg-bg-sunken flex items-center justify-center\">\n            <svg\n              className=\"size-6 text-text-secondary\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-lg font-semibold text-text-primary\">Access Denied</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You don&apos;t have permission to withdraw credits.\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  if (!isLoadingAccount && !billingAccount) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <h2 className=\"text-lg font-semibold text-text-primary\">No Billing Account</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You need a billing account to withdraw credits.\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  if (isLoadingAccount && !billingAccount) {\n    return (\n      <div className=\"space-y-6 px-6 lg:px-8 py-6\">\n        <div className=\"h-8 w-64 bg-bg-sunken animate-pulse rounded\" />\n        <div className=\"grid grid-cols-2 lg:grid-cols-4 gap-4\">\n          {[1, 2, 3, 4].map((i) => (\n            <div key={i} className=\"border border-border-subtle rounded-lg p-5\">\n              <div className=\"h-4 w-24 bg-bg-sunken animate-pulse rounded mb-2\" />\n              <div className=\"h-8 w-32 bg-bg-sunken animate-pulse rounded\" />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n  const withdrawable = balance?.withdrawable ?? 0;\n  // Small epsilon so a Decimal→number conversion on the server (e.g.\n  // 34.999999999999997) can never make \"the exact max\" silently fail this\n  // check with no visible reason (BOFF-7192).\n  const AMOUNT_EPSILON = 0.005;\n  const amountValid = withdrawAmount > 0 && withdrawAmount <= withdrawable + AMOUNT_EPSILON;\n  const activeAccounts = payoutAccounts.filter((a) => a.status !== 'ARCHIVED');\n\n  // Exactly which condition is currently blocking the request — shown next to\n  // the button instead of just disabling it silently (BOFF-7192).\n  const withdrawBlockedReason = isSubmitting\n    ? null\n    : activeAccounts.length === 0\n      ? 'Add a payout method above before requesting a withdrawal.'\n      : !selectedAccountId\n        ? 'Select a payout method above.'\n        : !(withdrawAmount > 0)\n          ? 'Enter an amount to withdraw.'\n          : withdrawAmount > withdrawable + AMOUNT_EPSILON\n            ? `Amount exceeds your withdrawable balance of ${withdrawable.toLocaleString()} credits.`\n            : null;\n\n  return (\n    <div className=\"space-y-6 px-6 lg:px-8 py-6\">\n      {/* Header */}\n      <div className=\"flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4\">\n        <div>\n          <h1 className=\"text-2xl md:text-3xl font-semibold tracking-tight text-text-primary\">\n            Withdraw Credits\n          </h1>\n          <p className=\"text-sm text-text-secondary mt-1\">\n            Convert your withdrawable credits (purchased &amp; earned) to a payout\n          </p>\n          <PagePurpose className=\"mt-3\">\n            Turn the credits you bought or earned (from sales and referrals) back into real money.\n            Add a bank account or UPI as a payout destination, request a withdrawal for any amount\n            up to your withdrawable balance, and track each request here until it is paid. Granted\n            credits (coupons, admin grants) are not withdrawable.\n          </PagePurpose>\n        </div>\n\n        {/* Billing Account Switcher — only shown when the org has more than one account */}\n        {billingAccounts.length > 1 && (\n          <select\n            value={billingAccount?.id ?? ''}\n            onChange={(e) => setSelectedBillingAccountId(e.target.value)}\n            aria-label=\"Switch billing account\"\n            className=\"px-3 py-2 text-sm border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] w-full sm:min-w-[200px] sm:w-auto\"\n          >\n            {billingAccounts.map((account) => (\n              <option key={account.id} value={account.id}>\n                {account.name}\n              </option>\n            ))}\n          </select>\n        )}\n      </div>\n\n      {/* Balance breakdown */}\n      <div className=\"grid grid-cols-2 lg:grid-cols-4 gap-4\">\n        {isLoadingBalance ? (\n          [1, 2, 3, 4].map((i) => (\n            <div key={i} className=\"border border-border-subtle rounded-lg p-5\">\n              <div className=\"h-4 w-20 bg-bg-sunken animate-pulse rounded mb-2\" />\n              <div className=\"h-8 w-28 bg-bg-sunken animate-pulse rounded\" />\n            </div>\n          ))\n        ) : balanceError ? (\n          <div className=\"col-span-4 text-sm text-status-error-text\">{balanceError}</div>\n        ) : (\n          <>\n            <BalanceCard\n              label=\"Purchased\"\n              value={balance?.purchased ?? 0}\n              description=\"From credit purchases\"\n            />\n            <BalanceCard\n              label=\"Earned\"\n              value={balance?.earned ?? 0}\n              description=\"From sales & referrals\"\n            />\n            <BalanceCard\n              label=\"Granted\"\n              value={balance?.granted ?? 0}\n              description=\"Coupons & admin grants — non-withdrawable\"\n            />\n            <BalanceCard\n              label=\"Withdrawable\"\n              value={withdrawable}\n              description=\"Purchased + earned\"\n              highlight\n            />\n          </>\n        )}\n      </div>\n\n      {/* Success banner */}\n      {submitSuccess && (\n        <div className=\"flex items-center gap-3 p-4 rounded-lg bg-status-success-bg-subtle border border-status-success-border text-status-success-text\">\n          <svg className=\"size-5 shrink-0\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 13l4 4L19 7\" />\n          </svg>\n          <div>\n            <p className=\"font-medium\">Withdrawal request submitted</p>\n            <p className=\"text-sm opacity-80\">Our team will review and process your request.</p>\n          </div>\n          <button\n            type=\"button\"\n            onClick={() => setSubmitSuccess(false)}\n            className=\"ml-auto text-current opacity-60 hover:opacity-100\"\n          >\n            <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M6 18L18 6M6 6l12 12\"\n              />\n            </svg>\n          </button>\n        </div>\n      )}\n\n      {/* Main two-column layout */}\n      <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-6\">\n        {/* Left: Payout account management */}\n        <div className=\"space-y-4\">\n          <div className=\"flex items-center justify-between\">\n            <h2 className=\"text-base font-semibold text-text-primary\">Payout Account</h2>\n            <button\n              type=\"button\"\n              onClick={() => setShowAddAccount((v) => !v)}\n              className=\"text-sm text-text-link hover:underline\"\n            >\n              {showAddAccount ? 'Cancel' : '+ Add new'}\n            </button>\n          </div>\n\n          {/* Add account form */}\n          {showAddAccount && (\n            <div className=\"border border-border-subtle rounded-lg p-4 space-y-3 bg-bg-sunken\">\n              <h3 className=\"text-sm font-medium text-text-primary\">New Payout Account</h3>\n\n              <div>\n                <label className=\"block text-xs text-text-secondary mb-1\">Label</label>\n                <input\n                  type=\"text\"\n                  value={accountForm.label}\n                  onChange={(e) => setAccountForm((f) => ({ ...f, label: e.target.value }))}\n                  placeholder=\"e.g. My Bank Account\"\n                  className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                />\n              </div>\n\n              <div>\n                <label className=\"block text-xs text-text-secondary mb-1\">\n                  Account Holder Name\n                </label>\n                <input\n                  type=\"text\"\n                  value={accountForm.accountHolderName}\n                  onChange={(e) =>\n                    setAccountForm((f) => ({ ...f, accountHolderName: e.target.value }))\n                  }\n                  placeholder=\"Full name as on bank account\"\n                  className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                />\n              </div>\n\n              <div className=\"grid grid-cols-2 gap-3\">\n                <div>\n                  <label className=\"block text-xs text-text-secondary mb-1\">Type</label>\n                  <select\n                    value={accountForm.type}\n                    onChange={(e) =>\n                      setAccountForm((f) => ({\n                        ...f,\n                        type: e.target.value as typeof accountForm.type,\n                      }))\n                    }\n                    className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  >\n                    <option value=\"BANK_ACCOUNT\">Bank Account</option>\n                    <option value=\"UPI\">UPI</option>\n                  </select>\n                </div>\n\n                <div>\n                  <label className=\"block text-xs text-text-secondary mb-1\">Country</label>\n                  <input\n                    type=\"text\"\n                    value={accountForm.country}\n                    onChange={(e) => setAccountForm((f) => ({ ...f, country: e.target.value }))}\n                    placeholder=\"e.g. India, US, UK\"\n                    className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              </div>\n\n              {accountForm.type === 'BANK_ACCOUNT' && (\n                <>\n                  <div>\n                    <label className=\"block text-xs text-text-secondary mb-1\">Account Number</label>\n                    <input\n                      type=\"text\"\n                      value={accountForm.accountNumber}\n                      onChange={(e) =>\n                        setAccountForm((f) => ({ ...f, accountNumber: e.target.value }))\n                      }\n                      placeholder=\"Account number\"\n                      className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                  {accountForm.country.trim().toUpperCase() === 'IN' ||\n                  accountForm.country.trim().toLowerCase() === 'india' ? (\n                    <div>\n                      <label className=\"block text-xs text-text-secondary mb-1\">IFSC Code</label>\n                      <input\n                        type=\"text\"\n                        value={accountForm.ifscCode}\n                        onChange={(e) =>\n                          setAccountForm((f) => ({ ...f, ifscCode: e.target.value.toUpperCase() }))\n                        }\n                        placeholder=\"e.g. SBIN0001234\"\n                        className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  ) : (\n                    <div>\n                      <label className=\"block text-xs text-text-secondary mb-1\">\n                        Routing Number\n                      </label>\n                      <input\n                        type=\"text\"\n                        value={accountForm.routingNumber}\n                        onChange={(e) =>\n                          setAccountForm((f) => ({ ...f, routingNumber: e.target.value }))\n                        }\n                        placeholder=\"Routing / sort code\"\n                        className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  )}\n                </>\n              )}\n\n              {accountForm.type === 'UPI' && (\n                <div>\n                  <label className=\"block text-xs text-text-secondary mb-1\">UPI ID</label>\n                  <input\n                    type=\"text\"\n                    value={accountForm.upiId}\n                    onChange={(e) => setAccountForm((f) => ({ ...f, upiId: e.target.value }))}\n                    placeholder=\"yourname@upi\"\n                    className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              )}\n\n              {addAccountError && (\n                <p className=\"text-xs text-status-error-text\">{addAccountError}</p>\n              )}\n\n              <button\n                type=\"button\"\n                onClick={() => void handleAddAccount()}\n                disabled={isAddingAccount || !accountForm.label || !accountForm.accountHolderName}\n                className=\"w-full py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n              >\n                {isAddingAccount ? 'Saving…' : 'Save Account'}\n              </button>\n            </div>\n          )}\n\n          {/* Existing accounts */}\n          {isLoadingAccounts ? (\n            <div className=\"space-y-2\">\n              {[1, 2].map((i) => (\n                <div\n                  key={i}\n                  className=\"h-16 border border-border-subtle rounded-lg bg-bg-sunken animate-pulse\"\n                />\n              ))}\n            </div>\n          ) : activeAccounts.length === 0 && !showAddAccount ? (\n            <IllustratedEmptyState\n              illustration=\"empty-generic\"\n              title=\"No payout accounts yet\"\n              description=\"Add a bank account or UPI to receive your withdrawn credits.\"\n              action={\n                <button\n                  type=\"button\"\n                  onClick={() => setShowAddAccount(true)}\n                  className=\"px-4 py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors\"\n                >\n                  Add a bank account or UPI\n                </button>\n              }\n            />\n          ) : (\n            <div className=\"space-y-2\">\n              {activeAccounts.map((account) => (\n                <button\n                  type=\"button\"\n                  key={account.id}\n                  onClick={() => setSelectedAccountId(account.id)}\n                  className={`w-full text-left p-4 border rounded-lg transition-colors ${\n                    selectedAccountId === account.id\n                      ? 'border-border-strong bg-[var(--color-accent-soft)]'\n                      : 'border-border-subtle bg-bg-surface hover:border-border-strong'\n                  }`}\n                >\n                  <div className=\"flex items-center justify-between\">\n                    <div>\n                      <p className=\"text-sm font-medium text-text-primary\">{account.label}</p>\n                      <p className=\"text-xs text-text-secondary mt-0.5\">\n                        {account.type.replaceAll('_', ' ')}\n                        {account.displayName ? ` · ${account.displayName}` : ''}\n                        {account.accountLast4 ? ` ···${account.accountLast4}` : ''}\n                        {account.country ? ` · ${account.country}` : ''}\n                      </p>\n                    </div>\n                    <div className=\"flex items-center gap-2\">\n                      {account.isDefault && (\n                        <span className=\"text-xs px-2 py-0.5 rounded bg-[var(--color-accent-soft)] text-text-link font-medium\">\n                          Default\n                        </span>\n                      )}\n                      <span\n                        className={`text-xs px-2 py-0.5 rounded font-medium ${\n                          account.status === 'ACTIVE'\n                            ? `${statusTokens.success.bg} ${statusTokens.success.text}`\n                            : account.status === 'PENDING_VERIFICATION'\n                              ? `${statusTokens.warning.bg} ${statusTokens.warning.text}`\n                              : `${statusTokens.error.bg} ${statusTokens.error.text}`\n                        }`}\n                      >\n                        {account.status.replaceAll('_', ' ').toLowerCase()}\n                      </span>\n                      {selectedAccountId === account.id && (\n                        <svg\n                          className=\"size-4 text-text-link shrink-0\"\n                          fill=\"none\"\n                          viewBox=\"0 0 24 24\"\n                          stroke=\"currentColor\"\n                        >\n                          <path\n                            strokeLinecap=\"round\"\n                            strokeLinejoin=\"round\"\n                            strokeWidth={2}\n                            d=\"M5 13l4 4L19 7\"\n                          />\n                        </svg>\n                      )}\n                    </div>\n                  </div>\n                </button>\n              ))}\n            </div>\n          )}\n        </div>\n\n        {/* Right: Withdrawal request form */}\n        <div className=\"space-y-4\">\n          <h2 className=\"text-base font-semibold text-text-primary\">Request Withdrawal</h2>\n\n          <div className=\"border border-border-subtle rounded-lg p-5 bg-bg-surface space-y-4\">\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                Credits to Withdraw\n              </label>\n              <input\n                type=\"number\"\n                min={1}\n                max={withdrawable}\n                step={1}\n                value={creditAmount}\n                onChange={(e) => setCreditAmount(e.target.value)}\n                placeholder=\"Enter credit amount\"\n                className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n              />\n              <p className=\"text-xs text-text-secondary mt-1\">\n                Max withdrawable:{' '}\n                <span className=\"font-medium\">{withdrawable.toLocaleString()} credits</span>\n              </p>\n              {withdrawAmount > 0 && withdrawAmount <= withdrawable + AMOUNT_EPSILON && (\n                <p className=\"text-xs text-text-secondary mt-1\">\n                  {isFetchingCost ? (\n                    'Calculating…'\n                  ) : estimatedPayout != null ? (\n                    <>\n                      Estimated payout:{' '}\n                      <span className=\"font-semibold text-text-primary\">\n                        {estimatedPayout.toLocaleString(undefined, {\n                          style: 'currency',\n                          currency: accountCurrency,\n                          minimumFractionDigits: 2,\n                          maximumFractionDigits: 2,\n                        })}\n                      </span>{' '}\n                      at the current credit rate\n                    </>\n                  ) : null}\n                </p>\n              )}\n              {withdrawAmount > 0 && withdrawAmount > withdrawable + AMOUNT_EPSILON && (\n                <p className=\"text-xs text-status-error-text mt-1\">\n                  Amount exceeds your withdrawable balance\n                </p>\n              )}\n            </div>\n\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                Notes <span className=\"text-text-secondary font-normal\">(optional)</span>\n              </label>\n              <textarea\n                value={notes}\n                onChange={(e) => setNotes(e.target.value)}\n                placeholder=\"Any notes for this withdrawal request\"\n                rows={2}\n                className=\"w-full px-3 py-2 text-sm border border-border-subtle rounded-button bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n              />\n            </div>\n\n            {submitError && (\n              <div className=\"p-3 rounded-button bg-status-error-bg-subtle border border-status-error-border\">\n                <p className=\"text-sm text-status-error-text\">{submitError}</p>\n              </div>\n            )}\n\n            <div className=\"pt-1 border-t border-border-subtle\">\n              <p className=\"text-xs text-text-secondary mb-3\">\n                Credits will be converted to {accountCurrency} at the current credit rate.\n                Withdrawals are reviewed before processing and may take 3–5 business days.\n              </p>\n              {/* Always say exactly why the button is disabled — never just gray it\n                  out with no explanation (BOFF-7192). */}\n              {withdrawBlockedReason && (\n                <p className=\"text-xs text-status-warning-text mb-2\">{withdrawBlockedReason}</p>\n              )}\n              <button\n                type=\"button\"\n                onClick={() => void handleWithdraw()}\n                disabled={\n                  isSubmitting || !amountValid || !selectedAccountId || activeAccounts.length === 0\n                }\n                className=\"w-full py-2.5 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n              >\n                {isSubmitting ? 'Submitting…' : 'Request Withdrawal'}\n              </button>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      {/* Withdrawal history */}\n      <div className=\"space-y-3\">\n        <div className=\"flex items-center justify-between\">\n          <h2 className=\"text-base font-semibold text-text-primary\">Withdrawal History</h2>\n          <button\n            type=\"button\"\n            onClick={() => void loadHistory()}\n            className=\"text-sm text-text-secondary hover:text-text-primary transition-colors\"\n            aria-label=\"Refresh withdrawal history\"\n          >\n            <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\"\n              />\n            </svg>\n          </button>\n        </div>\n\n        {isLoadingHistory ? (\n          <div className=\"space-y-2\">\n            {[1, 2, 3].map((i) => (\n              <div\n                key={i}\n                className=\"h-16 border border-border-subtle rounded-lg bg-bg-sunken animate-pulse\"\n              />\n            ))}\n          </div>\n        ) : history.length === 0 ? (\n          <IllustratedEmptyState\n            illustration=\"empty-data\"\n            title=\"No withdrawal requests yet\"\n            description=\"Once you request a withdrawal, its status will appear here.\"\n          />\n        ) : (\n          <div className=\"border border-border-subtle rounded-lg overflow-hidden\">\n            <table className=\"w-full text-sm\">\n              <thead className=\"bg-bg-sunken border-b border-border-subtle\">\n                <tr>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide\">\n                    Amount\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide\">\n                    Status\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden sm:table-cell\">\n                    Payout Account\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden md:table-cell\">\n                    Requested\n                  </th>\n                  <th className=\"text-left px-4 py-3 text-xs font-medium text-text-secondary uppercase tracking-wide hidden md:table-cell\">\n                    Completed\n                  </th>\n                </tr>\n              </thead>\n              <tbody className=\"divide-y divide-border-subtle\">\n                {history.map((req) => (\n                  <tr key={req.id} className=\"hover:bg-bg-sunken transition-colors\">\n                    <td className=\"px-4 py-3 font-medium text-text-primary\">\n                      {req.requestedAmount.toLocaleString()} {req.currency}\n                    </td>\n                    <td className=\"px-4 py-3\">\n                      <span\n                        className={`inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${getWithdrawalStatusBg(req.status)}`}\n                      >\n                        {req.status.charAt(0) + req.status.slice(1).toLowerCase()}\n                      </span>\n                      {req.failureReason && (\n                        <p\n                          className=\"text-xs text-status-error-text mt-0.5 max-w-[180px] truncate\"\n                          title={req.failureReason}\n                        >\n                          {req.failureReason}\n                        </p>\n                      )}\n                    </td>\n                    <td className=\"px-4 py-3 text-text-secondary hidden sm:table-cell\">\n                      {req.payoutAccount ? (\n                        <span>\n                          {req.payoutAccount.label}\n                          {req.payoutAccount.accountLast4\n                            ? ` ···${req.payoutAccount.accountLast4}`\n                            : ''}\n                        </span>\n                      ) : (\n                        '—'\n                      )}\n                    </td>\n                    <td className=\"px-4 py-3 text-text-secondary hidden md:table-cell\">\n                      <span title={formatDate(req.createdAt, 'long')}>\n                        {formatRelativeTime(req.createdAt)}\n                      </span>\n                    </td>\n                    <td className=\"px-4 py-3 text-text-secondary hidden md:table-cell\">\n                      {req.paidAt ? (\n                        <span className={getWithdrawalStatusColor('PAID')}>\n                          {formatDate(req.paidAt, 'short')}\n                        </span>\n                      ) : (\n                        '—'\n                      )}\n                    </td>\n                  </tr>\n                ))}\n              </tbody>\n            </table>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}