this.props.hideBaggageInfo()}\r\n size=\"xl\"\r\n >\r\n \r\n \r\n {\" \"}\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n {this.props.baggageInfo !== null ? (\r\n this.retunBaggageInfo()\r\n ) : (\r\n \r\n )}{\" \"}\r\n \r\n \r\n this.props.hideBaggageInfo()}\r\n >\r\n \r\n \r\n \r\n \r\n \r\n );\r\n }\r\n}\r\nconst mapStateTopProps = (state) => {\r\n return {\r\n baggageInfo: state.shoppingCart.baggageInfo,\r\n };\r\n};\r\nexport default connect(mapStateTopProps, null)(BaggageInfo);\r\n","import React from \"react\";\r\nimport {\r\n Accordion,\r\n Card,\r\n Row,\r\n Tabs,\r\n Tab,\r\n OverlayTrigger,\r\n Tooltip,\r\n} from \"react-bootstrap\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faAngleDown,\r\n faExchangeAlt,\r\n faPlane,\r\n faAngleUp,\r\n faChair,\r\n faLuggageCart,\r\n faMoneyCheck,\r\n faFileInvoiceDollar,\r\n faLongArrowAltRight,\r\n faSuitcase,\r\n faShoppingCart,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\nimport \"./ShoppingCart.css\";\r\nimport { connect } from \"react-redux\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nimport { shoppingCartAction } from \"../../../redux/actions/booking/shoopingCartAction\";\r\nimport Translation from \"../../../service/shared/multi-lingual/Translation\";\r\nimport { AirportFullName } from \"../../../service/shared/AirportFullName\";\r\nimport moment from \"moment\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { seatSelectionAction } from \"../../../redux/actions/booking/seatSelectionAction\";\r\nimport { SeatSelectionService } from \"../../../service/booking/seat-selection/SeatSelectionService\";\r\nimport { ancillaryAction } from \"../../../redux/actions/booking/ancillaryAction\";\r\nimport FareRule from \"./FareRule\";\r\nimport BaggageInfo from \"./BaggageInfo\";\r\n\r\nclass ShoppingCart extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n flightAccordion: 0,\r\n seatAccordion: -1,\r\n extraAccordion: -1,\r\n sucharchgesAccordion: -1,\r\n taxesAccordion: -1,\r\n showFareRule: false,\r\n showBaggageInformation: false,\r\n checkedIn: 1,\r\n carryOn: -1,\r\n };\r\n }\r\n hideBaggageInfo = () => {\r\n this.setState({ showBaggageInformation: false });\r\n };\r\n hideFareRule = () => {\r\n this.setState({ showFareRule: false });\r\n };\r\n currencyForSeat = \"\";\r\n currentPageTracker = 1;\r\n\r\n totalFinder = () => {\r\n if (this.props.isAncillaryAdd) {\r\n return (\r\n this.props.searchFlight.selectionResult.total.alternatives[0][0]\r\n .amount +\r\n this.calculateSeatTotalPrice() +\r\n this.props.totalPriceBaggage\r\n );\r\n } else {\r\n return (\r\n this.props.searchFlight.selectionResult.total.alternatives[0][0]\r\n .amount + this.calculateSeatTotalPrice()\r\n );\r\n }\r\n };\r\n\r\n componentDidMount = () => {\r\n var sabreCookies = null;\r\n if (this.props.searchFlight.selectionResult !== null) {\r\n sabreCookies =\r\n this.props.searchFlight.selectionResult.cookieSabreDataRequest;\r\n }\r\n var url = window.location.pathname;\r\n\r\n\r\n if ((this.props.fareRule === null || url.includes(\"flightsummary\")) && sabreCookies !== null ) {\r\n HttpService.postService(\r\n sabreCookies,\r\n \"/Booking/GetFareRule\",\r\n this.props.searchFlight.token\r\n )\r\n .then((response) => {\r\n if (response.data.statusAPI === \"SUCCESS\") {\r\n this.props.saveFareRule(response.data);\r\n }\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n }\r\n if ((this.props.baggageInfo === null || url.includes(\"flightsummary\")) && sabreCookies !== null) {\r\n HttpService.postService(\r\n sabreCookies,\r\n \"/Bag/GetAllowance\",\r\n this.props.searchFlight.token\r\n )\r\n .then((response) => {\r\n if (response.data.statusAPI === \"SUCCESS\") {\r\n this.props.saveBaggageInfo(response.data);\r\n }\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n }\r\n };\r\n carryOnBaggage = () => {\r\n return (\r\n \r\n
\r\n {this.props.baggageInfo.baggageInfoCarryOn.map(\r\n (baggage_info, baggage_infoKey) => (\r\n \r\n {baggage_info.generalData.origin}\r\n {\" \"}\r\n \r\n {\" \"}\r\n {baggage_info.generalData.destination}\r\n \r\n }\r\n >\r\n \r\n {baggage_info.passengerBaggageDisclosure.map(\r\n (\r\n passengerBaggageDisclosure,\r\n passengerBaggageDisclosureKey\r\n ) => (\r\n \r\n
\r\n \r\n \r\n :{\" \"}\r\n {passengerBaggageDisclosure.passangerType ===\r\n \"ADT\" ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n \r\n {passengerBaggageDisclosure.bag.map(\r\n (bag, bagKey) => (\r\n \r\n )\r\n )}\r\n
\r\n \r\n {\" \"}\r\n \r\n \r\n \r\n - \r\n :{\" \"}\r\n {passengerBaggageDisclosure.totalUnits}\r\n
\r\n {passengerBaggageDisclosure.baggageRestrictions.map(\r\n (baggageRestrictions, key4) => (\r\n <>\r\n - \r\n \r\n :{\" \"}\r\n {\r\n baggageRestrictions.dimensionDescription\r\n }\r\n \r\n
\r\n - \r\n :{\" \"}\r\n {baggageRestrictions.weightDescription}\r\n
\r\n \r\n )\r\n )}\r\n
\r\n :\r\n \r\n {passengerBaggageDisclosure.additionalInfo}\r\n
\r\n \r\n \r\n
\r\n \r\n )\r\n )}\r\n \r\n
\r\n
\r\n {this.props.baggageInfo.baggageInfoCheckeId.map(\r\n (baggage_info, baggage_infoKey) => (\r\n \r\n {baggage_info.generalData.origin}\r\n {\" \"}\r\n \r\n {\" \"}\r\n {baggage_info.generalData.destination}\r\n \r\n }\r\n >\r\n \r\n {baggage_info.passengerBaggageDisclosure.map(\r\n (\r\n passengerBaggageDisclosure,\r\n passengerBaggageDisclosureKey\r\n ) => (\r\n \r\n
\r\n \r\n \r\n :{\" \"}\r\n {passengerBaggageDisclosure.passangerType ===\r\n \"ADT\" ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n \r\n {passengerBaggageDisclosure.bag.map(\r\n (bag, bagKey) => (\r\n \r\n )\r\n )}\r\n
\r\n \r\n {\" \"}\r\n \r\n \r\n\r\n \r\n - \r\n :{\" \"}\r\n {passengerBaggageDisclosure.totalUnits}\r\n
\r\n - \r\n {passengerBaggageDisclosure.baggageRestrictions.map(\r\n (baggageRestrictions, key4) => (\r\n \r\n :{\" \"}\r\n {baggageRestrictions.weightDescription}\r\n \r\n )\r\n )}\r\n
\r\n - \r\n :{\" \"}\r\n {passengerBaggageDisclosure.totalWeight}\r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n )\r\n )}\r\n \r\n
\r\n {\" \"}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n {this.checkedInBaggage()}\r\n \r\n \r\n \r\n \r\n {\r\n if (this.state.carryOn === 2) {\r\n this.setState({ carryOn: -1 });\r\n } else {\r\n this.setState({ carryOn: 2 });\r\n }\r\n }}\r\n >\r\n \r\n {\" \"}\r\n \r\n \r\n\r\n \r\n {\" \"}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n {this.carryOnBaggage()}\r\n \r\n \r\n \r\n \r\n );\r\n } catch (error) {\r\n console.log(error);\r\n return <>;\r\n }\r\n };\r\n getHoursFromMins = (mins) => {\r\n if (mins <= 60) {\r\n return (\r\n \r\n {\" \"}\r\n {mins} {\" mins\"}\r\n \r\n );\r\n } else {\r\n return (\r\n \r\n {\" \"}\r\n {parseInt(mins / 60)}\r\n {\" hr(s) \"} {mins % 60} {\" mins\"}\r\n \r\n );\r\n }\r\n };\r\n numberWithCommas(number) {\r\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n }\r\n getFlights = () => {\r\n var shoppingCartFlight = [];\r\n var operatedBy = [];\r\n var priceList = [];\r\n var flightTotal = null;\r\n var origin = null;\r\n var destination = null;\r\n try {\r\n this.props.bookingWiget.itineraryPart.forEach((itineraryPart, index) => {\r\n if (index === 0 && itineraryPart !== null) {\r\n origin = itineraryPart.params.from.value;\r\n destination = itineraryPart.params.to.value;\r\n } else {\r\n if (itineraryPart.params.to !== null) {\r\n destination = itineraryPart.params.to.value;\r\n }\r\n }\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n\r\n this.props.searchFlight.selectionResult.productBreakdowns.forEach(\r\n (productBreakdown) => {\r\n if (productBreakdown.label === \"air\") {\r\n productBreakdown.breakdownElements.forEach((breakdownElement) => {\r\n if (breakdownElement.label === \"BASE_FARE\") {\r\n breakdownElement.breakdownElementAssignment.travelPart.itineraryParts.forEach(\r\n (itineraryPart, index) => {\r\n var time = null;\r\n var date = null;\r\n var stopAirport = [];\r\n if (\r\n index === 1 &&\r\n this.props.bookingWiget.journyType === \"roundTrip\"\r\n ) {\r\n time = moment(itineraryPart.segments[0].departure)\r\n .locale(localStorage.getItem(\"i18nextLng\"))\r\n .format(\"LT\");\r\n date = moment(itineraryPart.segments[0].departure)\r\n .locale(localStorage.getItem(\"i18nextLng\"))\r\n .format(\"DD MMMM YYYY\");\r\n stopAirport = [];\r\n operatedBy = [];\r\n shoppingCartFlight.push(\r\n \r\n
\r\n \r\n \r\n {\" \"}\r\n \r\n {time}, on {date}\r\n \r\n
\r\n
\r\n \r\n {AirportFullName.getCityName(\r\n itineraryPart.segments[0].origin\r\n )}\r\n
\r\n \r\n \r\n {AirportFullName.getCityName(\r\n itineraryPart.segments[\r\n itineraryPart.segments.length - 1\r\n ].destination\r\n )}\r\n \r\n
\r\n
\r\n
\r\n \r\n
:{\" \"}\r\n {this.getHoursFromMins(itineraryPart.totalDuration)}\r\n {itineraryPart.stops !== 0 ? (\r\n
\r\n /{itineraryPart.stops}{\" \"}\r\n \r\n {itineraryPart.segments.map(\r\n (segment, index) => {\r\n segment.flight.stopAirports.forEach(\r\n (stopAirporTemp) => {\r\n stopAirport.push(\r\n stopAirporTemp.airport\r\n );\r\n }\r\n );\r\n if (\r\n itineraryPart.segments.length > 0 &&\r\n index != 0\r\n ) {\r\n stopAirport.push(segment.origin);\r\n }\r\n }\r\n )}\r\n ({stopAirport.join(\",\")})\r\n \r\n ) : (\r\n
\r\n {\" /\"}\r\n \r\n \r\n )}\r\n {itineraryPart.segments.map((segment, index) => {\r\n operatedBy.push(\r\n
\r\n \r\n {segment.flight.airlineCode === \"ET\" ? (\r\n
\r\n ) : null}\r\n\r\n {segment.flight.airlineCode}\r\n {\" \"}\r\n {segment.flight.flightNumber}\r\n
\r\n Operated by {segment.flight.airlineName}\r\n
\r\n \r\n );\r\n })}\r\n
\r\n {operatedBy}\r\n
\r\n
\r\n \r\n {this.props.bookingWiget.journyType ===\r\n \"multicity\" ||\r\n this.props.bookingWiget.journyType ===\r\n \"stopover\" ? (\r\n {index + 1}\r\n ) : null}{\" \"}\r\n \r\n {\" \"}\r\n \r\n {time}, on {date}\r\n \r\n
\r\n
\r\n \r\n {AirportFullName.getCityName(\r\n itineraryPart.segments[0].origin\r\n )}\r\n
\r\n \r\n \r\n {AirportFullName.getCityName(\r\n itineraryPart.segments[\r\n itineraryPart.segments.length - 1\r\n ].destination\r\n )}\r\n \r\n
\r\n
\r\n
\r\n \r\n
:\r\n {this.getHoursFromMins(itineraryPart.totalDuration)}\r\n {itineraryPart.stops !== 0 ? (\r\n
\r\n /{itineraryPart.stops}{\" \"}\r\n \r\n {itineraryPart.segments.map(\r\n (segment, index) => {\r\n segment.flight.stopAirports.forEach(\r\n (stopAirporTemp) => {\r\n stopAirport.push(\r\n stopAirporTemp.airport\r\n );\r\n }\r\n );\r\n if (\r\n itineraryPart.segments.length !== 1 &&\r\n index + 1 !==\r\n itineraryPart.segments.length\r\n ) {\r\n stopAirport.push(segment.destination);\r\n }\r\n }\r\n )}\r\n ({stopAirport.join(\",\")})\r\n \r\n ) : (\r\n
\r\n {\" /\"}\r\n \r\n \r\n )}\r\n {itineraryPart.segments.map((segment, index) => {\r\n operatedBy.push(\r\n
\r\n \r\n
\r\n {segment.flight.airlineCode}\r\n {\" \"}\r\n {segment.flight.flightNumber}\r\n
\r\n Operated by {segment.flight.airlineName}\r\n
\r\n \r\n );\r\n })}\r\n
\r\n {operatedBy}\r\n
\r\n \r\n \r\n {subElement.label === \"ADT\" ? (\r\n \r\n ) : subElement.label === \"CHD\" ? (\r\n \r\n ) : (\r\n \r\n )}{\" \"}\r\n x {subElement.breakdownElementAssignment.quantity}\r\n \r\n
\r\n \r\n \r\n {this.numberWithCommas(\r\n subElement.price.alternatives[0][0].amount\r\n )}{\" \"}\r\n {subElement.price.alternatives[0][0].currency}\r\n \r\n
\r\n
\r\n );\r\n });\r\n }\r\n });\r\n }\r\n }\r\n );\r\n\r\n return (\r\n \r\n {\r\n if (this.state.flightAccordion === 0) {\r\n this.setState({ flightAccordion: -1 });\r\n } else {\r\n this.setState({ flightAccordion: 0 });\r\n }\r\n }}\r\n >\r\n \r\n {\" \"}\r\n \r\n\r\n \r\n \r\n \r\n
{origin}
\r\n
\r\n \r\n
\r\n
\r\n {destination}\r\n
\r\n
\r\n {flightTotal}\r\n
\r\n
\r\n \r\n \r\n {subElement.label === \"ADT\" ? (\r\n \r\n ) : subElement.label === \"CHD\" ? (\r\n \r\n ) : (\r\n \r\n )}{\" \"}\r\n x {subElement.breakdownElementAssignment.quantity}\r\n \r\n
\r\n \r\n \r\n {this.numberWithCommas(\r\n subElement.price.alternatives[0][0].amount\r\n )}{\" \"}\r\n {subElement.price.alternatives[0][0].currency}\r\n \r\n
\r\n
\r\n );\r\n });\r\n }\r\n });\r\n }\r\n }\r\n );\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n\r\n return (\r\n \r\n {\r\n if (this.state.sucharchgesAccordion === 3) {\r\n this.setState({ sucharchgesAccordion: -1 });\r\n } else {\r\n this.setState({ sucharchgesAccordion: 3 });\r\n }\r\n }}\r\n >\r\n {\" \"}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n {surchargeTotal}
\r\n
\r\n \r\n \r\n {shoppingSurcharge}\r\n \r\n \r\n );\r\n };\r\n\r\n getTaxs = () => {\r\n var shoppingTax = [];\r\n var taxTotal = null;\r\n this.props.searchFlight.selectionResult.productBreakdowns.forEach(\r\n (productBreakdown) => {\r\n if (productBreakdown.label === \"air\") {\r\n productBreakdown.breakdownElements.forEach((breakdownElement) => {\r\n if (breakdownElement.label === \"TAXES\") {\r\n taxTotal = (\r\n \r\n {this.numberWithCommas(\r\n breakdownElement.price.alternatives[0][0].amount\r\n )}{\" \"}\r\n {breakdownElement.price.alternatives[0][0].currency}\r\n \r\n );\r\n breakdownElement.subElements.forEach((subElement) => {\r\n shoppingTax.push(\r\n <>\r\n \r\n \r\n {subElement.label === \"ADT\" ? (\r\n \r\n ) : subElement.label === \"CHD\" ? (\r\n \r\n ) : (\r\n \r\n )}\r\n
\r\n \r\n {subElement.price.alternatives.length !== 0 ? (\r\n \r\n {this.numberWithCommas(\r\n subElement.price.alternatives[0][0].amount\r\n )}{\" \"}\r\n {subElement.price.alternatives[0][0].currency}\r\n \r\n ) : null}\r\n
\r\n
\r\n\r\n {subElement.subElements !== null\r\n ? subElement.subElements.map((finalSubElement) => (\r\n \r\n \r\n {finalSubElement.label}\r\n
\r\n \r\n {finalSubElement.price.alternatives.length !==\r\n 0 ? (\r\n \r\n {this.numberWithCommas(\r\n finalSubElement.price.alternatives[0][0]\r\n .amount\r\n )}{\" \"}\r\n {\r\n finalSubElement.price.alternatives[0][0]\r\n .currency\r\n }\r\n \r\n ) : null}\r\n
\r\n
\r\n ))\r\n : null}\r\n \r\n );\r\n });\r\n }\r\n });\r\n }\r\n }\r\n );\r\n return (\r\n \r\n {\r\n if (this.state.taxesAccordion === 4) {\r\n this.setState({ taxesAccordion: -1 });\r\n } else {\r\n this.setState({ taxesAccordion: 4 });\r\n }\r\n }}\r\n >\r\n {\" \"}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n {taxTotal}
\r\n
\r\n \r\n \r\n {shoppingTax}\r\n \r\n \r\n );\r\n };\r\n\r\n removeSeat = (\r\n flightIdentifier,\r\n passengerIndex,\r\n seatMapIdentifier,\r\n departure\r\n ) => {\r\n this.props.seatSelectingUpdate(true);\r\n var seatSelectionService = new SeatSelectionService();\r\n var payload = {\r\n departure: departure,\r\n seatMapIdentifier: seatMapIdentifier,\r\n seatCode: null,\r\n passengerIndex: this.props.passengerIndex,\r\n };\r\n\r\n seatSelectionService\r\n .selectSeat(this.props.cookieSabreDataRequest, this.props.token, payload)\r\n .then((response) => {\r\n this.props.seatSelectingUpdate(false);\r\n this.props.removeSelectedSeat(flightIdentifier, passengerIndex);\r\n });\r\n };\r\n\r\n calculateSeatTotalPrice = () => {\r\n var temp = Object.keys(this.props.selectedSeats).filter(\r\n (key) => \"seat\" in this.props.selectedSeats[key]\r\n );\r\n var total = 0;\r\n for (var i = 0; i < temp.length; i++) {\r\n if (\r\n !this.props.selectedSeats[temp[i]].seat.freeOfCharge &&\r\n this.props.selectedSeats[temp[i]].seat.total.alternatives.length !== 0\r\n ) {\r\n total =\r\n total +\r\n this.props.selectedSeats[temp[i]].seat.total.alternatives[0][0]\r\n .amount;\r\n this.currencyForSeat =\r\n this.props.selectedSeats[\r\n temp[i]\r\n ].seat.total.alternatives[0][0].currency;\r\n }\r\n }\r\n return total;\r\n };\r\n\r\n getSelectedSeats = () => {\r\n return (\r\n <>\r\n {/* {console.log(this.props.segmentSeatMaps)} */}\r\n {/* {this.props.segmentSeatMaps.map((segmentSeatMap) => {\r\n {segmentSeatMap.segment.origin + \"-\" + segmentSeatMap.segment.destination}
\r\n console.log(segmentSeatMap)\r\n })} */}\r\n {this.props.segmentSeatMaps.map((segmentSeatMap) => {\r\n return (\r\n <>\r\n \r\n {\"Flight : \" +\r\n segmentSeatMap.segment.origin +\r\n \"-\" +\r\n segmentSeatMap.segment.destination}\r\n \r\n \r\n
\r\n {this.props.segmentSeatMaps[0].passengerSeatMaps.map(\r\n (passengerSeatMap) => {\r\n return (\r\n
\r\n \r\n \r\n {passengerSeatMap.passenger.passengerDetails\r\n .firstName +\r\n \" \" +\r\n passengerSeatMap.passenger.passengerDetails\r\n .lastName}\r\n \r\n \r\n }\r\n >\r\n \r\n {/* {console.log(this.passengerSeatMaps)} */}\r\n {this.props.activePassangerIdentifierCodeMapper[passengerSeatMap.passenger.passengerInfo.type[0] +\r\n passengerSeatMap.passenger.passengerIndex]}\r\n \r\n \r\n {segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex in\r\n this.props.selectedSeats ? (\r\n <>\r\n \r\n {\" Seat \" +\r\n this.props.selectedSeats[\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex\r\n ].seatCode}\r\n \r\n \r\n {this.props.selectedSeats[\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex\r\n ].seat.freeOfCharge\r\n ? \" Free \"\r\n : !this.props.selectedSeats[\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex\r\n ].seat.freeOfCharge &&\r\n this.props.selectedSeats[\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex\r\n ].seat.total.alternatives.length !== 0\r\n ? this.numberWithCommas(\r\n this.props.selectedSeats[\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger\r\n .passengerIndex\r\n ].seat.total.alternatives[0][0].amount\r\n ) +\r\n \" \" +\r\n this.props.selectedSeats[\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex\r\n ].seat.total.alternatives[0][0].currency\r\n : null}\r\n \r\n \r\n this.removeSeat(\r\n segmentSeatMap.segment.origin +\r\n segmentSeatMap.segment.destination +\r\n passengerSeatMap.passenger.passengerIndex,\r\n segmentSeatMap.segment.origin +\r\n \"-\" +\r\n segmentSeatMap.segment.destination,\r\n segmentSeatMap.segment.departure\r\n )\r\n }\r\n >\r\n x\r\n \r\n \r\n ) : (\r\n \r\n {passengerSeatMap.passenger.passengerInfo.type ===\r\n \"INF\"\r\n ? \"n/a (Infant)\"\r\n : \" - - \"}\r\n \r\n )}\r\n
\r\n );\r\n }\r\n )}\r\n
\r\n
\r\n
\r\n \r\n \r\n {ancillaryListForShoppingCartSingle.firstName +\r\n \" \" +\r\n ancillaryListForShoppingCartSingle.lastName}\r\n \r\n \r\n }\r\n >\r\n \r\n {ancillaryListForShoppingCartSingle.type[0] +\r\n ancillaryListForShoppingCartSingle.passengerIndex}\r\n \r\n \r\n <>\r\n \r\n {ancillaryListForShoppingCartSingle.ancillaryName}\r\n \r\n \r\n {this.numberWithCommas(\r\n ancillaryListForShoppingCartSingle.price\r\n )}{\" \"}\r\n {\r\n this.props.searchFlight.selectionResult.total\r\n .alternatives[0][0].currency\r\n }\r\n \r\n {\r\n this.removeBaggage(\r\n ancillaryListForShoppingCartSingle\r\n );\r\n }}\r\n >\r\n x\r\n \r\n \r\n
\r\n
No Extras Added Yet!
;\r\n }\r\n };\r\n shoppingCartBody = () => {\r\n return (\r\n <>\r\n \r\n \r\n \r\n
\r\n \r\n \r\n {\" \"}\r\n {\" \"}\r\n
\r\n \r\n {this.getFlights()}\r\n \r\n
\r\n \r\n {\r\n if (this.state.seatAccordion === 1) {\r\n this.setState({ seatAccordion: -1 });\r\n } else {\r\n this.setState({ seatAccordion: 1 });\r\n }\r\n }}\r\n >\r\n \r\n {\" \"}\r\n = 4\r\n ? \"shopping-cart-active shopping-cart-left-icon\"\r\n : \"shopping-cart-disapled shopping-cart-left-icon\"\r\n }\r\n />\r\n \r\n = 4\r\n ? faAngleUp\r\n : faAngleDown\r\n }\r\n className=\"shopping-cart-right-icon\"\r\n />\r\n = 5\r\n ? \"mx-3 shopping-cart-title shopping-cart-header\"\r\n : \"mx-3 shopping-cart-disapled shopping-cart-header\"\r\n }\r\n >\r\n {\" \"}\r\n {\" \"}\r\n {this.calculateSeatTotalPrice() !== 0 ? (\r\n \r\n {this.numberWithCommas(this.calculateSeatTotalPrice()) +\r\n \" \" +\r\n this.currencyForSeat}\r\n \r\n ) : null}\r\n \r\n \r\n {this.currentPageTracker >= 4 ? (\r\n \r\n \r\n {this.getSelectedSeats()}\r\n \r\n \r\n ) : null}\r\n \r\n \r\n
\r\n \r\n {\r\n if (this.state.extraAccordion === 1) {\r\n this.setState({ extraAccordion: -1 });\r\n } else {\r\n this.setState({ extraAccordion: 1 });\r\n }\r\n }}\r\n >\r\n \r\n = 5\r\n ? \"shopping-cart-active shopping-cart-left-icon\"\r\n : \"shopping-cart-disapled shopping-cart-left-icon\"\r\n }\r\n />\r\n \r\n = 5\r\n ? faAngleUp\r\n : faAngleDown\r\n }\r\n className=\"shopping-cart-right-icon\"\r\n />\r\n\r\n = 5\r\n ? \"mx-3 shopping-cart-title shopping-cart-header\"\r\n : \"mx-3 shopping-cart-disapled shopping-cart-header\"\r\n }\r\n >\r\n {\" \"}\r\n \r\n {this.props.isAncillaryAdd ? (\r\n \r\n {this.numberWithCommas(this.props.totalPriceBaggage)}{\" \"}\r\n {\r\n this.props.searchFlight.selectionResult.total\r\n .alternatives[0][0].currency\r\n }\r\n \r\n ) : null}\r\n \r\n \r\n {this.currentPageTracker >= 5 ? (\r\n \r\n \r\n {this.getExtras()}\r\n \r\n \r\n ) : null}\r\n \r\n \r\n
{this.getSurcharges()}\r\n
{this.getTaxs()}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n {this.numberWithCommas(this.totalFinder())}{\" \"}\r\n \r\n {\" \"}\r\n {\r\n this.props.searchFlight.selectionResult.total\r\n .alternatives[0][0].currency\r\n }\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n {\" \"}\r\n {\" \"}\r\n this.setState({ showFareRule: true })}\r\n >\r\n \r\n {\" \"}\r\n \r\n \r\n {\" \"}\r\n this.setState({ showBaggageInformation: true })}\r\n >\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n {\" \"} {this.flightSearch()}\r\n
\r\n {this.state.currentBreadCrumb} of 6{\" \"}\r\n {this.state.showDropDown ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n {Translation.t(\"select_flight\")}{\" \"}\r\n
\r\n
\r\n
\r\n {\" \"}\r\n Passenger\r\n
\r\n {this.state.currentBreadCrumb} of 6{\" \"}\r\n {this.state.showDropDown ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n
{this.getNumberOfPassenge()}
\r\n
\r\n \r\n {\" \"}\r\n \r\n {this.state.currentBreadCrumb} of 6{\" \"}\r\n {this.state.showDropDown ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n Seat Selection\r\n
\r\n );\r\n case 5:\r\n return (\r\n \r\n \r\n {\" \"}\r\n \r\n {this.state.currentBreadCrumb} of 6{\" \"}\r\n {this.state.showDropDown ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n Extras\r\n
\r\n );\r\n case 6:\r\n return (\r\n \r\n \r\n {this.state.currentBreadCrumb} of 6\r\n \r\n \r\n {\" \"}\r\n \r\n {this.state.showDropDown ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n Payment\r\n
\r\n );\r\n }\r\n }\r\n renderBreadcrumbMediumScreen() {\r\n return (\r\n <>\r\n \r\n
{\r\n this.setState({ showDropDown: false });\r\n }}\r\n >\r\n {\r\n this.setState({ showDropDown: !this.state.showDropDown });\r\n }}\r\n >\r\n {this.renderActivePage(this.state.currentBreadCrumb)}\r\n\r\n \r\n \r\n
\r\n {\" \"}\r\n {\" \"}Home\r\n
\r\n
\r\n
{\r\n var textSelect = document.getElementById(\"select-flight\");\r\n textSelect.innerHTML = Translation.t(\"review_flight\");\r\n }}\r\n onClick={this.changePage.bind(this, \"flight\")}\r\n onMouseOut={() => {\r\n var textSelect = document.getElementById(\"select-flight\");\r\n textSelect.innerHTML = Translation.t(\"select_flight\");\r\n }}\r\n >\r\n \r\n {this.state.currentBreadCrumb !== \"flight\" ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"} {this.flightSearch()}\r\n \r\n {Translation.t(\"select_flight\")}{\" \"}\r\n
\r\n \r\n \r\n
3\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n onClick={this.changePage.bind(this, \"passenger\")}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 3 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n {\" \"}\r\n {\" \"}\r\n Passenger\r\n \r\n {this.state.currentBreadCrumb === 3\r\n ? Translation.t(\"info_required\")\r\n : this.getNumberOfPassenge()}\r\n
\r\n \r\n \r\n
4\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n onClick={this.changePage.bind(this, \"seat\")}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 4 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n Seat Selection\r\n \r\n \r\n
5\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n onClick={this.changePage.bind(this, \"extra\")}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 5 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n {\" \"}\r\n {\" \"}\r\n Extras\r\n \r\n \r\n
6\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n >\r\n \r\n {this.state.currentBreadCrumb > 6 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"}\r\n Payment\r\n \r\n \r\n
\r\n - \r\n \r\n {\" \"}\r\n \r\n {\" \"}\r\n
Home
\r\n \r\n \r\n - \r\n false}\r\n className={\r\n this.state.currentBreadCrumb === 2\r\n ? \"breadcrumb-custom-current\"\r\n : \"breadcrumb-custom-disabled previsous\"\r\n }\r\n onMouseOver={() => {\r\n var textSelect = document.getElementById(\"select-flight-lg\");\r\n textSelect.innerHTML = Translation.t(\"review_flight\");\r\n }}\r\n onClick={this.changePage.bind(this, \"flight\")}\r\n onMouseOut={() => {\r\n var textSelect = document.getElementById(\"select-flight-lg\");\r\n textSelect.innerHTML = Translation.t(\"select_flight\");\r\n }}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 2 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"} {this.flightSearch()}\r\n
{Translation.t(\"select_flight\")}
\r\n \r\n \r\n - \r\n false}\r\n className={\r\n this.state.currentBreadCrumb === 3\r\n ? \"breadcrumb-custom-current\"\r\n : this.state.currentBreadCrumb > 3\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n onMouseOver={() => {\r\n if (this.state.currentBreadCrumb >= 3) {\r\n var textSelect =\r\n document.getElementById(\"passenger-text-lg\");\r\n textSelect.innerHTML = Translation.t(\"edit_info\");\r\n }\r\n }}\r\n onClick={this.changePage.bind(this, \"passenger\")}\r\n onMouseOut={() => {\r\n var textSelect = document.getElementById(\"passenger-text-lg\");\r\n if (this.state.currentBreadCrumb === 3) {\r\n textSelect.innerHTML = Translation.t(\"info_required\");\r\n }\r\n if (this.state.currentBreadCrumb > 3) {\r\n var passengerText = this.getNumberOfPassenge();\r\n textSelect.innerHTML = passengerText;\r\n }\r\n }}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 3 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"}\r\n Passenger\r\n
\r\n {this.state.currentBreadCrumb === 3\r\n ? Translation.t(\"info_required\")\r\n : this.getNumberOfPassenge()}\r\n
\r\n \r\n \r\n - \r\n false}\r\n className={\r\n this.state.currentBreadCrumb === 4\r\n ? \"breadcrumb-custom-current\"\r\n : this.state.currentBreadCrumb > 4\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n onMouseOver={() => {\r\n if (this.state.currentBreadCrumb >= 4) {\r\n var textSelect = document.getElementById(\"seat-text-lg\");\r\n textSelect.innerHTML = Translation.t(\"edit_seat\");\r\n }\r\n }}\r\n onClick={this.changePage.bind(this, \"seat\")}\r\n onMouseOut={() => {\r\n if (this.state.currentBreadCrumb >= 4) {\r\n var textSelect = document.getElementById(\"seat-text-lg\");\r\n textSelect.innerHTML = \"\";\r\n }\r\n }}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 4 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"}\r\n Seat Selection\r\n \r\n \r\n
\r\n - \r\n false}\r\n className={\r\n this.state.currentBreadCrumb === 5\r\n ? \"breadcrumb-custom-current\"\r\n : this.state.currentBreadCrumb > 5\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n onMouseOver={() => {\r\n if (this.state.currentBreadCrumb === 5) {\r\n var textSelect = document.getElementById(\"extras-text-lg\");\r\n textSelect.innerHTML = Translation.t(\"edit_extras\");\r\n }\r\n }}\r\n onClick={this.changePage.bind(this, \"extra\")}\r\n onMouseOut={() => {\r\n if (this.state.currentBreadCrumb === 5) {\r\n var textSelect = document.getElementById(\"extras-text-lg\");\r\n textSelect.innerHTML = \"\";\r\n }\r\n }}\r\n >\r\n \r\n {this.state.currentBreadCrumb > 5 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"}\r\n Extras\r\n \r\n \r\n
\r\n - \r\n false}\r\n className={\r\n this.state.currentBreadCrumb === 6\r\n ? \"breadcrumb-custom-current\"\r\n : this.state.currentBreadCrumb > 6\r\n ? \"breadcrumb-custom-disabled previsous\"\r\n : \"breadcrumb-custom-disabled btn-not-allowd\"\r\n }\r\n >\r\n \r\n {this.state.currentBreadCrumb > 6 ? (\r\n \r\n ) : (\r\n \r\n )}\r\n {\" \"}\r\n {\" \"}\r\n Payment\r\n \r\n
\r\n
\r\n {/*
\r\n \r\n */}\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n
{this.props.ancillaries.name}
\r\n
\r\n
\r\n {this.props.ancillaries.description !== null\r\n ? this.props.ancillaries.description.split(\"\\n\")[0]\r\n : null}\r\n
\r\n
\r\n
\r\n {this.props.bagIsAdded ? (\r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n ) : null}\r\n
\r\n {\" \"}\r\n \r\n
\r\n
\r\n \r\n {this.props.bagIsAdded\r\n ? this.numberWithCommas(this.props.finaloverAllTotal)\r\n : this.minimumPrice}{\" \"}\r\n {this.currency}\r\n \r\n
\r\n
\r\n {\" \"}\r\n \r\n / \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n this.setState({ showModal: true })}\r\n >\r\n {this.props.bagIsAdded ? (\r\n \r\n \r\n \r\n \r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n
\r\n \r\n
{this.props.ancillaries.name}
\r\n\r\n
\r\n
\r\n
\r\n {this.props.ancillaries.description !== null\r\n ? this.props.ancillaries.description.split(\"\\n\")[1]\r\n : null}\r\n
\r\n \r\n \r\n
\r\n {this.props.bagIsAdded ? (\r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n ) : null}\r\n
\r\n {\" \"}\r\n \r\n
\r\n
\r\n \r\n {this.minimumPrice} {this.currency}\r\n \r\n
\r\n
\r\n {\" \"}\r\n \r\n / \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n {this.props.itinerary.itineraryParts.map(\r\n (itinerary, itinerayIndex) => {\r\n var stopAirport = [];\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {this.props.journeytype === \"roundTrip\" ||\r\n this.props.journeytype === \"oneWay\" ? (\r\n itinerayIndex === 0 ? (\r\n \r\n {\" \"}\r\n \r\n \r\n ) : (\r\n \r\n {\" \"}\r\n \r\n \r\n )\r\n ) : (\r\n \r\n \r\n {\" \"}\r\n {itinerayIndex + 1}\r\n {\" \"}\r\n {itinerary.segments[0].origin}\r\n {\" \"}\r\n {\" \"}\r\n {\r\n itinerary.segments[\r\n itinerary.segments.length - 1\r\n ].destination\r\n }\r\n \r\n \r\n )}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n {\" \"}\r\n {itinerary.segments.map(\r\n (segments, segmentsIndex) => {\r\n stopAirport.push(\r\n segments.flight.airlineCode +\r\n \" \" +\r\n segments.flight.flightNumber\r\n );\r\n }\r\n )}\r\n {stopAirport.join(\",\")}\r\n {\" : \"}\r\n {AirportFullName.getFullName(\r\n itinerary.segments[0].origin\r\n )}{\" \"}\r\n {\" \"}\r\n {AirportFullName.getFullName(\r\n itinerary.segments[\r\n itinerary.segments.length - 1\r\n ].destination\r\n )}\r\n
\r\n
\r\n \r\n Select the number of bags, and their respective\r\n weight, that you will be carrying.\r\n
\r\n
\r\n {this.props.ancillaryPassengers.map(\r\n (passenger, passengerIndex) => {\r\n var passengerAncillary = this.ancillaryForPassenger(\r\n passenger[\"@id\"],\r\n itinerary[\"@id\"],\r\n itinerary.segments[0].origin,\r\n itinerary.segments[\r\n itinerary.segments.length - 1\r\n ].destination,\r\n itinerary.segments[0].departure\r\n );\r\n if (passengerAncillary.ancillary.length !== 0) {\r\n return (\r\n
\r\n \r\n
\r\n \r\n
\r\n {\" \"}\r\n {\r\n passengerAncillary.passenger\r\n .firstName\r\n }{\" \"}\r\n {\r\n passengerAncillary.passenger\r\n .lastName\r\n }\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {\" \"}\r\n {\" \"}\r\n \r\n :{\" \"}\r\n \r\n {this.getPassengerData(\r\n \"totalQuantity\",\r\n passenger[\"@id\"],\r\n itinerayIndex\r\n )}\r\n \r\n \r\n \r\n {this.getPassengerData(\r\n \"totalPrice\",\r\n passenger[\"@id\"],\r\n itinerayIndex\r\n )}\r\n {\" \"}\r\n {this.currency}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n {passengerAncillary.ancillary.map(\r\n (ancillary, ancillaryIndex) => (\r\n \r\n {ancillary.name}\r\n \r\n \r\n {this.numberWithCommas(\r\n ancillary\r\n .travelPartOffers[0]\r\n .passengerOffers[0]\r\n .ancillaryPrice\r\n .totalPrice\r\n .alternatives[0][0]\r\n .amount\r\n )}\r\n \r\n {\" \"}{\" \"}\r\n \r\n {\r\n ancillary\r\n .travelPartOffers[0]\r\n .passengerOffers[0]\r\n .ancillaryPrice\r\n .totalPrice\r\n .alternatives[0][0]\r\n .currency\r\n }\r\n \r\n
\r\n\r\n \r\n \r\n {\" \"}\r\n {this.getPassengerData(\r\n \"quantity\",\r\n passenger[\"@id\"],\r\n itinerayIndex,\r\n ancillaryIndex\r\n )}\r\n \r\n \r\n \r\n -\r\n \r\n\r\n \r\n +\r\n \r\n \r\n
\r\n
\r\n \r\n
\r\n {\" \"}\r\n {\r\n passengerAncillary.passenger\r\n .firstName\r\n }{\" \"}\r\n {\r\n passengerAncillary.passenger\r\n .lastName\r\n }\r\n
\r\n \r\n \r\n
\r\n Unavailable for{\" \"}\r\n {passengerAncillary.passenger.type}\r\n
\r\n \r\n
\r\n );\r\n }\r\n }\r\n )}\r\n \r\n \r\n \r\n \r\n \r\n );\r\n }\r\n )}\r\n \r\n
\r\n \r\n :{\" \"}\r\n \r\n {this.numberWithCommas(this.props.totalPrice)}\r\n {\" \"}\r\n {this.currency}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {\r\n this.setState({ showModal: false });\r\n }}\r\n >\r\n \r\n \r\n \r\n {this.props.bagIsAdded ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {\" \"}\r\n \r\n \r\n \r\n );\r\n }\r\n}\r\nconst mapStateToProps = (state) => {\r\n return {\r\n baggageModel: state.ancillary.baggageModel,\r\n totalPrice:state.ancillary.overAllTotal,\r\n finaloverAllTotal:state.ancillary.finaloverAllTotal,\r\n journeytype : state.bookingWiget.journyType,\r\n bagIsAdded:state.ancillary.bagIsAdded,\r\n cookieSabreDataRequest:state.ancillary.ancillaryList.cookieSabreDataRequest,\r\n token: state.searchFlight.token,\r\n itineraryList:state.ancillary.ancillaryList.itinerary.itineraryParts,\r\n baggageRequest:state.ancillary.baggageRequest\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n addBag: (\r\n passengerId,\r\n ancillaryIndex,\r\n ancillaryCode,\r\n price,\r\n itinerayIndex,\r\n itineryId\r\n ) =>\r\n dispatch({\r\n type: ancillaryAction.ADDBAG,\r\n passengerId: passengerId,\r\n ancillaryIndex: ancillaryIndex,\r\n ancillaryCode: ancillaryCode,\r\n price: price,\r\n itinerayIndex: itinerayIndex,\r\n itineryId: itineryId,\r\n }),\r\n minusBag: (passengerId, ancillaryIndex, price, itinerayIndex) =>\r\n dispatch({\r\n type: ancillaryAction.MINUSBAG,\r\n passengerId: passengerId,\r\n ancillaryIndex: ancillaryIndex,\r\n price: price,\r\n itinerayIndex: itinerayIndex,\r\n }),\r\n addedToCart: (ancillaryOperationResults,baggageRequest) =>\r\n dispatch({\r\n type: ancillaryAction.ADDTOCART,\r\n ancillaryOperationResults:ancillaryOperationResults,\r\n baggageRequest:baggageRequest\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(BaggagePage);\r\n","import React from \"react\";\r\nimport BreadCrumb from \"../../shared/bread-crumb/BreadCrumb\";\r\nimport \"./ancillary.css\";\r\nimport { connect } from \"react-redux\";\r\nimport BaggagePage from \"./BaggagePage\";\r\nimport ShoppingCart from \"../../shared/shoppingCart/ShoppingCart\";\r\nimport { Row, Col, Button } from \"react-bootstrap\";\r\nimport { ancillaryAction } from \"../../../redux/actions/booking/ancillaryAction\";\r\nimport Translation from \"i18next\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faArrowLeft } from \"@fortawesome/free-solid-svg-icons\";\r\nimport Notification from \"../booking-widget/Notification\";\r\n\r\nclass AncillaryList extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showModal: false,\r\n };\r\n this.intializeState();\r\n }\r\n intializeState = async () => {\r\n if (!this.props.bagIsAdded) {\r\n await this.props.intializeState(this.props.ancillaryList);\r\n }\r\n };\r\n render() {\r\n return (\r\n <>\r\n \r\n \r\n \r\n {this.props.ancillaryList.ancillaryGroups !== undefined ? (\r\n this.props.ancillaryList.ancillaryGroups.map(\r\n (ancillary, index) => {\r\n if (ancillary.code === \"BG\") {\r\n return (\r\n
\r\n );\r\n }\r\n }\r\n )\r\n ) : (\r\n
\r\n \r\n
\r\n )}\r\n\r\n
\r\n \r\n \r\n \r\n this.setState({ backPage: true })}\r\n >\r\n \r\n \r\n {\r\n if (\r\n this.props.isTeleBirrPayment === \"true\" ||\r\n this.props.isTeleBirrPayment === true\r\n ) {\r\n this.props.history.push(\"/pay-with-telebirr\");\r\n } else {\r\n // this.props.history.push(\"/payment\");\r\n this.props.history.push(\"/pay-with-telebirr\");\r\n }\r\n }}\r\n >\r\n {Translation.t(\"continue\")}\r\n \r\n \r\n \r\n
\r\n
\r\n {!this.props.isMedium && }\r\n
\r\n
\r\n \r\n );\r\n }\r\n}\r\nconst mapStateToProps = (state) => {\r\n return {\r\n ancillaryList: state.ancillary.ancillaryList,\r\n bagIsAdded: state.ancillary.bagIsAdded,\r\n isMedium: state.global.isMedium,\r\n isTeleBirrPayment: state.global.isTeleBirrPayment,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n intializeState: (data) =>\r\n dispatch({\r\n type: ancillaryAction.SAVEANCILLARYDATA,\r\n data: data,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(AncillaryList);\r\n","import React, { Component } from \"react\";\r\nimport { ButtonGroup, Col } from \"react-bootstrap\";\r\nimport { BookingWidgetAction } from \"../../../redux/actions/booking/bookingWidgetAction\";\r\nimport { connect } from \"react-redux\";\r\nimport Translation from \"../../../service/shared/multi-lingual/Translation\";\r\n\r\nclass FareOptions extends Component {\r\n setFareType = (event) => {\r\n this.props.updateFareType(event.target.value);\r\n };\r\n\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n {this.props.recentSearchState.map((recentSearch, index) => {\r\n if(recentSearch.journeyType===\"oneWay\"){\r\n return(\r\n \r\n
\r\n \r\n {\" \"}\r\n\r\n
\r\n {index+1} \r\n {AirportFullName.getFullName(recentSearch.itineraryParts[0].from)}\r\n \r\n {\" \"}\r\n \r\n \r\n {AirportFullName.getFullName(recentSearch.itineraryParts[0].to)}\r\n
\r\n \r\n
\r\n \r\n ONE WAY | {this.cabinClassService.getCabinClassByCode(recentSearch.cabinClass)}\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n {\" \"}\r\n
\r\n {index+1} \r\n {AirportFullName.getFullName(recentSearch.itineraryParts[0].from)}\r\n \r\n {\" \"}\r\n \r\n \r\n {AirportFullName.getFullName(recentSearch.itineraryParts[0].to)}\r\n
\r\n \r\n
\r\n \r\n ROUND TRIP | {this.cabinClassService.getCabinClassByCode(recentSearch.cabinClass)}\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n {\" \"}\r\n {\r\n recentSearch.itineraryParts.map((itinerary,itineraryIndex)=>(\r\n itineraryIndex===0?\r\n
\r\n {index+1} \r\n \r\n {AirportFullName.getFullName(itinerary.from)}\r\n \r\n {\" \"}\r\n \r\n \r\n {AirportFullName.getFullName(itinerary.to)}\r\n
:\r\n
\r\n {AirportFullName.getFullName(itinerary.from)} \r\n \r\n {\" \"}\r\n \r\n \r\n {AirportFullName.getFullName(itinerary.to)}\r\n
\r\n ))\r\n }\r\n
\r\n \r\n MULTI CITY | {this.cabinClassService.getCabinClassByCode(recentSearch.cabinClass)}\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n {\" \"}\r\n {\r\n recentSearch.itineraryParts.map((itinerary,itineraryIndex)=>(\r\n itineraryIndex===0?\r\n
\r\n {index+1} \r\n \r\n {AirportFullName.getFullName(itinerary.from)}\r\n \r\n {\" \"}\r\n \r\n \r\n {AirportFullName.getFullName(itinerary.to)}\r\n
:\r\n
\r\n {AirportFullName.getFullName(itinerary.from)} \r\n \r\n {\" \"}\r\n \r\n \r\n {AirportFullName.getFullName(itinerary.to)}\r\n
\r\n ))\r\n }\r\n
\r\n \r\n Stopover | {this.cabinClassService.getCabinClassByCode(recentSearch.cabinClass)}\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n {\r\n \r\n this.setState({showRecentSearches:!this.state.showRecentSearches});\r\n }}/>\r\n
\r\n \r\n {this.state.showRecentSearches && }\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\nexport default RecentSearch;","import React, { Component } from \"react\";\r\nclass SearchFormRemark extends Component {\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n Please Note:\r\n \r\n \r\n All fields are required unless marked as optional. Use latin\r\n characters only.\r\n \r\n
\r\n
\r\n
Search for Flights
\r\n \r\n );\r\n }\r\n}\r\nexport default FlightSearchHeadText;\r\n","export const flightScheduleAction={\r\n UPADTESEARCHCRITRION:\"UPADTESEARCHCRITRION\",\r\n SCHEDULEFILTERUPDATE : \"SCHEDULEFILTERUPDATE\",\r\n SCHEDULEUPDATESORTOPTIONS : \"SCHEDULEUPDATESORTOPTIONS\",\r\n SCHEDULEUPDATECOUNTSORTUPDATE : \"SCHEDULEUPDATECOUNTSORTUPDATE\",\r\n UPDATEFLIGHTSCHEDULES : \"UPDATEFLIGHTSCHEDULES\",\r\n SCHEDULEINITFLIGHTS : \"SCHEDULEINITFLIGHTS\",\r\n ISFLIGHTSCHEDULEPRESENT : \"ISFLIGHTSCHEDULEPRESENT\",\r\n}","import { faClock, faInfoCircle, faPlaneDeparture, faSuitcase } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport React from \"react\";\r\nimport { Button, ButtonGroup, Col, Row } from \"react-bootstrap\";\r\nimport { connect } from \"react-redux\";\r\nimport { BookingWidgetAction } from \"../../../redux/actions/booking/bookingWidgetAction\";\r\n\r\nconst WidgetType = (props) => {\r\n return (\r\n \r\n \r\n props.changeWidgetType(\"bookFlight\")}\r\n >\r\n \r\n Book a flight\r\n \r\n props.changeWidgetType(\"flightStatus\")}\r\n >\r\n \r\n Flight Status\r\n \r\n props.changeWidgetType(\"flightSchedule\")}\r\n >\r\n \r\n Flight Schedule\r\n \r\n props.changeWidgetType(\"manageTrip\")}\r\n >\r\n \r\n Manage my Trips\r\n \r\n \r\n
\r\n );\r\n};\r\nconst mapStateToProps = (state) => {\r\n return {\r\n widgetType: state.bookingWiget.widgetType,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n changeWidgetType: (widgetType) =>\r\n dispatch({\r\n type: BookingWidgetAction.CHANGEWIDGETTYPE,\r\n widgetType: widgetType,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(WidgetType);\r\n","export const flightStatusAction={\r\n STATUSUPADTESEARCHCRITRION:\"STATUSUPADTESEARCHCRITRION\",\r\n STATUSFILTERUPDATE : \"STATUSFILTERUPDATE\",\r\n STATUSUPDATESORTOPTIONS : \"STATUSUPDATESORTOPTIONS\",\r\n STATUSUPDATECOUNTSORTUPDATE : \"STATUSUPDATECOUNTSORTUPDATE\",\r\n INITFLIGHTSTATUS :\"INITFLIGHTSTATUS\",\r\n UPDATEFLIGHTSTATUS :\"UPDATEFLIGHTSTATUS\",\r\n UPDATESTATUSSERACHTYPE :\"UPDATESTATUSSERACHTYPE\",\r\n UPDATEFLIGHTNUMBER :\"UPDATEFLIGHTNUMBER\",\r\n ISFLIGHTSTATUSPRESENT :\"isFlightStatusPresent\",\r\n}","import React from \"react\";\r\nimport { Button, Row, Col } from \"react-bootstrap\";\r\nimport AirportSelection from \"../../booking/booking-widget/airport-selection/AirportSelection\";\r\nimport { connect } from \"react-redux\";\r\nimport { flightScheduleAction } from \"../../../redux/actions/manage-my-booking/flightScheduleAction\";\r\nimport { flightStatusAction } from \"../../../redux/actions/manage-my-booking/flightStatusAction\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport { globalActionType } from \"../../../redux/actions/shared/globalAction\";\r\nimport Translation from \"i18next\";\r\n\r\nconst FlightStatus = (props) => {\r\n // const [searchType, setSearchType] = useState(1);\r\n let history = useHistory();\r\n\r\n var searchBody;\r\n if (props.flightStatusSearchType === 1) {\r\n searchBody = (\r\n \r\n \r\n
\r\n );\r\n } else {\r\n searchBody = (\r\n \r\n \r\n props.updateFlightNumber(event.target.value)}\r\n />\r\n \r\n
\r\n );\r\n }\r\n return (\r\n <>\r\n {Translation.t(\"enter_flight_information\")}
\r\n \r\n {Translation.t(\"please_note\")}\r\n
\r\n \r\n props.updateSearchType(1)}\r\n >\r\n {Translation.t(\"route\")}\r\n \r\n props.updateSearchType(2)}\r\n >\r\n {Translation.t(\"flight_#\")}\r\n \r\n {searchBody}\r\n \r\n \r\n \r\n {console.log(\r\n props.flightStatusSearchType === 1 &&\r\n props.itineraryPart[0].params.from === null &&\r\n props.itineraryPart[0].params.to === null,\r\n props.flightStatusSearchType === 2 && props.flightNumber === \"\"\r\n )}\r\n {\r\n props.updateIsLoading(true);\r\n history.push(\"/flight-status-result\");\r\n }}\r\n >\r\n {Translation.t(\"Search\")}\r\n \r\n \r\n
\r\n
\r\n \r\n );\r\n};\r\n\r\nconst mapStateToProps = (state) => {\r\n return {\r\n itineraryPart: state.bookingWiget.itineraryPart,\r\n isLoading: state.global.isLoading,\r\n flightSchedules: state.flightSchedule.flightSchedules,\r\n flightStatusSearchType: state.flightStatus.flightStatusSearchType,\r\n flightNumber: state.flightStatus.flightNumber,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n updateBackedupSchedules: (value) =>\r\n dispatch({\r\n type: flightScheduleAction.SCHEDULEINITFLIGHTS,\r\n payload: value,\r\n }),\r\n updateSearchType: (value) =>\r\n dispatch({\r\n type: flightStatusAction.UPDATESTATUSSERACHTYPE,\r\n payload: value,\r\n }),\r\n updateFlightNumber: (value) =>\r\n dispatch({\r\n type: flightStatusAction.UPDATEFLIGHTNUMBER,\r\n payload: value,\r\n }),\r\n updateIsLoading: (value) =>\r\n dispatch({\r\n type: globalActionType.UPDATEISLOADING,\r\n value: value,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(FlightStatus);\r\n","import React from \"react\";\r\nimport { Col, Row, Button } from \"react-bootstrap\";\r\nimport AirportSelection from \"../../booking/booking-widget/airport-selection/AirportSelection\";\r\nimport DatePicker from \"../../booking/booking-widget/booking-calendar/DatePicker\";\r\nimport { connect } from \"react-redux\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport Translation from \"i18next\";\r\n\r\nconst FlightSchedule = (props) => {\r\n\r\n let history = useHistory();\r\n\r\n return (\r\n <>\r\n {Translation.t(\"enter_flight_information\")}
\r\n \r\n {Translation.t(\"please_note\")}\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n history.push(\"/flight-schedule-result\")}\r\n disabled={props.itineraryPart[0].params.from !== null &&\r\n props.itineraryPart[0].params.to !== null &&\r\n props.itineraryPart[0].params.when.departureDate !== null ? \"\" : \"disabled\"}\r\n >\r\n {Translation.t(\"search\")}\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\nconst mapStateTopProps = (state) => {\r\n return {\r\n itineraryPart: state.bookingWiget.itineraryPart,\r\n isMedium: state.global.isMedium,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n storeSeatMaps: (payload, selectedSeats) => {\r\n dispatch({\r\n type: \"MBYSTORESEATRESULT\",\r\n payload: payload,\r\n selectedSeats: selectedSeats,\r\n });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(mapStateTopProps, mapDispatchToProps)(FlightSchedule);","export const manageMyBookingAction = {\r\n INITIALIZE: \"INITIALIZE\",\r\n SAVEDATA:\"SAVEDATA\",\r\n};","import { faPlaneDeparture } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport React, { useState } from \"react\";\r\nimport { Col, Row, Button } from \"react-bootstrap\";\r\nimport { connect } from \"react-redux\";\r\nimport { useHistory } from \"react-router\";\r\nimport { BookingWidgetAction } from \"../../../redux/actions/booking/bookingWidgetAction\";\r\nimport { AirportFullName } from \"../../../service/shared/AirportFullName\";\r\nimport Login from \"../account/Login\";\r\nimport moment from \"moment\";\r\nimport Loading from \"../../booking/seat-selection/Loading\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nimport { accountAction } from \"../../../redux/actions/manage-my-booking/accountAction\";\r\nimport { manageMyBookingAction } from \"../../../redux/actions/manage-my-booking/manageMyBookingAction\";\r\nimport ForgotPasswordModal from \"../account/ForgotPasswordModal\";\r\nconst ManageTrip = (props) => {\r\n var history = useHistory();\r\n const [showLoginPage, setShowLoginPage] = useState(false);\r\n const [redirectToCreateAccount, setRedirectToCreateAccount] = useState(false);\r\n const [findBooking, setFindBooking] = useState(false);\r\n const [isMytripLoad, setIsMytripLoad] = useState(false);\r\n const [showModal, setShowModla] = useState(false);\r\n if (redirectToCreateAccount) {\r\n history.push(\"create-account\");\r\n }\r\n const getMyTrips = async () => {\r\n await HttpService.postAccount(props.profileCookie, \"/MyTrips\", props.token)\r\n .then((myTripsResponse) => {\r\n if (myTripsResponse.data.statusAPI === \"SUCCESS\") {\r\n props.getMyTrips(myTripsResponse.data.trips);\r\n }\r\n setIsMytripLoad(true);\r\n })\r\n .catch((error) => {\r\n setIsMytripLoad(true);\r\n console.log(error);\r\n });\r\n };\r\n const setShowModal = () => {\r\n setShowModla(!showModal);\r\n };\r\n const searchMyTrip = async () => {\r\n var pnr = document.getElementById(\"manage-booking-pnr\");\r\n var lastName = document.getElementById(\"manage-booking-last-name\");\r\n if (\r\n pnr.value !== null &&\r\n lastName.value !== null &&\r\n pnr.value !== \"\" &&\r\n lastName.value !== \"\"\r\n ) {\r\n props.saveMyManageBooking(pnr.value, lastName.value);\r\n history.push(\"manage-trip\");\r\n } else {\r\n if (pnr.value === null || pnr.value === \"\") {\r\n pnr.classList.add(\"invalid_input\");\r\n }\r\n if (lastName.value === null || lastName.value === \"\") {\r\n lastName.classList.add(\"invalid_input\");\r\n }\r\n }\r\n };\r\n if (props.isUserSignedIn && !isMytripLoad) {\r\n getMyTrips();\r\n }\r\n\r\n if (props.isUserSignedIn && !findBooking) {\r\n if (isMytripLoad) {\r\n return (\r\n <>\r\n Upcoming Trips
\r\n
\r\n {props.trips.length >= 1 ? (\r\n props.trips.map((trip, index) => (\r\n \r\n \r\n {trip.pnr}
\r\n \r\n {AirportFullName.getFullName(trip.origin)}\r\n {\" \"}\r\n \r\n {\" \"}\r\n {AirportFullName.getFullName(trip.destination)}\r\n
\r\n \r\n {moment(trip.departureDate)\r\n .locale(\"en\")\r\n .format(\"dddd, MMM DD, YYYY\")}\r\n
\r\n \r\n \r\n \r\n Trip Details\r\n \r\n \r\n
\r\n \r\n
\r\n ))\r\n ) : (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {props.firstName[0] + props.lastName[0]}\r\n \r\n
\r\n
\r\n
\r\n Hi {props.firstName}, it looks like you do not have any\r\n upcoming trips. Check out our{\" \"}\r\n inspiration page for ideas and special\r\n membership discount. We hope to see you\r\n in the air again soon!\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n props.redirectToBooking(\"bookFlight\")}\r\n >\r\n Book A Trip\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n \r\n If you do not see your booking above, please click Find a\r\n booking button to search\r\n
\r\n \r\n \r\n setFindBooking(true)}\r\n >\r\n Find Booking\r\n \r\n \r\n
\r\n \r\n );\r\n } else {\r\n return ;\r\n }\r\n } else {\r\n return (\r\n <>\r\n {showModal && }\r\n \r\n \r\n Search by Trip Details
\r\n \r\n Please Note:All fields are required unless marked as\r\n optional. Use latin characters only.\r\n
\r\n {\r\n var pnr = document.getElementById(\"manage-booking-pnr\");\r\n if (pnr.value === null || pnr.value === \"\") {\r\n pnr.classList.add(\"invalid_input\");\r\n }\r\n }}\r\n onFocus={() => {\r\n var pnr = document.getElementById(\"manage-booking-pnr\");\r\n pnr.classList.remove(\"invalid_input\");\r\n }}\r\n />\r\n {\r\n var lastName = document.getElementById(\r\n \"manage-booking-last-name\"\r\n );\r\n if (lastName.value === null || lastName.value === \"\") {\r\n lastName.classList.add(\"invalid_input\");\r\n }\r\n }}\r\n onFocus={() => {\r\n var lastName = document.getElementById(\r\n \"manage-booking-last-name\"\r\n );\r\n lastName.classList.remove(\"invalid_input\");\r\n }}\r\n />\r\n \r\n \r\n \r\n searchMyTrip()}\r\n >\r\n Search\r\n \r\n \r\n
\r\n \r\n \r\n {!findBooking && (\r\n <>\r\n {showLoginPage ? (\r\n \r\n ) : (\r\n \r\n \r\n setShowLoginPage(true)}\r\n >\r\n SIGN IN TO MY ACCOUNT\r\n \r\n \r\n \r\n setRedirectToCreateAccount(true)}\r\n >\r\n CREATE PROFILE\r\n \r\n \r\n
\r\n )}\r\n \r\n )}\r\n \r\n
\r\n \r\n );\r\n }\r\n};\r\nconst mapStateToProps = (state) => {\r\n return {\r\n isUserSignedIn: state.global.isUserSignedIn,\r\n firstName: state.account.firstName,\r\n lastName: state.account.lastName,\r\n trips: state.account.trips,\r\n profileCookie: state.account.profileCookie,\r\n token: state.searchFlight.token,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n redirectToBooking: (widgetType) =>\r\n dispatch({\r\n type: BookingWidgetAction.CHANGEWIDGETTYPE,\r\n widgetType: widgetType,\r\n }),\r\n getMyTrips: (data) =>\r\n dispatch({\r\n type: accountAction.GETMYTRIPS,\r\n data: data,\r\n }),\r\n saveMyManageBooking: (pnr, lastName) =>\r\n dispatch({\r\n type: manageMyBookingAction.INITIALIZE,\r\n pnr: pnr,\r\n lastName: lastName,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(ManageTrip);\r\n","import React, { Component } from \"react\";\r\nimport { Row, Col, Modal } from \"react-bootstrap\";\r\nimport \"./BookingWidget.css\";\r\nimport CabinClass from \"./CabinClass\";\r\nimport FareOptions from \"./FareOption\";\r\nimport JourneyType from \"./JourneyType\";\r\nimport PassengerSelector from \"./passenger-selection/PassengerSelector\";\r\nimport RecentSearch from \"./recent-search/RecentSearch\";\r\nimport SearchFormRemark from \"./SearchFormRemark\";\r\nimport StartBookingButton from \"./StartBookingButton\";\r\nimport AirportSelection from \"./airport-selection/AirportSelection\";\r\nimport DatePicker from \"./booking-calendar/DatePicker\";\r\nimport PromoCode from \"./PromoCode\";\r\nimport { connect } from \"react-redux\";\r\nimport { BookingWidgetAction } from \"../../../redux/actions/booking/bookingWidgetAction\";\r\nimport Multicity from \"./multicity/Multicity\";\r\nimport Stopover from \"./stopover/StopOver\";\r\nimport FlightSearchHeadText from \"./FlightSearchHeadText\";\r\nimport { flightSelectionAction } from \"../../../redux/actions/booking/flightSelectionAction\";\r\nimport FlightLoading from \"../../shared/progress-loading/FlightLoading\";\r\nimport { Redirect } from \"react-router\";\r\nimport { matrixAction } from \"../../../redux/actions/booking/matrixAction\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nimport Translation from \"i18next\";\r\nimport WidgetType from \"./WidgetType\";\r\nimport FlightStatus from \"../../manage-my-booking/flight-status/FlightStatus\";\r\nimport FlightSchedule from \"../../manage-my-booking/flight-schedule/FlightSchedule\";\r\nimport ManageTrip from \"../../manage-my-booking/manage-trip/ManageTrip\";\r\nclass BookingWidget extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isLoading: false,\r\n showModal: false,\r\n };\r\n }\r\n changeLoadingType = (\r\n redirectToFlightSelection = false,\r\n redirectToMatrix = false\r\n ) => {\r\n if (redirectToFlightSelection) {\r\n this.props.history.push(\"/flightSelect\");\r\n } else if (redirectToMatrix) {\r\n if (this.props.journeyType === \"roundTrip\") {\r\n this.redirectToMatrix();\r\n } else if (this.props.journeyType === \"oneWay\") {\r\n this.props.history.push(\"/fareCalendar\");\r\n } else {\r\n this.setState({ redirectToFlightSelection: true });\r\n }\r\n } else {\r\n if (this.state.isLoading) {\r\n this.setState({ isLoading: false, showModal: true });\r\n } else {\r\n this.setState({ isLoading: true });\r\n }\r\n }\r\n };\r\n getWidgetType = () => {\r\n if (this.props.widgetType === \"bookFlight\") {\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n {\" \"}\r\n \r\n \r\n
\r\n \r\n\r\n {this.getJourneyType()}\r\n\r\n {/* */}
\r\n \r\n \r\n
\r\n \r\n \r\n );\r\n } else if (this.props.widgetType === \"flightStatus\") {\r\n return ;\r\n } else if (this.props.widgetType === \"flightSchedule\") {\r\n return ;\r\n } else {\r\n return ;\r\n }\r\n };\r\n componentDidMount() {\r\n this.props.updateFlightIndex();\r\n document.title = \"Ethiopian Airlines\";\r\n }\r\n\r\n getJourneyType = () => {\r\n if (this.props.journeyType === \"multicity\") {\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n\r\n if (this.props.journeyType === \"stopover\") {\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n
\r\n \r\n );\r\n } else\r\n return (\r\n <>\r\n {\r\n this.setState({ showModal: false });\r\n }}\r\n centered\r\n >\r\n \r\n Error Message\r\n \r\n \r\n Something went wrong. we are working on getting this fixed as soon\r\n as we can. You may able to try again.\r\n \r\n \r\n this.setState({ showModal: false })}\r\n >\r\n {Translation.t(\"ok\")}\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n {this.props.journeyType === \"roundTrip\" && (\r\n \r\n )}\r\n
\r\n \r\n );\r\n };\r\n\r\n redirectToMatrix = () => {\r\n var tempSerachRequest = this.props.flightSearchRequest;\r\n tempSerachRequest.searchType = \"MATRIX\";\r\n HttpService.postService(\r\n tempSerachRequest,\r\n \"/Availability/AdvancedSearch\",\r\n this.props.token\r\n )\r\n .then((response) => {\r\n this.props.saveMatrixResult(response.data);\r\n this.props.history.push(\"/matrix\");\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n };\r\n render() {\r\n if (this.state.isLoading) {\r\n return (\r\n <>\r\n \r\n \r\n );\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
\r\n {/*
*/}\r\n
\r\n {this.getWidgetType()}\r\n
\r\n
\r\n
\r\n\r\n
(this.slider = ref)} id=\"slider\">\r\n
(this.minValue = ref)}\r\n id=\"min\"\r\n disabled={this.props.disabled}\r\n data-content={currentMin}\r\n >\r\n (this.minValueDrag = ref)}\r\n id=\"min-drag\"\r\n onMouseDown={this.props.disabled ? null : this.changeMinValue}\r\n >\r\n
\r\n \r\n -\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default DoubleRangeSlider;\r\n","import React from \"react\";\r\nimport \"./SingleRangeSlider.css\";\r\nimport Translation from \"i18next\";\r\n\r\nclass SingleRangeSlider extends React.Component{\r\n state = {\r\n sliderWidth: 0,\r\n offsetSliderWidht: 0,\r\n min: 0,\r\n max: 200,\r\n currentMin: 60,\r\n inputMin: 60,\r\n \r\n currentMax: 100,\r\n };\r\n \r\n componentDidMount() {\r\n var maxFromProps = this.props.max;\r\n var minFromProps = this.props.min;\r\n var currentValue = this.props.value;\r\n // console.log(currentValue);\r\n if(minFromProps === maxFromProps){\r\n this.minValue.style.width = \"100%\";\r\n }\r\n else{\r\n this.minValue.style.width = (100*(currentValue - minFromProps))/(maxFromProps - minFromProps) + \"%\";\r\n }\r\n this.setState({\r\n sliderWidth: this.slider.offsetWidth,\r\n offsetSliderWidht: this.slider.getBoundingClientRect().x,\r\n min: minFromProps,\r\n currentMin: currentValue,\r\n inputMin: currentValue,\r\n \r\n currentMax: maxFromProps,\r\n max: maxFromProps,\r\n });\r\n this.minValueDrag.addEventListener(\"touchstart\", this.changeMinValue, {\r\n passive: false\r\n });\r\n }\r\n \r\n setMin = (e) => {\r\n const { min, max, currentMax } = this.state;\r\n const inputMin = parseInt(e.target.value);\r\n \r\n var tempCurent = parseInt(inputMin);\r\n\r\n if (inputMin >= min && inputMin <= currentMax) {\r\n this.setState({\r\n inputMin,\r\n currentMin: parseInt(inputMin),\r\n });\r\n \r\n this.minValue.style.width = (inputMin * 100) / max + \"%\";\r\n } else if (inputMin < min) {\r\n tempCurent = parseInt(min);\r\n this.setState({\r\n inputMin: min,\r\n currentMin: parseInt(min),\r\n });\r\n this.minValue.style.width = 100 + \"%\";\r\n } else {\r\n tempCurent = parseInt(currentMax);\r\n this.setState({\r\n inputMin: parseInt(currentMax ),\r\n currentMin: parseInt(currentMax ),\r\n });\r\n this.minValue.style.width = (100*(currentMax - min))/(max - min) + \"%\";\r\n }\r\n this.props.onChange(tempCurent);\r\n };\r\n \r\n changeMinValue = (e) => {\r\n e.preventDefault();\r\n \r\n document.addEventListener(\"mousemove\", this.onMouseMoveMin);\r\n document.addEventListener(\"mouseup\", this.onMouseUpMin);\r\n \r\n document.addEventListener(\"touchmove\", this.onTouchMoveMin);\r\n document.addEventListener(\"touchend\", this.onMouseUpMin);\r\n };\r\n \r\n onTouchMoveMin = (e) => {\r\n if (e.touches.length !== 0) {\r\n const {\r\n min,\r\n max,\r\n currentMax,\r\n sliderWidth,\r\n offsetSliderWidht,\r\n } = this.state;\r\n var touch = e.touches[0];\r\n var ratio = (max - min) / max;\r\n const dragedWidht = touch.clientX - offsetSliderWidht;\r\n const dragedWidhtInPercent = (dragedWidht * 100) / sliderWidth;\r\n const currentMin = min + parseInt(Math.abs(parseInt((max * dragedWidhtInPercent) / 100) * ratio));\r\n if (\r\n dragedWidht >= 0 &&\r\n currentMin >= min &&\r\n currentMin <= currentMax\r\n ) {\r\n this.minValue.style.width = dragedWidhtInPercent + \"%\";\r\n this.minValue.dataset.content = currentMin;\r\n this.setState({\r\n currentMin,\r\n inputMin: currentMin,\r\n });\r\n this.props.onChange(this.minValue.dataset.content);\r\n }\r\n }\r\n };\r\n \r\n onMouseMoveMin = (e) => {\r\n const {\r\n min,\r\n max,\r\n currentMax,\r\n sliderWidth,\r\n offsetSliderWidht,\r\n } = this.state;\r\n const dragedWidht = e.clientX - offsetSliderWidht;\r\n var ratio = (max - min) / max;\r\n const dragedWidhtInPercent = (dragedWidht * 100) / sliderWidth;\r\n const currentMin = min + Math.ceil(Math.abs((max * dragedWidhtInPercent) / 100) * ratio);\r\n if ( dragedWidht >= 0 && currentMin >= min && currentMin <= currentMax ) {\r\n this.minValue.style.width = dragedWidhtInPercent + \"%\";\r\n this.minValue.dataset.content = currentMin;\r\n this.setState({\r\n currentMin,\r\n inputMin: currentMin,\r\n });\r\n this.props.onChange(this.minValue.dataset.content);\r\n }\r\n };\r\n \r\n onMouseUpMin = () => {\r\n document.removeEventListener(\"mouseup\", this.onMouseUpMin);\r\n document.removeEventListener(\"mousemove\", this.onMouseMoveMin);\r\n \r\n document.removeEventListener(\"touchend\", this.onMouseMoveMin);\r\n document.removeEventListener(\"touchmove\", this.onTouchMoveMin);\r\n }; \r\n\r\n render() {\r\n const { currentMin, min, max } = this.state;\r\n return (\r\n <>\r\n \r\n
(this.slider = ref)} id=\"slider\">\r\n
(this.minValue = ref)}\r\n id=\"min-slider\" disabled={this.props.disabled}\r\n data-content={currentMin}\r\n >\r\n (this.minValueDrag = ref)}\r\n id=\"min-drag\"\r\n onMouseDown={this.props.disabled ? null : this.changeMinValue}\r\n >\r\n
\r\n
\r\n \r\n
\r\n
\r\n {Translation.t(\"non_stop\")}\r\n
\r\n
\r\n {this.state.filterCriteria.NoOfStops[0].count}\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n {Translation.t(\r\n this.state.filterCriteria.NoOfStops[0].stops + \"-stop\"\r\n )}\r\n \r\n
\r\n
\r\n {this.state.filterCriteria.NoOfStops[0].count}\r\n
\r\n
\r\n
\r\n {\r\n if (this.state.checkedStop[second]) return first + 1;\r\n return first;\r\n },\r\n 0\r\n )\r\n ? \"checked\"\r\n : \"\"\r\n }\r\n onChange={(event) => {\r\n var temp = this.state.checkedStop;\r\n for (const [key] of Object.entries(\r\n this.state.checkedStop\r\n )) {\r\n temp[key] = event.target.checked;\r\n }\r\n this.setState({ checkedStop: temp });\r\n }}\r\n className=\"et-ibe-checkbox\"\r\n />\r\n
\r\n
\r\n {Translation.t(\"All\")}\r\n
\r\n
\r\n \r\n {this.state.filterCriteria.NoOfStops.reduce(\r\n (a, b) => a + b.count,\r\n 0\r\n )}\r\n \r\n
\r\n
\r\n
\r\n {\r\n var temp = this.state.checkedStop;\r\n temp[event.target.value] = event.target.checked;\r\n this.setState({ checkedStop: temp });\r\n }}\r\n />\r\n
\r\n
\r\n {val.name}\r\n
\r\n
\r\n {val.count}\r\n
\r\n
\r\n \r\n \r\n this.setState({\r\n Accordion: this.state.Accordion === 0 ? \"none\" : 0,\r\n })\r\n }\r\n >\r\n {Translation.t(\"filter_time\")}\r\n \r\n {this.state.filterCriteriaActive.Departure !== undefined\r\n ? \"Departure: \" + this.state.filterCriteriaActive.Departure\r\n : null}\r\n \r\n \r\n {\" \"}\r\n {this.state.filterCriteriaActive.Arrival !== undefined\r\n ? \"Arrival: \" + this.state.filterCriteriaActive.Arrival\r\n : null}\r\n \r\n \r\n {this.state.Accordion === 0 ? (\r\n \r\n \r\n {Translation.t(\"departure_time\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ departMin: val })}\r\n onMaxChange={(val) => this.setState({ departMax: val })}\r\n disabled={\r\n this.state.filterCriteria.Departure.min ===\r\n this.state.filterCriteria.Departure.max\r\n }\r\n currentMin={this.state.departMin}\r\n currentMax={this.state.departMax}\r\n min={this.state.filterCriteria.Departure.min}\r\n max={this.state.filterCriteria.Departure.max}\r\n />\r\n\r\n {Translation.t(\"arrival_time\")}
\r\n this.setState({ arriveMin: val })}\r\n onMaxChange={(val) => this.setState({ arriveMax: val })}\r\n currentMin={this.state.arriveMin}\r\n currentMax={this.state.arriveMax}\r\n disabled={\r\n this.state.filterCriteria.ArrivalTime.min ===\r\n this.state.filterCriteria.ArrivalTime.max\r\n }\r\n min={this.state.filterCriteria.ArrivalTime.min}\r\n max={this.state.filterCriteria.ArrivalTime.max}\r\n />\r\n \r\n ) : null}\r\n \r\n \r\n \r\n this.setState({\r\n Accordion: this.state.Accordion === 1 ? \"none\" : 1,\r\n })\r\n }\r\n >\r\n {Translation.t(\"filter_duration\")}\r\n \r\n {this.state.filterCriteriaActive.duration !== undefined\r\n ? \"Duration \" + this.state.filterCriteriaActive.duration\r\n : null}\r\n \r\n \r\n {this.state.Accordion === 1 ? (\r\n \r\n \r\n {\" \"}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ duration: val })}\r\n disabled={\r\n this.state.filterCriteria.Duration.min ===\r\n this.state.filterCriteria.Duration.max\r\n }\r\n min={this.state.filterCriteria.Duration.min}\r\n max={this.state.filterCriteria.Duration.max}\r\n />\r\n \r\n ) : null}\r\n \r\n \r\n \r\n this.setState({\r\n Accordion: this.state.Accordion === 2 ? \"none\" : 2,\r\n })\r\n }\r\n >\r\n {Translation.t(\"number_of_tops\")}\r\n \r\n {this.state.filterCriteriaActive.stops !== undefined\r\n ? \"Stops \" + this.state.filterCriteriaActive.stops\r\n : null}\r\n \r\n \r\n {this.state.Accordion === 2 ? (\r\n \r\n \r\n {\" \"}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n {this.getNumberOfStopsFuction()}\r\n \r\n ) : null}\r\n \r\n \r\n \r\n this.setState({\r\n Accordion: this.state.Accordion === 3 ? \"none\" : 3,\r\n })\r\n }\r\n >\r\n {Translation.t(\"price\")}\r\n \r\n {this.state.filterCriteriaActive.price !== undefined\r\n ? \"Price \" + this.state.filterCriteriaActive.price\r\n : null}\r\n \r\n \r\n {this.state.Accordion === 3 ? (\r\n \r\n \r\n {\" \"}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ price: val })}\r\n disabled={\r\n this.state.filterCriteria.Price.min ===\r\n this.state.filterCriteria.Price.max\r\n }\r\n min={this.state.filterCriteria.Price.min}\r\n max={this.state.filterCriteria.Price.max}\r\n />\r\n \r\n ) : null}\r\n \r\n
\r\n \r\n );\r\n } else {\r\n return (\r\n \r\n
\r\n
\r\n {Translation.t(\"departure_time\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ departMin: val })}\r\n onMaxChange={(val) => this.setState({ departMax: val })}\r\n disabled={\r\n this.state.filterCriteria.Departure.min ===\r\n this.state.filterCriteria.Departure.max\r\n }\r\n currentMin={this.state.departMin}\r\n currentMax={this.state.departMax}\r\n min={this.state.filterCriteria.Departure.min}\r\n max={this.state.filterCriteria.Departure.max}\r\n />\r\n\r\n {Translation.t(\"arrival_time\")}
\r\n this.setState({ arriveMin: val })}\r\n onMaxChange={(val) => this.setState({ arriveMax: val })}\r\n currentMin={this.state.arriveMin}\r\n currentMax={this.state.arriveMax}\r\n disabled={\r\n this.state.filterCriteria.ArrivalTime.min ===\r\n this.state.filterCriteria.ArrivalTime.max\r\n }\r\n min={this.state.filterCriteria.ArrivalTime.min}\r\n max={this.state.filterCriteria.ArrivalTime.max}\r\n />\r\n \r\n
\r\n
\r\n {Translation.t(\"filter_duration\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ duration: val })}\r\n disabled={\r\n this.state.filterCriteria.Duration.min ===\r\n this.state.filterCriteria.Duration.max\r\n }\r\n min={this.state.filterCriteria.Duration.min}\r\n max={this.state.filterCriteria.Duration.max}\r\n />\r\n \r\n
\r\n
\r\n {Translation.t(\"number_of_tops\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n {this.getNumberOfStopsFuction()}\r\n \r\n
\r\n
\r\n {Translation.t(\"price\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ price: val })}\r\n disabled={\r\n this.state.filterCriteria.Price.min ===\r\n this.state.filterCriteria.Price.max\r\n }\r\n min={this.state.filterCriteria.Price.min}\r\n max={this.state.filterCriteria.Price.max}\r\n />\r\n \r\n
\r\n
\r\n
\r\n \r\n {moment(this.props.queryDate).locale(this.props.locale).format(\"ddd, MMM DD\")}\r\n \r\n \r\n {this.props.itineraryPartBrandsLength}{\" \"}\r\n {Translation.t(\"results\")}\r\n \r\n \r\n {this.props.journyType === \"roundTrip\" ||\r\n this.props.journyType === \"oneWay\" ? (\r\n <>\r\n \r\n this.setState({\r\n isClosed: false,\r\n isFiltersModalOpened: false,\r\n })\r\n }\r\n >\r\n {Translation.t(\"show_filter\")}\r\n \r\n {this.getActiveFilter()}\r\n \r\n ) : null}\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n {Translation.t(\"economy\")}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {Translation.t(\"business\")}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {this.getFilterOptions()}\r\n
\r\n
\r\n this.handleCancleButtonClick()}\r\n >\r\n {Translation.t(\"cancel\")}\r\n \r\n
\r\n
\r\n this.handleUpdate()}\r\n className=\"col-12 btn btn-success text-uppercase std-et-bg-color filter-bottom-button\"\r\n >\r\n {Translation.t(\"update\")}\r\n \r\n
\r\n
\r\n
\r\n
this.toggleFlightDetail()}\r\n >\r\n {Translation.t(\"details\")}\r\n \r\n \r\n \r\n \r\n {this.state.showDetail && (\r\n \r\n
\r\n {this.props.itineraryPart.segments.map((segment, index) => (\r\n \r\n \r\n {segment.origin != null && (\r\n \r\n \r\n {segment.origin}\r\n {\" \"}\r\n \r\n {this.renderAirportName(segment.origin)}\r\n \r\n
\r\n )}\r\n {segment.duration != null && (\r\n \r\n \r\n {this.parseDate(segment.departure)}\r\n \r\n \r\n
\r\n )}\r\n\r\n \r\n {segment.flight.airlineCode === \"ET\" && (\r\n
\r\n )}\r\n
{segment.flight.airlineCode}\r\n {segment.flight.flightNumber != null && (\r\n
{segment.flight.flightNumber}\r\n )}{\" \"}\r\n {segment.flight.operatingAirlineCode != null && (\r\n
\r\n {Translation.t(\"operated_by\")}{\" \"}\r\n {segment.flight.operatingAirlineCode}\r\n \r\n )}\r\n
\r\n Aircraft: {segment.manufacturerName}{\" \"}\r\n {segment.equipmentDescription}\r\n
\r\n )}\r\n {segment.departureTerminal != null && (\r\n \r\n {Translation.t(\"departure\")}{\" \"}\r\n {segment.flight.departureTerminal}\r\n
\r\n )}\r\n {segment.arrivalTerminal != null && (\r\n \r\n {Translation.t(\"arrival\")}{\" \"}\r\n {segment.flight.arrivalTerminal}\r\n
\r\n )}\r\n \r\n {segment.arrival != null && (\r\n
\r\n {this.parseDate(segment.arrival)}{\" \"}\r\n
\r\n )}\r\n {segment.destination != null && (\r\n
\r\n \r\n {segment.destination}\r\n {\" \"}\r\n \r\n {this.renderAirportName(segment.destination)}\r\n \r\n
\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n {Translation.t(\"economy_result\")}: {this.props.isActive}\r\n
\r\n \r\n {Translation.t(\"fare\")}\r\n
\r\n \r\n {Translation.t(\"tax\")}\r\n
\r\n \r\n {Translation.t(\"seat_left\")}\r\n
\r\n \r\n {Translation.t(\"total\")}\r\n
\r\n \r\n {this.props.itineraryPartBrand.brandOffers.map(\r\n (brand, key) =>\r\n brand.cabinClass === \"Economy\" && (\r\n \r\n \r\n {brand.brandLabel}\r\n
\r\n \r\n {brand.fare.alternatives[0][0].currency}{\" \"}\r\n {brand.fare.alternatives[0][0].amount}\r\n
\r\n \r\n {brand.taxes.alternatives[0][0].currency}{\" \"}\r\n {brand.taxes.alternatives[0][0].amount}\r\n
\r\n \r\n {brand.seatsRemaining.count}\r\n
\r\n \r\n {brand.total.alternatives[0][0].currency}{\" \"}\r\n {this.thousands_separators(\r\n brand.total.alternatives[0][0].amount\r\n )}\r\n
\r\n\r\n \r\n \r\n this.props.selectFlight(\r\n brand.shoppingBasketHashCode\r\n )\r\n }\r\n >\r\n Select\r\n \r\n
\r\n \r\n )\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n {Translation.t(\"business_result\")}: {this.props.isActive}\r\n
\r\n \r\n {Translation.t(\"fare\")}\r\n
\r\n \r\n {Translation.t(\"tax\")}\r\n
\r\n \r\n {Translation.t(\"seat_left\")}\r\n
\r\n \r\n {Translation.t(\"total\")}\r\n
\r\n \r\n {this.props.itineraryPartBrand.brandOffers.map(\r\n (brand, key) =>\r\n brand.cabinClass === \"Business\" && (\r\n \r\n \r\n {brand.brandLabel}\r\n
\r\n \r\n {brand.fare.alternatives[0][0].currency}{\" \"}\r\n {brand.fare.alternatives[0][0].amount}\r\n
\r\n \r\n {brand.taxes.alternatives[0][0].currency}{\" \"}\r\n {brand.taxes.alternatives[0][0].amount}\r\n
\r\n \r\n {brand.seatsRemaining.count}\r\n
\r\n \r\n {brand.total.alternatives[0][0].currency}{\" \"}\r\n {this.thousands_separators(\r\n brand.total.alternatives[0][0].amount\r\n )}\r\n
\r\n\r\n \r\n \r\n this.props.selectFlight(\r\n brand.shoppingBasketHashCode\r\n )\r\n }\r\n >\r\n Select\r\n \r\n
\r\n \r\n )\r\n )}\r\n
\r\n
\r\n
\r\n {this.renderEconomyBrand()}\r\n {this.renderBusinessBrand()}\r\n
\r\n );\r\n }\r\n}\r\nexport default ItineraryBrand;\r\n","import React, { Component } from \"react\";\r\nimport { Col, Row, Button } from \"react-bootstrap\";\r\nimport Translation from \"i18next\";\r\nimport FlightSelectionSummaryDetail from \"../../FlightSelectionSummaryDetail\";\r\n\r\nclass ItineraryBrandItemMob extends Component {\r\n thousands_separators = (num) => {\r\n var num_parts = num.toString().split(\".\");\r\n num_parts[0] = num_parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n return num_parts.join(\".\");\r\n };\r\n\r\n renderEconomyBrands() {\r\n if (\r\n this.props.selectedBrand === \"Economy\" &&\r\n this.props.brand.cabinClass === \"Economy\"\r\n ) {\r\n return (\r\n \r\n
\r\n \r\n \r\n {this.props.brand.brandLabel}\r\n
\r\n \r\n
\r\n
\r\n \r\n {Translation.t(\"fare\")}
\r\n \r\n \r\n {this.props.brand.fare.alternatives[0][0].currency + \" \"}\r\n \r\n {this.thousands_separators(\r\n this.props.brand.fare.alternatives[0][0].amount\r\n )}\r\n
\r\n \r\n \r\n {Translation.t(\"tax\")}
\r\n \r\n \r\n {this.props.brand.taxes.alternatives[0][0].currency + \" \"}\r\n \r\n {this.thousands_separators(\r\n this.props.brand.taxes.alternatives[0][0].amount\r\n )}\r\n
\r\n \r\n \r\n {Translation.t(\"seat_left\")}
\r\n \r\n {this.props.brand.seatsRemaining.count}\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n this.props.selectFlight(\r\n this.props.brand.shoppingBasketHashCode\r\n )\r\n }\r\n >\r\n \r\n {this.props.brand.total.alternatives[0][0].currency + \" \"}\r\n \r\n \r\n {this.thousands_separators(\r\n this.props.brand.total.alternatives[0][0].amount\r\n ) + \" \"}\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n {this.props.brand.brandLabel}\r\n
\r\n \r\n
\r\n
\r\n \r\n {Translation.t(\"fare\")}
\r\n \r\n \r\n {this.props.brand.fare.alternatives[0][0].currency + \" \"}\r\n \r\n {this.props.brand.fare.alternatives[0][0].amount}\r\n
\r\n \r\n \r\n {Translation.t(\"tax\")}
\r\n \r\n \r\n {this.props.brand.taxes.alternatives[0][0].currency + \" \"}\r\n \r\n {this.props.brand.taxes.alternatives[0][0].amount}\r\n
\r\n \r\n \r\n {Translation.t(\"seat_left\")}
\r\n \r\n {this.props.brand.seatsRemaining.count}\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n this.props.selectFlight(\r\n this.props.brand.shoppingBasketHashCode\r\n )\r\n }\r\n >\r\n \r\n {this.props.brand.total.alternatives[0][0].currency + \" \"}\r\n \r\n \r\n {this.props.brand.total.alternatives[0][0].amount + \" \"}\r\n \r\n \r\n \r\n
\r\n
\r\n {this.renderEconomyBrands()}\r\n {this.renderBusinessBrands()}\r\n
\r\n );\r\n }\r\n}\r\nexport default ItineraryBrandItemMob;\r\n","import { faWindowClose } from '@fortawesome/free-solid-svg-icons';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport React, { Component } from 'react';\r\nimport { Col, Row } from 'react-bootstrap';\r\nimport ItineraryBrandItemMob from './ItineraryBrandItemMob';\r\nimport Translation from \"i18next\";\r\nimport FlightSelectionSummaryDetail from '../../FlightSelectionSummaryDetail';\r\n\r\nclass ItineraryBrandMob extends Component{\r\n constructor(props)\r\n {\r\n super(props);\r\n this.state ={\r\n isEconomySelected:true,\r\n isBusinessSelected:false,\r\n selectedBrand:\"Economy\"\r\n }\r\n }\r\n componentDidMount()\r\n {\r\n if(this.props.echeepPrice === \"N/A\")\r\n {\r\n this.setState({isBusinessSelected:true});\r\n this.setState({isEconomySelected:false});\r\n }\r\n if(this.props.bcheepPrice === \"N/A\")\r\n {\r\n this.setState({isEconomySelected:true});\r\n this.setState({isBusinessSelected:false});\r\n }\r\n }\r\n toggleBrand(type)\r\n {\r\n if(type === \"bus\")\r\n {\r\n \r\n this.setState({isBusinessSelected:true});\r\n this.setState({isEconomySelected:false});\r\n }\r\n else{\r\n this.setState({isEconomySelected:true});\r\n this.setState({isBusinessSelected:false});\r\n \r\n \r\n }\r\n \r\n }\r\n \r\n render(){\r\n return(\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n {Translation.t(\"fare_options\")}\r\n
\r\n \r\n \r\n this.props.onCloseClicked()}>\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {this.props.echeepPrice != \"N/A\" &&\r\n {this.toggleBrand('eco')}}>\r\n \r\n {Translation.t(\"economy\")}\r\n
\r\n \r\n {Translation.t(\"from\")} \r\n {this.props.echeepPrice}\r\n
\r\n \r\n }\r\n {this.props.bcheepPrice != \"N/A\" &&\r\n {this.toggleBrand('bus')}}>\r\n \r\n {Translation.t(\"business\")}\r\n \r\n
\r\n \r\n {Translation.t(\"from\")} \r\n {this.props.bcheepPrice}\r\n
\r\n \r\n }\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n {\r\n this.props.brandOffers.map((brand,key)=>
)\r\n }\r\n \r\n {/*
\r\n
*/}\r\n
\r\n // {\r\n // segments.map((segment,key)=> {(key !== 0) &&{stops} {stops > 1?\"Stops\":\"Stop\"} {segment.origin}})\r\n // }\r\n //
\r\n // );\r\n // }\r\n // else{\r\n // return(Non-stop)\r\n // }\r\n // }\r\n renderStops(segments, stops) {\r\n if (stops > 0) {\r\n if (segments.length > 1) {\r\n return (\r\n \r\n \r\n {stops > 1\r\n ? stops + \" \" + Translation.t(\"stops\")\r\n : stops + \" \" + Translation.t(\"stop\")}\r\n \r\n \r\n );\r\n } else {\r\n return (\r\n \r\n \r\n {stops > 1\r\n ? stops + \" \" + Translation.t(\"stops\")\r\n : stops + \" \" + Translation.t(\"stop\")}\r\n \r\n {segments.map((segment, index) => (\r\n \r\n {segment.flight.stopAirports.map((airport, index2) => (\r\n {\" \" + airport.airport}\r\n ))}\r\n \r\n ))}\r\n \r\n );\r\n }\r\n } else {\r\n return {Translation.t(\"non-stop\")};\r\n }\r\n }\r\n showFareOptions = () => {\r\n this.setState({ showFareOptions: true });\r\n };\r\n\r\n hidFareOptions = () => {\r\n this.setState({ showFareOptions: false });\r\n };\r\n render() {\r\n return (\r\n \r\n {!this.state.showFareOptions && (\r\n this.showFareOptions()}>\r\n
\r\n
\r\n \r\n {this.props.index + 1}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n {\r\n this.props.itineraryPartBrand.itineraryPart.segments[0]\r\n .origin\r\n }\r\n \r\n \r\n \r\n \r\n {this.parseTime(this.props.itineraryPartBrand.duration)}\r\n \r\n \r\n \r\n \r\n {\r\n this.props.itineraryPartBrand.itineraryPart.segments[\r\n this.props.itineraryPartBrand.itineraryPart.segments\r\n .length - 1\r\n ].destination\r\n }\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n {this.parseDate(this.props.itineraryPartBrand.departure)}\r\n \r\n \r\n \r\n \r\n {/* */}\r\n \r\n \r\n \r\n {this.parseDate(this.props.itineraryPartBrand.arrival)}\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.renderStops(\r\n this.props.itineraryPartBrand.itineraryPart.segments,\r\n this.props.itineraryPartBrand.itineraryPart.stops\r\n )}\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {this.props.itineraryPartBrand.echeepPrice != \"N/A\" ? (\r\n \r\n \r\n \r\n {Translation.t(\"from\")}{\" \"}\r\n \r\n {this.thousands_separators(\r\n this.props.itineraryPartBrand.echeepPrice\r\n )}\r\n {\" \"}\r\n \r\n
\r\n \r\n ) : (\r\n \r\n \r\n \r\n {Translation.t(\"from\")}{\" \"}\r\n \r\n {this.thousands_separators(\r\n this.props.itineraryPartBrand.bcheepPrice\r\n )}\r\n {\" \"}\r\n \r\n
\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {this.parseDate(this.props.itineraryPartBrand.departure)}\r\n \r\n \r\n {this.parseDate(this.props.itineraryPartBrand.arrival)}\r\n \r\n
\r\n \r\n \r\n {\" \"}\r\n \r\n {\r\n this.props.itineraryPartBrand.itineraryPart\r\n .segments[0].origin\r\n }\r\n \r\n \r\n \r\n {\" \"}\r\n \r\n {\r\n this.props.itineraryPartBrand.itineraryPart.segments[\r\n this.props.itineraryPartBrand.itineraryPart.segments\r\n .length - 1\r\n ].destination\r\n }\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {\" \"}\r\n \r\n {this.parseTime(this.props.itineraryPartBrand.duration)}\r\n \r\n
\r\n \r\n \r\n {this.renderStops(\r\n this.props.itineraryPartBrand.itineraryPart.segments,\r\n this.props.itineraryPartBrand.itineraryPart.stops\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {this.props.itineraryPartBrand.echeepPrice != \"N/A\" && (\r\n
{\r\n const tesNode = ReactDOM.findDOMNode(this.refs.test);\r\n if (!this.state.isEconomySelected)\r\n window.scrollTo({\r\n top: tesNode.offsetTop - 340,\r\n behavior: \"smooth\",\r\n }); //(0, tesNode.offsetTop - 320, );\r\n\r\n this.setState({\r\n isEconomySelected: !this.state.isEconomySelected,\r\n isBusinessSelected: false,\r\n });\r\n }}\r\n >\r\n {Translation.t(\"from\")}
\r\n \r\n \r\n {this.thousands_separators(\r\n this.props.itineraryPartBrand.echeepPrice\r\n )}\r\n {\" \"}\r\n {!this.state.isEconomySelected && (\r\n \r\n \r\n \r\n )}\r\n {this.state.isEconomySelected && (\r\n \r\n \r\n \r\n )}\r\n
\r\n \r\n )}\r\n \r\n {this.props.itineraryPartBrand.bcheepPrice != \"N/A\" && (\r\n
{\r\n const tesNode = ReactDOM.findDOMNode(this.refs.test);\r\n if (!this.state.isBusinessSelected)\r\n window.scrollTo({\r\n top: tesNode.offsetTop - 340,\r\n behavior: \"smooth\",\r\n });\r\n this.setState({\r\n isBusinessSelected: !this.state.isBusinessSelected,\r\n isEconomySelected: false,\r\n });\r\n }}\r\n >\r\n {Translation.t(\"from\")}
\r\n \r\n \r\n {this.thousands_separators(\r\n this.props.itineraryPartBrand.bcheepPrice\r\n )}\r\n {\" \"}\r\n {!this.state.isBusinessSelected && (\r\n \r\n \r\n \r\n )}\r\n {this.state.isBusinessSelected && (\r\n \r\n \r\n \r\n )}\r\n
\r\n \r\n )}\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n {this.props.itineraryPartBrand.itineraryPart.segments.map(\r\n (segment, index) => (\r\n \r\n {segment.flight.airlineCode}\r\n {segment.flight.flightNumber}\r\n {segment.manufacturerName}\r\n {segment.equipmentDescription}\r\n
\r\n )\r\n )}\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n {moment(alternate.date).locale(\"en\").format(\"MMM DD\")}\r\n \r\n
\r\n {alternate.currency === \"N/A\" ? (\r\n \r\n ) : (\r\n \r\n {this.thousands_separators(alternate.amount)}{\" \"}\r\n \r\n )}\r\n {alternate.currency}\r\n
\r\n \r\n \r\n );\r\n };\r\n\r\n listAllRibons = () => {\r\n return this.props.alternateDayResponse.map((alternate, index) => {\r\n return (\r\n \r\n {\" \"}\r\n {this.singleFlightRibbon(alternate, index)}{\" \"}\r\n \r\n );\r\n });\r\n };\r\n\r\n componentWillUnmount() {\r\n window.removeEventListener(\"resize\", this.scrollcenter);\r\n this.setState = (state,callback)=>{\r\n return;\r\n };\r\n}\r\n\r\n render() {\r\n return (\r\n <>\r\n {this.props.alternateDayResponse !== null && this.props.alternateDayResponse.length === 7 ? \r\n \r\n
\r\n {this.backButton()}\r\n
\r\n
\r\n {this.listAllRibons()}\r\n
\r\n
\r\n {this.nextButton()}\r\n
\r\n
\r\n
\r\n {Translation.t(\"choose_your_flight\")}\r\n
\r\n \r\n {Translation.t(\"select_your_flights_for_your\")} {origin}{\" \"}\r\n \r\n \r\n {\" \"}\r\n {destination}{\" \"}\r\n
\r\n \r\n {this.props.flightIndex === 0\r\n ? \"Select Your Departure Flight\"\r\n : \"Select Your Return Flight\"}\r\n
\r\n {this.props.journyType === \"roundTrip\" ||\r\n this.props.journyType === \"oneWay\" ? (\r\n \r\n ) : null}\r\n \r\n );\r\n }\r\n}\r\nexport default FlightSelectionHeader;\r\n","// import { faSleigh } from '@fortawesome/free-solid-svg-icons';\r\nimport React, { Component } from 'react';\r\nimport { Modal,Button } from 'react-bootstrap';\r\nclass ExceptionModal extends Component\r\n{\r\n constructor(props)\r\n {\r\n super(props);\r\n this.state={\r\n showModal:this.props.showModal\r\n }\r\n }\r\n closeModal=()=>\r\n {\r\n this.setState({showModal:false})\r\n }\r\n render()\r\n {\r\n return(\r\n \r\n \r\n {this.props.exceptionMessage}
\r\n \r\n \r\n \r\n \r\n \r\n
)\r\n }\r\n}\r\nexport default ExceptionModal;","import React, { Component } from \"react\";\r\nimport ItineraryPartOfferHeader from \"./itinerary-part-offer/ItineraryPartOfferHeader\";\r\nimport \"./FlightSelection.css\";\r\nimport ItineraryPartOffer from \"./itinerary-part-offer/ItineraryPartOffer\";\r\nimport { connect } from \"react-redux\";\r\nimport { FlightSelectionService } from \"../../../service/booking/flight-selection/FlightSelectionService\";\r\nimport { flightSelectionAction } from \"../../../redux/actions/booking/flightSelectionAction\";\r\nimport { searchFlightAction } from \"../../../redux/actions/booking/searchFlightAction\";\r\nimport FlightSelectionHeader from \"./FlightSelectionHeader\";\r\nimport ExceptionModal from \"../../shared/expection/ExceptionModal\";\r\nimport { ApiResponseStatus } from \"../../../master-data/shared/APIResponseStatus\";\r\nimport ProgressLoader from \"../../shared/progress-loading/progress-loader\";\r\nimport ProgressSimpler from \"../../shared/progress-simple/ProgressSimpler\";\r\nimport { globalActionType } from \"../../../redux/actions/shared/globalAction\";\r\nimport BreadCrumb from \"../../shared/bread-crumb/BreadCrumb\";\r\nimport FlightLoading from \"../../shared/progress-loading/FlightLoading\";\r\nimport Notification from \"../booking-widget/Notification\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nclass FlightSelection extends Component {\r\n constructor(props) {\r\n super(props);\r\n var temp = JSON.parse(\r\n JSON.stringify(\r\n this.props.flightSearchResult.data.searchResponse.brandedResults\r\n .itineraryPartBrands\r\n )\r\n );\r\n this.state = {\r\n itineraryPartBrandsState: temp,\r\n isLoading: false,\r\n isException: false,\r\n };\r\n }\r\n componentDidMount() {\r\n window.scrollTo({ top: 0, behavior: \"smooth\" });\r\n this.props.updateIsLoading(false);\r\n\r\n // this.setState({\r\n // itineraryPartBrandsState: this.props.flightSearchResult.data\r\n // .searchResponse.brandedResults.itineraryPartBrands[\r\n // this.props.flightSelection.flightIndex\r\n // ],\r\n // });\r\n }\r\n selectFlight = async (offerRef) => {\r\n // let flightResult = null;\r\n let flightSelectionService = new FlightSelectionService();\r\n window.scrollTo({ top: 0, behavior: \"smooth\" });\r\n this.props.updateIsLoading(true);\r\n this.setState({ isLoading: true });\r\n if (\r\n this.props.flightSelection.flightIndex + 1 ===\r\n this.props.flightSearchRequest.itineraryParts.length\r\n ) {\r\n flightSelectionService\r\n .selectFlight(\r\n this.props.flightSearchRequest,\r\n offerRef,\r\n this.props.flightSelection.flightIndex,\r\n this.props.flightSearchResult.data.cookieSabreDataRequest,\r\n this.props.token,\r\n this.props.flightSearchResult\r\n )\r\n .then((response) => {\r\n window.scrollTo({ top: 0, behavior: \"smooth\" });\r\n\r\n if (response.data.statusAPI === ApiResponseStatus.SUCCESS) {\r\n this.setState({ isException: false }, () => {\r\n this.props.updateSelectionResult(response.data);\r\n });\r\n this.props.history.push(\"/flightsummary\");\r\n } else {\r\n this.setState({ isException: true });\r\n }\r\n this.props.updateIsLoading(false);\r\n });\r\n } else {\r\n await flightSelectionService\r\n .searchContext(\r\n this.props.flightSearchRequest,\r\n offerRef,\r\n this.props.flightSelection.flightIndex,\r\n this.props.flightSearchResult.data.cookieSabreDataRequest,\r\n this.props.token,\r\n this.props.flightSearchResult\r\n )\r\n .then((response) => {\r\n window.scrollTo({ top: 0, behavior: \"smooth\" });\r\n if (response.data.statusAPI === ApiResponseStatus.SUCCESS) {\r\n this.setState(\r\n {\r\n itineraryPartBrandsState:\r\n response.data.searchResponse.brandedResults\r\n .itineraryPartBrands,\r\n isLoading: false,\r\n isException: false,\r\n },\r\n () => {\r\n this.props.updateFlightResult(response);\r\n this.props.updateFlightIndex(\r\n this.props.flightSelection.flightIndex + 1\r\n );\r\n }\r\n );\r\n } else {\r\n this.setState({ isException: true });\r\n }\r\n this.props.updateIsLoading(false);\r\n });\r\n }\r\n };\r\n\r\n // componentDidUpdate(){\r\n // console.log(this.props.countSortUpdate)\r\n // }\r\n\r\n render() {\r\n if (this.state.isException) {\r\n return (\r\n \r\n );\r\n }\r\n if (this.props.isLoading) {\r\n if (\r\n this.props.journyType === \"roundTrip\" &&\r\n this.props.flightSelection.flightIndex === 0\r\n ) {\r\n return ;\r\n } else {\r\n return (\r\n \r\n );\r\n }\r\n } else {\r\n return (\r\n <>\r\n \r\n {this.props.flightSearchResult.data.statusAPI !== \"SUCCESS\" ? (\r\n \r\n \r\n {this.props.itineraryPartBrands[\r\n this.props.flightSelection.flightIndex\r\n ].length === 0 ? null : (\r\n \r\n )}\r\n\r\n \r\n
\r\n ) : (\r\n \r\n \r\n {this.props.flightSearchResult.data.searchResponse.brandedResults\r\n .itineraryPartBrands[this.props.flightSelection.flightIndex]\r\n .length != 0 ? (\r\n \r\n ) : null}\r\n {this.props.flightSearchResult.data.searchResponse.brandedResults\r\n .itineraryPartBrands[this.props.flightSelection.flightIndex]\r\n .length != 0 ? (\r\n this.props.flightSearchResult.data.searchResponse.brandedResults.itineraryPartBrands[\r\n this.props.flightSelection.flightIndex\r\n ].map(\r\n (itineraryPartBrand, key) =>\r\n itineraryPartBrand.brandOffers.length > 0 && (\r\n \r\n )\r\n )\r\n ) : (\r\n
Flight not found
\r\n )}\r\n \r\n )}\r\n \r\n );\r\n }\r\n }\r\n}\r\nconst mapStateToProps = (state) => {\r\n return {\r\n flightSearchResult: state.searchFlight.searchResult,\r\n flightSearchRequest: state.searchFlight.searchRequest,\r\n flightSelection: state.flightSelection,\r\n token: state.searchFlight.token,\r\n itineraryPartBrands:\r\n state.searchFlight.searchResult.data.searchResponse.brandedResults\r\n .itineraryPartBrands,\r\n listenToChanges:\r\n state.searchFlight.searchResult.data.searchResponse.brandedResults\r\n .itineraryPartBrands[state.flightSelection.flightIndex],\r\n backedUpFlights: state.filteredFlights.backedUpFlights,\r\n isLoading: state.global.isLoading,\r\n journyType: state.bookingWiget.journyType,\r\n // countSortUpdate : state.filteredFlights.countSortUpdate\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n updateFlightIndex: (index) => {\r\n dispatch({\r\n type: flightSelectionAction.UPDATEFLIGHTINDEX,\r\n flightIndex: index,\r\n });\r\n },\r\n updateFlightResult: (result) => {\r\n dispatch({\r\n type: searchFlightAction.SAVESEARCHRESULT,\r\n searchResult: result,\r\n });\r\n },\r\n updateSelectionResult: (result) => {\r\n dispatch({\r\n type: flightSelectionAction.SAVEFLIGHTSELECTIONSUMMARY,\r\n selectionResult: result,\r\n });\r\n },\r\n updateIsLoading: (value) => {\r\n dispatch({\r\n type: globalActionType.UPDATEISLOADING,\r\n value: value,\r\n });\r\n },\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(FlightSelection);\r\n","import React, { Component } from \"react\";\r\nimport \"./progress-loader.css\";\r\n\r\nclass ProgressLoader extends Component {\r\n render() {\r\n let displayMess = \"Loading\";\r\n if (this.props.displayMess != null) {\r\n displayMess = this.props.displayMess;\r\n }\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {displayMess}\r\n
\r\n
\r\n \r\n
\r\n {this.state.isLoading &&
}\r\n
\r\n
\r\n Review Your Flight Selections\r\n
\r\n \r\n {this.props.flightSearchResult.map((itineraryPart, key) => (\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n {moment(itineraryPart.segments[0].departure)\r\n .locale(localStorage.getItem(\"i18nextLng\"))\r\n .format(\"dddd, MMMM Do\")}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n this.changeFlight(key)}\r\n >\r\n Change Flight\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {this.parseDate(\r\n itineraryPart.segments[0].departure\r\n )}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {this.parseDate(\r\n itineraryPart.segments[\r\n itineraryPart.segments.length - 1\r\n ].arrival\r\n )}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {this.parseTime(itineraryPart.totalDuration)}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {itineraryPart.segments[0].origin}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n {\r\n itineraryPart.segments[\r\n itineraryPart.segments.length - 1\r\n ].destination\r\n }\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {this.renderStops(\r\n itineraryPart.segments,\r\n itineraryPart.stops,\r\n key\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n {/* Economy Semi Flex */}\r\n
\r\n \r\n \r\n {itineraryPart.segments.map((segment, index) => (\r\n \r\n \r\n {segment.flight.airlineCode}\r\n \r\n \r\n {segment.flight.flightNumber}\r\n \r\n \r\n {segment.manufacturerName}\r\n \r\n {segment.equipmentDescription}\r\n
\r\n ))}\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n ))}\r\n
\r\n \r\n \r\n \r\n this.redirectToHome()}\r\n >\r\n \r\n \r\n this.redirectToPassenger()}\r\n >\r\n CONTINUE\r\n \r\n
\r\n \r\n
\r\n
\r\n {!this.props.isMedium && }\r\n
\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n return {\r\n flightSearchResult:\r\n state.searchFlight.selectionResult.productBreakdowns[0]\r\n .breakdownElements[0].breakdownElementAssignment.travelPart\r\n .itineraryParts,\r\n journeyType: state.bookingWiget.journyType,\r\n searchFlight: state.searchFlight,\r\n isMedium: state.global.isMedium,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n updateFlightIndex: (index) => {\r\n dispatch({\r\n type: flightSelectionAction.UPDATEFLIGHTINDEX,\r\n flightIndex: index,\r\n });\r\n },\r\n removeSeatData: () => {\r\n dispatch({\r\n type: seatSelectionAction.CLEARSEATSELECTIONENTRY,\r\n });\r\n },\r\n saveSearchResult: (result) =>\r\n dispatch({\r\n type: searchFlightAction.SAVESEARCHRESULT,\r\n searchResult: result,\r\n }),\r\n };\r\n};\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(FlightSelectionSummary);\r\n","import React from \"react\";\r\nimport { Container, Row,Button, Col } from \"react-bootstrap\";\r\nimport Translation from \"i18next\";\r\nimport { connect } from \"react-redux\";\r\nimport { matrixAction } from \"../../../../redux/actions/booking/matrixAction\";\r\nimport \"./Matrix.css\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {faAngleLeft, faAngleRight, faArrowLeft, faArrowRight, faPlaneArrival, faPlaneDeparture } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { AirportFullName } from \"../../../../service/shared/AirportFullName\";\r\nimport HttpService from \"../../../../service/shared/HttpService\";\r\nimport moment from \"moment\";\r\nimport Loading from \"../../seat-selection/Loading\";\r\nimport { searchFlightAction } from \"../../../../redux/actions/booking/searchFlightAction\";\r\nimport { Redirect } from \"react-router\";\r\n\r\nclass Matrix extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n startDate: null,\r\n endDate: null,\r\n isLoading:false,\r\n redirect:false,\r\n };\r\n // this.initializeState();\r\n }\r\n addClass = (columnNumber, rowNumber) => {\r\n var columnList = document.querySelectorAll(\".matrix-col-\" + columnNumber);\r\n var columnCounter = 0;\r\n columnList.forEach((column) => {\r\n if (columnCounter <= rowNumber) {\r\n column.className += \" high-light\";\r\n columnCounter++;\r\n } else {\r\n return true;\r\n }\r\n });\r\n var headerList = document.getElementsByClassName(\r\n \"matrix-header-col-\" + columnNumber\r\n );\r\n headerList[0].className += \" active-header\";\r\n };\r\n removeClass = (columnNumber) => {\r\n var columnList = document.querySelectorAll(\".matrix-col-\" + columnNumber);\r\n columnList.forEach((column) => {\r\n column.classList.remove(\"high-light\");\r\n });\r\n var headerList = document.getElementsByClassName(\r\n \"matrix-header-col-\" + columnNumber\r\n );\r\n headerList[0].classList.remove(\"active-header\");\r\n };\r\n dateConverter = (date) => {\r\n return new Date(date.toString());\r\n };\r\n selectedMatrix = (columnNumber, rowNumber, startDate, endDate) => {\r\n this.setState({ startDate: startDate, endDate: endDate });\r\n //remove last selected element\r\n var oldSeletedList = document.getElementById(\"selected\");\r\n if (oldSeletedList !== null) {\r\n oldSeletedList.setAttribute(\"id\", \"\");\r\n }\r\n var newSelectedList = document.getElementsByClassName(\r\n \"matrix-col-\" + columnNumber + \"-row-\" + rowNumber\r\n );\r\n newSelectedList[0].setAttribute(\"id\", \"selected\");\r\n };\r\n returnNextButton=()=>{\r\n this.setState({ isLoading: true });\r\n var tempSerachRequest = this.props.flightSearchRequest;\r\n tempSerachRequest.itineraryParts[1].when.date =moment(\r\n this.props.tableBody[6][7]\r\n ).add(2, \"days\").format(\"YYYY-MM-DD\");\r\n tempSerachRequest.searchType=\"MATRIX\";\r\n\r\n HttpService.postService(\r\n tempSerachRequest,\r\n \"/Availability/AdvancedSearch\",\r\n this.props.token\r\n )\r\n .then((response) => {\r\n this.props.saveMatrixResult(response.data);\r\n this.setState({ isLoading: false });\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n }\r\n departureNextButton=()=>{\r\n var deparureLastDate = moment(this.props.topHeader[6]).format(\"YYYY-MM-DD\");\r\n var returnFirstDate=moment(this.props.tableBody[0][7]).add(2, \"days\").format(\"YYYY-MM-DD\");\r\n if(deparureLastDate {\r\n this.props.saveMatrixResult(response.data);\r\n this.setState({ isLoading: false });\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n }\r\n\r\n }\r\n returnPreviousButton=()=>{\r\n var deparureLastDate = moment(this.props.topHeader[0]).format(\"YYYY-MM-DD\");\r\n var returnFirstDate=moment(this.props.tableBody[0][7]).add(-4, \"days\").format(\"YYYY-MM-DD\");\r\n if(deparureLastDate {\r\n this.props.saveMatrixResult(response.data);\r\n this.setState({ isLoading: false });\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n }\r\n }\r\n departurePreviousButton=()=>{\r\n var toDay = moment().format(\"YYYY-MM-DD\");\r\n var departureFirstDate = moment(this.props.topHeader[0]).format(\"YYYY-MM-DD\");\r\n if(departureFirstDate>=toDay){\r\n this.setState({ isLoading: true });\r\n var tempSerachRequest = this.props.flightSearchRequest;\r\n tempSerachRequest.itineraryParts[0].when.date =moment(\r\n departureFirstDate\r\n ).add(-4, \"days\").format(\"YYYY-MM-DD\");\r\n tempSerachRequest.searchType=\"MATRIX\";\r\n HttpService.postService(\r\n tempSerachRequest,\r\n \"/Availability/AdvancedSearch\",\r\n this.props.token\r\n )\r\n .then((response) => {\r\n this.props.saveMatrixResult(response.data);\r\n this.setState({ isLoading: false });\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n }\r\n }\r\n disabledDepartureNextButton=()=>{\r\n var deparureLastDate = moment(this.props.topHeader[6]).format(\"YYYY-MM-DD\");\r\n var returnFirstDate=moment(this.props.tableBody[0][7]).add(2, \"days\").format(\"YYYY-MM-DD\");\r\n if (deparureLastDate < returnFirstDate) {\r\n return false;\r\n } else {\r\n return true;\r\n }\r\n }\r\n disabledReturnPreviousButton=()=>{\r\n var deparureLastDate = moment(this.props.topHeader[0]).format(\"YYYY-MM-DD\");\r\n var returnFirstDate=moment(this.props.tableBody[0][7]).add(-4, \"days\").format(\"YYYY-MM-DD\");\r\n if(deparureLastDate{\r\n var toDay = moment().format(\"YYYY-MM-DD\");\r\n var departureFirstDate = moment(this.props.topHeader[0]).format(\"YYYY-MM-DD\");\r\n if(departureFirstDate>=toDay){\r\n return false\r\n\r\n }\r\n else{\r\n return true;\r\n\r\n }\r\n }\r\n numberWithCommas(number) {\r\n return parseInt(number).toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n }\r\n continue=()=>{\r\n if(this.state.startDate !== null &&this.state.endDate !== null){\r\n this.setState({ isLoading: true });\r\n var tempSerachRequest = this.props.flightSearchRequest;\r\n tempSerachRequest.itineraryParts[0].when.date =this.state.startDate;\r\n tempSerachRequest.itineraryParts[1].when.date =this.state.endDate;\r\n tempSerachRequest.searchType=1;\r\n \r\n HttpService.postService(\r\n tempSerachRequest,\r\n \"/Availability/Search\",\r\n this.props.token\r\n )\r\n .then((response) => {\r\n this.props.saveSearchResult(response);\r\n this.setState({ isLoading: false,redirect:true});\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n });\r\n\r\n }\r\n }\r\n render() {\r\n if(this.state.redirect){\r\n return (\r\n \r\n );\r\n }\r\n return (\r\n \r\n {this.state.isLoading ?
: null}\r\n
\r\n \r\n
\r\n \r\n \r\n | \r\n \r\n \r\n {Translation.t(\"departure_city_or_airport\")}\r\n {AirportFullName.getFullName(\r\n this.props.searchFlightRequest.itineraryParts[0].to.code\r\n )}\r\n \r\n this.departurePreviousButton()}\r\n >\r\n \r\n \r\n this.departureNextButton()}\r\n >\r\n \r\n \r\n \r\n \r\n | \r\n
\r\n \r\n {this.props.topHeader.map((topHeader, index) => (\r\n \r\n \r\n {Translation.t(\r\n \"day_\" + this.dateConverter(topHeader).getDay()\r\n )}\r\n
\r\n \r\n {Translation.t(\r\n \"month_\" + this.dateConverter(topHeader).getMonth()\r\n )}{\" \"}\r\n {this.dateConverter(topHeader).getDate()}\r\n
\r\n \r\n ))}\r\n \r\n \r\n Departure\r\n \r\n
\r\n \r\n Return \r\n \r\n | \r\n
\r\n \r\n \r\n {this.props.tableBody.map((tableBodyRows, rowIndex) => (\r\n \r\n {tableBodyRows.map((cell, columnIndex) => {\r\n if (columnIndex === 7) {\r\n return (\r\n \r\n \r\n {Translation.t(\r\n \"day_\" + this.dateConverter(cell).getDay()\r\n )}\r\n
\r\n \r\n {Translation.t(\r\n \"month_\" + this.dateConverter(cell).getMonth()\r\n )}{\" \"}\r\n {this.dateConverter(cell).getDate()}\r\n
\r\n \r\n );\r\n } else {\r\n var classNames =\r\n \"matrix-body align-text-top matrix-col-\" +\r\n columnIndex +\r\n \" matrix-col-\" +\r\n columnIndex +\r\n \"-row-\" +\r\n rowIndex +\r\n \" matrix-row-\" +\r\n rowIndex;\r\n return (\r\n {\r\n if (cell.status === \"AVAILABLE\") {\r\n this.addClass(columnIndex, rowIndex);\r\n }\r\n }}\r\n onMouseLeave={() => {\r\n if (cell.status === \"AVAILABLE\") {\r\n this.removeClass(columnIndex);\r\n }\r\n }}\r\n onClick={() => {\r\n if (cell.status === \"AVAILABLE\") {\r\n this.selectedMatrix(\r\n columnIndex,\r\n rowIndex,\r\n cell.startDate,\r\n cell.endDate\r\n );\r\n }\r\n }}\r\n >\r\n \r\n {cell.status === \"AVAILABLE\"\r\n ? this.numberWithCommas(\r\n cell.total.alternatives[0][0].amount\r\n ) +\r\n \" \" +\r\n cell.total.alternatives[0][0].currency\r\n : cell.status === \"UNAVAILABLE\"\r\n ? \"N/A\"\r\n : cell.status}\r\n
\r\n \r\n );\r\n }\r\n })}\r\n
\r\n ))}\r\n \r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n \r\n {Translation.t(\"returning_city_or_airport\")}\r\n {AirportFullName.getFullName(\r\n this.props.searchFlightRequest.itineraryParts[1].to.code\r\n )}\r\n \r\n this.returnPreviousButton()}\r\n >\r\n \r\n \r\n this.returnNextButton()}\r\n >\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n this.continue()}\r\n >\r\n {Translation.t(\"continue\")}\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {moment(props.flights[0].departureInfo.scheduledDateTime)\r\n .locale(\"en\")\r\n .format(\"DD MMMM hh:mm\")}{\" \"}\r\n {\" \"}\r\n {moment(\r\n props.flights[props.flights.length - 1].arrivalInfo\r\n .scheduledDateTime\r\n )\r\n .locale(\"en\")\r\n .format(\"DD MMMM hh:mm\")}\r\n
\r\n \r\n \r\n \r\n \r\n {props.airlineCode + \" \" + props.flightNumber}\r\n \r\n \r\n
\r\n
\r\n {props.flights.length === 1 ? \"Non-stop\" : props.flights.length - 1 + \" Stop\" + (props.flights.length > 2 ? \"s\" : \"\")}\r\n
\r\n \r\n \r\n setShowStatus(!showStatus)}\r\n style={{ maxHeight: \"12px\"}}\r\n >\r\n {(showStatus ? \"Hide \" : \"View \") + Translation.t(\"status\")}\r\n \r\n
\r\n
\r\n {showStatus && (\r\n <>\r\n {props.flights.map((flight, index) => {\r\n return (\r\n <>\r\n {index === 0 ? null :
}\r\n
\r\n \r\n \r\n
\r\n {Translation.t(\"flight_#\") + props.flightNumber}\r\n
\r\n \r\n \r\n {AirportFullName.getFullName(\r\n flight.departureInfo.airportCode\r\n )}\r\n {\" \"}\r\n {AirportFullName.getFullName(\r\n flight.arrivalInfo.airportCode\r\n )}\r\n \r\n
\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n {Translation.t(flight.departureInfo.flightStatus)}\r\n \r\n
\r\n \r\n {Translation.t(\"depart\")}\r\n
\r\n \r\n {Translation.t(\"scheduled\")}{\" \"}\r\n {moment(flight.departureInfo.scheduledDateTime)\r\n .locale(\"en\")\r\n .format(\"hh:mm A\")}\r\n
\r\n {Translation.t(\"terminal_gate\")}
\r\n \r\n {flight.departureInfo.terminal === null\r\n ? \"-\"\r\n : flight.departureInfo.terminal}\r\n /\r\n {flight.departureInfo.gate === null\r\n ? \"-\"\r\n : flight.departureInfo.gate}\r\n
\r\n \r\n\r\n \r\n \r\n \r\n \r\n {Translation.t(flight.arrivalInfo.flightStatus)}\r\n \r\n
\r\n \r\n {Translation.t(\"arrive\")}\r\n
\r\n {Translation.t(\"scheduled\")} {\" \"}\r\n {moment(flight.arrivalInfo.scheduledDateTime)\r\n .locale(\"en\")\r\n .format(\"hh:mm A\")}
\r\n {Translation.t(\"terminal_gate\")}
\r\n {flight.arrivalInfo.terminal === null\r\n ? \"-\"\r\n : flight.arrivalInfo.terminal}\r\n /\r\n {flight.arrivalInfo.gate === null\r\n ? \"-\"\r\n : flight.arrivalInfo.gate}
\r\n \r\n
\r\n \r\n );\r\n })}\r\n \r\n )}\r\n
\r\n \r\n
\r\n );\r\n } else {\r\n searchBody = (\r\n \r\n \r\n props.updateFlightNumber(event.target.value)}\r\n />\r\n \r\n
\r\n );\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n {itineraryPart[0].params.from !== null &&\r\n itineraryPart[0].params.to !== null &&\r\n props.flightStatusSearchType === 1 ? (\r\n <>\r\n \r\n {itineraryPart[0].params.from !== null\r\n ? props.isMedium\r\n ? itineraryPart[0].params.from.value\r\n : itineraryPart[0].params.from.label\r\n : null}\r\n \r\n \r\n {itineraryPart[0].params.to !== null\r\n ? props.isMedium\r\n ? itineraryPart[0].params.to.value\r\n : itineraryPart[0].params.to.label\r\n : null}\r\n \r\n \r\n ) : null}\r\n\r\n \r\n setShowEditForm(!showEditForm)}\r\n >\r\n \r\n \r\n \r\n
\r\n\r\n {showEditForm ? (\r\n
\r\n
{Translation.t(\"enter_flight_information\")}
\r\n
{Translation.t(\"please_note\")}
\r\n
\r\n setSearchType(1)}\r\n >\r\n {Translation.t(\"route\")}\r\n \r\n setSearchType(2)}\r\n >\r\n {Translation.t(\"flight_#\")}\r\n \r\n {searchBody}\r\n \r\n \r\n setShowEditForm(!showEditForm)}\r\n >\r\n {Translation.t(\"cancel\")}\r\n \r\n \r\n \r\n handleFlightStatusSaveClick()}\r\n >\r\n {Translation.t(\"save\")}\r\n \r\n \r\n
\r\n
\r\n
\r\n ) : null}\r\n
\r\n
\r\n
\r\n \r\n {Translation.t(\"flight_status\")}\r\n \r\n
\r\n \r\n \r\n \r\n {Translation.t(\"review_the_status_of_the_flights_that_match_your_search\")}\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default FlightStatusHeader;\r\n","import React from \"react\";\r\n\r\nimport moment from \"moment\";\r\nimport { connect } from \"react-redux\";\r\n// import FlightList from \"../flight list temp/FlightList\";\r\nimport OutsideClickHandler from \"react-outside-click-handler\";\r\n\r\nimport { Card, Col } from \"react-bootstrap\";\r\nimport { flightStatusAction } from \"../../../redux/actions/manage-my-booking/flightStatusAction\";\r\n\r\nimport DoubleRangeSlider from \"../../booking/flight-selection/range slider/DoubleRangeSlider\"; //range slider/DoubleRangeSlider\";\r\n\r\n// import FlightScheduleSort from \"./FlightScheduleSort\";\r\nimport Translation from \"i18next\";\r\n\r\n// import { flightScheduleAction } from \"../../../redux/actions/manage-my-booking/flightScheduleAction\";\r\n\r\nclass FlightStatusFilter extends React.Component {\r\n state = {\r\n departMin: 0,\r\n departMax: 0,\r\n isClosed: true,\r\n filterCriteria: {\r\n NoOfStops: [],\r\n Departure: { min: null, max: null },\r\n },\r\n filterCriteriaActive: {},\r\n isFiltersModalOpened: false,\r\n checkedStop: [],\r\n Accordion: 0,\r\n searchResponse: {},\r\n };\r\n constructor(props) {\r\n super(props);\r\n this.state = this.initFilters();\r\n console.log(this.state);\r\n this.props.updateSortFilterCriteria(this.state.filterCriteria);\r\n // console.log(\"this.state = this.initFilters();\");\r\n }\r\n\r\n initFilters = () => {\r\n try {\r\n var flightstatusResults = [];\r\n if (\r\n this.props.fligthStatusDay === \"today\" ||\r\n this.props.fligthStatusDay === \"yesterday\"\r\n ) {\r\n flightstatusResults =\r\n this.props.statusFlights.todayFlightStatusResponse\r\n .routeFlightStatusResponses;\r\n }\r\n if (this.props.fligthStatusDay === \"tomorrow\") {\r\n flightstatusResults =\r\n this.props.statusFlights.tomorrowFlightStatusResponse\r\n .routeFlightStatusResponses;\r\n }\r\n\r\n if (flightstatusResults !== null) {\r\n var p = {};\r\n var countsNoOfStopsCount = flightstatusResults.reduce(\r\n (first, second) => {\r\n // console.log(second.segmentFlightStatusResponses[0])\r\n var name =\r\n second.segmentFlightStatusResponses[0].flights.length - 1;\r\n console.log(name);\r\n if (!p.hasOwnProperty(name)) {\r\n p[name] = 0;\r\n }\r\n p[name]++;\r\n return p;\r\n },\r\n {}\r\n );\r\n console.log(countsNoOfStopsCount, flightstatusResults);\r\n countsNoOfStopsCount = Object.keys(countsNoOfStopsCount).map((k) => {\r\n return {\r\n name:\r\n parseInt(k) === 0\r\n ? \"Non-Stop \"\r\n : k + \" Stop\" + (k > 1 ? \"s \" : \" \"),\r\n count: countsNoOfStopsCount[k],\r\n stops: k,\r\n };\r\n });\r\n p = {};\r\n var variableDepartureTime = flightstatusResults.reduce(\r\n (firstElement, secondElement) => {\r\n var name =\r\n \"Departure time : \" +\r\n moment(\r\n secondElement.segmentFlightStatusResponses[0].flights[0]\r\n .departureInfo.scheduledDateTime\r\n ).format(\"HH:mm\");\r\n if (!p.hasOwnProperty(name)) {\r\n p[name] = moment(\r\n secondElement.segmentFlightStatusResponses[0].flights[0]\r\n .departureInfo.scheduledDateTime\r\n ).format(\"HH:mm\");\r\n }\r\n return p;\r\n },\r\n {}\r\n );\r\n\r\n p = {};\r\n\r\n variableDepartureTime = Object.keys(variableDepartureTime).map((k) => {\r\n return variableDepartureTime[k];\r\n });\r\n\r\n var minDepartTime = variableDepartureTime.reduce(\r\n (first, second) => {\r\n if (first < second) return first;\r\n else return second;\r\n },\r\n [\"Infinity\"]\r\n );\r\n\r\n var maxDepartTime = variableDepartureTime.reduce(\r\n (first, second) => {\r\n if (first > second) return first;\r\n else return second;\r\n },\r\n [\"-Infinity\"]\r\n );\r\n\r\n var filterCriteria = {\r\n NoOfStops: countsNoOfStopsCount,\r\n Departure: { min: minDepartTime, max: maxDepartTime },\r\n };\r\n\r\n var checkedStop = {};\r\n\r\n filterCriteria.NoOfStops.map((val, index) => {\r\n checkedStop[val.name] = true;\r\n return index;\r\n });\r\n var state = { ...this.state };\r\n\r\n state.filterCriteria = filterCriteria;\r\n state.checkedStop = checkedStop;\r\n //time\r\n // state.filterCriteriaActive= {};\r\n // state.isFiltersModalOpened = false;\r\n // state.isClosed = true;\r\n state.departMin = minDepartTime;\r\n state.departMax = maxDepartTime;\r\n\r\n return state;\r\n }\r\n console.log(\r\n \"jlklkjasjfdk lkjlkasjlkfjdaskl;jfdas jerlkjfdsalkfjasl;kjfdaksfdsa\"\r\n );\r\n } catch (e) {\r\n console.log(\"Exception occured\", e);\r\n return null;\r\n }\r\n };\r\n\r\n componentDidUpdate() {\r\n // this.props.updateFlightStatus({flightIndex : this.props.flightIndex, searchResponse : this.getItineraryPartBrands()});\r\n try {\r\n document.getElementById(\"sticky-header-outer-container\").style.height =\r\n \"auto\";\r\n } catch {}\r\n }\r\n\r\n getNumberOfStopsFuction = () => {\r\n return (\r\n <>\r\n {this.state.filterCriteria.NoOfStops.length === 1 ? (\r\n parseInt(this.state.filterCriteria.NoOfStops[0].stops) === 0 ? (\r\n \r\n
\r\n \r\n
\r\n
\r\n {Translation.t(\"non_stop\")}\r\n
\r\n
\r\n {this.state.filterCriteria.NoOfStops[0].count}\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n {Translation.t(\r\n this.state.filterCriteria.NoOfStops[0].stops + \"-stop\"\r\n )}\r\n \r\n
\r\n
\r\n {this.state.filterCriteria.NoOfStops[0].count}\r\n
\r\n
\r\n
\r\n {\r\n if (this.state.checkedStop[second]) return first + 1;\r\n return first;\r\n },\r\n 0\r\n )\r\n ? \"checked\"\r\n : \"\"\r\n }\r\n onChange={(event) => {\r\n var temp = this.state.checkedStop;\r\n for (const [key] of Object.entries(\r\n this.state.checkedStop\r\n )) {\r\n temp[key] = event.target.checked;\r\n }\r\n this.setState({ checkedStop: temp });\r\n }}\r\n className=\"et-ibe-checkbox\"\r\n />\r\n
\r\n
\r\n {Translation.t(\"All\")}\r\n
\r\n
\r\n \r\n {this.state.filterCriteria.NoOfStops.reduce(\r\n (a, b) => a + b.count,\r\n 0\r\n )}\r\n \r\n
\r\n
\r\n
\r\n {\r\n var temp = this.state.checkedStop;\r\n temp[event.target.value] = event.target.checked;\r\n this.setState({ checkedStop: temp });\r\n }}\r\n />\r\n
\r\n
\r\n {val.name}\r\n
\r\n
\r\n {val.count}\r\n
\r\n
\r\n \r\n \r\n this.setState({\r\n Accordion: this.state.Accordion === 0 ? \"none\" : 0,\r\n })\r\n }\r\n >\r\n {Translation.t(\"filter_time\")}\r\n \r\n {this.state.filterCriteriaActive.Departure !== undefined\r\n ? \"Departure: \" + this.state.filterCriteriaActive.Departure\r\n : null}\r\n \r\n \r\n {\" \"}\r\n {this.state.filterCriteriaActive.Arrival !== undefined\r\n ? \"Arrival: \" + this.state.filterCriteriaActive.Arrival\r\n : null}\r\n \r\n \r\n {this.state.Accordion === 0 ? (\r\n \r\n \r\n {Translation.t(\"departure_time\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ departMin: val })}\r\n onMaxChange={(val) => this.setState({ departMax: val })}\r\n disabled={\r\n this.state.filterCriteria.Departure.min ===\r\n this.state.filterCriteria.Departure.max\r\n }\r\n currentMin={this.state.departMin}\r\n currentMax={this.state.departMax}\r\n min={this.state.filterCriteria.Departure.min}\r\n max={this.state.filterCriteria.Departure.max}\r\n />\r\n \r\n ) : null}\r\n \r\n \r\n \r\n this.setState({\r\n Accordion: this.state.Accordion === 2 ? \"none\" : 2,\r\n })\r\n }\r\n >\r\n {Translation.t(\"number_of_tops\")}\r\n \r\n {this.state.filterCriteriaActive.stops !== undefined\r\n ? \"Stops \" + this.state.filterCriteriaActive.stops\r\n : null}\r\n \r\n \r\n {this.state.Accordion === 2 ? (\r\n \r\n \r\n {\" \"}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n {this.getNumberOfStopsFuction()}\r\n \r\n ) : null}\r\n \r\n
\r\n \r\n );\r\n } else {\r\n return (\r\n \r\n
\r\n
\r\n {Translation.t(\"departure_time\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n this.setState({ departMin: val })}\r\n onMaxChange={(val) => this.setState({ departMax: val })}\r\n disabled={\r\n this.state.filterCriteria.Departure.min ===\r\n this.state.filterCriteria.Departure.max\r\n }\r\n currentMin={this.state.departMin}\r\n currentMax={this.state.departMax}\r\n min={this.state.filterCriteria.Departure.min}\r\n max={this.state.filterCriteria.Departure.max}\r\n />\r\n \r\n
\r\n
\r\n {Translation.t(\"number_of_tops\")}\r\n this.clearFilter(event)}\r\n >\r\n {Translation.t(\"clear\")}\r\n \r\n
\r\n {this.getNumberOfStopsFuction()}\r\n \r\n
\r\n
\r\n
\r\n \r\n {this.getResultNumberAccordingly()} {Translation.t(\"results\")}\r\n \r\n \r\n this.setState({\r\n isClosed: !this.state.isClosed,\r\n isFiltersModalOpened: false,\r\n })\r\n }\r\n >\r\n {this.state.isClosed\r\n ? Translation.t(\"show_filter\")\r\n : Translation.t(\"hide_filter\")}\r\n \r\n {this.getActiveFilter()}\r\n
\r\n \r\n
\r\n {this.getFilterOptions()}\r\n
\r\n
\r\n this.handleCancleButtonClick()}\r\n >\r\n {Translation.t(\"cancel\")}\r\n \r\n
\r\n
\r\n this.handleUpdate()}\r\n className=\"col-12 btn btn-success text-uppercase std-et-bg-color filter-bottom-button\"\r\n >\r\n {Translation.t(\"update\")}\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n {props.statusFlights.yesterdayFlightStatusResponse ===\r\n undefined ? null : (\r\n
setFligthStatusDay(\"yesterday\")}\r\n >\r\n \r\n {Translation.t(\"yesterday\")}\r\n
\r\n \r\n {moment(props.statusFlights.date)\r\n .subtract(1, \"d\")\r\n .locale(\"en\")\r\n .format(\"MMMM DD\")}\r\n \r\n \r\n \r\n )}\r\n
setFligthStatusDay(\"today\")}\r\n >\r\n \r\n {Translation.t(\"today\")}\r\n
\r\n \r\n {moment(props.statusFlights.date)\r\n .locale(\"en\")\r\n .format(\"MMMM DD\")}\r\n \r\n \r\n
\r\n \r\n {moment(props.statusFlights.date)\r\n .add(1, \"d\")\r\n .locale(\"en\")\r\n .format(\"MMMM DD\")}\r\n \r\n \r\n \r\n \r\n\r\n {props.flightStatusSearchType === 2 ? null : (\r\n <>\r\n {fligthStatusDay === \"today\" ||\r\n fligthStatusDay === \"yesterday\" ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n )}\r\n\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n {Translation.t(\"departure_time\")}\r\n \r\n
\r\n \r\n \r\n \r\n {Translation.t(\"stops\")}\r\n
\r\n \r\n \r\n \r\n {Translation.t(\"status\")}\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n {fligthStatusDay === \"yesterday\" ? (\r\n <>\r\n {props.statusFlights.yesterdayFlightStatusResponse\r\n .flights !== null ? (\r\n <>\r\n {props.statusFlights.yesterdayFlightStatusResponse.flights.map(\r\n (flight) => {\r\n return (\r\n \r\n );\r\n }\r\n )}\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n ) : null}\r\n {fligthStatusDay === \"today\" ? (\r\n <>\r\n {props.statusFlights.todayFlightStatusResponse\r\n .flights !== null ? (\r\n <>\r\n {props.statusFlights.todayFlightStatusResponse.flights.map(\r\n (flight) => {\r\n return (\r\n \r\n );\r\n }\r\n )}\r\n \r\n ) : (\r\n \r\n // no flight available\r\n )}\r\n \r\n ) : null}\r\n {fligthStatusDay === \"tomorrow\" ? (\r\n <>\r\n {props.statusFlights.tomorrowFlightStatusResponse\r\n .flights !== null ? (\r\n <>\r\n {props.statusFlights.tomorrowFlightStatusResponse.flights.map(\r\n (flight) => {\r\n return (\r\n \r\n );\r\n }\r\n )}\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n ) : null}\r\n
\r\n ) : (\r\n // route\r\n \r\n {fligthStatusDay === \"today\" ||\r\n fligthStatusDay === \"yesterday\" ? (\r\n <>\r\n {props.statusFlights.todayFlightStatusResponse !==\r\n null ? (\r\n <>\r\n {props.statusFlights.todayFlightStatusResponse.routeFlightStatusResponses.map(\r\n (routeFlightStatusResponses) => {\r\n // (flight) => {\r\n return (\r\n <>\r\n \r\n \r\n );\r\n }\r\n )}\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n ) : null}\r\n {fligthStatusDay === \"tomorrow\" ? (\r\n <>\r\n {props.statusFlights.tomorrowFlightStatusResponse !==\r\n null ? (\r\n <>\r\n {props.statusFlights.tomorrowFlightStatusResponse.routeFlightStatusResponses.map(\r\n (routeFlightStatusResponses) => {\r\n return (\r\n <>\r\n \r\n \r\n );\r\n }\r\n )}\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n ) : null}\r\n
\r\n )}\r\n \r\n \r\n )}\r\n \r\n ) : (\r\n \r\n \r\n {\r\n history.push(\"/\");\r\n props.updateFlightStatusPresent(true);\r\n }}\r\n >\r\n \r\n {Translation.t(\"go_back\")}\r\n \r\n
\r\n )}\r\n \r\n );\r\n};\r\nconst mapStateToProps = (state) => {\r\n return {\r\n token: state.searchFlight.token,\r\n itineraryPart: state.bookingWiget.itineraryPart,\r\n isLoading: state.global.isLoading,\r\n flightStatusSearchType: state.flightStatus.flightStatusSearchType,\r\n flightNumber: state.flightStatus.flightNumber,\r\n statusFlights: state.flightStatus.statusFlights,\r\n backedUpFlights: state.flightStatus.backedUpFlights,\r\n isFlightStatusPresent: state.flightStatus.isFlightStatusPresent,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n updateBackedupSchedules: (value) =>\r\n dispatch({\r\n type: flightScheduleAction.SCHEDULEINITFLIGHTS,\r\n payload: value,\r\n }),\r\n saveToken: (token) =>\r\n dispatch({\r\n type: searchFlightAction.SAVETOKEN,\r\n token: token,\r\n }),\r\n updateFlightStatusPresent: (value) =>\r\n dispatch({\r\n type: flightStatusAction.ISFLIGHTSTATUSPRESENT,\r\n payload: value,\r\n }),\r\n initFlightStatus: (value) =>\r\n dispatch({\r\n type: flightStatusAction.INITFLIGHTSTATUS,\r\n payload: value,\r\n }),\r\n updateIsLoading: (value) =>\r\n dispatch({\r\n type: globalActionType.UPDATEISLOADING,\r\n value: value,\r\n }),\r\n };\r\n};\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(AllFlightStatusResult);\r\n","import React from \"react\";\r\nimport { Col, Row } from \"react-bootstrap\";\r\nimport Translation from \"i18next\";\r\nimport { connect } from \"react-redux\";\r\nimport PhoneInput from \"react-phone-input-2\";\r\nimport \"react-phone-input-2/lib/style.css\";\r\nimport { passengerAction } from \"../../../redux/actions/booking/passengerAction\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nclass ContactInfo extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n countryCode: null,\r\n };\r\n }\r\n\r\n \r\n validateEmail =(inputValue) =>\r\n{\r\n var mailformat = /^(([^<>()\\[\\]\\\\.,;:\\s@\"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/;\r\n // var mailformat=/(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|\"(?:[\\x01-\\x08\\x0b\\x0c\\x0e-\\x1f\\x21\\x23-\\x5b\\x5d-\\x7f]|\\\\[\\x01-\\x09\\x0b\\x0c\\x0e-\\x7f])*\")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\\x01-\\x08\\x0b\\x0c\\x0e-\\x1f\\x21-\\x5a\\x53-\\x7f]|\\\\[\\x01-\\x09\\x0b\\x0c\\x0e-\\x7f])+)\\])/; \r\n if(inputValue.value.trim().match(mailformat)){\r\n this.props.updatePassengerMethod(0, inputValue.value.trim(), \"contact\", \"email\");\r\n inputValue.classList.remove(\"invalid_input\");\r\n inputValue.placeholder = Translation.t(\"email_address\");\r\n }\r\n else{\r\n this.props.updatePassengerMethod(0, null, \"contact\", \"email\");\r\n inputValue.classList.add(\"invalid_input\");\r\n inputValue.placeholder = Translation.t(\"email_address_required\");\r\n }\r\n\r\n}\r\n // validateEmail = (inputValue) => {\r\n // var mailformat =\r\n // /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\\.[a-zA-Z0-9-]+)*$/;\r\n // if (mailformat.test(inputValue.value)) {\r\n // } else {\r\n\r\n // }\r\n // };\r\n componentDidMount = async() => {\r\n if (\r\n this.props.passengerList[0].contact.phone === null ||\r\n this.props.passengerList[0].contact.phone === undefined\r\n ) {\r\n const publicIp = require(\"public-ip\");\r\n var IpData = await publicIp.v4();\r\n\r\n HttpService.getCountryCode(IpData, this.props.token)\r\n .then((response) => {\r\n if (response.data.statusAPI === \"SUCCESS\") {\r\n this.setState({\r\n countryCode: response.data.country_code.toLowerCase(),\r\n });\r\n }\r\n })\r\n .catch((error) => console.log(error));\r\n }\r\n\r\n };\r\n render() {\r\n return (\r\n <>\r\n {/* \r\n \r\n \r\n \r\n {Translation.t(\"create_account_info\")}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n
*/}\r\n \r\n \r\n
{Translation.t(\"remember_me_message\")}
\r\n \r\n \r\n {\r\n this.props.changeRememberMe();\r\n }}\r\n />\r\n \r\n
\r\n
\r\n {Translation.t(\"contact_info\")}
\r\n \r\n \r\n {\r\n this.props.updatePassengerMethod(\r\n 0,\r\n formattedValue,\r\n \"contact\",\r\n \"phone\"\r\n );\r\n }}\r\n onBlur={() => {\r\n var inputValue = document.getElementById(\"adult-0-phone\");\r\n if (\r\n inputValue.value === null ||\r\n inputValue.value === \"\" ||\r\n inputValue.value === \"+\"\r\n ) {\r\n inputValue.classList.add(\"invalid_input\");\r\n inputValue.placeholder = Translation.t(\r\n \"phone_number_required\"\r\n );\r\n }\r\n }}\r\n onFocus={() => {\r\n var inputField = document.getElementById(\"adult-0-phone\");\r\n inputField.classList.remove(\"invalid_input\");\r\n inputField.placeholder = Translation.t(\"phone_number\");\r\n }}\r\n />\r\n \r\n \r\n \r\n this.validateEmail(document.getElementById(\"adult-0-email\"))\r\n }\r\n onChange={() =>\r\n this.validateEmail(document.getElementById(\"adult-0-email\"))\r\n }\r\n onFocus={() => {\r\n var inputField = document.getElementById(\"adult-0-email\");\r\n inputField.classList.remove(\"invalid_input\");\r\n inputField.placeholder = Translation.t(\"email_address\");\r\n }}\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n {\r\n var receiveEmail = document.getElementById(\"receive-emial\");\r\n if(receiveEmail.value===\"on\"){\r\n this.props.updatePassengerMethod(0, true, \"contact\", \"recieveEmail\");\r\n }\r\n else{\r\n this.props.updatePassengerMethod(0, false, \"contact\", \"recieveEmail\");\r\n }\r\n }}\r\n />\r\n \r\n
\r\n
\r\n \r\n );\r\n }\r\n}\r\nconst mapStateToProps = (state) => {\r\n return {\r\n passengerList: state.passenger.passengerList,\r\n rememberMe: state.passenger.rememberMe,\r\n token: state.searchFlight.token,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n changeRememberMe: () =>\r\n dispatch({\r\n type: passengerAction.CHANGEREMEMBERME,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(ContactInfo);\r\n","import React from \"react\";\r\nimport { Button, Card, Col, Row } from \"react-bootstrap\";\r\nimport Select from \"react-select\";\r\nimport AirportSelectStyle from \"../../../master-data/booking-widget/airpot-select-style\";\r\nimport Month from \"../../../master-data/shared/month.json\";\r\nimport Day from \"../../../master-data/shared/day.json\";\r\nimport Translation from \"i18next\";\r\nimport \"./PassengerInfo.css\";\r\nimport ContactInfo from \"./ContactInfo\";\r\nimport PassengerService from \"../../../service/booking/passenger/PassengerService\";\r\nimport { connect } from \"react-redux\";\r\nimport { passengerAction } from \"../../../redux/actions/booking/passengerAction\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nimport { accountAction } from \"../../../redux/actions/manage-my-booking/accountAction\";\r\nimport moment from \"moment\";\r\nclass PassengerInfo extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n showFrequentFlyer: false,\r\n showSpecialRequest: false,\r\n passengerInfoChanged: false,\r\n savedNameList: [],\r\n showMealPreference: moment(this.props.departureDate).isAfter(\r\n moment().format(\"YYYY-MM-DD\")\r\n ),\r\n };\r\n var currentYear = new Date().getFullYear();\r\n this.selectStyle = AirportSelectStyle.desktopStyle;\r\n this.passengerService = new PassengerService();\r\n this.Year = [];\r\n if (\r\n this.props.passengerList[this.props.index].passengerInfo.type === \"child\"\r\n ) {\r\n var childYearStart = currentYear - 2;\r\n for (var i = 0; i < 11; i++) {\r\n var tempChildYear = {\r\n value: childYearStart - i,\r\n label: childYearStart - i,\r\n };\r\n this.Year.push(tempChildYear);\r\n }\r\n } else if (\r\n this.props.passengerList[this.props.index].passengerInfo.type === \"infant\"\r\n ) {\r\n for (var i = 0; i < 3; i++) {\r\n var tempInfantYear = {\r\n value: currentYear - i,\r\n label: currentYear - i,\r\n };\r\n this.Year.push(tempInfantYear);\r\n }\r\n } else {\r\n var adultYear = currentYear - 12;\r\n for (var i = 0; i < 95; i++) {\r\n var tempAdultYear = {\r\n value: adultYear - i,\r\n label: adultYear - i,\r\n };\r\n this.Year.push(tempAdultYear);\r\n }\r\n }\r\n }\r\n componentDidMount() {\r\n const profileList = JSON.parse(localStorage.getItem(\"IBE_PassengerInfo\"));\r\n if (profileList !== null) {\r\n this.setState({ savedNameList: Object.getOwnPropertyNames(profileList) });\r\n }\r\n if (this.props.isUserSignedIn && this.props.index === 0) {\r\n this.fillPassengerForm();\r\n }\r\n // document.getElementById(\"passenger-0-first-name\").focus();\r\n }\r\n fillPassengerForm = async () => {\r\n this.setState({ passengerInfoChanged: false });\r\n\r\n if (this.props.userProfile === null) {\r\n // this.setState({ profileDataLoading: true });\r\n await HttpService.postAccount(\r\n this.props.profileCookie,\r\n \"/ProfileRetrieve\",\r\n this.props.token\r\n )\r\n .then((accountRetrieveResponse) => {\r\n if (accountRetrieveResponse.data.statusAPI === \"SUCCESS\") {\r\n this.props.fillPassengerForm(accountRetrieveResponse.data.profile);\r\n this.props.iniliazeProfile(accountRetrieveResponse.data.profile);\r\n }\r\n // this.setState({ profileDataLoading: false });\r\n })\r\n .catch((error) => {\r\n // this.setState({ profileDataLoading: false });\r\n console.log(error);\r\n });\r\n } else {\r\n this.props.fillPassengerForm(this.props.userProfile);\r\n }\r\n };\r\n enterAnotherPassenger = () => {\r\n this.setState({ passengerInfoChanged: true });\r\n this.props.enterAnotherPassenger();\r\n };\r\n render() {\r\n return (\r\n <>\r\n \r\n \r\n \r\n {this.props.getHeaderText(this.props.index)} (\r\n {Translation.t(\r\n this.props.passengerList[this.props.index].passengerInfo.type\r\n )}\r\n )\r\n
\r\n \r\n \r\n {this.props.isUserSignedIn && (\r\n \r\n {this.state.passengerInfoChanged ? (\r\n
\r\n {this.props.firstName} {this.props.lastName} is loyalty\r\n member.,{\" \"}\r\n \r\n Pre-fill loyalty passenger information\r\n \r\n , or continue to enter new passenger info\r\n
\r\n ) : (\r\n
\r\n You have signed in as {this.props.firstName}{\" \"}\r\n {this.props.lastName}, so we've pre-filled this information.\r\n If you are booking for someone else, then{\" \"}\r\n \r\n ENTER NEW PASSENGER INFO\r\n \r\n
\r\n )}\r\n
{Translation.t(\"passange_form_message\")}
\r\n \r\n\r\n {Translation.t(\"basic_info\")}
\r\n \r\n {this.props.passengerList[this.props.index].passengerInfo.type ===\r\n \"adult\" && (\r\n \r\n \r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"prefix\",\r\n \"props.onFocus\"\r\n )\r\n }\r\n onBlur={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"prefix\",\r\n \"onBlur\"\r\n )\r\n }\r\n onChange={(value) =>\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"passengerDetails\",\r\n \"prefix\",\r\n null,\r\n true\r\n )\r\n }\r\n styles={this.selectStyle}\r\n options={this.passengerService.getTitleList()}\r\n placeholder={\r\n this.props.passengerList[this.props.index].validation\r\n .isprefixValid ? (\r\n Translation.t(\"title\")\r\n ) : (\r\n \r\n {Translation.t(\"title_required\")}\r\n \r\n )\r\n }\r\n >\r\n \r\n )}\r\n \r\n this.props.onKeyDownFunction(e)}\r\n onBlur={() => {\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n document.getElementById(\r\n \"passenger-\" + this.props.index + \"-first-name\"\r\n ).value,\r\n \"passengerDetails\",\r\n \"firstName\",\r\n \"passenger-\" + this.props.index + \"-first-name\"\r\n );\r\n }}\r\n onChange={() => {\r\n if (this.props.index === 0) {\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n document.getElementById(\r\n \"passenger-\" + this.props.index + \"-first-name\"\r\n ).value,\r\n \"passengerDetails\",\r\n \"firstName\",\r\n \"passenger-\" + this.props.index + \"-first-name\"\r\n );\r\n }\r\n }}\r\n onFocus={() =>\r\n this.props.onFocus(\r\n \"passenger-\" + this.props.index + \"-first-name\"\r\n )\r\n }\r\n list={\r\n this.props.index === 0\r\n ? \"passenger-0-first-name-list\"\r\n : null\r\n }\r\n />\r\n {this.props.index === 0 && (\r\n \r\n )}\r\n \r\n \r\n {\r\n var inputValue = document.getElementById(\r\n \"passenger-\" + this.props.index + \"-middle-name\"\r\n ).value;\r\n if (inputValue !== null && inputValue !== \"\") {\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n inputValue,\r\n \"passengerDetails\",\r\n \"middleName\"\r\n );\r\n }\r\n }}\r\n onKeyDown={(e) => this.props.onKeyDownFunction(e)}\r\n />\r\n \r\n \r\n {\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n document.getElementById(\r\n \"passenger-\" + this.props.index + \"-last-name\"\r\n ).value,\r\n \"passengerDetails\",\r\n \"lastName\",\r\n \"passenger-\" + this.props.index + \"-last-name\"\r\n );\r\n }}\r\n onFocus={() => {\r\n this.props.onFocus(\r\n \"passenger-\" + this.props.index + \"-last-name\"\r\n );\r\n }}\r\n onKeyDown={(e) => this.props.onKeyDownFunction(e)}\r\n />\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"year\",\r\n \"props.onFocus\"\r\n )\r\n }\r\n onBlur={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"year\",\r\n \"onBlur\"\r\n )\r\n }\r\n onChange={(value) =>\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"passengerInfo\",\r\n \"birthOfYear\"\r\n )\r\n }\r\n placeholder={\r\n this.props.passengerList[this.props.index].validation\r\n .isYearValid ? (\r\n Translation.t(\"birth_year\")\r\n ) : (\r\n \r\n {Translation.t(\"birth_year_required\")}\r\n \r\n )\r\n }\r\n >\r\n \r\n
\r\n \r\n \r\n {Translation.t(\"birth_month_required\")}\r\n \r\n )\r\n }\r\n id={\"passenger-\" + this.props.index + \"birth-of-month\"}\r\n value={\r\n this.props.passengerList[this.props.index].passengerInfo\r\n .birthOfMonth\r\n }\r\n onFocus={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"month\",\r\n \"props.onFocus\"\r\n )\r\n }\r\n onBlur={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"month\",\r\n \"onBlur\"\r\n )\r\n }\r\n onChange={(value) =>\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"passengerInfo\",\r\n \"birthOfMonth\"\r\n )\r\n }\r\n >\r\n \r\n
\r\n \r\n \r\n {Translation.t(\"birth_day_required\")}\r\n \r\n )\r\n }\r\n id={\"passenger-\" + this.props.index + \"birth-of-day\"}\r\n value={\r\n this.props.passengerList[this.props.index].passengerInfo\r\n .birthOfDay\r\n }\r\n onFocus={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"day\",\r\n \"props.onFocus\"\r\n )\r\n }\r\n onBlur={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"day\",\r\n \"onBlur\"\r\n )\r\n }\r\n onChange={(value) =>\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"passengerInfo\",\r\n \"birthOfDay\"\r\n )\r\n }\r\n >\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n {Translation.t(\"gender_required\")}\r\n \r\n )\r\n }\r\n id={\"passenger-\" + this.props.index + \"gender\"}\r\n value={\r\n this.props.passengerList[this.props.index].passengerInfo\r\n .gender\r\n }\r\n onFocus={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"gender\",\r\n \"props.onFocus\"\r\n )\r\n }\r\n onBlur={() =>\r\n this.props.changeSelectValidation(\r\n this.props.index,\r\n \"gender\",\r\n \"onBlur\"\r\n )\r\n }\r\n onChange={(value) =>\r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"passengerInfo\",\r\n \"gender\"\r\n )\r\n }\r\n >\r\n \r\n
\r\n {this.props.index === 0 &&\r\n this.props.passengerList[this.props.index].passengerInfo.type ===\r\n \"adult\" ? (\r\n \r\n ) : null}\r\n\r\n {Translation.t(\"additional_info\")}
\r\n \r\n \r\n \r\n {this.state.showFrequentFlyer ? (\r\n \r\n \r\n this.setState({\r\n showFrequentFlyer: !this.state.showFrequentFlyer,\r\n })\r\n }\r\n >\r\n -\r\n {\" \"}\r\n \r\n \r\n ) : (\r\n \r\n \r\n this.setState({\r\n showFrequentFlyer: !this.state.showFrequentFlyer,\r\n })\r\n }\r\n >\r\n +\r\n {\" \"}\r\n \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n {this.state.showSpecialRequest ? (\r\n \r\n \r\n this.setState({\r\n showSpecialRequest: !this.state.showSpecialRequest,\r\n })\r\n }\r\n >\r\n -\r\n {\" \"}\r\n \r\n \r\n ) : (\r\n \r\n \r\n this.setState({\r\n showSpecialRequest: !this.state.showSpecialRequest,\r\n })\r\n }\r\n >\r\n +\r\n {\" \"}\r\n \r\n \r\n )}\r\n \r\n \r\n
\r\n \r\n \r\n {this.state.showFrequentFlyer || this.state.showSpecialRequest ? (\r\n \r\n \r\n {this.state.showFrequentFlyer ? (\r\n \r\n \r\n
{Translation.t(\"frequent_flyer\")}
\r\n
{Translation.t(\"frequent_flyer_message\")}
\r\n
\r\n {this.props.searchRequest.itineraryParts.map(\r\n (itinerary, index) => {\r\n if (\r\n index !== 0 &&\r\n index !==\r\n this.props.searchRequest.itineraryParts.length\r\n ) {\r\n return (\r\n \r\n {itinerary.from.code} to {\" \"}{\" \"}\r\n {itinerary.to.code}\r\n \r\n );\r\n } else {\r\n return (\r\n \r\n {itinerary.from.code} to {\" \"}{\" \"}\r\n {itinerary.to.code} |{\" \"}\r\n \r\n );\r\n }\r\n }\r\n )}\r\n
\r\n
\r\n \r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"preferences\",\r\n \"frequentFlyerProgramme\"\r\n )\r\n }\r\n >\r\n
\r\n \r\n \r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n document.getElementById(\r\n \"frequent-flyer-number-\" + this.props.index\r\n ).value,\r\n \"preferences\",\r\n \"frequentFlyerNumber\"\r\n )\r\n }\r\n />\r\n
\r\n
\r\n ) : null}\r\n {this.state.showSpecialRequest ? (\r\n \r\n \r\n
{Translation.t(\"special_requests\")}
\r\n \r\n \r\n \r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"preferences\",\r\n \"specialRequests\"\r\n )\r\n }\r\n >\r\n
\r\n {this.state.showMealPreference && (\r\n \r\n \r\n this.props.updatePassengerMethod(\r\n this.props.index,\r\n value,\r\n \"preferences\",\r\n \"mealPreference\"\r\n )\r\n }\r\n >\r\n
\r\n )}\r\n
\r\n ) : null}\r\n \r\n \r\n ) : null}\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n return {\r\n searchRequest: state.searchFlight.searchRequest,\r\n passengerList: state.passenger.passengerList,\r\n firstName: state.account.createAccountModle.firstName,\r\n lastName: state.account.createAccountModle.lastName,\r\n isUserSignedIn: state.global.isUserSignedIn,\r\n userProfile: state.account.profile,\r\n profileCookie: state.account.profileCookie,\r\n token: state.searchFlight.token,\r\n departureDate: state.searchFlight.searchRequest.itineraryParts[0].when.date,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n changeSelectValidation: (index, domain, className) =>\r\n dispatch({\r\n type: passengerAction.CHANGEVALIDATION,\r\n index: index,\r\n domain: domain,\r\n className: className,\r\n }),\r\n enterAnotherPassenger: () =>\r\n dispatch({\r\n type: passengerAction.REMOVEFILLEDPASSENGERFORM,\r\n }),\r\n fillPassengerForm: (userProfile) =>\r\n dispatch({\r\n type: passengerAction.FILLPASSENGERFORM,\r\n userProfile: userProfile,\r\n }),\r\n iniliazeProfile: (data) =>\r\n dispatch({\r\n type: accountAction.INTIALZEPROFILE,\r\n data: data,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(PassengerInfo);\r\n","import React from \"react\";\r\nimport PassengerInfo from \"./PassengerInfo\";\r\nimport { connect } from \"react-redux\";\r\nimport { passengerAction } from \"../../../redux/actions/booking/passengerAction\";\r\nimport { Row, Col, Button, Modal } from \"react-bootstrap\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faArrowLeft, faTimes } from \"@fortawesome/free-solid-svg-icons\";\r\nimport PassengerService from \"../../../service/booking/passenger/PassengerService\";\r\nimport HttpService from \"../../../service/shared/HttpService\";\r\nimport Translation from \"i18next\";\r\nimport { Redirect } from \"react-router-dom\";\r\nimport BreadCrumb from \"../../shared/bread-crumb/BreadCrumb\";\r\nimport ShoppingCart from \"../../shared/shoppingCart/ShoppingCart\";\r\nimport { ancillaryAction } from \"../../../redux/actions/booking/ancillaryAction\";\r\nimport ProgressSimpler from \"../../shared/progress-simple/ProgressSimpler\";\r\n\r\nclass AllPassengerForm extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n backPage: false,\r\n isLoading: false,\r\n redirect: false,\r\n openErrorModal: false,\r\n errorMessage: [],\r\n };\r\n this.props.removeValidation();\r\n }\r\n rememberMe = () => {\r\n var rememberMe = document.getElementById(\"remember-me\");\r\n if (rememberMe.checked) {\r\n var savedPassengerProfiles = JSON.parse(\r\n localStorage.getItem(\"IBE_PassengerInfo\")\r\n );\r\n var passengerKey = this.props.passengerList[0].passengerDetails.firstName;\r\n var passengerInfo = this.props.passengerList[0];\r\n if (\r\n savedPassengerProfiles === null ||\r\n savedPassengerProfiles.length === 0\r\n ) {\r\n var newProfile = {};\r\n newProfile[passengerKey] = passengerInfo;\r\n localStorage.setItem(\"IBE_PassengerInfo\", JSON.stringify(newProfile));\r\n } else {\r\n savedPassengerProfiles[passengerKey] = passengerInfo;\r\n localStorage.setItem(\r\n \"IBE_PassengerInfo\",\r\n JSON.stringify(savedPassengerProfiles)\r\n );\r\n }\r\n } else {\r\n var savedPassengerProfiles = JSON.parse(\r\n localStorage.getItem(\"IBE_PassengerInfo\")\r\n );\r\n var passengerKey = this.props.passengerList[0].passengerDetails.firstName;\r\n if (\r\n savedPassengerProfiles !== null &&\r\n savedPassengerProfiles.length !== 0\r\n ) {\r\n if (savedPassengerProfiles.hasOwnProperty(passengerKey)) {\r\n delete savedPassengerProfiles[passengerKey];\r\n localStorage.setItem(\r\n \"IBE_PassengerInfo\",\r\n JSON.stringify(savedPassengerProfiles)\r\n );\r\n }\r\n }\r\n }\r\n };\r\n async continue() {\r\n await this.props.validatePassengerForm();\r\n if (this.props.isPassengerFormValid) {\r\n this.setState({ isLoading: true });\r\n var passengerService = new PassengerService();\r\n var dataForServer = await passengerService.passengerDataForApi(\r\n this.props.passengerList,\r\n this.props.searchFlight.selectionResult.cookieSabreDataRequest\r\n );\r\n this.rememberMe();\r\n HttpService.postService(\r\n dataForServer,\r\n \"/Passanger/AddPassangerInfo\",\r\n this.props.searchFlight.token\r\n )\r\n .then((passengerResponse) => {\r\n if (passengerResponse.data.statusAPI === \"SUCCESS\") {\r\n var getAncillariesRequest = {\r\n Flow: 0,\r\n cookieSabreDataRequest:\r\n this.props.searchFlight.selectionResult.cookieSabreDataRequest,\r\n };\r\n HttpService.ancillaryPostService(\r\n getAncillariesRequest,\r\n \"/Ancillary/GetAncillaries\",\r\n this.props.searchFlight.token\r\n )\r\n .then((ancillaryResponse) => {\r\n this.props.saveAncillaryDate(ancillaryResponse.data);\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n this.setState({ isLoading: false });\r\n });\r\n this.setState({ redirect: true });\r\n } else {\r\n this.setState({\r\n openErrorModal: true,\r\n isLoading: false,\r\n errorMessage: passengerResponse.data.errorList,\r\n });\r\n }\r\n })\r\n .catch((error) => {\r\n console.log(error);\r\n this.setState({ isLoading: false });\r\n });\r\n }\r\n }\r\n updatePassengerMethod = (\r\n index,\r\n value,\r\n objName,\r\n inputName,\r\n id,\r\n updateGender = false\r\n ) => {\r\n if (id !== null && id !== undefined && (value === null || value === \"\")) {\r\n var inputValue = document.getElementById(id);\r\n inputValue.classList.add(\"invalid_input\");\r\n if (id.includes(\"first-name\")) {\r\n inputValue.placeholder = Translation.t(\"first_name_required\");\r\n } else if (id.includes(\"last-name\")) {\r\n inputValue.placeholder = Translation.t(\"last_name_required\");\r\n }\r\n } else {\r\n if (id === \"passenger-0-first-name\") {\r\n var savedPassengerProfiles = JSON.parse(\r\n localStorage.getItem(\"IBE_PassengerInfo\")\r\n );\r\n if (savedPassengerProfiles !== null && !this.props.isRememberedTrue) {\r\n if (savedPassengerProfiles.hasOwnProperty(value)) {\r\n this.props.updateSavedProfile(savedPassengerProfiles[value]);\r\n document.getElementById(\"remember-me\").checked = true;\r\n return true;\r\n }\r\n }\r\n }\r\n this.props.updatePassengerInfo(\r\n index,\r\n value,\r\n objName,\r\n inputName,\r\n updateGender\r\n );\r\n }\r\n };\r\n onFocus = (id) => {\r\n var inputField = document.getElementById(id);\r\n inputField.classList.remove(\"invalid_input\");\r\n if (id.includes(\"first-name\")) {\r\n inputField.placeholder = Translation.t(\"first_name\");\r\n } else if (id.includes(\"last-name\")) {\r\n inputField.placeholder = Translation.t(\"last_name\");\r\n }\r\n };\r\n getHeaderText = (index) => {\r\n if (\r\n this.props.passengerList[index].passengerDetails.firstName !== null &&\r\n this.props.passengerList[index].passengerDetails.lastName !== null\r\n ) {\r\n return (\r\n this.props.passengerList[index].passengerDetails.firstName +\r\n \" \" +\r\n this.props.passengerList[index].passengerDetails.lastName\r\n );\r\n } else {\r\n var passengerIndex = this.props.passengerList[index].passengerIndex;\r\n return (\r\n Translation.t(this.props.passengerList[index].passengerInfo.type) +\r\n \" \" +\r\n passengerIndex\r\n );\r\n }\r\n };\r\n onKeyDownFunction = (e) => {\r\n var keynum;\r\n if (window.event) {\r\n keynum = e.keyCode;\r\n } else if (e.which) {\r\n keynum = e.which;\r\n }\r\n let isValid =\r\n (keynum <= 90 && keynum >= 65) ||\r\n keynum === 8 ||\r\n keynum === 9 ||\r\n keynum === 13 ||\r\n keynum === 32 ||\r\n keynum === 36 ||\r\n keynum === 37 ||\r\n keynum === 38 ||\r\n keynum === 39 ||\r\n keynum === 40;\r\n\r\n if (!isValid) {\r\n e.preventDefault();\r\n }\r\n };\r\n\r\n render() {\r\n if (this.state.backPage) {\r\n return (\r\n \r\n );\r\n }\r\n if (this.state.redirect) {\r\n return (\r\n \r\n );\r\n }\r\n return (\r\n <>\r\n {\r\n this.setState({ openErrorModal: false });\r\n }}\r\n >\r\n \r\n Error Message List\r\n \r\n \r\n \r\n - \r\n \r\n {this.state.errorMessage?.map((error) => error)}\r\n
\r\n
\r\n \r\n \r\n this.setState({ openErrorModal: false })}\r\n >\r\n {Translation.t(\"close\")}\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
Passenger Information
\r\n
\r\n Names must match the ones in your passport and can’t be\r\n changed once booking is completed.\r\n
\r\n
\r\n {this.props.isUserSignedIn && (\r\n
\r\n
\r\n
\r\n \r\n {this.props.firstName[0] + this.props.lastName[0]}\r\n \r\n
\r\n
\r\n
\r\n \r\n ShebaMiles Account
\r\n \r\n {this.props.firstName} {this.props.lastName}\r\n
\r\n {this.props.userName}
\r\n \r\n \r\n \r\n Balance
{\" \"}\r\n Total {this.props.currentAwardPoints} Miles
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n )}\r\n
\r\n {this.props.passengerList.map((passenger, index) => {\r\n try {\r\n return (\r\n
\r\n );\r\n } catch (error) {\r\n console.log(error);\r\n return <>;\r\n }\r\n })}\r\n
\r\n \r\n \r\n \r\n this.setState({ backPage: true })}\r\n >\r\n \r\n \r\n this.continue()}\r\n >\r\n {this.state.isLoading ? (\r\n \r\n ) : (\r\n Translation.t(\"continue\")\r\n )}\r\n \r\n \r\n \r\n
\r\n {/*
\r\n {this.props.isMobile && (\r\n \r\n this.setState({\r\n showShoppingCart: !this.state.showShoppingCart,\r\n })\r\n }\r\n >\r\n \r\n \r\n )}\r\n
*/}\r\n
\r\n {!this.props.isMedium && }\r\n
\r\n
\r\n \r\n );\r\n }\r\n}\r\nconst mapStateToProps = (state) => {\r\n return {\r\n passengerInfo: state.bookingWiget.passengerInfo,\r\n passengerList: state.passenger.passengerList,\r\n isPassengerFormValid: state.passenger.isFormValid,\r\n isRememberedTrue: state.passenger.isRememberedTrue,\r\n searchFlight: state.searchFlight,\r\n isMobile: state.global.isMobile,\r\n isMedium: state.global.isMedium,\r\n isUserSignedIn: state.global.isUserSignedIn,\r\n userName: state.account.createAccountModle.userName,\r\n firstName: state.account.firstName,\r\n lastName: state.account.lastName,\r\n currentAwardPoints: state.account.currentAwardPoints,\r\n };\r\n};\r\nconst mapDispatchToProps = (dispatch) => {\r\n return {\r\n validatePassengerForm: () =>\r\n dispatch({ type: passengerAction.SAVEPASSENGER }),\r\n removeValidation: () =>\r\n dispatch({ type: passengerAction.REMOVEVALIDATION }),\r\n updatePassengerInfo: (index, value, objName, inputName, updateGender) =>\r\n dispatch({\r\n type: passengerAction.UPDATEPASSENGERINFO,\r\n index: index,\r\n value: value,\r\n objName: objName,\r\n inputName: inputName,\r\n updateGender: updateGender,\r\n }),\r\n changeSelectValidation: (index, domain, className) =>\r\n dispatch({\r\n type: passengerAction.CHANGEVALIDATION,\r\n index: index,\r\n domain: domain,\r\n className: className,\r\n }),\r\n updateSavedProfile: (savedProfile) =>\r\n dispatch({\r\n type: passengerAction.UPDATESAVEDPROFILE,\r\n savedProfile: savedProfile,\r\n }),\r\n saveAncillaryDate: (responseData) =>\r\n dispatch({\r\n type: ancillaryAction.SAVEANCILLARYDATA,\r\n data: responseData,\r\n }),\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(AllPassengerForm);\r\n","import React, { Component } from \"react\";\r\nclass Payment3DApproved extends Component {\r\n render() {\r\n return (\r\n
Approved
\r\n );\r\n }\r\n}\r\nexport default Payment3DApproved;","import React, { Component } from \"react\";\r\nclass Payment3DCancel extends Component {\r\n render() {\r\n return (\r\n
Cancel
\r\n );\r\n }\r\n}\r\nexport default Payment3DCancel;","import React, { Component } from \"react\";\r\nclass Payment3DDecline extends Component {\r\n render() {\r\n return (\r\n
Decline
\r\n );\r\n }\r\n}\r\nexport default Payment3DDecline;","import React, { Component } from \"react\";\r\nclass Payment3DDefault extends Component {\r\n render() {\r\n return (\r\n
Default
\r\n );\r\n }\r\n}\r\nexport default Payment3DDefault;","import React, { Component } from \"react\";\r\nclass Payment3DError extends Component {\r\n render() {\r\n return (\r\n
Error
\r\n );\r\n }\r\n}\r\nexport default Payment3DError;","import React, { Component } from \"react\";\r\nclass Payment3DPending extends Component {\r\n render() {\r\n return (\r\n
Pending
\r\n );\r\n }\r\n}\r\nexport default Payment3DPending;","export class CreditCardRequestObj\r\n{\r\nconstructor()\r\n{\r\n this.requestObj ={\r\n \"paymentRequired\": true,\r\n \r\n \"payment\": [\r\n \r\n {\r\n \"@type\": \"CREDIT_CARD\",\r\n \"@id\": \"1\",\r\n \"amount\": {\r\n \"amount\": 2162,\r\n \"currency\": \"ETB\"\r\n },\r\n \"number\": \"4444333322221111\",\r\n \"cvc\": \"737\",\r\n \"pin\": null,\r\n \"holderName\": \"Fisha Javour\",\r\n \"expirationDate\": \"2030-03\",\r\n \"cardCode\": \"VI\",\r\n \"installment\": null,\r\n \"received3rdPartyData\": null,\r\n \"selectedDCCOffer\": null,\r\n \"redirectData\": {\r\n \"redirectUrlData\": {\r\n \"defaultURL\": \"http://localhost:19081/FlightBooking/WebPayment/LandingPage/Default\",\r\n \"pendingURL\": \"http://localhost:19081/FlightBooking/WebPayment/LandingPage/Pending\",\r\n \"approvedURL\": \"http://localhost:19081/FlightBooking/WebPayment/LandingPage/Approved\",\r\n \"declinedURL\": \"http://localhost:19081/FlightBooking/WebPayment/LandingPage/Declined\",\r\n \"errorURL\": \"http://localhost:19081/FlightBooking/WebPayment/LandingPage/Error\",\r\n \"cancelURL\": \"http://localhost:19081/FlightBooking/WebPayment/LandingPage/Cancel\"\r\n },\r\n \"paRes\": null,\r\n \"verificationResult\": null,\r\n \"transactionId\": null\r\n },\r\n \"redirectUrlData\": null,\r\n \"afopClientDetail\": null,\r\n \"fopCode\": null,\r\n \"fopSubcode\": null,\r\n \"cancelURL\": null,\r\n \"successURL\": null,\r\n \"payerId\": null,\r\n \"token\": null,\r\n \"status\": null\r\n }\r\n \r\n ],\r\n \r\n \"billingData\": {\r\n \"street1\": \"WASHINGTON\",\r\n \"street2\": null,\r\n \"city\": \"WASHINGTON DC\",\r\n \"province\": null,\r\n \"zipCode\": \"00098\",\r\n \"country\": \"GB\",\r\n \"phone\": {\r\n \"type\": \"WORK\",\r\n \"countryCode\": \"251\",\r\n \"areaCode\": null,\r\n \"number\": \"922215325\"\r\n },\r\n \"email\": \"accept@accept.com\"\r\n },\r\n \r\n \"languageForBooking\": null,\r\n \r\n \"fraudNetData\": {\r\n \"httpHeaders\":null,\r\n \"deviceFingerPrintId\":\"123456789\",\r\n \"timestamp\": \"2018-12-07\",\r\n \"ipAddress\":\"192.168.42.11\"\r\n },\r\n \r\n \"remarksAndSSRs\": null,\r\n \r\n \"profileInput\": null,\r\n \r\n \"queuePlacementData\": null,\r\n \r\n \"holdOptionId\": null,\r\n \r\n \"cookieSabreDataRequest\": null,\r\n \r\n \"TinNumber\": null,\r\n \r\n \"CompanyName\": null,\r\n \r\n \"Email\": null\r\n }\r\n}\r\n}","export class FloCashRequestObj {\r\n constructor() {\r\n this.requestObj = {\r\n \"Amount\": null,\r\n \"Currency\": null,\r\n \"Email\": null,\r\n \"Country\": null,\r\n \"FirstName\": null,\r\n \"LastName\": null,\r\n \"PhoneNumber\": {\r\n \"CountryCode\": null,\r\n \"Number\": null\r\n },\r\n \"PaymentID\": 0,\r\n \"cookieSabreDataRequest\": null\r\n }\r\n}\r\n }\r\n","export class UnionPayRequestObj\r\n{\r\nconstructor()\r\n{\r\n this.requestObj ={\r\n \"paymentRequired\": true,\r\n \"payment\": [\r\n {\r\n \"@type\": null,\r\n \"@id\": \"1\",\r\n \"amount\": {\r\n \"amount\": null,\r\n \"currency\":null\r\n },\r\n \"number\": null,\r\n \"cvc\": null,\r\n \"pin\": null,\r\n \"holderName\": null,\r\n \"expirationDate\": null,\r\n \"cardCode\": null,\r\n \"installment\": null,\r\n \"received3rdPartyData\": null,\r\n \"selectedDCCOffer\": null,\r\n \"redirectData\": null,\r\n \"redirectUrlData\": {\r\n \"defaultURL\": \"https://azuremobileapitest.ethiopianairlines.com:19081/Payment/WebPayment/LandingPage/Default\",\r\n \"pendingURL\": \"https://azuremobileapitest.ethiopianairlines.com:19081/Payment/WebPayment/LandingPage/Pending\",\r\n \"approvedURL\": \"https://azuremobileapitest.ethiopianairlines.com:19081/Payment/WebPayment/LandingPage/Approved\",\r\n \"declinedURL\": \"https://azuremobileapitest.ethiopianairlines.com:19081/Payment/WebPayment/LandingPage/Declined\",\r\n \"errorURL\": \"https://azuremobileapitest.ethiopianairlines.com:19081/Payment/WebPayment/LandingPage/Error\",\r\n \"cancelURL\": \"https://azuremobileapitest.ethiopianairlines.com:19081/Payment/WebPayment/LandingPage/Cancel\"\r\n },\r\n \"afopClientDetail\": {\r\n \"firstName\": null,\r\n \"lastName\": null,\r\n \"birthDate\": null,\r\n \"gender\": null,\r\n \"email\":null,\r\n \"street\": null,\r\n \"houseNumber\": null,\r\n \"postcode\": null,\r\n \"province\": null,\r\n \"city\": null,\r\n \"country\": null,\r\n \"issuer\": null\r\n },\r\n \"fopCode\": null,\r\n \"fopSubcode\": null,\r\n \"cancelURL\": null,\r\n \"successURL\": null,\r\n \"payerId\": null,\r\n \"token\": null,\r\n \"status\": null\r\n }\r\n ],\r\n \"billingData\": null,\r\n \"fraudNetData\": null,\r\n \"holdOptionId\": null,\r\n \"cookieSabreDataRequest\":null\r\n }\r\n}\r\n}","import Translation from \"i18next\";\r\nimport CreditCard from \"../../../component/booking/payment/payment-options/credit-card/CreditCard\"\r\nimport { CreditCardRequestObj } from \"../../../model/payment/CreditCardRequestObj\";\r\nimport { FloCashRequestObj } from \"../../../model/payment/FloCashRequestObj\";\r\nimport { UnionPayRequestObj } from \"../../../model/payment/UnionPayRequestObj\";\r\nexport class PaymentService\r\n{\r\n static getCountryList=(CountryList)=>{\r\n \r\n let countryListTemp = [];\r\n CountryList.forEach(country => {\r\n countryListTemp.push( { value: country.countryShortCode, label: country.countryName });\r\n });\r\n return countryListTemp;\r\n }\r\n static getCreditCardTypes(creditCardOptions)\r\n {\r\n \r\n let creditCardList =[];\r\n\r\n creditCardOptions.forEach(creditCard => {\r\n \r\n let creditCardOption = null;\r\n switch (creditCard.paymentInfo.paymentCode) {\r\n case \"DS\":\r\n creditCardOption = {\r\n value: creditCard.paymentInfo.paymentCode,\r\n label:Translation.t(\"discover\")\r\n };\r\n creditCardList.push(creditCardOption);\r\n break;\r\n case \"AX\":\r\n creditCardOption = {\r\n value: creditCard.paymentInfo.paymentCode,\r\n label: Translation.t(\"american_express\")\r\n };\r\n creditCardList.push(creditCardOption);\r\n break;\r\n case \"DC\":\r\n creditCardOption = {\r\n value: creditCard.paymentInfo.paymentCode,\r\n label: Translation.t(\"dinners_club\")\r\n };\r\n creditCardList.push(creditCardOption);\r\n break;\r\n case \"MA\":\r\n creditCardOption = {\r\n value: creditCard.paymentInfo.paymentCode,\r\n label: Translation.t(\"maestro\")\r\n };\r\n creditCardList.push(creditCardOption);\r\n break;\r\n case \"VI\":\r\n creditCardOption = {\r\n value: creditCard.paymentInfo.paymentCode,\r\n label: Translation.t(\"visa\")\r\n };\r\n creditCardList.push(creditCardOption);\r\n break;\r\n case \"CA\":\r\n creditCardOption = {\r\n value: creditCard.paymentInfo.paymentCode,\r\n label: Translation.t(\"master_card\")\r\n };\r\n creditCardList.push(creditCardOption);\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n \r\n });\r\n \r\n return creditCardList;\r\n }\r\n static mapToRequestObject(creditCardInfo)\r\n {\r\n \r\n let creditCardRequestObject = new CreditCardRequestObj();\r\n creditCardRequestObject.requestObj.payment[0].amount.amount = creditCardInfo.Amount;\r\n creditCardRequestObject.requestObj.payment[0].amount.currency = creditCardInfo.Currency;\r\n creditCardRequestObject.requestObj.payment[0].number = creditCardInfo.CreditCardNumber;\r\n creditCardRequestObject.requestObj.payment[0].cvc = creditCardInfo._CVC;\r\n creditCardRequestObject.requestObj.payment[0].holderName = creditCardInfo.FullName;\r\n creditCardRequestObject.requestObj.payment[0].expirationDate = creditCardInfo.ExpireYear + \"-\"+creditCardInfo.ExpireMonth;\r\n creditCardRequestObject.requestObj.payment[0].cardCode = creditCardInfo.CreditCardType;\r\n creditCardRequestObject.requestObj.billingData.street1 = creditCardInfo.BillingAddess;\r\n creditCardRequestObject.requestObj.billingData.street2 = creditCardInfo.Address;\r\n creditCardRequestObject.requestObj.billingData.city = creditCardInfo.City;\r\n creditCardRequestObject.requestObj.billingData.zipCode = creditCardInfo.PostalCode;\r\n creditCardRequestObject.requestObj.billingData.country = creditCardInfo.Country;\r\n creditCardRequestObject.requestObj.billingData.phone.countryCode = creditCardInfo.PhoneCountryCode;\r\n creditCardRequestObject.requestObj.billingData.phone.number = creditCardInfo.PhoneNumber.substring(creditCardInfo.PhoneCountryCode.length);\r\n creditCardRequestObject.requestObj.billingData.email = creditCardInfo.Email;\r\n return creditCardRequestObject.requestObj;\r\n }\r\n static mapToUnionPayRequestObject(unionPayInfo)\r\n {\r\n \r\n let unionPayRequestObject = new UnionPayRequestObj();\r\n unionPayRequestObject.requestObj.payment[0][\"@type\"]=\"AFOP\";\r\n unionPayRequestObject.requestObj.payment[0].amount.amount = unionPayInfo.Amount;\r\n unionPayRequestObject.requestObj.payment[0].amount.currency = unionPayInfo.Currency;\r\n unionPayRequestObject.requestObj.payment[0].fopCode = unionPayInfo.FopCode;\r\n unionPayRequestObject.requestObj.payment[0].fopSubcode = unionPayInfo.FopSubCode;\r\n unionPayRequestObject.requestObj.payment[0].afopClientDetail.email = unionPayInfo.Email;\r\n unionPayRequestObject.requestObj.payment[0].afopClientDetail.country = unionPayInfo.Country;\r\n\r\n return unionPayRequestObject.requestObj;\r\n }\r\n static mapToFlocashRequestObject(floCashInfo)\r\n {\r\n let floCashRequestObject = new FloCashRequestObj();\r\n floCashRequestObject.requestObj.Amount = floCashInfo.Amount;\r\n floCashRequestObject.requestObj.Currency = floCashInfo.Currency;\r\n floCashRequestObject.requestObj.Email = floCashInfo.Email;\r\n floCashRequestObject.requestObj.Country = floCashInfo.Country;\r\n floCashRequestObject.requestObj.FirstName = floCashInfo.FirstName;\r\n floCashRequestObject.requestObj.LastName = floCashInfo.LastName;\r\n floCashRequestObject.requestObj.PhoneNumber.CountryCode = floCashInfo.PhoneCountryCode;\r\n floCashRequestObject.requestObj.PhoneNumber.Number = floCashInfo.PhoneNumber.substring(floCashInfo.PhoneCountryCode.length);;\r\n floCashRequestObject.requestObj.PaymentID = floCashInfo.PaymentID;\r\n return floCashRequestObject.requestObj;\r\n }\r\n}","import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport React, { Component } from 'react';\r\nimport Translation from \"i18next\";\r\nimport { Col, Row } from 'react-bootstrap';\r\nclass CreditCardHeader extends Component\r\n{\r\n\r\n render()\r\n {\r\n return(\r\n
{Translation.t(\"credit_card\")}
\r\n
{Translation.t(\"surcharge_apply_for\")}
\r\n
\r\n {this.props.creditCardOptions.map((creditCardOption) => creditCardOption.paymentInfo.afopDetails != null && )}\r\n \r\n \r\n \r\n\r\n
\r\n
\r\n \r\n {Translation.t(\"fraud_card_warning\")} \r\n
\r\n
\r\n {Translation.t(\"credit_card_form_required_remark\")}\r\n
\r\n
\r\n
\r\n
{Translation.t(\"complete_payment\")}
\r\n \r\n
\r\n {Translation.t(\"payment_terms_and_condition\")}\r\n
\r\n
\r\n
\r\n \r\n {Translation.t(\"continue\")}\r\n \r\n
\r\n
\r\n {this.state.isLoading ?
: null}\r\n
\r\n
\r\n
\r\n
{Translation.t(\"select_payment_form\")}
\r\n \r\n
\r\n \r\n \r\n this.setSelectedPaymentOption(\"HR\")}\r\n >\r\n \r\n {Translation.t(\"hold_reservation\")}
\r\n
{Translation.t(\"travel_bank\")}
\r\n \r\n \r\n }\r\n {this.props.paymentInfo.creditCardOptions.length > 0 && (\r\n \r\n this.setSelectedPaymentOption(\"CC\")}\r\n >\r\n \r\n {Translation.t(\"credit_card\")}
\r\n \r\n \r\n )}\r\n\r\n {this.props.paymentInfo.flocashOptions.length > 0 && (\r\n \r\n this.setSelectedPaymentOption(\"AFOP\")}\r\n >\r\n \r\n {Translation.t(\"flocash\")}
\r\n \r\n \r\n )}\r\n {this.props.paymentInfo.unionPay != null && (\r\n \r\n this.setSelectedPaymentOption(\"UP\")}\r\n >\r\n \r\n \r\n {this.props.paymentInfo.unionPay.paymentName}\r\n
\r\n \r\n \r\n )}\r\n \r\n \r\n );\r\n }\r\n}\r\nexport default PaymentOption;\r\n","export class TravelBankProfile {\r\n constructor()\r\n {\r\n this.MembershipNumber=null;\r\n this.Password=null;\r\n }\r\n}","\r\n\r\nexport class TravelBankValidatorService\r\n{\r\n constructor()\r\n {\r\n this.isMembershipNumberValid=true;\r\n this.isPasswordValid=true;\r\n this.travelBankValidLists =[];\r\n }\r\n\r\n validateTravelBankInfo(travelBankProfile)\r\n {\r\n this.travelBankValidLists =[];\r\n for(let index =0;index<2;index++)\r\n {\r\n this.travelBankValidLists.push(true);\r\n }\r\n \r\n this.isMembershipNumberValid=this.validateTravelBankType(travelBankProfile.MembershipNumber,0);\r\n this.isPasswordValid=this.validateTravelBankType(travelBankProfile.Password,1);\r\n\r\n return {\"travelBankValidation\":this,\"travelBankValidLists\": this.travelBankValidLists};\r\n }\r\n validateTravelBankType(type,index)\r\n {\r\n if(type === \"\" || type == null)\r\n {\r\n this.travelBankValidLists[index]=false;\r\n return false;\r\n }\r\n else\r\n {\r\n this.travelBankValidLists[index]=true;\r\n return true;\r\n }\r\n }\r\n\r\n}","export class TravelBankSignInRequestObj{\r\n constructor()\r\n {\r\n this.requestObj={\r\n \"userId\": null,\r\n \"password\": null,\r\n \"cookieSabreDataRequest\": null\r\n }\r\n }\r\n}","export class TravelBankRequestObj\r\n{\r\n constructor()\r\n {\r\n this.requestObj={\r\n \"payment\": [\r\n {\r\n \"@type\": \"TRAVEL_BANK\",\r\n \"amount\": {\r\n \"amount\": null,\r\n \"currency\": null\r\n },\r\n \"paymentCode\": \"BT\"\r\n }\r\n ],\r\n \"paymentRequired\": false,\r\n \"cookieSabreDataRequest\": null\r\n }\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { Button, Col, Form, Row } from 'react-bootstrap';\r\nimport Translation from \"i18next\";\r\nimport { connect } from \"react-redux\";\r\nimport { TravelBankProfile } from '../../../../../model/payment/TravelBankInfo';\r\nimport SubmitPayment from '../../SubmitPayment';\r\nimport { TravelBankValidatorService } from \"../../../../../service/booking/payment/TravelBankValidatorService\";\r\nimport HttpService from '../../../../../service/shared/HttpService';\r\nimport { TravelBankSignInRequestObj } from '../../../../../model/payment/TravelBankSignInRequestObj';\r\nimport ProgressSimpler from '../../../../shared/progress-simple/ProgressSimpler';\r\nimport { TravelBankRequestObj } from '../../../../../model/payment/TravelBankRequestObj';\r\n\r\nclass TravelBank extends Component\r\n{\r\n constructor(props)\r\n {\r\n super(props);\r\n this.state={\r\n isLoading:false,\r\n isTravelBankSignInRequestValid:false,\r\n travelBankAPIresponse:null,\r\n travelBankProfileState : new TravelBankProfile(),\r\n travelBankValidatorState : new TravelBankValidatorService()\r\n }\r\n this.travelBankProfile = new TravelBankProfile();\r\n this.travelBankValidatorService = new TravelBankValidatorService();\r\n this.travelRequestObj=new TravelBankRequestObj();\r\n }\r\n onInputKeyDown=(travelBankValidator)=>\r\n {\r\n \r\n this.setState({travelBankValidatorState:travelBankValidator});\r\n }\r\n submitTravelBank =(event)=>{\r\n event.preventDefault();\r\n \r\n let travelBankSignInRequestObj = new TravelBankSignInRequestObj();\r\n travelBankSignInRequestObj.requestObj.userId =this.travelBankProfile.MembershipNumber;\r\n travelBankSignInRequestObj.requestObj.password =this.travelBankProfile.Password;\r\n travelBankSignInRequestObj.requestObj.cookieSabreDataRequest =this.props.searchFlight.searchResult.data.cookieSabreDataRequest;\r\n this.setState({travelBankValidatorState:this.state.travelBankValidatorState.validateTravelBankInfo(this.travelBankProfile).travelBankValidation});\r\n this.travelBankValidatorService = this.state.travelBankValidatorState.validateTravelBankInfo(this.travelBankProfile).travelBankValidation;\r\n let travelBankValidLists =this.state.travelBankValidatorState.validateTravelBankInfo(this.travelBankProfile).travelBankValidLists;\r\n let isTravelBankInfoValid = !travelBankValidLists.includes(false);\r\n if(isTravelBankInfoValid)\r\n {\r\n this.setState({ isLoading: true });\r\n HttpService.postService(\r\n travelBankSignInRequestObj.requestObj,\r\n \"/PaymentOption/GetTravelBankPaymentOption\",\r\n this.props.searchFlight.token\r\n ).then((response) => {\r\n \r\n this.setState({ isLoading: false,travelBankAPIresponse:response.data});//availableAmountForTrip\r\n \r\n });\r\n }\r\n }\r\n handleSubmit = (event) => {\r\n event.preventDefault();\r\n this.travelRequestObj.requestObj.payment[0].amount.amount =this.state.travelBankAPIresponse.availableAmountForTrip.amount;\r\n this.travelRequestObj.requestObj.payment[0].amount.currency =this.state.travelBankAPIresponse.availableAmountForTrip.currency;\r\n this.travelRequestObj.requestObj.cookieSabreDataRequest = this.props.searchFlight.searchResult.data.cookieSabreDataRequest;\r\n\r\n \r\n this.setState({ isLoading: true });\r\n HttpService.postService(\r\n this.travelRequestObj.requestObj,\r\n \"/Purchase/Purchase\",\r\n this.props.searchFlight.token\r\n ).then((response) => {\r\n \r\n this.setState({ isLoading: false});\r\n \r\n });\r\n \r\n };\r\n render()\r\n {\r\n if (this.state.isLoading) {\r\n return (\r\n \r\n );\r\n }\r\n return(\r\n
\r\n
\r\n {Translation.t(\"travel_bank\")}\r\n
\r\n
\r\n {Translation.t(\"travel_bank_remark\")}\r\n\r\n
\r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n { this.state.isLoading ?
: null}\r\n
\r\n
\r\n {Translation.t(\"select_bank\")} \r\n
\r\n \r\n \r\n
\r\n {\r\n this.props.flocashOptions.map((afop,index)=>\r\n \r\n this.onBankSelected(index, afop.fopSubCode)}>\r\n
\r\n
{afop.paymentName}
\r\n
\r\n {this.state.showPaymentForm &&\r\n
\r\n
\r\n
\r\n {Translation.t(\"flo_cash\")}\r\n
\r\n
\r\n {Translation.t(\"flo_cash_required_fields_remark\")}\r\n
\r\n
\r\n
\r\n
\r\n }\r\n
\r\n
\r\n \r\n \r\n Union Pay\r\n \r\n
\r\n
{Translation.t(\"union_pay_redirect_remark\")}
\r\n
\r\n
\r\n {this.state.isLoading?
:null}\r\n
\r\n
{Translation.t(\"pay_at_airport_title\")}
\r\n
\r\n {Translation.t(\"pay_at_airport_info\")}\r\n
\r\n
\r\n {Translation.t(\"pay_at_airport_note\")} {Translation.t(\"pay_at_airport_remark\")}\r\n
\r\n
\r\n
\r\n
\r\n {this.state.isLoading ? (\r\n
\r\n ) : (\r\n
\r\n )}\r\n {this.renderPaymentOption()}\r\n
);\r\n }\r\n}\r\nexport default CreditCardRedirect;","import React, { Component } from 'react';\r\nimport parse from 'html-react-parser';\r\n\r\nimport $ from 'jquery';\r\nimport Loading from '../../../seat-selection/Loading';\r\n\r\nclass FloCashRedirect extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n htmlResponse :null\r\n }\r\n }\r\n componentDidMount() {\r\n \r\n let redirectPath = this.props.location.state.redirectToPath;\r\n redirectPath.replace(\"><\", \">\\n<\");\r\n let firstIndex = redirectPath.indexOf(\"body\");\r\n let lastIndex = redirectPath.indexOf(\"