import { faVolumeHigh, faVolumeXmark } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { useSoundEnabled } from "react-sounds";

const SoundBtn = () => {
  const [enabled, setEnabled] = useSoundEnabled();

  const handleClick = () => {
    setEnabled(!enabled);
  };

  return (
    <button onClick={handleClick}>
      <FontAwesomeIcon
        icon={enabled ? faVolumeHigh : faVolumeXmark}
        size="2x"
      />
    </button>
  );
};

export default SoundBtn;
