Skip to content

Commit

Permalink
Merge pull request #20 from Adyen/PW-7651
Browse files Browse the repository at this point in the history 
[PW-7651] - Apple Pay & Google Pay currency and the currency symbol issue
  • Loading branch information
@RokPopov
RokPopov authored Dec 20, 2022
2 parents 6301e99 + fa54262 commit 0aa9d4b
Show file tree
Hide file tree
Showing 4 changed files with 75 additions and 25 deletions.
30 changes: 24 additions & 6 deletions view/frontend/web/js/applepay/button.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@ define([
'Adyen_ExpressCheckout/js/helpers/validatePdpForm',
'Adyen_ExpressCheckout/js/model/config',
'Adyen_ExpressCheckout/js/model/countries',
'Adyen_ExpressCheckout/js/model/totals'
'Adyen_ExpressCheckout/js/model/totals',
'Adyen_ExpressCheckout/js/model/currency'
],
function (
Component,
Expand Down Expand Up @@ -56,7 +57,8 @@ define([
validatePdpForm,
configModel,
countriesModel,
totalsModel
totalsModel,
currencyModel
) {
'use strict';

Expand Down Expand Up @@ -87,6 +89,7 @@ define([

setExpressMethods(response);
totalsModel().setTotal(response.totals.grand_total);
currencyModel().setCurrency(response.totals.quote_currency_code)

const $priceBox = getPdpPriceBox();
const pdpForm = getPdpForm(element);
Expand Down Expand Up @@ -142,6 +145,11 @@ define([
});
const applePayConfiguration = this.getApplePayConfiguration(applePaymentMethod, element);

if (this.isProductView) {
applePayConfiguration.currencyCode = currencyModel().getCurrency();
applePayConfiguration.amount.currency = currencyModel().getCurrency();
}

this.applePayComponent = adyenCheckoutComponent.create(
'applepay',
applePayConfiguration
Expand Down Expand Up @@ -186,10 +194,20 @@ define([
const config = configModel().getConfig();
const countryCode = config.countryCode === 'UK' ? 'GB' : config.countryCode;
const pdpForm = getPdpForm(element);
let currency;

if (this.isProductView) {
currency = currencyModel().getCurrency();
} else {
const cartData = customerData.get('cart');
const adyenMethods = cartData()['adyen_payment_methods'];
const paymentMethodExtraDetails = adyenMethods.paymentMethodsExtraDetails[applePaymentMethod.type];
currency = paymentMethodExtraDetails.configuration.amount.currency;
}

return {
countryCode: countryCode,
currencyCode: config.currency,
currencyCode: currency,
totalPriceLabel: $t('Grand Total'),
configuration: {
domainName: window.location.hostname,
Expand All @@ -200,7 +218,7 @@ define([
value: this.isProductView
? formatAmount(totalsModel().getTotal() * 100)
: formatAmount(getCartSubtotal() * 100),
currency: config.currency
currency: currency
},
supportedNetworks: getSupportedNetworks(),
merchantCapabilities: ['supports3DS'],
Expand Down Expand Up @@ -285,7 +303,7 @@ define([
applePayShippingContactUpdate.newShippingMethods = shippingMethods;
applePayShippingContactUpdate.newTotal = {
label: $t('Grand Total'),
amount: response.base_grand_total.toString()
amount: response.grand_total.toString()
};
applePayShippingContactUpdate.newLineItems = [
{
Expand Down Expand Up @@ -332,7 +350,7 @@ define([
applePayShippingMethodUpdate.newTotal = {
type: 'final',
label: $t('Grand Total'),
amount: response.base_grand_total.toString()
amount: response.grand_total.toString()
};
applePayShippingMethodUpdate.newLineItems = [
{
Expand Down
47 changes: 30 additions & 17 deletions view/frontend/web/js/googlepay/button.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,8 @@ define([
'Adyen_ExpressCheckout/js/helpers/validatePdpForm',
'Adyen_ExpressCheckout/js/model/config',
'Adyen_ExpressCheckout/js/model/countries',
'Adyen_ExpressCheckout/js/model/totals'
'Adyen_ExpressCheckout/js/model/totals',
'Adyen_ExpressCheckout/js/model/currency'
],
function (
Component,
Expand Down Expand Up @@ -54,7 +55,8 @@ define([
validatePdpForm,
configModel,
countriesModel,
totalsModel
totalsModel,
currencyModel
) {
'use strict';

Expand Down Expand Up @@ -111,6 +113,7 @@ define([

setExpressMethods(response);
totalsModel().setTotal(response.totals.grand_total);
currencyModel().setCurrency(response.totals.quote_currency_code)

const $priceBox = getPdpPriceBox();
const pdpForm = getPdpForm(element);
Expand Down Expand Up @@ -192,6 +195,16 @@ define([
const googlePayStyles = getGooglePayStyles();
const config = configModel().getConfig();
const pdpForm = getPdpForm(element);
let currency;

if (this.isProductView) {
currency = currencyModel().getCurrency();
} else {
const cartData = customerData.get('cart');
const adyenMethods = cartData()['adyen_payment_methods'];
const paymentMethodExtraDetails = adyenMethods.paymentMethodsExtraDetails[googlePaymentMethod.type];
currency = paymentMethodExtraDetails.configuration.amount.currency;
}

return {
showPayButton: true,
Expand All @@ -215,7 +228,7 @@ define([
totalPrice: this.isProductView
? formatAmount(totalsModel().getTotal())
: formatAmount(getCartSubtotal()),
currencyCode: config.currency
currencyCode: currency
},
paymentDataCallbacks: {
onPaymentDataChanged: this.onPaymentDataChanged.bind(this)
Expand Down Expand Up @@ -254,18 +267,6 @@ define([
return;
}

const shippingMethods = response.map((shippingMethod) => {
const label = shippingMethod.price_incl_tax
? formatCurrency(shippingMethod.price_incl_tax) + ' - ' + shippingMethod.method_title
: shippingMethod.method_title;

return {
id: shippingMethod.method_code,
label: label,
description: shippingMethod.carrier_title
};
});

this.shippingMethods = response;
const selectedShipping = data.shippingOptionData.id === 'shipping_option_unselected'
? response[0]
Expand All @@ -287,6 +288,18 @@ define([

setTotalsInfo(totalsPayload, this.isProductView)
.done(function (totals) {
const shippingMethods = response.map((shippingMethod) => {
const label = shippingMethod.price_incl_tax
? formatCurrency(shippingMethod.price_incl_tax, totals.quote_currency_code) + ' - ' + shippingMethod.method_title
: shippingMethod.method_title;

return {
id: shippingMethod.method_code,
label: label,
description: shippingMethod.carrier_title
};
});

const paymentDataRequestUpdate = {
newShippingOptionParameters: {
defaultSelectedOptionId: selectedShipping.method_code,
Expand All @@ -301,9 +314,9 @@ define([
status: 'FINAL'
}
],
currencyCode: totals.base_currency_code,
currencyCode: totals.quote_currency_code,
totalPriceStatus: 'FINAL',
totalPrice: totals.base_grand_total.toString(),
totalPrice: totals.grand_total.toString(),
totalPriceLabel: 'Total',
countryCode: configModel().getConfig().countryCode
}
Expand Down
4 changes: 2 additions & 2 deletions view/frontend/web/js/helpers/formatCurrency.js
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
define(['Adyen_ExpressCheckout/js/model/config'], function (configModel) {
'use strict';

return function (amount) {
return function (amount, currency) {
const config = configModel().getConfig();
const locale = config.locale.replace('_', '-');
const options = {
style: 'currency',
currency: config.currency
currency: currency
};

return new Intl.NumberFormat(locale, options).format(amount);
Expand Down
19 changes: 19 additions & 0 deletions view/frontend/web/js/model/currency.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
define([
'uiComponent',
'ko'
], function (Component, ko) {
'use strict';
return Component.extend({
defaults: {
currency: ko.observable(0).extend({notify: 'always'})
},

getCurrency: function () {
return this.currency();
},

setCurrency: function (currency) {
return this.currency(currency);
}
});
});

0 comments on commit 0aa9d4b

Please sign in to comment.