import cls from "./index.module.css";

const Arrow = ({ direction, disabled, onClick }) => {
  function handleClick() {
    onClick(direction)
  }
  return (
    <button
      className={`${cls["arrow"]} ${
        direction == "right" ? cls["arrow__right"] : ""
      } ${true ? "disabled" : ""}`}
      onClick={handleClick}
    >
      <div
        className={`${cls["arrow-top"]} ${
          direction == "right" ? cls["arrow-top__right"] : ""
        }`}
      ></div>
      <div
        className={`${cls["arrow-bottom"]} ${
          direction == "right" ? cls["arrow-bottom__right"] : ""
        }`}
      ></div>
    </button>
  );
};

export default Arrow;