FormattedBitcoinAmount.tsx raw

   1  import { BITCOIN_DISPLAY_FORMAT_BIP177 } from "src/constants";
   2  import { useInfo } from "src/hooks/useInfo";
   3  
   4  interface FormattedBitcoinAmountProps {
   5    amountMsat: number;
   6    className?: string;
   7    showSymbol?: boolean; // Whether to show the symbol/unit
   8  }
   9  
  10  export function FormattedBitcoinAmount({
  11    amountMsat,
  12    className = "",
  13    showSymbol = true,
  14  }: FormattedBitcoinAmountProps) {
  15    const { data: info } = useInfo();
  16  
  17    if (!info) {
  18      return null;
  19    }
  20  
  21    const sats = Math.floor(amountMsat / 1000);
  22  
  23    // Get display format from settings
  24    const displayFormat = info.bitcoinDisplayFormat;
  25  
  26    const formattedNumber = new Intl.NumberFormat().format(sats);
  27  
  28    if (!showSymbol) {
  29      return <span className={className}>{formattedNumber}</span>;
  30    }
  31  
  32    if (displayFormat === BITCOIN_DISPLAY_FORMAT_BIP177) {
  33      return <span className={className}>₿{formattedNumber}</span>;
  34    } else {
  35      return <span className={className}>{formattedNumber} sats</span>;
  36    }
  37  }
  38