import {
  backgroundColors,
  backgroundHoverColors,
  textColors,
} from "../consts/buttonColors";
import { ButtonType } from "../types/button";

interface ButtonProps {
  buttonType?: ButtonType;
  icon?: React.ReactNode;
  text?: string;
  className?: string;
}

const Button = ({
  className,
  icon,
  text,
  buttonType = "primary",
}: ButtonProps) => {
  const backgroundColor = backgroundColors[buttonType];
  const backgroundHoverColor = backgroundHoverColors[buttonType];
  const textColor = textColors[buttonType];

  return (
    <button
      className={`min-w-[50px] py-3 px-6 transition-[background] duration-300 ease-in-out rounded-lg ${backgroundColor} ${backgroundHoverColor} ${textColor} ${
        className ? className : ""
      }`}
    >
      {icon && <div>{icon}</div>}
      {text && <p>{text}</p>}
    </button>
  );
};

export default Button;
