import React from "react";
const TravelNewsletter = (props) => {
  const { handleChangeSubscribeEvent, inputEl, handleSubscribeSite, emailError, userState } = props
  return (
    <div className="newsletter index-section">
        <div className="container">
            <h3>Subscribe to get our best deals and promotions! </h3>
            <form className="newsletter--form">
                <div className="form-group">
                    <label htmlFor="subscribe-email">
                        <input ref={ inputEl } id="subscribe-email"  onChange={ handleChangeSubscribeEvent } name='subscribe-email' className="form-control" placeholder="Enter your email" type="text" />
                        {emailError && <span className="field_error">{emailError}</span>}
                        { userState?.successSubscribe && <span className="field_success">{userState?.successSubscribe}</span>}

                    </label>
                </div>
                <button type="button" onClick={handleSubscribeSite}  className="btn btn-primary">Sign Up</button>
            </form>
        </div>
    </div>
  );
};

export default TravelNewsletter;