refactor: implementing new formatted amount hooks

packages/webapp/src/containers/Purchases/Bills/BillForm/BillFormFooterRight.tsx

@@ -11,24 +11,22 @@ import {
   useBillAdjustmentAmountFormatted,
   useBillAggregatedTaxRates,
   useBillDiscountAmountFormatted,
+  useBillDueAmountFormatted,
+  useBillPaidAmountFormatted,
   useBillSubtotalFormatted,
   useBillTotalFormatted,
-  useBillTotals,
 } from './utils';
 import { TaxType } from '@/interfaces/TaxRates';
 import { AdjustmentTotalLine } from '@/containers/Sales/Invoices/InvoiceForm/AdjustmentTotalLine';
 import { DiscountTotalLine } from '@/containers/Sales/Invoices/InvoiceForm/DiscountTotalLine';
 
 export function BillFormFooterRight() {
-  const {
-    formattedDueTotal,
-    formattedPaymentTotal,
-  } = useBillTotals();
-
   const {
     values: { inclusive_exclusive_tax, currency_code },
   } = useFormikContext();
 
+  const dueAmountFormatted = useBillDueAmountFormatted();
+  const paidAmountFormatted = useBillPaidAmountFormatted();
   const subtotalFormatted = useBillSubtotalFormatted();
   const totalFormatted = useBillTotalFormatted();
   const taxEntries = useBillAggregatedTaxRates();
@@ -68,12 +66,12 @@ export function BillFormFooterRight() {
       />
       <TotalLine
         title={'Paid Amount'}
-        value={formattedPaymentTotal}
+        value={paidAmountFormatted}
         borderStyle={TotalLineBorderStyle.None}
       />
       <TotalLine
         title={'Due Amount'}
-        value={formattedDueTotal}
+        value={dueAmountFormatted}
         textStyle={TotalLineTextStyle.Bold}
       />
     </BillTotalLines>

packages/webapp/src/containers/Purchases/Bills/BillForm/utils.tsx

@@ -260,58 +260,6 @@ export const useSetPrimaryWarehouseToForm = () => {
   }, [isWarehousesSuccess, setFieldValue, warehouses]);
 };
 
-/**
- * Retreives the bill totals.
- */
-export const useBillTotals = () => {
-  const {
-    values: { currency_code: currencyCode },
-  } = useFormikContext();
-
-  // Retrieves the bill subtotal.
-  const subtotal = useBillSubtotal();
-  const total = useBillTotal();
-
-  // Retrieves the formatted total money.
-  const formattedTotal = React.useMemo(
-    () => formattedAmount(total, currencyCode),
-    [total, currencyCode],
-  );
-  // Retrieves the formatted subtotal.
-  const formattedSubtotal = React.useMemo(
-    () => formattedAmount(subtotal, currencyCode, { money: false }),
-    [subtotal, currencyCode],
-  );
-  // Retrieves the payment total.
-  const paymentTotal = React.useMemo(() => 0, []);
-
-  // Retireves the formatted payment total.
-  const formattedPaymentTotal = React.useMemo(
-    () => formattedAmount(paymentTotal, currencyCode),
-    [paymentTotal, currencyCode],
-  );
-  // Retrieves the formatted due total.
-  const dueTotal = React.useMemo(
-    () => total - paymentTotal,
-    [total, paymentTotal],
-  );
-  // Retrieves the formatted due total.
-  const formattedDueTotal = React.useMemo(
-    () => formattedAmount(dueTotal, currencyCode),
-    [dueTotal, currencyCode],
-  );
-
-  return {
-    total,
-    paymentTotal,
-    dueTotal,
-    formattedTotal,
-    formattedSubtotal,
-    formattedPaymentTotal,
-    formattedDueTotal,
-  };
-};
-
 /**
  * Detarmines whether the bill has foreign customer.
  * @returns {boolean}
@@ -377,9 +325,9 @@ export const useBillSubtotal = () => {
  */
 export const useBillSubtotalFormatted = () => {
   const subtotal = useBillSubtotal();
-  const { currency_code: currencyCode } = useFormikContext();
+  const { values} = useFormikContext();
 
-  return formattedAmount(subtotal, currencyCode);
+  return formattedAmount(subtotal, values.currency_code);
 };
 
 /**
@@ -398,9 +346,9 @@ export const useBillDiscountAmount = () => {
  */
 export const useBillDiscountAmountFormatted = () => {
   const discountAmount = useBillDiscountAmount();
-  const { currency_code: currencyCode } = useFormikContext();
+  const { values } = useFormikContext();
 
-  return formattedAmount(discountAmount, currencyCode);
+  return formattedAmount(discountAmount, values.currency_code);
 };
 
 /**
@@ -419,9 +367,9 @@ export const useBillAdjustmentAmount = () => {
  */
 export const useBillAdjustmentAmountFormatted = () => {
   const adjustmentAmount = useBillAdjustmentAmount();
-  const { currency_code: currencyCode } = useFormikContext();
+  const { values } = useFormikContext();
 
-  return formattedAmount(adjustmentAmount, currencyCode);
+  return formattedAmount(adjustmentAmount, values.currency_code);
 };
 
 /**
@@ -436,6 +384,7 @@ export const useBillTotalTaxAmount = () => {
       .filter((entry) => entry.tax_amount)
       .sumBy('tax_amount')
       .value();
+
   }, [values.entries]);
 };
 
@@ -473,7 +422,50 @@ export const useBillTotal = () => {
  */
 export const useBillTotalFormatted = () => {
   const total = useBillTotal();
-  const { currency_code: currencyCode } = useFormikContext();
+  const { values } = useFormikContext();
 
-  return formattedAmount(total, currencyCode);
+  return formattedAmount(total, values.currency_code);
+};
+
+/**
+ * Retrieves the bill paid amount.
+ * @returns {number}
+ */
+export const useBillPaidAmount = () => {
+  const { values } = useFormikContext();
+
+  return toSafeNumber(0);
+};
+
+/**
+ * Retrieves the bill paid amount formatted.
+ * @returns {string}
+ */
+export const useBillPaidAmountFormatted = () => {
+  const paidAmount = useBillPaidAmount();
+  const { values } = useFormikContext();
+
+  return formattedAmount(paidAmount, values.currency_code);
+};
+
+/**
+ * Retrieves the bill due amount.
+ * @returns {number}
+ */
+export const useBillDueAmount = () => {
+  const total = useBillTotal();
+  const paidAmount = useBillPaidAmount();
+
+  return total - paidAmount;
+};
+
+/**
+ * Retrieves the bill due amount formatted.
+ * @returns {string}
+ */
+export const useBillDueAmountFormatted = () => {
+  const dueAmount = useBillDueAmount();
+  const { values } = useFormikContext();
+
+  return formattedAmount(dueAmount, values.currency_code);
 };

