@kiwicom/smart-faq
Version:
275 lines (227 loc) • 11.1 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 = 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 React = _interopRequireWildcard(require("react"));
var _reactRelay = require("react-relay");
var _icons = require("@kiwicom/orbit-components/lib/icons");
var _Button = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Button"));
var _utils = require("../common/booking/utils");
var _bookingTypes = _interopRequireDefault(require("../common/booking/bookingTypes"));
var _BookingState = require("../context/BookingState");
var _OneWayTrip = _interopRequireDefault(require("./OneWayTrip"));
var _ReturnTrip = _interopRequireDefault(require("./ReturnTrip"));
var _MultiCityTrip = _interopRequireDefault(require("./MultiCityTrip"));
var _formatBookingId = _interopRequireDefault(require("../helpers/formatBookingId"));
var _replaceWithCurrentDomain = _interopRequireDefault(require("../helpers/replaceWithCurrentDomain"));
var _Responsive = require("../common/Responsive");
var _SelectAnotherBookingLink = _interopRequireDefault(require("../common/booking/SelectAnotherBookingLink"));
// @flow
var TripId = function TripId(props
/*: TripIdProps*/
) {
return props.databaseId && React.createElement("div", {
className: "jsx-3519835792" + " " + "TripId"
}, React.createElement("span", {
className: "jsx-3519835792"
}, "".concat(props.isPastBooking ? 'Past' : 'Upcoming', " trip # ").concat((0, _formatBookingId.default)(props.databaseId))), React.createElement(_style.default, {
styleId: "3519835792",
css: ".TripId.jsx-3519835792{font-size:14px;line-height:1.4;color:#7f91a8;margin-top:8px;}"
}));
};
/*:: type ManageMyBookingButtonProps = {|
+manageBookingURL: ?string,
|};*/
var ManageMyBookingButton = function ManageMyBookingButton(props
/*: ManageMyBookingButtonProps*/
) {
return React.createElement("div", {
className: "jsx-930188553" + " " + "manageBookingButton"
}, React.createElement(_Button.default, {
block: true,
onClick: function onClick() {
if (typeof window !== 'undefined') {
window.open(props.manageBookingURL, '_blank', 'noopener');
}
},
type: "secondary",
size: "small"
}, "Manage My Booking"), React.createElement(_style.default, {
styleId: "930188553",
css: ".manageBookingButton.jsx-930188553{height:32px;margin:4px 0;margin-bottom:8px;display:block;-webkit-text-decoration:none;text-decoration:none;}"
}));
};
var MobileBookingControls = function MobileBookingControls(props
/*: MobileBookingControlsProps*/
) {
return React.createElement(React.Fragment, null, React.createElement(ManageMyBookingButton, {
manageBookingURL: props.manageBookingURL
}), React.createElement(_SelectAnotherBookingLink.default, null));
};
var MobileBookingSummaryStyle = new String(".topRow{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}.topRow:focus{outline:0;}.Chevron{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:space-around;-webkit-justify-content:space-around;-ms-flex-pack:space-around;justify-content:space-around;cursor:pointer;}");
MobileBookingSummaryStyle.__hash = "4008135546";
MobileBookingSummaryStyle.__scoped = ".topRow.jsx-2529371835{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}.topRow.jsx-2529371835:focus{outline:0;}.Chevron.jsx-2529371835{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:space-around;-webkit-justify-content:space-around;-ms-flex-pack:space-around;justify-content:space-around;cursor:pointer;}";
MobileBookingSummaryStyle.__scopedHash = "2529371835";
/*:: type State = {
expanded: boolean,
};*/
var renderByType = function renderByType(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(_MultiCityTrip.default, {
booking: booking
});
}
return null;
};
var MobileBookingDetail =
/*#__PURE__*/
function (_React$Component) {
(0, _inherits2.default)(MobileBookingDetail, _React$Component);
function MobileBookingDetail() {
var _getPrototypeOf2;
var _this;
(0, _classCallCheck2.default)(this, MobileBookingDetail);
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)(MobileBookingDetail)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
expanded: true
});
return _this;
}
(0, _createClass2.default)(MobileBookingDetail, [{
key: "componentDidMount",
value: function componentDidMount() {
(0, _utils.updateFAQSection)(this.props);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
(0, _utils.updateFAQSection)(this.props);
}
}, {
key: "toggle",
value: function toggle() {
this.setState(function (prevState) {
return {
expanded: !prevState.expanded
};
});
}
}, {
key: "renderPortrait",
value: function renderPortrait() {
var _this2 = this;
var booking = this.props.booking;
var isPastBooking = booking.isPastBooking,
databaseId = booking.databaseId;
return React.createElement(React.Fragment, null, React.createElement("div", {
onClick: function onClick() {
return _this2.toggle();
},
onKeyDown: function onKeyDown() {
return _this2.toggle();
},
role: "button",
tabIndex: "0",
className: "jsx-".concat(MobileBookingSummaryStyle.__scopedHash) + " " + "topRow"
}, React.createElement("div", {
style: {
flexGrow: 1
},
className: "jsx-".concat(MobileBookingSummaryStyle.__scopedHash)
}, React.createElement(TripId, {
databaseId: databaseId,
isPastBooking: isPastBooking
}), renderByType(booking)), React.createElement("div", {
className: "jsx-".concat(MobileBookingSummaryStyle.__scopedHash) + " " + "Chevron"
}, this.state.expanded ? React.createElement(_icons.ChevronUp, {
customColor: "#bac7d5"
}) : React.createElement(_icons.ChevronDown, {
customColor: "#bac7d5"
}))), this.state.expanded ? React.createElement("div", {
className: "jsx-".concat(MobileBookingSummaryStyle.__scopedHash) + " " + "bottomRow"
}, React.createElement(MobileBookingControls, {
manageBookingURL: booking.directAccessURL && (0, _replaceWithCurrentDomain.default)(booking.directAccessURL)
})) : null, React.createElement(_style.default, {
styleId: MobileBookingSummaryStyle.__scopedHash,
css: MobileBookingSummaryStyle.__scoped
}));
}
}, {
key: "renderLandscape",
value: function renderLandscape() {
var booking = this.props.booking;
var isPastBooking = booking.isPastBooking,
databaseId = booking.databaseId;
return React.createElement("div", {
className: "jsx-2474403434"
}, React.createElement("div", {
className: "jsx-2474403434" + " " + "flexToolbar"
}, React.createElement("div", {
className: "jsx-2474403434"
}, React.createElement(TripId, {
databaseId: databaseId,
isPastBooking: isPastBooking
}), renderByType(booking)), React.createElement("div", {
className: "jsx-2474403434"
}, React.createElement(_SelectAnotherBookingLink.default, null))), React.createElement("div", {
className: "jsx-2474403434" + " " + "centered"
}, React.createElement(ManageMyBookingButton, {
manageBookingURL: booking.directAccessURL && (0, _replaceWithCurrentDomain.default)(booking.directAccessURL)
})), React.createElement(_style.default, {
styleId: "2474403434",
css: ".centered.jsx-2474403434{max-width:288px;margin:auto;}.flexToolbar.jsx-2474403434{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}"
}));
}
}, {
key: "render",
value: function render() {
return React.createElement(React.Fragment, null, React.createElement(_Responsive.Portrait, null, this.renderPortrait()), React.createElement(_Responsive.Landscape, null, this.renderLandscape()));
}
}]);
return MobileBookingDetail;
}(React.Component);
var MobileBookingDetailWithFAQHandler = function MobileBookingDetailWithFAQHandler(props
/*: ComponentProps*/
) {
return React.createElement(_BookingState.BookingState.Consumer, null, function (_ref) {
var onSetFAQSection = _ref.onSetFAQSection;
return React.createElement(MobileBookingDetail, (0, _extends2.default)({}, props, {
onSetFAQSection: onSetFAQSection
}));
});
};
var _default = (0, _reactRelay.createFragmentContainer)(MobileBookingDetailWithFAQHandler, {
booking: function booking() {
var node = require("./__generated__/MobileBookingDetail_booking.graphql");
if (node.hash && node.hash !== "4c49931a21b71582f85b3782780e84b3") {
console.error("The definition of 'MobileBookingDetail_booking' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data.");
}
return require("./__generated__/MobileBookingDetail_booking.graphql");
}
});
exports.default = _default;