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

export const ChangeArrow: React.FC<{
  change: number
}> = ({ change }) => {
  const color = getColorByChange(change)

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