@kiwicom/smart-faq/lib/CustomerSupportPhones/Phone.js

"use strict";

require("core-js/modules/es.array.concat");

require("core-js/modules/es.array.join");

require("core-js/modules/es.array.slice");

require("core-js/modules/es.object.get-own-property-descriptor");

require("core-js/modules/es.object.to-string");

require("core-js/modules/es.parse-int");

require("core-js/modules/es.regexp.to-string");

require("core-js/modules/es.string.replace");

require("core-js/modules/es.string.split");

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

var _style = _interopRequireDefault(require("styled-jsx/style"));

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

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

var _libphonenumberJs = require("libphonenumber-js");

var _ValueBind = _interopRequireDefault(require("@kiwicom/nitro/lib/components/ValueBind"));

var _Stack = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Stack"));

var _TextLink = _interopRequireDefault(require("@kiwicom/orbit-components/lib/TextLink"));

var _Tooltip = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Tooltip"));

var _CountryFlag = _interopRequireDefault(require("@kiwicom/orbit-components/lib/CountryFlag"));

var _consts = require("@kiwicom/orbit-components/lib/CountryFlag/consts");

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

var _add_minutes = _interopRequireDefault(require("date-fns/add_minutes"));

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

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

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

// @flow
// TODO refactor -> get rid of custom css
var styles = new String(".CustomerSupportPhones .Phone a{color:#00ad98;-webkit-text-decoration:none;text-decoration:none;}");
styles.__hash = "484359465";
/*:: type Props = {|
  data: PhoneType,
|};*/

var onClickPhone = function onClickPhone(localeTerritory) {
  return (0, _tracker.track)('ContactForm', 'phoneClicked', {
    localeTerritory: localeTerritory
  });
};

var formatTime = function formatTime(datetime
/*: Date*/
) {
  return "".concat(datetime.getUTCHours() % 12).concat(datetime.getUTCMinutes() > 0 ? ":".concat(datetime.getUTCMinutes()) : '', " ").concat(datetime.getUTCHours() >= 12 ? 'pm' : 'am');
};

var parseUTCTimeToDate = function parseUTCTimeToDate(utcString
/*: string*/
) {
  var hour = parseInt(utcString.split(':')[0], 10);
  var minute = parseInt(utcString.split(':')[1], 10);
  var now = new Date();
  return new Date(Date.UTC(now.getFullYear(), now.getMonth(), now.getDay(), hour, minute));
};

var convertToTimezone = _add_minutes.default;

var convertToLocalTimezone = function convertToLocalTimezone(datetime
/*: Date*/
) {
  // it's negative because the offset has to be subtracted
  return convertToTimezone(datetime, -new Date().getTimezoneOffset());
};

var getTimezone = function getTimezone() {
  var offset = new Date().getTimezoneOffset();
  var offsetHours = Math.floor(Math.abs(offset / 60));
  var offsetMinutes = Math.abs(offset % 60);
  var formattedOffset = "".concat('00'.concat(offsetHours.toString()).slice(-2), ":").concat('00'.concat(offsetMinutes.toString()).slice(-2));

  if (offset > 0) {
    return "GMT-".concat(formattedOffset);
  } else if (offset === 0) {
    return 'GMT';
  }

  return "GMT+".concat(formattedOffset);
};

var formatOpenHours = function formatOpenHours(from
/*: string*/
, to
/*: string*/
)
/*: string*/
{
  var fromDate = convertToLocalTimezone(parseUTCTimeToDate(from));
  var toDate = convertToLocalTimezone(parseUTCTimeToDate(to));
  return "".concat(formatTime(fromDate), "-").concat(formatTime(toDate), " ").concat(getTimezone());
};

var parseAvailabilityTimes = function parseAvailabilityTimes(phoneLanguageAvailability, hasMultipleLanguages, language) {
  var type = phoneLanguageAvailability.type; // TODO refactor to translations with variables

  if (type === 'NONSTOP') {
    return 'Support Available in ';
  } else if (type === 'WORKING_DAYS') {
    var to = phoneLanguageAvailability.to,
        from = phoneLanguageAvailability.from;

    if (to && from && language) {
      return "".concat(hasMultipleLanguages ? language : '', " Mon - Fri ").concat(formatOpenHours(from, to), "; ");
    }
  }

  return '';
};

var Phone = function Phone(_ref) {
  var data = _ref.data;
  var phoneNumber = data.number,
      localeTerritory = data.localeTerritory,
      labels = data.labels,
      countryName = data.countryName,
      supportedLanguages = data.supportedLanguages;
  var parsedPhoneNumber;

  try {
    parsedPhoneNumber = (0, _libphonenumberJs.parsePhoneNumber)(phoneNumber).formatInternational();
  } catch (e) {
    parsedPhoneNumber = phoneNumber;
  }

  var flagCode = localeTerritory && _consts.CODES[localeTerritory.toUpperCase()];

  var hasMultipleLanguages = supportedLanguages && supportedLanguages.length > 1;
  var extraInfo = labels && labels.join(' ') || '';
  var availabilityInfo = supportedLanguages ? supportedLanguages.reduce(function (acc, supportedLanguage) {
    var language = supportedLanguage === null || supportedLanguage === void 0 ? void 0 : supportedLanguage.language;
    var languageAvailability = (supportedLanguage === null || supportedLanguage === void 0 ? void 0 : supportedLanguage.phoneLanguageAvailability) || {};
    return "".concat(parseAvailabilityTimes(languageAvailability, hasMultipleLanguages, language)) + acc;
  }, 'English 24/7;') + extraInfo : null;
  return React.createElement(_Stack.default, {
    direction: "row",
    spacing: "condensed"
  }, flagCode && countryName && React.createElement(_CountryFlag.default, {
    code: flagCode,
    name: countryName
  }), React.createElement("div", {
    dir: "ltr"
  }, parsedPhoneNumber && phoneNumber && localeTerritory && React.createElement("div", {
    className: "Phone"
  }, React.createElement(_ValueBind.default, {
    value: localeTerritory,
    onChange: onClickPhone
  }, function (_ref2) {
    var onClick = _ref2.onClick;
    return React.createElement(_TextLink.default, {
      href: "tel:".concat(phoneNumber.replace(/\s/g, '')),
      onClick: onClick
    }, parsedPhoneNumber || '');
  }))), React.createElement("div", {
    dir: "ltr",
    style: {
      cursor: 'pointer'
    }
  }, React.createElement(_Tooltip.default, {
    content: availabilityInfo,
    preferredPosition: "top",
    size: "medium"
  }, React.createElement(_InformationCircle.default, {
    size: "small",
    color: "tertiary"
  }))), React.createElement(_style.default, {
    styleId: styles.__hash,
    css: styles
  }));
};

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

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

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

exports.default = _default;