import React from 'react'
import { InputNumber, InputNumberProps } from 'antd'
import { precision } from 'utils/number'

// money number to display value
export const formatter = (isCent = true) => (
  value: string | number | undefined
) => {
  return `$ ${isCent ? precision(Number(value) / 100) : value}`.replace(
    /\B(?=(\d{3})+(?!\d))/g,
    ','
  )
}

// display value to money number
export const parser = (isCent = true) => (displayValue: string | undefined) => {
  const value = displayValue ? displayValue.replace(/\$\s?|(,*)/g, '') : 0
  return isCent ? Number(value) * 100 : value
}

interface InputProps extends InputNumberProps {
  isCent?: boolean
}

function InputCurrency({ isCent = true, ...rest }: InputProps) {
  return (
    <InputNumber
      step={isCent ? 100 : 1}
      formatter={formatter(isCent)}
      parser={parser(isCent)}
      {...rest}
    />
  )
}

export default InputCurrency