alm-search-01/dist/fields/ReturnTripDateRangePicker.js

This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

"use strict";

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

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

var _styles = require("@material-ui/core/styles");

var _DateRangeRounded = _interopRequireDefault(require("@material-ui/icons/DateRangeRounded"));

var _Field = _interopRequireDefault(require("../components/Field/Field"));

var _DatePicker = _interopRequireDefault(require("../components/DatePicker/DatePicker"));

var _moment = _interopRequireDefault(require("moment"));

var _getHotelsLocale2 = _interopRequireDefault(require("../utils/getHotelsLocale"));

var _brandStyles = _interopRequireDefault(require("../utils/brandStyles"));

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

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }

function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var useStyles = (0, _styles.makeStyles)(function (theme) {
  return {
    container: {
      display: 'flex',
      width: '100%',
      justifyContent: 'center',
      margin: '4px 0'
    },
    icon: {
      paddingRight: theme.spacing(1),
      paddingLeft: theme.spacing(1)
    },
    checkIcon: {
      color: '#FFF'
    }
  };
});

var ReturnTripDateRangePicker = function ReturnTripDateRangePicker(_ref) {
  var _ref$defaultSelectedD = _ref.defaultSelectedDates,
      _ref$defaultSelectedD2 = _ref$defaultSelectedD.departure,
      departureDate = _ref$defaultSelectedD2 === void 0 ? (0, _moment.default)() : _ref$defaultSelectedD2,
      _ref$defaultSelectedD3 = _ref$defaultSelectedD.return,
      returnDate = _ref$defaultSelectedD3 === void 0 ? (0, _moment.default)() : _ref$defaultSelectedD3,
      departure = _ref$defaultSelectedD.departure,
      onChange = _ref.onChange,
      lang = _ref.lang,
      brand = _ref.brand,
      isMobile = _ref.isMobile;

  var _getHotelsLocale = (0, _getHotelsLocale2.default)(lang),
      departure_date = _getHotelsLocale.departure_date,
      return_date = _getHotelsLocale.return_date,
      calendar_label = _getHotelsLocale.calendar_label;

  var classes = useStyles((0, _brandStyles.default)(brand));

  var _React$useState = _react.default.useState(false),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      open = _React$useState2[0],
      setOpen = _React$useState2[1];

  var _React$useState3 = _react.default.useState({
    selection: {
      startDate: departureDate,
      endDate: returnDate,
      key: 'selection'
    }
  }),
      _React$useState4 = _slicedToArray(_React$useState3, 2),
      selectedDates = _React$useState4[0],
      setSelectedDates = _React$useState4[1];

  _react.default.useEffect(function () {
    setSelectedDates({
      selection: {
        startDate: departureDate,
        endDate: returnDate,
        key: 'selection'
      }
    });
  }, [departureDate, returnDate]);

  var handleDropdownOpen = function handleDropdownOpen() {
    setOpen(true);
  };

  var handleDropdownClose = function handleDropdownClose() {
    setOpen(false);
  };

  var handleSelectedDates = function handleSelectedDates(selectedDates) {
    setSelectedDates(selectedDates);
  };

  var handleSubmit = function handleSubmit() {
    onChange({
      departure: selectedDates.selection.startDate,
      return: selectedDates.selection.endDate
    });
    handleDropdownClose();
  };

  return _react.default.createElement("div", {
    className: classes.container
  }, _react.default.createElement(_Field.default, {
    label: departure_date,
    value: (0, _moment.default)(selectedDates.selection.startDate).format('ddd, DD MMM'),
    iconComponent: function iconComponent(props) {
      return _react.default.createElement(_DateRangeRounded.default, props);
    },
    onClick: handleDropdownOpen,
    lang: lang,
    brand: brand
  }), _react.default.createElement(_Field.default, {
    label: return_date,
    value: (0, _moment.default)(selectedDates.selection.endDate).format('ddd, DD MMM'),
    onClick: handleDropdownOpen,
    lang: lang,
    brand: brand
  }), _react.default.createElement(_DatePicker.default, {
    title: calendar_label,
    open: open,
    onOkClick: handleSubmit,
    selectedDates: selectedDates,
    onSelect: handleSelectedDates,
    onClose: handleDropdownClose,
    lang: lang,
    brand: brand,
    isMobile: isMobile
  }));
};

var _default = ReturnTripDateRangePicker;
exports.default = _default;