refactor: update estimate and receipt forms to use new subtotal and total formatting utilities

packages/webapp/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormFooterRight.tsx

@@ -12,23 +12,23 @@ import {
 import {
   useReceiptAdjustmentFormatted,
   useReceiptDiscountAmountFormatted,
+  useReceiptSubtotalFormatted,
+  useReceiptTotalFormatted,
   useReceiptTotals,
 } from './utils';
 import { DiscountTotalLine } from '../../Invoices/InvoiceForm/DiscountTotalLine';
 import { AdjustmentTotalLine } from '../../Invoices/InvoiceForm/AdjustmentTotalLine';
 
 export function ReceiptFormFooterRight() {
-  const {
-    formattedSubtotal,
-    formattedTotal,
-    formattedDueTotal,
-    formattedPaymentTotal,
-  } = useReceiptTotals();
+  const { formattedDueTotal, formattedPaymentTotal } = useReceiptTotals();
 
   const {
     values: { currency_code },
   } = useFormikContext();
 
+  const subtotalFormatted = useReceiptSubtotalFormatted();
+  const totalFormatted = useReceiptTotalFormatted();
+
   const discountAmount = useReceiptDiscountAmountFormatted();
   const adjustmentAmount = useReceiptAdjustmentFormatted();
 
@@ -36,7 +36,7 @@ export function ReceiptFormFooterRight() {
     <ReceiptTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
       <TotalLine
         title={<T id={'receipt_form.label.subtotal'} />}
-        value={formattedSubtotal}
+        value={subtotalFormatted}
       />
       <DiscountTotalLine
         currencyCode={currency_code}
@@ -45,7 +45,7 @@ export function ReceiptFormFooterRight() {
       <AdjustmentTotalLine adjustmentAmount={adjustmentAmount} />
       <TotalLine
         title={<T id={'receipt_form.label.total'} />}
-        value={formattedTotal}
+        value={totalFormatted}
         borderStyle={TotalLineBorderStyle.SingleDark}
         textStyle={TotalLineTextStyle.Bold}
       />

packages/webapp/src/containers/Sales/Receipts/ReceiptForm/utils.tsx

@@ -268,14 +268,40 @@ export const useReceiptSubtotal = () => {
   return subtotal;
 };
 
+/**
+ * Retrieves the formatted subtotal.
+ * @returns {string}
+ */
+export const useReceiptSubtotalFormatted = () => {
+  const subtotal = useReceiptSubtotal();
+  const { values } = useFormikContext();
+
+  return formattedAmount(subtotal, values.currency_code, { money: true });
+};
+
+/**
+ * Retrieves the receipt discount amount.
+ * @returns {number}
+ */
+export const useReceiptDiscountAmount = () => {
+  const { values } = useFormikContext();
+  const subtotal = useReceiptSubtotal();
+  const discount = toSafeNumber(values.discount);
+
+  return values?.discount_type === 'percentage'
+    ? (subtotal * discount) / 100
+    : discount;
+};
+
 /**
  * Retrieves the formatted discount amount.
  * @returns {string}
  */
 export const useReceiptDiscountAmountFormatted = () => {
   const { values } = useFormikContext();
+  const discount = useReceiptDiscountAmount();
 
-  return formattedAmount(values.discount, values.currency_code);
+  return formattedAmount(discount, values.currency_code);
 };
 
 /**