Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 | /* This page will try to confirm the book,
and will return the booking details,
case it return that wasn't possible to confirm will redirect to the change page,
case the book return that was cancelled or confirm, it will redirect to the status page.
Also this page will add the book details in the store
*/
import React, { useEffect, useState } from 'react'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import { withRouter } from 'react-router'
import { useParams } from 'react-router-dom'
import * as PropTypes from 'prop-types'
import * as bookingServices from './Booking.services'
import * as bookingActions from './Booking.actions'
import * as bookingConstants from './Booking.constants'
import StatusPage from './status/Status.page'
import ChangePage from './change/Change.page'
import Warning from 'common/components/warning'
import SomethingWrongImg from 'common/components/warning/something-wrong.svg'
import Loading from 'common/components/loading'
const Booking = (
{ booking, setBookingStatus, setBookingData, history, company },
{ t: translate },
) => {
const { bookingId, companyHash } = useParams()
const [processing, setProcessing] = useState(false)
const getBookingData = ({ seat = null, time = null } = {}) => {
bookingServices
.confirmBooking({ seat, time, bookingId })
.then((response) => {
setBookingStatus(bookingConstants.BOOKING_STATUS[response.status])
setProcessing(false)
return response.json()
})
.then((response) => {
if (response && response.booking) {
setBookingData(response.booking)
}
})
}
useEffect(() => {
getBookingData()
}, [bookingId])
const onNewBooking = () => history.push(`/${companyHash}`)
const onCancel = () => {
if (window.confirm(translate('Are you sure that you want to cancel your booking'))) {
setProcessing(true)
bookingServices.cancelBooking({ bookingId }).then(() => {
getBookingData()
})
}
}
const statusPage = (
<StatusPage
translate={translate}
data={booking}
processing={processing}
onCancel={onCancel}
onNewBooking={onNewBooking}
/>
)
const PAGES_BY_STATE = {
[bookingConstants.PAGE_STATE.CANCELLED]: () => statusPage,
[bookingConstants.PAGE_STATE.CONFIRMED]: () => statusPage,
[bookingConstants.PAGE_STATE.UNAVAILABLE]: () => (
<ChangePage translate={translate} event={company.event} onBook={getBookingData} />
),
[bookingConstants.PAGE_STATE.LOADING]: () => <Loading translate={translate} />,
[bookingConstants.PAGE_STATE.NOT_FOUND]: () => (
<Warning
image={SomethingWrongImg}
imageAlt={translate('Something wrong happened')}
title={translate('Unable to find your booking')}
/>
),
}
return PAGES_BY_STATE[booking.status] ? PAGES_BY_STATE[booking.status]() : null
}
Booking.propTypes = {
booking: PropTypes.object,
setBookingStatus: PropTypes.func,
setBookingData: PropTypes.func,
history: PropTypes.object,
company: PropTypes.object,
}
Booking.contextTypes = {
t: PropTypes.func,
}
const mapStateToProps = ({ booking, company }) => ({ booking, company })
const mapDispatchToPros = (dispatch) =>
bindActionCreators(
{
setBookingStatus: bookingActions.setBookingStatus,
setBookingData: bookingActions.setBookingData,
},
dispatch,
)
export default connect(mapStateToProps, mapDispatchToPros)(withRouter(Booking))
|