Merge pull request #268 from ArjenMiedema/implement-taxes

Fetch applied taxes and subtotal incl and excl VAT
hyva-themes · Feb 11, 2022 · f0ae3ef · f0ae3ef
2 parents 1fedb09 + 904f98d
commit f0ae3ef
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 10 deletions.
diff --git a/src/reactapp/src/api/cart/fetchGuestCart/modifier.js b/src/reactapp/src/api/cart/fetchGuestCart/modifier.js
@@ -42,21 +42,33 @@ function modifyCartItemsData(cartItems) {
 
 function modifyCartPricesData(cartPrices) {
   const grandTotal = _get(cartPrices, 'grand_total', {});
-  const subTotal = _get(cartPrices, 'subtotal_including_tax', {});
+  const subTotalIncl = _get(cartPrices, 'subtotal_including_tax', {});
+  const subTotalExcl = _get(cartPrices, 'subtotal_excluding_tax', {});
   const discountPrices = _get(cartPrices, 'discounts', []) || [];
   const discounts = discountPrices.map((discount) => ({
     label: discount.label,
     price: formatPrice(-discount.amount.value, true),
     amount: discount.amount.value,
   }));
+  const appliedTaxAmounts = _get(cartPrices, 'applied_taxes', []) || [];
+  const appliedTaxes = appliedTaxAmounts.map((tax) => ({
+    label: tax.label,
+    price: formatPrice(tax.amount.value),
+    amount: tax.amount.value,
+  }));
   const grandTotalAmount = _get(grandTotal, 'value');
-  const subTotalAmount = _get(subTotal, 'value');
+  const subTotalInclAmount = _get(subTotalIncl, 'value');
+  const subTotalExclAmount = _get(subTotalExcl, 'value');
 
   return {
     discounts,
     hasDiscounts: !_isArrayEmpty(discountPrices),
-    subTotal: formatPrice(subTotalAmount),
-    subTotalAmount,
+    appliedTaxes,
+    hasAppliedTaxes: !_isArrayEmpty(appliedTaxAmounts),
+    subTotalIncl: formatPrice(subTotalInclAmount),
+    subTotalInclAmount,
+    subTotalExcl: formatPrice(subTotalExclAmount),
+    subTotalExclAmount,
     grandTotal: formatPrice(grandTotalAmount),
     grandTotalAmount,
   };

diff --git a/src/reactapp/src/api/cart/utility/query/cartPriceInfo.js b/src/reactapp/src/api/cart/utility/query/cartPriceInfo.js
@@ -4,10 +4,21 @@ prices {
     value
     currency
   }
+  subtotal_excluding_tax {
+    value
+    currency
+  }
   subtotal_including_tax {
     value
     currency
   }
+  applied_taxes {
+    label
+    amount {
+      currency
+      value
+    }
+  }
   discounts {
     label
     amount {

diff --git a/src/reactapp/src/components/totals/Totals.jsx b/src/reactapp/src/components/totals/Totals.jsx
@@ -7,10 +7,13 @@ import useTotalsCartContext from './hooks/useTotalsCartContext';
 
 function Totals() {
   const {
-    subTotal,
+    subTotalIncl,
+    subTotalExcl,
     discounts,
+    appliedTaxes,
     grandTotal,
     hasSubTotal,
+    hasAppliedTaxes,
     hasDiscounts,
     hasShippingRate,
     shippingMethodRate,
@@ -25,7 +28,7 @@ function Totals() {
               {hasSubTotal && (
                 <div className="flex justify-between">
                   <div>{__('Cart Subtotal')}</div>
-                  <div>{subTotal}</div>
+                  <div>{subTotalIncl}</div>
                 </div>
               )}
 
@@ -35,6 +38,15 @@ function Totals() {
                   <div>{shippingMethodRate}</div>
                 </div>
               )}
+              {hasAppliedTaxes &&
+                appliedTaxes.map((appliedTax) => (
+                  <div key={appliedTax.label} className="flex justify-between">
+                    <div>
+                      {__('Tax')} {__(appliedTax.label)}
+                    </div>
+                    <div>{appliedTax.price}</div>
+                  </div>
+                ))}
               {hasDiscounts &&
                 discounts.map((discount) => (
                   <div key={discount.label} className="flex justify-between">

diff --git a/src/reactapp/src/components/totals/hooks/useTotalsCartContext.js b/src/reactapp/src/components/totals/hooks/useTotalsCartContext.js
@@ -10,21 +10,27 @@ export default function useTotalsCartContext() {
   const prices = _get(cart, 'prices') || {};
   const { price: shippingMethodRate } = shippingMethod;
   const {
-    subTotal,
+    subTotalIncl,
+    subTotalExcl,
     grandTotal,
+    appliedTaxes,
+    hasAppliedTaxes,
     discounts,
     hasDiscounts,
-    subTotalAmount,
+    subTotalInclAmount,
     grandTotalAmount,
   } = prices;
 
   return {
-    subTotal,
+    subTotalIncl,
+    subTotalExcl,
     grandTotal,
     discounts,
+    appliedTaxes,
     shippingMethodRate,
     hasDiscounts,
-    hasSubTotal: !!subTotalAmount,
+    hasAppliedTaxes,
+    hasSubTotal: !!subTotalInclAmount,
     hasGrandTotal: !!grandTotalAmount,
     hasShippingRate: !!shippingMethod?.id,
   };