pages/book.js
import React, { Component } from "react";
import DayPicker from "react-day-picker";
import "react-day-picker/lib/style.css";
import icon from "../images/football.svg";
import { connect } from "react-redux";
import { onSelectedDay, doneBooking, iconClick } from "../Action/action";
export class Booking extends Component {
state = {
name: undefined,
contact: undefined,
errorStmt: "",
};
handleHomePage = () => {
};
handleValidation = () => {
};
Display_slot = Day => {
this.props.onSelectedDay(Day);
};
handleBook = () => {
};
render() {
return (
Play Zone:
{/* date picker goes here */}
{/* code goes here to display slot */}
{/* code goes here for the name and contact number input fields
each input field has name as name and contact respectively*/}
{/* code goes here the "Book Now" button with id book_button */}
{/* span to display error statement */}
Booking has been closed.Book your slot for
{/* code goes here to display the date */}
Booking is not opened yet
);
}
}
const mapStateToProps = state => {
return {
game: state.Games,
selectedGame: state.selectedGame,
selectedDate: state.selectedDate,
slotBooked: state.slotBooked
};
};
const mapDispatchToProps = dispatch => {
return {
doneBooking: () => dispatch(doneBooking()),
onSelectedDay: id => dispatch(onSelectedDay(id)),
iconClick: () => dispatch(iconClick()),
bookingDetails: (details, updatesGame) => dispatch({ type: "BOOKINGS", details, updatesGame }),
};
};
export default connect(
mapStateToProps,
mapDispatchToProps
)(Booking);