@kiwicom/smart-faq/lib/shared/StaticFAQ/FAQExtraInfo/BoardingPassesInfo/BoardingPassesItem.js

Smart FAQ

"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 React = _interopRequireWildcard(require("react"));

var _idx = _interopRequireDefault(require("idx"));

var _reactRelay = require("react-relay");

var _Badge = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Badge"));

var _Translate = _interopRequireDefault(require("@kiwicom/nitro/lib/components/Translate"));

var _InformationCircle = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/InformationCircle"));

var _Download = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/Download"));

var _FlightDirect = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/FlightDirect"));

var _HoverHelpTooltip = _interopRequireDefault(require("../../../../SmartFAQ/common/Tooltip/HoverHelpTooltip"));

var _trackers = require("../../../helpers/analytics/trackers");

var _UrlHelpers = require("../../../../SmartFAQ/helpers/UrlHelpers");

var _tracker = require("../../../cuckoo/tracker");

// @flow
var moreInfoBoardingTracker = function moreInfoBoardingTracker() {
  (0, _trackers.simpleTracker)('smartFAQ', {
    action: 'clickOnMoreInfoBoarding'
  });
  (0, _tracker.track)('BoardingPasses', 'clickOnMoreInfoBoarding');
};

var tooltipTracker = function tooltipTracker() {
  (0, _trackers.simpleTracker)('smartFAQ', {
    action: 'showTooltip'
  });
  (0, _tracker.track)('BoardingPasses', 'showTooltip');
};

var downloadBoardingPassTracker = function downloadBoardingPassTracker() {
  (0, _trackers.simpleTracker)('smartFAQ', {
    action: 'downloadBoardingPass'
  });
  (0, _tracker.track)('BoardingPasses', 'downloadBoardingPass');
};

var BoardingPassesItem = function BoardingPassesItem(_ref) {
  var data = _ref.data,
      mmbUrl = _ref.mmbUrl;
  if (data.leg === null) return null;
  var departureCity = (0, _idx.default)(data, function (_) {
    return _.leg.departure.airport.city.name;
  });
  var arrivalCity = (0, _idx.default)(data, function (_) {
    return _.leg.arrival.airport.city.name;
  });
  var vehicleType = (0, _idx.default)(data, function (_) {
    return _.leg.type;
  });
  var boardingPassUrl = (0, _idx.default)(data, function (_) {
    return _.boardingPassUrl;
  });
  var availableAt = (0, _idx.default)(data, function (_) {
    return _.availableAt;
  }) || '';
  var availabilityStatus = (0, _idx.default)(data, function (_) {
    return _.availabilityStatus;
  });
  var moreInfoButton = React.createElement("a", {
    href: (0, _UrlHelpers.replaceWithCurrentDomain)(mmbUrl),
    onClick: moreInfoBoardingTracker,
    target: "_blank",
    className: "moreInfo"
  }, React.createElement(_Translate.default, {
    t: "smartfaq.boarding_pass_info.more_info"
  }));

  var Info = function () {
    switch (availabilityStatus) {
      case 'AVAILABLE':
        return React.createElement("a", {
          href: boardingPassUrl,
          onClick: downloadBoardingPassTracker,
          target: "_blank",
          className: "download"
        }, React.createElement(_Download.default, {
          size: "medium",
          customColor: "#00a991"
        }), React.createElement(_Translate.default, {
          t: "smartfaq.boarding_pass_info.download"
        }));

      case 'IN_FUTURE':
        return React.createElement("p", null, React.createElement(_Translate.default, {
          t: "smartfaq.boarding_pass_info.available_at",
          values: {
            date: availableAt
          }
        }));

      case 'AT_AIRPORT':
        if (vehicleType !== 'AIRCRAFT') {
          return React.createElement("p", {
            style: {
              color: '#cf292a'
            }
          }, React.createElement(_Translate.default, {
            t: "smartfaq.boarding_pass_info.in_process"
          }));
        }

        return React.createElement(_HoverHelpTooltip.default, {
          content: React.createElement(_Translate.default, {
            t: "smartfaq.boarding_pass_info.airport_check_in.hover"
          }),
          placement: "top",
          tracker: tooltipTracker
        }, React.createElement(_Badge.default, {
          type: "info",
          icon: React.createElement(_InformationCircle.default, null)
        }, React.createElement(_Translate.default, {
          t: "smartfaq.boarding_pass_info.airport_check_in"
        })));

      case 'OTHER':
      default:
        return moreInfoButton;
    }
  }();

  return React.createElement(React.Fragment, null, React.createElement("hr", {
    className: "jsx-923504495" + " " + "separationLine"
  }), React.createElement("div", {
    className: "jsx-923504495" + " " + "boardingPassesRow"
  }, React.createElement("p", {
    className: "jsx-923504495" + " " + "leg"
  }, departureCity, React.createElement(_FlightDirect.default, {
    size: "medium",
    customColor: "#bac7d5"
  }), arrivalCity), React.createElement("div", {
    className: "jsx-923504495" + " " + "info"
  }, Info)), React.createElement(_style.default, {
    styleId: "923504495",
    css: "div.boardingPassesRow.jsx-923504495{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;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:15px 24px 15px 24px;}div.info.jsx-923504495{display:inline-block;float:right;}div.info.jsx-923504495 p{font-size:12px;line-height:1.4;color:#46515e;margin:0;}div.info.jsx-923504495 a.download{font-size:12px;color:#00a991;-webkit-text-decoration:none;text-decoration:none;}div.info.jsx-923504495 a.moreInfo{font-size:12px;font-weight:500;line-height:1.4;color:#171b1e;}div.info.jsx-923504495 .Tooltip{bottom:110%;right:0;}div.info.jsx-923504495 .Tooltip-inner.Tooltip-inner{max-width:265px;width:265px;}div.info.jsx-923504495 .Tooltip .Tooltip-arrow.Tooltip-arrow{left:auto;right:55px;}div.boardingPassesNumber.jsx-923504495{display:inline-block;margin-right:8px;}div.boardingPassesNumber.jsx-923504495 p.jsx-923504495{font-size:14px;font-weight:bold;line-height:1.4;color:#46515e;display:inline-block;}.leg.jsx-923504495{font-size:14px;font-weight:bold;line-height:1.4;color:#46515e;display:inline-block;margin:0 0 0 5px;}hr.separationLine.jsx-923504495{height:1px;background-color:#e8edf1;border:none;margin:0;width:100%;}"
  }));
};

var _default = (0, _reactRelay.createFragmentContainer)(BoardingPassesItem, {
  data: function data() {
    var node = require("./__generated__/BoardingPassesItem.graphql");

    if (node.hash && node.hash !== "68802d35b68a4540bc2bbf4621e876f5") {
      console.error("The definition of 'BoardingPassesItem' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data.");
    }

    return require("./__generated__/BoardingPassesItem.graphql");
  }
});

exports.default = _default;