import { Tag } from 'antd';
import { CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons';

export const VSTag = (diffPercent, diffData, data1, data2) => {
  const CaretIcon = parseInt(diffPercent) < 0 ? CaretDownOutlined : CaretUpOutlined;
  const tagColor = parseInt(diffPercent) < 0 ? "gold" : "lime";
  return parseInt(diffPercent) === 0 ? "-" : (
    <span>
      <div>
        {data1} vs {data2}
      </div>
      <Tag icon={<CaretIcon />} color={tagColor}>
        {diffPercent} {diffData}
      </Tag>
    </span>
  );
};