packages/webapp/src/containers/Purchases/CreditNotes/CreditNoteForm/VendorCreditNoteFormFooterRight.tsx

@@ -5,7 +5,7 @@ import { useFormikContext } from 'formik';
 import { T, TotalLines, TotalLine, TotalLineTextStyle } from '@/components';
 import {
   useVendorCreditAdjustmentAmountFormatted,
-  useVendorCreditDiscountAmount,
+  useVendorCreditDiscountAmountFormatted,
   useVendorCreditSubtotalFormatted,
   useVendorCreditTotalFormatted,
 } from './utils';
@@ -19,8 +19,8 @@ export function VendorCreditNoteFormFooterRight() {
   const totalFormatted = useVendorCreditTotalFormatted();
   const subtotalFormatted = useVendorCreditSubtotalFormatted();
 
-  const discountAmount = useVendorCreditDiscountAmount();
-  const adjustmentAmount = useVendorCreditAdjustmentAmountFormatted();
+  const discountAmountFormatted = useVendorCreditDiscountAmountFormatted();
+  const adjustmentAmountFormatted = useVendorCreditAdjustmentAmountFormatted();
 
   return (
     <VendorCreditNoteTotalLines
@@ -33,9 +33,9 @@ export function VendorCreditNoteFormFooterRight() {
       />
       <DiscountTotalLine
         currencyCode={currency_code}
-        discountAmount={discountAmount}
+        discountAmount={discountAmountFormatted}
       />
-      <AdjustmentTotalLine adjustmentAmount={adjustmentAmount} />
+      <AdjustmentTotalLine adjustmentAmount={adjustmentAmountFormatted} />
       <TotalLine
         title={<T id={'vendor_credit_form.label.total'} />}
         value={totalFormatted}

packages/webapp/src/containers/Purchases/CreditNotes/CreditNoteForm/utils.tsx

@@ -185,32 +185,6 @@ export const useSetPrimaryWarehouseToForm = () => {
   }, [isWarehousesSuccess, setFieldValue, warehouses]);
 };
 
-export const useVendorCrditNoteTotals = () => {
-  const {
-    values: { entries, currency_code: currencyCode },
-  } = useFormikContext();
-
-  // Retrieves the invoice entries total.
-  const total = React.useMemo(() => getEntriesTotal(entries), [entries]);
-
-  // Retrieves the formatted total money.
-  const formattedTotal = React.useMemo(
-    () => formattedAmount(total, currencyCode),
-    [total, currencyCode],
-  );
-  // Retrieves the formatted subtotal.
-  const formattedSubtotal = React.useMemo(
-    () => formattedAmount(total, currencyCode, { money: false }),
-    [total, currencyCode],
-  );
-
-  return {
-    total,
-    formattedTotal,
-    formattedSubtotal,
-  };
-};
-
 /**
  * Retrieves the vendor credit subtotal.
  * @returns {number}