| 1 |
import { ExperimentalOrderMeta, registerCheckoutFilters, TotalsItem } from "@woocommerce/blocks-checkout"; |
| 2 |
import { FormattedMonetaryAmount } from "@woocommerce/blocks-components"; |
| 3 |
import { __, sprintf } from "@wordpress/i18n"; |
| 4 |
import { registerPlugin } from "@wordpress/plugins"; |
| 5 |
|
| 6 |
import { formatPrice, getCurrencyFromPriceResponse } from "@woocommerce/price-format"; |
| 7 |
// import { useStoreCart } from "@woocommerce/base-context/hooks"; |
| 8 |
|
| 9 |
const modifyCartItemPrice = (defaultValue, extensions, args, validation) => { |
| 10 |
const { sdevs_subscription } = extensions; |
| 11 |
const { cartItem } = args; |
| 12 |
const { totals } = cartItem; |
| 13 |
|
| 14 |
if (totals === undefined) { |
| 15 |
return defaultValue; |
| 16 |
} |
| 17 |
if (totals.line_total === "0") { |
| 18 |
return `<price/> ${__("Due Today", "subscription")}`; |
| 19 |
} |
| 20 |
if (sdevs_subscription && sdevs_subscription.type) { |
| 21 |
// Capitalize the first letter to match product page display |
| 22 |
const capitalizedType = sdevs_subscription.type.charAt(0).toUpperCase() + sdevs_subscription.type.slice(1); |
| 23 |
|
| 24 |
// Check max_no_payment - handle string, number, null, undefined |
| 25 |
const maxPayments = parseInt(sdevs_subscription.max_no_payment, 10); |
| 26 |
const paymentInfo = !isNaN(maxPayments) && maxPayments > 0 ? ` x ${maxPayments}` : ""; |
| 27 |
return `<price/> / ${ |
| 28 |
sdevs_subscription.time && sdevs_subscription.time > 1 ? " " + sdevs_subscription.time + "-" : "" |
| 29 |
}${capitalizedType}${paymentInfo}`; |
| 30 |
} |
| 31 |
return defaultValue; |
| 32 |
}; |
| 33 |
|
| 34 |
const modifySubtotalPriceFormat = (defaultValue, extensions, args, validation) => { |
| 35 |
const { sdevs_subscription } = extensions; |
| 36 |
const { sdevs_subscription: recurrings } = extensions; |
| 37 |
|
| 38 |
if (sdevs_subscription && sdevs_subscription.type) { |
| 39 |
// Capitalize the first letter to match product page display |
| 40 |
const capitalizedType = sdevs_subscription.type.charAt(0).toUpperCase() + sdevs_subscription.type.slice(1); |
| 41 |
|
| 42 |
// Check max_no_payment - handle string, number, null, undefined |
| 43 |
const maxPayments = parseInt(sdevs_subscription.max_no_payment, 10); |
| 44 |
const paymentInfo = !isNaN(maxPayments) && maxPayments > 0 ? ` x ${maxPayments}` : ""; |
| 45 |
|
| 46 |
const timePart = sdevs_subscription.time && sdevs_subscription.time > 1 ? sdevs_subscription.time + "-" : ""; |
| 47 |
const priceText = "<price/>\u00A0" + __("Every", "subscription") + " " + timePart + capitalizedType + paymentInfo; |
| 48 |
|
| 49 |
return priceText; |
| 50 |
} |
| 51 |
|
| 52 |
return defaultValue; |
| 53 |
}; |
| 54 |
|
| 55 |
registerCheckoutFilters("sdevs-subscription", { |
| 56 |
cartItemPrice: modifyCartItemPrice, |
| 57 |
subtotalPriceFormat: modifySubtotalPriceFormat, |
| 58 |
}); |
| 59 |
|
| 60 |
const RecurringTotals = ({ cart, extensions }) => { |
| 61 |
if (Object.keys(extensions).length === 0) { |
| 62 |
return; |
| 63 |
} |
| 64 |
const { cartTotals } = cart; |
| 65 |
const { sdevs_subscription: recurrings } = extensions; |
| 66 |
if (recurrings.length === 0) { |
| 67 |
return; |
| 68 |
} |
| 69 |
|
| 70 |
const currency = getCurrencyFromPriceResponse(cartTotals); |
| 71 |
const multiplier = Math.pow(10, currency.minorUnit); |
| 72 |
|
| 73 |
return ( |
| 74 |
<TotalsItem |
| 75 |
className="wc-block-components-totals-footer-item" |
| 76 |
label={__("Recurring totals", "subscription")} |
| 77 |
description={ |
| 78 |
<div style={{ display: "grid" }}> |
| 79 |
{recurrings.map((recurring) => { |
| 80 |
// Capitalize the first letter to match product page display |
| 81 |
const capitalizedType = recurring.type.charAt(0).toUpperCase() + recurring.type.slice(1); |
| 82 |
|
| 83 |
return ( |
| 84 |
<div style={{ margin: "20px 0", float: "right" }}> |
| 85 |
<div style={{ fontSize: "18px" }}> |
| 86 |
<FormattedMonetaryAmount currency={currency} value={Math.round(recurring.price * multiplier)} /> |
| 87 |
<span class="wpsubs-subscription-timing"> |
| 88 |
/ |
| 89 |
{recurring.time && recurring.time > 1 |
| 90 |
? `${recurring.time + "-" + capitalizedType} ` |
| 91 |
: capitalizedType} |
| 92 |
</span> |
| 93 |
</div> |
| 94 |
<small>{recurring.description}</small> |
| 95 |
{recurring.can_user_cancel === "yes" && |
| 96 |
(recurring.max_no_payment === "" || parseInt(recurring.max_no_payment) === 0) && ( |
| 97 |
<> |
| 98 |
<br /> |
| 99 |
<small>{__("You can cancel subscription at any time!", "subscription")} </small> |
| 100 |
</> |
| 101 |
)} |
| 102 |
{parseInt(recurring.max_no_payment) > 0 && ( |
| 103 |
<> |
| 104 |
<br /> |
| 105 |
<small> |
| 106 |
{sprintf( |
| 107 |
// translators: 1: number of installments, 2: total amount. |
| 108 |
__( |
| 109 |
"This subscription will be billed in %1$s installments, for a total of %2$s.", |
| 110 |
"subscription", |
| 111 |
), |
| 112 |
recurring.max_no_payment, |
| 113 |
formatPrice(Math.round(recurring.price * multiplier * parseInt(recurring.max_no_payment)), { |
| 114 |
currency: currency.code, |
| 115 |
currency_symbol: currency.symbol, |
| 116 |
decimal_separator: currency.decimalSeparator, |
| 117 |
thousand_separator: currency.thousandSeparator, |
| 118 |
precision: currency.minorUnit, |
| 119 |
price_format: currency.priceFormat, |
| 120 |
}), |
| 121 |
)} |
| 122 |
</small> |
| 123 |
</> |
| 124 |
)} |
| 125 |
</div> |
| 126 |
); |
| 127 |
})} |
| 128 |
</div> |
| 129 |
} |
| 130 |
></TotalsItem> |
| 131 |
); |
| 132 |
}; |
| 133 |
|
| 134 |
const render = () => { |
| 135 |
return ( |
| 136 |
<ExperimentalOrderMeta> |
| 137 |
<RecurringTotals /> |
| 138 |
</ExperimentalOrderMeta> |
| 139 |
); |
| 140 |
}; |
| 141 |
|
| 142 |
registerPlugin("sdevs-subscription", { |
| 143 |
render, |
| 144 |
scope: "woocommerce-checkout", |
| 145 |
}); |
| 146 |
|
