"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

exports.__esModule = true;
exports.OrderSummary = void 0;

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

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

var _Common = require("../../../Common");

var _UI = require("../UI");

var _Components = require("./Components");

var _lib = require("@sentecacommerce-theme/lib");

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

var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;

var OrderSummary = function OrderSummary(_ref) {
  var _products$data$lineIt, _products$data;

  var title = _ref.title,
      setEmail = _ref.setEmail,
      gdprAgreed = _ref.gdprAgreed,
      uncheckGDPR = _ref.uncheckGDPR,
      checkGDPR = _ref.checkGDPR;
  var products = (0, _lib.useBasketCompact)();
  var productCount = (_products$data$lineIt = (_products$data = products.data) == null ? void 0 : _products$data.lineItemsCount) != null ? _products$data$lineIt : 0;

  var _useOrderPrice = (0, _lib.useOrderPrice)(),
      subtotalRaw = _useOrderPrice.subtotal,
      totalWithShippingRaw = _useOrderPrice.taxedPrice,
      discountCodesSum = _useOrderPrice.discountCodesSum;

  var _useOrderShippingPric = (0, _lib.useOrderShippingPrice)(),
      shippingPriceRaw = _useOrderShippingPric.originalPrice,
      shippingDiscountedPriceRaw = _useOrderShippingPric.discountedPrice;

  var _usePrice = (0, _lib.usePrice)({
    price: subtotalRaw,
    discountedPrice: undefined
  }),
      subtotal = _usePrice.price;

  var _usePrice2 = (0, _lib.usePrice)({
    price: totalWithShippingRaw,
    discountedPrice: undefined
  }),
      totalWithShipping = _usePrice2.price;

  var _usePrice3 = (0, _lib.usePrice)({
    price: shippingDiscountedPriceRaw || shippingPriceRaw,
    discountedPrice: undefined
  }),
      shipping = _usePrice3.price;

  var _usePrice4 = (0, _lib.usePrice)({
    price: discountCodesSum,
    discountedPrice: undefined
  }),
      discountAmount = _usePrice4.price;

  var _useCheckoutDiscountC = (0, _lib.useCheckoutDiscountCode)(),
      appliedCodes = _useCheckoutDiscountC.appliedCodes;

  var _useLocalLabels = (0, _lib.useLocalLabels)(),
      withoutShippingLabel = _useLocalLabels.totalWithoutShippingPrice,
      shippingLabel = _useLocalLabels.totalShippingPrice,
      shippingPriceNotAvailable = _useLocalLabels.shippingPriceNotAvailable,
      chooseShippingMethod = _useLocalLabels.chooseShippingMethod,
      totalLabel = _useLocalLabels.totalPrice,
      goToPayment = _useLocalLabels.goToPayment,
      submitButtonLabel = _useLocalLabels.submitButtonLabel,
      placeOrder = _useLocalLabels.placeOrder,
      fixErrorsMessage = _useLocalLabels.fixErrorsMessage,
      GDPRErrorMessage = _useLocalLabels.GDPRErrorMessage,
      securityNotice = _useLocalLabels.securityNotice;

  var _useAllSubscriptions = (0, _lib.useAllSubscriptions)({
    tag: 'checkout'
  }),
      requiredSubs = _useAllSubscriptions.requiredSubs,
      checkedSubs = _useAllSubscriptions.checkedSubs,
      clickSub = _useAllSubscriptions.clickSub,
      allSubscriptions = _useAllSubscriptions.allSubscriptions,
      checkRequiredSubs = _useAllSubscriptions.checkRequiredSubs;

  var _useCheckoutFormStep = (0, _lib.useCheckoutFormStep)(),
      currentStep = _useCheckoutFormStep.currentStep;

  var showAddressPreview = currentStep !== _lib.CheckoutFormStepsEnum.Shipping;
  var currency = subtotal.currency;

  var getButtonLabel = function getButtonLabel() {
    if (currentStep === _lib.CheckoutFormStepsEnum.Shipping) {
      return goToPayment;
    }

    if (currentStep === _lib.CheckoutFormStepsEnum.Payment) {
      return placeOrder;
    }

    return submitButtonLabel;
  };

  var _useCheckoutFormPayme = (0, _lib.useCheckoutFormPaymentState)(),
      paymentErrors = _useCheckoutFormPayme.errors;

  var _useCheckoutFormShipp = (0, _lib.useCheckoutFormShippingState)(),
      shippingData = _useCheckoutFormShipp.data,
      shippingErrors = _useCheckoutFormShipp.errors,
      isAddingNew = _useCheckoutFormShipp.isAddingNew;

  var renderError = function renderError() {
    if (isAddingNew && currentStep === _lib.CheckoutFormStepsEnum.Shipping && shippingErrors) {
      return /*#__PURE__*/_react["default"].createElement(_Common.FormError, {
        text: fixErrorsMessage
      });
    }

    if (currentStep === _lib.CheckoutFormStepsEnum.Payment && paymentErrors) {
      return /*#__PURE__*/_react["default"].createElement(_Common.FormError, {
        text: fixErrorsMessage
      });
    }

    return null;
  };

  _react["default"].useEffect(function () {
    setEmail(shippingData == null ? void 0 : shippingData.email);
  }, [shippingData == null ? void 0 : shippingData.email, setEmail]);

  var handleClick = function handleClick(sub) {
    clickSub(sub);
    var allChecked = checkRequiredSubs();

    if (!allChecked) {
      uncheckGDPR();
    } else {
      checkGDPR();
    }
  };

  return /*#__PURE__*/_react["default"].createElement(Container, null, /*#__PURE__*/_react["default"].createElement(Box, null, /*#__PURE__*/_react["default"].createElement(_UI.CheckoutTitle, {
    small: true,
    data: title
  }), /*#__PURE__*/_react["default"].createElement(Row, null, /*#__PURE__*/_react["default"].createElement(Name, null, withoutShippingLabel), /*#__PURE__*/_react["default"].createElement(Value, null, /*#__PURE__*/_react["default"].createElement(_Common.Price, {
    size: "tiny",
    price: (subtotal.value + discountAmount.value).toFixed(2),
    currency: subtotal.currency
  }))), /*#__PURE__*/_react["default"].createElement(Row, null, /*#__PURE__*/_react["default"].createElement(Name, null, shippingLabel), /*#__PURE__*/_react["default"].createElement(Value, null, !shipping ? shippingPriceNotAvailable : !shippingPriceRaw && !shippingDiscountedPriceRaw ? chooseShippingMethod : "" + shipping.displayValue)), appliedCodes == null ? void 0 : appliedCodes.map(function (data) {
    return /*#__PURE__*/_react["default"].createElement(Row, {
      key: "Code__" + data.discountCode.resourceId + "--" + data.discountCode.resource.code
    }, /*#__PURE__*/_react["default"].createElement(_Components.DiscountCode, {
      data: data
    }));
  }), /*#__PURE__*/_react["default"].createElement(Row, {
    big: true
  }, /*#__PURE__*/_react["default"].createElement(Name, {
    big: true
  }, totalLabel), /*#__PURE__*/_react["default"].createElement(Value, {
    big: true
  }, /*#__PURE__*/_react["default"].createElement(_Common.Price, {
    size: "tiny",
    price: totalWithShipping.value,
    currency: subtotal.currency
  })))), /*#__PURE__*/_react["default"].createElement(PromoCodeContainer, null, /*#__PURE__*/_react["default"].createElement(_Common.PromoCode, {
    stringsDomain: "checkout"
  })), /*#__PURE__*/_react["default"].createElement(SubmitButtonContainer, null, requiredSubs.map(function (sub) {
    return /*#__PURE__*/_react["default"].createElement(_Components.Checkbox, {
      key: sub,
      onChange: function onChange() {
        return handleClick(sub);
      },
      isChecked: checkedSubs == null ? void 0 : checkedSubs[sub],
      size: "tiny"
    }, /*#__PURE__*/_react["default"].createElement(GDPRLabel, null, /*#__PURE__*/_react["default"].createElement(_lib.Html, null, allSubscriptions == null ? void 0 : allSubscriptions[sub].description)));
  }), !checkRequiredSubs() && /*#__PURE__*/_react["default"].createElement(_Common.FormError, {
    text: GDPRErrorMessage
  }), /*#__PURE__*/_react["default"].createElement(_Common.Button, {
    type: "submit",
    variant: !gdprAgreed ? 'disabled' : 'primary',
    disabled: !gdprAgreed,
    icon: /*#__PURE__*/_react["default"].createElement(_Common.IconArrowRight, null)
  }, getButtonLabel()), /*#__PURE__*/_react["default"].createElement(_Common.Typography, {
    variant: "6",
    color: "primary",
    className: "d-none d-lg-block mt-2"
  }, securityNotice), renderError()), /*#__PURE__*/_react["default"].createElement(Box, null, /*#__PURE__*/_react["default"].createElement(_Components.BasketPreview, null), showAddressPreview && /*#__PURE__*/_react["default"].createElement(_Components.AddressPreview, null)), productCount >= 5 && /*#__PURE__*/_react["default"].createElement(SubmitButtonContainer, {
    mobile: true
  }, requiredSubs.map(function (sub) {
    return /*#__PURE__*/_react["default"].createElement(_Components.Checkbox, {
      key: sub,
      onChange: function onChange() {
        return handleClick(sub);
      },
      isChecked: checkedSubs == null ? void 0 : checkedSubs[sub],
      size: "tiny"
    }, /*#__PURE__*/_react["default"].createElement(GDPRLabel, null, /*#__PURE__*/_react["default"].createElement(_lib.Html, null, allSubscriptions == null ? void 0 : allSubscriptions[sub].description)));
  }), !checkRequiredSubs() && /*#__PURE__*/_react["default"].createElement(_Common.FormError, {
    text: GDPRErrorMessage
  }), /*#__PURE__*/_react["default"].createElement(_Common.Button, {
    type: "submit",
    variant: !gdprAgreed ? 'disabled' : 'primary',
    disabled: !gdprAgreed,
    icon: /*#__PURE__*/_react["default"].createElement(_Common.IconArrowRight, null)
  }, getButtonLabel()), /*#__PURE__*/_react["default"].createElement(_Common.Typography, {
    variant: "6",
    color: "primary",
    className: "mt-2"
  }, securityNotice), renderError()));
};

