"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.PaymentType = PaymentType;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _loader = require("./loader");
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var PaypalCustomerCareMessage = function PaypalCustomerCareMessage() {
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "ncf__payment-type-paypal-message"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "o-message o-message--notice o-message--inform",
    "data-o-component": "o-message"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "o-message__container"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "o-message__content"
  }, /*#__PURE__*/_react["default"].createElement("p", {
    className: "o-message__content-main"
  }, "To change your payment method to ", /*#__PURE__*/_react["default"].createElement("b", null, "PayPal"), ", please\xA0", /*#__PURE__*/_react["default"].createElement("a", {
    className: "o-message__actions__secondary",
    href: "https://help.ft.com"
  }, "contact Customer Care"), ".")))));
};
function PaymentType(_ref) {
  var _ref$enableApplepay = _ref.enableApplepay,
    enableApplepay = _ref$enableApplepay === void 0 ? false : _ref$enableApplepay,
    _ref$enableCreditcard = _ref.enableCreditcard,
    enableCreditcard = _ref$enableCreditcard === void 0 ? false : _ref$enableCreditcard,
    _ref$enableDirectdebi = _ref.enableDirectdebit,
    enableDirectdebit = _ref$enableDirectdebi === void 0 ? false : _ref$enableDirectdebi,
    _ref$enablePaypal = _ref.enablePaypal,
    enablePaypal = _ref$enablePaypal === void 0 ? false : _ref$enablePaypal,
    _ref$enableBankTransf = _ref.enableBankTransfer,
    enableBankTransfer = _ref$enableBankTransf === void 0 ? false : _ref$enableBankTransf,
    _ref$showLoaderOnInit = _ref.showLoaderOnInit,
    showLoaderOnInit = _ref$showLoaderOnInit === void 0 ? false : _ref$showLoaderOnInit,
    _ref$fieldId = _ref.fieldId,
    fieldId = _ref$fieldId === void 0 ? 'paymentTypeField' : _ref$fieldId,
    _ref$inputId = _ref.inputId,
    inputId = _ref$inputId === void 0 ? 'paymentType' : _ref$inputId,
    value = _ref.value,
    _ref$isSingleTerm = _ref.isSingleTerm,
    isSingleTerm = _ref$isSingleTerm === void 0 ? false : _ref$isSingleTerm,
    _ref$isSingleTermChec = _ref.isSingleTermChecked,
    isSingleTermChecked = _ref$isSingleTermChec === void 0 ? false : _ref$isSingleTermChec,
    _ref$enableZuoraPayme = _ref.enableZuoraPaymentLink,
    enableZuoraPaymentLink = _ref$enableZuoraPayme === void 0 ? false : _ref$enableZuoraPayme;
  var createSecuritySeal = function createSecuritySeal() {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "ncf__security-seal",
      dangerouslySetInnerHTML: {
        __html: "\n\t\t\t\t<!-- NOTE: this won't display on local.ft.com (yet it will still take up space. I know.) -->\n\t\t\t\t<!--- DO NOT EDIT - GlobalSign SSL Site Seal Code - DO NOT EDIT --->\n\t\t\t\t<!-- Disabled until we can get a version from GlobalSign that works better than this one. Currently it doesn't always load correctly. -->\n\t\t\t\t<!-- <table width=125 border=0 cellspacing=0 cellpadding=0 title=\"CLICK TO VERIFY: This site uses a GlobalSign SSL Certificate to secure your personal information.\">\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td><span id=\"ss_img_wrapper_gmogs_image_110-45_en_dblue\"><a href=\"https://www.globalsign.com/\" target=_blank title=\"GlobalSign Site Seal\" rel=\"nofollow\"><img alt=\"SSL\" border=0 id=\"ss_img\" src=\"//seal.globalsign.com/SiteSeal/images/gs_noscript_110-45_en.gif\"></a></span>\n\t\t\t\t\t\t\t<script type=\"text/javascript\" src=\"//seal.globalsign.com/SiteSeal/gmogs_image_110-45_en_dblue.js\"></script>\n\t\t\t\t\t\t</td>\n\t\t\t\t\t</tr>\n\t\t\t\t</table> -->\n\t\t\t\t<!--- DO NOT EDIT - GlobalSign SSL Site Seal Code - DO NOT EDIT --->\n\t\t\t"
      }
    });
  };
  var paymentTypeCreditCard = {
    id: 'creditcard',
    label: 'Credit / Debit Card',
    hide: !enableCreditcard
  };
  var paymentTypePaypal = {
    id: 'paypal',
    label: 'PayPal',
    hide: !enablePaypal
  };
  var paymentTypeDirectDebit = {
    id: 'directdebit',
    label: 'Direct Debit',
    hide: !enableDirectdebit
  };
  var paymentTypeApplePay = {
    id: 'applepay',
    label: 'Apple Pay',
    hide: !enableApplepay
  };
  var paymentTypeBankTransfer = {
    id: 'banktransfer',
    label: 'Bank Transfer',
    hide: !enableBankTransfer
  };
  var zuoraPaymentLink = {
    id: 'zuorapaymentlink',
    label: 'Zuora Payment',
    hide: !enableZuoraPaymentLink
  };
  var createPaymentTypes = function createPaymentTypes() {
    var paymentTypes = [paymentTypeCreditCard, paymentTypePaypal, paymentTypeDirectDebit, paymentTypeApplePay, paymentTypeBankTransfer, zuoraPaymentLink].filter(Boolean);
    return paymentTypes.map(function (type) {
      if (type.id === undefined) {
        return type;
      } else {
        var inputProps = _objectSpread({
          type: 'radio',
          name: inputId,
          value: type.id,
          id: type.id,
          'aria-label': type.label
        }, value === type.id && {
          defaultChecked: true
        });
        var className = (0, _classnames["default"])(['o-forms-input--radio-box__container', 'ncf__payment-type', "ncf__payment-type--".concat(type.id), {
          ncf__hidden: type.hide
        }]);
        return /*#__PURE__*/_react["default"].createElement("div", {
          key: type.id,
          className: className
        }, /*#__PURE__*/_react["default"].createElement("label", {
          htmlFor: inputProps.id
        }, /*#__PURE__*/_react["default"].createElement("input", inputProps), /*#__PURE__*/_react["default"].createElement("span", {
          className: "o-forms-input__label",
          "aria-hidden": "true"
        }, type.label)));
      }
    });
  };
  var createDirectDebitPanel = function createDirectDebitPanel() {
    return enableDirectdebit && /*#__PURE__*/_react["default"].createElement("div", {
      className: "ncf__payment-type-panel ncf__payment-type-panel--directdebit ncf__hidden"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      id: "directDebitGuarantee",
      className: "ncf__directdebit-guarantee",
      "data-o-component": "o-expander",
      "data-o-expander-shrink-to": "hidden",
      "data-o-expander-expanded-toggle-text": "guarantee",
      "data-o-expander-collapsed-toggle-text": "guarantee",
      role: "tabpanel"
    }, /*#__PURE__*/_react["default"].createElement("p", null, "Direct Debit is only supported in the UK"), /*#__PURE__*/_react["default"].createElement("p", null, "Your payments are protected by the Direct Debit", ' ', /*#__PURE__*/_react["default"].createElement("button", {
      type: "button",
      className: "ncf__directdebit-guarantee-toggle o-expander__toggle"
    }, "guarantee")), /*#__PURE__*/_react["default"].createElement("ul", {
      className: "ncf__directdebit-guarantee-list o-expander__content"
    }, /*#__PURE__*/_react["default"].createElement("li", null, "This Guarantee is offered by all banks and building societies that accept instructions to pay Direct Debits."), /*#__PURE__*/_react["default"].createElement("li", null, "If there are any changes to the amount, date or frequency of your Direct Debit GoCardless re: The Financial Times will notify you 3 working days in advance of your account being debited or as otherwise agreed. If you request GoCardless Ltd re: The Financial Times to collect a payment, confirmation of the amount and date will be given to you at the time of the request."), /*#__PURE__*/_react["default"].createElement("li", null, "If an error is made in the payment of your Direct Debit, by GoCardless Ltd re: The Financial Times or your bank or building society, you are entitled to a full and immediate refund of the amount paid from your bank or building society."), /*#__PURE__*/_react["default"].createElement("li", null, "If you receive a refund you are not entitled to, you must pay it back when GoCardless Ltd re: The Financial Times asks you to."), /*#__PURE__*/_react["default"].createElement("li", null, "You can cancel a Direct Debit at any time by simply contacting your bank or building society. Written confirmation may be required. Please also notify us."))));
  };
  var createZuoraPanel = function createZuoraPanel() {
    // eslint-disable-next-line react/no-unknown-property
    return (enableDirectdebit || enableCreditcard) && /*#__PURE__*/_react["default"].createElement("div", {
      className: "ncf__payment-type-panel ncf__payment-type-panel--creditcard ncf__payment-type-panel--directdebit ncf__hidden"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      className: "ncf__zuora-payment-overlay ncf__hidden"
    }), /*#__PURE__*/_react["default"].createElement("div", {
      id: "zuora_payment",
      className: "ncf__zuora-payment"
    }, /*#__PURE__*/_react["default"].createElement("iframe", {
      id: "z_hppm_iframe",
      title: "Zuora Payment",
      overflow: "visible",
      scrolling: "no",
      frameBorder: "0",
      className: "z_hppm_iframe",
      style: {
        display: 'block',
        width: '100%'
      }
    })), /*#__PURE__*/_react["default"].createElement("script", {
      src: "https://static.zuora.com/Resources/libs/hosted/1.3.1/zuora-min.js"
    }));
  };
  var createLoaderOnInit = function createLoaderOnInit() {
    return showLoaderOnInit && /*#__PURE__*/_react["default"].createElement(_loader.Loader, {
      inElement: true,
      showLoader: true,
      title: "Loading payment form..."
    });
  };
  var inputCheckProps = _objectSpread({
    id: 'payFasterNextTime',
    type: 'checkbox',
    name: 'payFasterNextTime',
    value: 'true',
    required: false,
    checked: true
  }, isSingleTermChecked && {
    defaultChecked: true
  });
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, createSecuritySeal(), /*#__PURE__*/_react["default"].createElement("div", {
    id: fieldId,
    className: "o-forms-field"
  }, createLoaderOnInit(), /*#__PURE__*/_react["default"].createElement("div", {
    className: "o-forms-input o-forms-input--radio-box ncf__payment-type-selector"
  }, createPaymentTypes()), /*#__PURE__*/_react["default"].createElement("div", {
    className: "o-forms-input__error"
  }, "Please enter a valid payment type"), !enablePaypal && PaypalCustomerCareMessage(), createDirectDebitPanel(), createZuoraPanel()), /*#__PURE__*/_react["default"].createElement("div", {
    className: "o-forms-field"
  }, isSingleTerm && /*#__PURE__*/_react["default"].createElement("label", {
    className: "o-forms-input o-forms-input--checkbox o-forms-input--suffix ncf__payment-type-pay-faster-next-time-checkbox",
    htmlFor: "payFasterNextTime"
  }, /*#__PURE__*/_react["default"].createElement("input", inputCheckProps), /*#__PURE__*/_react["default"].createElement("span", {
    className: "o-forms-input__label"
  }, "Use these details to pay faster next time"))));
}
PaymentType.propTypes = {
  enableApplepay: _propTypes["default"].bool,
  enableCreditcard: _propTypes["default"].bool,
  enableDirectdebit: _propTypes["default"].bool,
  enablePaypal: _propTypes["default"].bool,
  enableBankTransfer: _propTypes["default"].bool,
  showLoaderOnInit: _propTypes["default"].bool,
  fieldId: _propTypes["default"].string,
  inputId: _propTypes["default"].string,
  value: _propTypes["default"].string,
  isSingleTerm: _propTypes["default"].bool,
  isSingleTermChecked: _propTypes["default"].bool,
  enableZuoraPaymentLink: _propTypes["default"].bool
};