import React, { useCallback, useEffect, useState } from "react";
import usdt from "../../assets/usdt.png";
import usdc from "../../assets/usdc.png";
import sol from "../../assets/sol.png";
import ivry from "../../assets/ivry.png";

interface TProps {
  type?: string;
  showUsd?: boolean;
  className?: string;
}
export default function CurrencyImage({
  type,
  showUsd,
  className = "",
}: TProps) {
  const [iconType, setIconType] = useState<string>("");

  const checkType = useCallback(() => {
    if (type?.toLowerCase().includes("usdt")) return setIconType(usdt);
    if (type?.toLowerCase().includes("usdc")) return setIconType(usdc);
    if (type?.toLowerCase().includes("sol")) return setIconType(sol);
    //set nigeria currency here
    return setIconType(ivry);
  }, [type]);

  useEffect(() => {
    checkType();
  }, [checkType]);

  return (
    <div className={`rounded-[10px] ${className} p-2 w-10 h-10 `}>
      <img src={iconType} alt="icon-type" />
    </div>
  );
}