"use strict";

require("core-js/modules/web.dom.iterable");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _coreUtils = _interopRequireDefault(require("@opentripplanner/core-utils"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _react = _interopRequireWildcard(require("react"));

var _reactBootstrap = require("react-bootstrap");

var _reactIntl = require("react-intl");

var _reactRedux = require("react-redux");

var _styledComponents = _interopRequireDefault(require("styled-components"));

var narrativeActions = _interopRequireWildcard(require("../../actions/narrative"));

var _contexts = require("../../util/contexts");

var _i18n = require("../../util/i18n");

var _state = require("../../util/state");

var _formattedDuration = _interopRequireDefault(require("../util/formatted-duration"));

var _formattedTimeRange = _interopRequireDefault(require("../util/formatted-time-range"));

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

const {
  calculateFares,
  calculatePhysicalActivity
} = _coreUtils.default.itinerary;
const Bullet = _styledComponents.default.span`
  ::before {
    content: "•";
    margin: 0 0.25em;
  }
`;

class TabbedItineraries extends _react.Component {
  constructor(...args) {
    super(...args);

    _defineProperty(this, "_toggleRealtimeItineraryClick", e => {
      const {
        setUseRealtimeResponse,
        useRealtime
      } = this.props;
      setUseRealtimeResponse({
        useRealtime: !useRealtime
      });
    });
  }

  render() {
    const {
      activeItinerary,
      currency,
      itineraries,
      realtimeEffects,
      setActiveItinerary,
      timeFormat,
      useRealtime,
      ...itineraryBodyProps
    } = this.props;
    const {
      ItineraryBody,
      LegIcon
    } = this.context;
    if (!itineraries) return null;
    /* TODO: should this be moved? */

    const showRealtimeAnnotation = realtimeEffects.isAffectedByRealtimeData && (realtimeEffects.exceedsThreshold || realtimeEffects.routesDiffer || !useRealtime);
    return /*#__PURE__*/_react.default.createElement("div", {
      className: "options itinerary tabbed-itineraries"
    }, /*#__PURE__*/_react.default.createElement("div", {
      className: "tab-row"
    }, itineraries.map((itinerary, index) => {
      return /*#__PURE__*/_react.default.createElement(TabButton, {
        currency: currency,
        index: index,
        isActive: index === activeItinerary,
        itinerary: itinerary,
        key: index,
        onClick: setActiveItinerary
      });
    })), itineraries.length > 0 && activeItinerary >= 0 ? /*#__PURE__*/_react.default.createElement(ItineraryBody, _extends({
      active: true,
      expanded: true,
      index: activeItinerary,
      itinerary: itineraries[activeItinerary],
      key: activeItinerary,
      LegIcon: LegIcon,
      routingType: "ITINERARY",
      showRealtimeAnnotation: showRealtimeAnnotation,
      timeFormat: timeFormat
    }, itineraryBodyProps)) : null);
  }

}

_defineProperty(TabbedItineraries, "propTypes", {
  activeItinerary: _propTypes.default.number,
  itineraries: _propTypes.default.array,
  pending: _propTypes.default.bool,
  setActiveItinerary: _propTypes.default.func,
  setActiveLeg: _propTypes.default.func,
  setActiveStep: _propTypes.default.func,
  setUseRealtimeResponse: _propTypes.default.func,
  useRealtime: _propTypes.default.bool
});

_defineProperty(TabbedItineraries, "contextType", _contexts.ComponentContext);

class TabButton extends _react.Component {
  constructor(...args) {
    super(...args);

    _defineProperty(this, "_onClick", () => {
      const {
        index,
        onClick
      } = this.props; // FIXME: change signature once actions resolved with otp-ui

      onClick(index);
    });
  }

  render() {
    const {
      currency,
      index,
      isActive,
      itinerary
    } = this.props;
    const classNames = ['tab-button', 'clear-button-formatting'];
    const {
      caloriesBurned
    } = calculatePhysicalActivity(itinerary);
    const {
      maxTNCFare,
      minTNCFare,
      transitFare
    } = calculateFares(itinerary); // TODO: support non-USD

    const minTotalFare = minTNCFare * 100 + transitFare;
    if (isActive) classNames.push('selected');
    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
      className: classNames.join(' '),
      key: `tab-button-${index}`,
      onClick: this._onClick
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "title"
    }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
      id: "components.TabbedItineraries.optionNumber",
      values: {
        optionNum: index + 1
      }
    })), /*#__PURE__*/_react.default.createElement("span", {
      className: "details"
    }, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_formattedDuration.default, {
      duration: itinerary.duration
    })), /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_formattedTimeRange.default, {
      endTime: itinerary.endTime,
      startTime: itinerary.startTime
    })), /*#__PURE__*/_react.default.createElement("span", null, minTotalFare > 0 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
      id: "components.TabbedItineraries.fareCost",
      values: {
        hasMaxFare: maxTNCFare && maxTNCFare > minTNCFare,
        minTotalFare: /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedNumber, {
          currency: currency,
          currencyDisplay: "narrowSymbol",
          style: "currency",
          value: minTotalFare / 100
        })
      }
    }), /*#__PURE__*/_react.default.createElement(Bullet, null)), /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
      id: "common.itineraryDescriptions.calories",
      values: {
        calories: Math.round(caloriesBurned)
      }
    })), /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {
      id: "common.itineraryDescriptions.transfers",
      values: {
        transfers: itinerary.transfers
      }
    }))));
  }

} // connect to the redux store


const mapStateToProps = (state, ownProps) => {
  var _state$otp$config$loc;

  const activeSearch = (0, _state.getActiveSearch)(state);
  const currency = ((_state$otp$config$loc = state.otp.config.localization) === null || _state$otp$config$loc === void 0 ? void 0 : _state$otp$config$loc.currency) || 'USD';
  const pending = activeSearch ? Boolean(activeSearch.pending) : false;
  const realtimeEffects = (0, _state.getRealtimeEffects)(state);
  const useRealtime = state.otp.useRealtime;
  return {
    activeItinerary: activeSearch && activeSearch.activeItinerary,
    activeLeg: activeSearch && activeSearch.activeLeg,
    activeStep: activeSearch && activeSearch.activeStep,
    companies: state.otp.currentQuery.companies,
    currency,
    pending,
    // swap out realtime itineraries with non-realtime depending on boolean
    realtimeEffects,
    timeFormat: (0, _i18n.getTimeFormat)(state),
    tnc: state.otp.tnc,
    useRealtime
  };
};

const mapDispatchToProps = (dispatch, ownProps) => {
  const {
    setActiveItinerary,
    setActiveLeg,
    setActiveStep,
    setUseRealtimeResponse
  } = narrativeActions;
  return {
    // FIXME
    setActiveItinerary: index => {
      dispatch(setActiveItinerary({
        index
      }));
    },
    // FIXME
    setActiveLeg: (index, leg) => {
      dispatch(setActiveLeg({
        index,
        leg
      }));
    },
    // FIXME
    setActiveStep: (index, step) => {
      dispatch(setActiveStep({
        index,
        step
      }));
    },
    // FIXME
    setUseRealtimeResponse: ({
      useRealtime
    }) => {
      dispatch(setUseRealtimeResponse({
        useRealtime
      }));
    }
  };
};

var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(TabbedItineraries);

exports.default = _default;
module.exports = exports.default;

//# sourceMappingURL=tabbed-itineraries.js