import styles from "../../Form/SeatSelectForm/SeatSelectForm.module.css"
import {Select} from "../../Base/Select/Select.jsx"
import {Button} from "../../Base/Buttons/Button.jsx"
import PropTypes from "prop-types";

export const SeatSelectForm = ({ seatOptions, seatCount, setSeatCount, onClose }) => {
  return (
    <form className={styles.modalform} onSubmit={(e) => e.preventDefault()}>
      <Select
        options={seatOptions}
        value={seatCount}
        onChange={(e) => setSeatCount(parseInt(e.target.value))}
      />
      <Button variant="primary" label="Continue" size="md" onClick={onClose} />
    </form>
  );
};

SeatSelectForm.propTypes = {
  seatOptions: PropTypes.array.isRequired,
  seatCount: PropTypes.number.isRequired,
  setSeatCount: PropTypes.func.isRequired,
  onClose: PropTypes.func.isRequired,
};
