/**
 * 可用资产，联动划转组件
 */
import React, { FC } from "react";
import { Cell } from "@components/PlaceOrder/Cell";
import { formatFloor } from "@utils/FormatNumber";
import { TransferIcon } from "@icons/TransferIcon";

interface Props {
  /** 划转 */
  onTransfer?: () => void;
  /** 资产币种 */
  coin?: string;
  label?: string;
  value?: number;
  scale?: number;
  isLogin: boolean;
}

export const AvbBalance: FC<Props> = props => {
  const { value = 0, coin = "USDT", onTransfer, label = "可用", scale, isLogin } = props;

  return (
    <Cell
      label={label}
      value={
        <div className="flex items-center">
          {formatFloor(value, scale)}
          <span className="ml-[2px] mr-[8px]">{coin}</span>
          {isLogin && <TransferIcon onClick={() => onTransfer?.()} />}
        </div>
      }
    />
  );
};