import { useSwapContext } from "@src/context";
import { weiToHumanReadable } from "@src/utils";
import { SwapPanelType } from "../../index";

type Props = {
  type: SwapPanelType;
};
export const MaxPanel = ({ type }: Props) => {
  const { srcToken, srcTokenBalanceWei, srcTokenBalanceInfo, setSrcValue } =
    useSwapContext();

  return (
    <button
      type="button"
      className={`flex items-center w-16 justify-center p-4 gap-8 ${
        !srcTokenBalanceInfo && "opacity-60"
      } ${
        type === "source" &&
        "border-l border-solid border-t_text_primary border-opacity-10"
      }`}
      disabled={!srcTokenBalanceInfo}
      onClick={() =>
        setSrcValue(
          weiToHumanReadable({
            amount: srcTokenBalanceWei,
            decimals: srcToken?.decimals || 18,
            precisionFractionalPlaces: srcToken?.decimals || 18,
          }),
        )
      }
    >
      {type === "source" && (
        <p
          className={`border-b border-solid border-t_text_primary ${
            !srcTokenBalanceInfo && "border-opacity-60"
          }`}
        >
          Max
        </p>
      )}
    </button>
  );
};