exports.OrderSummary = OrderSummary;

var PromoCodeContainer = _styledComponents["default"].div.attrs({
  className: 'my-4'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var Container = _styledComponents["default"].div.attrs({
  className: 'pt-5 pt-lg-4 mt-lg-2'
})(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var Row = _styledComponents["default"].div.attrs({
  className: 'd-flex justify-content-between'
})(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  width: 100%;\n  padding-top: ", ";\n  margin-bottom: 1.2rem;\n  color: ", ";\n\n  &:last-of-type {\n    margin-bottom: 0;\n  }\n"])), function (props) {
  return props.big ? '1rem' : 0;
}, function (props) {
  return props.big ? props.theme.palette.primary : 'inherit';
});

var SubmitButtonContainer = _styledComponents["default"].div.attrs(function (props) {
  return {
    className: "mb-4 " + (props.mobile ? ' d-lg-none mt-4' : 'd-block')
  };
})(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  @media (max-width: ", ") {\n    display: ", ";\n    & button:hover {\n      background: ", " !important;\n    }\n  }\n  & button {\n    width: 100%;\n    margin-top: 1rem;\n  }\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.breakpoints.md.max;
}, function (props) {
  return props.mobile ? 'block' : 'none';
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.palette.primary;
});

var Box = _styledComponents["default"].div.attrs({
  className: 'px-lg-3 pb-lg-3 pt-lg-2'
})(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  @media (min-width: ", ") {\n    border: 0.1rem solid ", ";\n  }\n"])), function (_ref4) {
  var theme = _ref4.theme;
  return theme.breakpoints.lg.min;
}, function (_ref5) {
  var theme = _ref5.theme;
  return theme.palette.light;
});

var Name = _styledComponents["default"].span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-weight: ", ";\n  line-height: 1;\n  font-size: ", ";\n"])), function (props) {
  return props.big ? '600' : '300';
}, function (props) {
  return props.big ? '1.8rem' : 'inherit';
});

var Value = _styledComponents["default"].span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-weight: ", ";\n  line-height: 1;\n  font-size: ", ";\n\n  ", "\n"])), function (props) {
  return props.big ? '600' : '400';
}, function (props) {
  return props.big ? '1.8rem' : 'inherit';
}, function (props) {
  return !props.big ? (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2["default"])(["\n          * {\n            font-size: inherit !important;\n          }\n        "]))) : '';
});

var GDPRLabel = _styledComponents["default"].span(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  & > div {\n    & > a {\n      text-decoration: underline;\n    }\n  }\n  font-size: 1.18rem;\n"])));
//# sourceMappingURL=index.js.map