import { FontAwesome5 } from '@expo/vector-icons'
import React from 'react'

import { getColorByChange } from '../util'

export const ChangePlusMinus: React.FC<{
  change?: number
}> = ({ change }) => {
  if (!change) {
    return null
  }

  const color = getColorByChange(change)

  return (
    <FontAwesome5
      name={change > 0 ? 'plus' : 'minus'}
      size={10}
      color={color}
    />
  )
}