import { useState, useEffect } from 'react';
import { useCurrency } from '../contexts/CurrencyContext';
import { formatPrice as formatPriceUtil } from '../utils/priceFormat';
import { convertPrice } from '../utils/currencyService';

/**
 * Hook to format prices using the selected currency from context with conversion
 */
export function usePriceFormat() {
  const { currency, exchangeRates } = useCurrency();
  const [convertedPriceCache, setConvertedPriceCache] = useState(new Map());

  const formatPrice = async (price, preferredCurrency = null) => {
    const displayCurrency = preferredCurrency || currency;
    
    // Convert price to target currency if needed
    if (exchangeRates && price) {
      try {
        const converted = await convertPrice(price, displayCurrency, exchangeRates);
        return formatPriceUtil(converted, displayCurrency);
      } catch (error) {
        console.warn('Failed to convert price, using original:', error);
        return formatPriceUtil(price, displayCurrency);
      }
    }
    
    return formatPriceUtil(price, displayCurrency);
  };

  // Synchronous version for use in render (uses cache or returns promise)
  const formatPriceSync = (price, preferredCurrency = null) => {
    const displayCurrency = preferredCurrency || currency;
    // For now, return the formatted price without conversion in sync mode
    // Conversion will happen in components that can handle async
    return formatPriceUtil(price, displayCurrency);
  };

  return { formatPrice, formatPriceSync, currency, exchangeRates };
}