@kiwicom/smart-faq
Version:
Smart FAQ
326 lines (262 loc) • 13.3 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.RawBookingDetail = void 0;
var _style = _interopRequireDefault(require("styled-jsx/style"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _idx = _interopRequireDefault(require("idx"));
var React = _interopRequireWildcard(require("react"));
var _luxon = require("luxon");
var _reactRelay = require("react-relay");
var _reactRouterDom = require("react-router-dom");
var _styledComponents = require("styled-components");
var _Insurance = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/Insurance"));
var _Ticket = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/Ticket"));
var _BaggageChecked = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/BaggageChecked"));
var _Text = _interopRequireDefault(require("@kiwicom/nitro/lib/components/Text"));
var _Stack = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Stack"));
var _TextLink = _interopRequireDefault(require("@kiwicom/orbit-components/lib/TextLink"));
var _ButtonLink = _interopRequireDefault(require("@kiwicom/orbit-components/lib/ButtonLink"));
var _utils = require("../common/booking/utils");
var _OneWayTrip = _interopRequireDefault(require("./bookingTypes/OneWayTrip"));
var _ReturnTrip = _interopRequireDefault(require("./bookingTypes/ReturnTrip"));
var _MulticityOverlayTrip = _interopRequireDefault(require("./bookingTypes/MulticityOverlayTrip"));
var _Contact = _interopRequireDefault(require("./bookingItem/Contact"));
var _Notification = _interopRequireDefault(require("./bookingItem/Notification"));
var _Header = _interopRequireDefault(require("./bookingItem/Header"));
var _trackers = require("../../shared/helpers/analytics/trackers");
var _index = require("../common/index");
var _bookingTypes = _interopRequireDefault(require("../common/booking/bookingTypes"));
var _dateUtils = require("../helpers/dateUtils");
var _UrlHelpers = require("../helpers/UrlHelpers");
var _FAQExtraInfoButton = _interopRequireDefault(require("../StaticFAQ/FAQExtraInfo/FAQExtraInfoButton"));
var _BookingState = require("../context/BookingState");
var _featureToggles = _interopRequireDefault(require("../../feature-toggles.json"));
var _tracker = require("../../shared/cuckoo/tracker");
// @flow
var goToMMB = function goToMMB() {
(0, _trackers.simpleTracker)('smartFAQBookingOverview', {
action: 'goToMMB'
});
(0, _tracker.track)('Booking overview', 'goToMMB');
};
var clickEticket = function clickEticket() {
(0, _trackers.simpleTracker)('smartFAQBookingOverview', {
action: 'clickOnEticket'
});
(0, _tracker.track)('Booking overview', 'clickOnEticket');
};
var addInsurance = function addInsurance() {
(0, _trackers.simpleTracker)('smartFAQBookingOverview', {
action: 'addInsurance'
});
(0, _tracker.track)('Booking overview', 'addInsurance');
};
var BookingDetail =
/*#__PURE__*/
function (_React$Component) {
(0, _inherits2.default)(BookingDetail, _React$Component);
function BookingDetail() {
var _getPrototypeOf2;
var _this;
(0, _classCallCheck2.default)(this, BookingDetail);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(BookingDetail)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "renderByType", function (booking
/*: NearestBooking_booking*/
) {
if (booking.type === _bookingTypes.default.ONE_WAY) {
return React.createElement(_OneWayTrip.default, {
booking: booking
});
}
if (booking.type === _bookingTypes.default.RETURN) {
return React.createElement(_ReturnTrip.default, {
booking: booking
});
}
if (booking.type === _bookingTypes.default.MULTICITY) {
return React.createElement(_MulticityOverlayTrip.default, {
booking: booking
});
}
return null;
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "getArrivalByType", function (booking
/*: NearestBooking_booking*/
) {
var date = null;
if (booking.type === _bookingTypes.default.ONE_WAY) {
date = (0, _idx.default)(booking, function (_) {
return _.trip.arrival.time;
});
}
if (booking.type === _bookingTypes.default.RETURN) {
date = (0, _idx.default)(booking, function (_) {
return _.inbound.arrival.time;
});
}
if (booking.type === _bookingTypes.default.MULTICITY) {
date = (0, _idx.default)(booking, function (_) {
return _.end.time;
});
}
return date ? new Date(date) : null;
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "decideIfIsFutureAndUrgent", function (time
/*: ?Date*/
) {
var timeDelta = time ? _luxon.DateTime.fromJSDate(time, {
zone: 'utc'
}).diffNow('hours').hours : null;
var isUrgent = timeDelta !== null && _dateUtils.URGENCY_THRESHOLD > timeDelta && timeDelta >= 0;
return {
timeDelta: timeDelta,
isFuture: timeDelta !== null && timeDelta > 0,
isUrgent: isUrgent
};
});
return _this;
}
(0, _createClass2.default)(BookingDetail, [{
key: "componentDidMount",
value: function componentDidMount() {
(0, _utils.updateFAQSection)(this.props);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
(0, _utils.updateFAQSection)(this.props);
}
}, {
key: "render",
value: function render() {
var _this$props = this.props,
booking = _this$props.booking,
theme = _this$props.theme;
var eTicketLink = (0, _idx.default)(booking, function (_) {
return _.assets.ticketUrl;
});
var departureTime = (0, _utils.getDepartureTimeByType)(booking);
var arrivalTime = this.getArrivalByType(booking);
var departureInfo = this.decideIfIsFutureAndUrgent(departureTime);
var arrivalInfo = this.decideIfIsFutureAndUrgent(arrivalTime);
var timeDelta = departureInfo.timeDelta,
isFuture = departureInfo.isFuture;
var isUrgent = (0, _utils.isUrgentBooking)(booking.isPastBooking, departureTime);
var isInsuranceAvailable = Boolean(((0, _idx.default)(booking, function (_) {
return _.availableServices.insurance.passengers;
}) || []).length);
return React.createElement(_index.ScrollableContent, {
dataCy: "nearestBooking",
styles: "width: 100%; padding:40px; background-color: #ffffff; box-shadow: inset -1px 0 0 0 #e8edf1;"
}, React.createElement("div", {
"data-test": arrivalInfo.isFuture ? 'upcoming' : 'past',
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]])
}, React.createElement(_Header.default, {
booking: booking,
isFuture: arrivalInfo.isFuture
})), _featureToggles.default.notification && isFuture && booking.status === 'CONFIRMED' && timeDelta && React.createElement(_Notification.default, {
hoursLeft: timeDelta,
isUrgent: isUrgent
}), React.createElement(_Stack.default, {
direction: "row",
wrap: true,
spaceAfter: "normal"
}, _featureToggles.default.baggage_info && React.createElement(_FAQExtraInfoButton.default, {
category: "baggage",
icon: React.createElement(_BaggageChecked.default, {
customColor: theme.orbit.paletteProductNormal
})
}, React.createElement("p", {
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]]) + " " + "iconLabel"
}, React.createElement(_Text.default, {
t: "smartfaq.single_booking_page.booking_detail.baggage"
}))), React.createElement(_FAQExtraInfoButton.default, {
category: "boarding-passes",
icon: React.createElement(_Ticket.default, {
customColor: theme.orbit.paletteProductNormal
})
}, React.createElement("p", {
"data-cy": "btn-boarding-passes",
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]]) + " " + "iconLabel"
}, React.createElement(_Text.default, {
t: "smartfaq.single_booking_page.booking_detail.boarding_passes"
}))), isInsuranceAvailable && React.createElement(_ButtonLink.default, {
onClick: addInsurance,
type: "secondary",
external: true,
iconLeft: React.createElement(_Insurance.default, {
customColor: theme.orbit.paletteProductNormal
}),
href: (0, _UrlHelpers.replaceWithCurrentDomain)((0, _UrlHelpers.addDeepLink)(booking.directAccessURL, 'insurance'))
}, React.createElement("p", {
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]]) + " " + "iconLabel"
}, React.createElement(_Text.default, {
t: "smartfaq.single_booking_page.booking_detail.insurance"
})))), this.renderByType(booking), React.createElement("div", {
"data-cy": "btn-manage-booking",
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]]) + " " + "buttons"
}, React.createElement("a", {
target: "_blank",
rel: "noopener noreferrer",
href: (0, _UrlHelpers.replaceWithCurrentDomain)(booking.directAccessURL),
onClick: goToMMB,
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]])
}, React.createElement("button", {
className: _style.default.dynamic([["2127585070", [theme.orbit.paletteProductNormal]]]) + " " + "manage-booking"
}, React.createElement(_Text.default, {
t: "smartfaq.single_booking_page.booking_detail.manage_my_booking"
})))), eTicketLink && React.createElement(_TextLink.default, {
href: eTicketLink,
type: "secondary",
external: true,
onClick: clickEticket
}, React.createElement(_Text.default, {
t: "smartfaq.single_booking_page.booking_detail.download_e_ticket"
})), isUrgent && React.createElement(_Contact.default, {
booking: booking,
dataTest: "contact"
}), React.createElement(_style.default, {
styleId: "2127585070",
css: ".buttons.__jsx-style-dynamic-selector{margin-top:24px;margin-bottom:20px;}.manage-booking.__jsx-style-dynamic-selector{font-weight:bold;font-size:14px;min-width:260px;height:44px;padding:12px 42px;border-radius:3px;background-color:#e8edf1;border:none;color:#46515e;cursor:pointer;}p.iconLabel.__jsx-style-dynamic-selector{display:inline-block;height:20px;font-size:14px;font-weight:500;line-height:1.43;color:".concat(theme.orbit.paletteProductNormal, ";margin-left:8px;vertical-align:middle;}"),
dynamic: [theme.orbit.paletteProductNormal]
}));
}
}]);
return BookingDetail;
}(React.Component);
var RawBookingDetail = BookingDetail;
exports.RawBookingDetail = RawBookingDetail;
var BookingDetailWithFAQHandler = function BookingDetailWithFAQHandler(props
/*: ComponentProps*/
) {
return React.createElement(_BookingState.BookingState.Consumer, null, function (_ref) {
var onSetFAQSection = _ref.onSetFAQSection;
return React.createElement(BookingDetail, (0, _extends2.default)({}, props, {
onSetFAQSection: onSetFAQSection
}));
});
};
var _default = (0, _reactRelay.createFragmentContainer)((0, _reactRouterDom.withRouter)((0, _styledComponents.withTheme)(BookingDetailWithFAQHandler)), {
booking: function booking() {
var node = require("./__generated__/BookingDetail_booking.graphql");
if (node.hash && node.hash !== "7ab65c39e541fd2ccc1eadaf66e592fd") {
console.error("The definition of 'BookingDetail_booking' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data.");
}
return require("./__generated__/BookingDetail_booking.graphql");
}
});
exports.default = _default;