fix: update financial forms to use new formatted amount utilities and add adjustment fields

packages/webapp/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormHeader.tsx

@@ -1,11 +1,9 @@
 // @ts-nocheck
 import React from 'react';
 import intl from 'react-intl-universal';
-import { useFormikContext } from 'formik';
 import CreditNoteFormHeaderFields from './CreditNoteFormHeaderFields';
-
-import { getEntriesTotal } from '@/containers/Entries/utils';
 import { Group, PageFormBigNumber } from '@/components';
+import { useCreditNoteTotalFormatted } from './utils';
 
 /**
  * Credit note header.
@@ -31,18 +29,12 @@ function CreditNoteFormHeader() {
  * @returns {React.ReactNode}
  */
 function CreditNoteFormBigNumber() {
-  const {
-    values: { entries, currency_code },
-  } = useFormikContext();
-
-  // Calculate the total amount.
-  const totalAmount = React.useMemo(() => getEntriesTotal(entries), [entries]);
+  const totalFormatted = useCreditNoteTotalFormatted();
 
   return (
     <PageFormBigNumber
       label={intl.get('credit_note.label_amount_to_credit')}
-      amount={totalAmount}
-      currencyCode={currency_code}
+      amount={totalFormatted}
     />
   );
 }

packages/webapp/src/containers/Sales/Estimates/EstimateForm/EstimateFormDialogs.tsx

@@ -1,5 +1,6 @@
 // @ts-nocheck
 import React from 'react';
+import { useFormikContext } from 'formik';
 import EstimateNumberDialog from '@/containers/Dialogs/EstimateNumberDialog';
 
 /**

packages/webapp/src/containers/Sales/Estimates/EstimateForm/EstimateFormHeader.tsx

@@ -1,12 +1,10 @@
 // @ts-nocheck
-import React, { useMemo } from 'react';
+import React from 'react';
 import intl from 'react-intl-universal';
-import { useFormikContext } from 'formik';
-import { x } from '@xstyled/emotion';
 
 import EstimateFormHeaderFields from './EstimateFormHeaderFields';
-import { getEntriesTotal } from '@/containers/Entries/utils';
 import { Group, PageFormBigNumber } from '@/components';
+import { useEstimateTotalFormatted } from './utils';
 
 // Estimate form top header.
 function EstimateFormHeader() {
@@ -29,19 +27,10 @@ function EstimateFormHeader() {
  * @returns {React.ReactNode}
  */
 function EstimateFormBigTotal() {
-  const {
-    values: { entries, currency_code },
-  } = useFormikContext();
-
-  // Calculate the total due amount of bill entries.
-  const totalDueAmount = useMemo(() => getEntriesTotal(entries), [entries]);
+  const totalFormatted = useEstimateTotalFormatted();
 
   return (
-    <PageFormBigNumber
-      label={intl.get('amount')}
-      amount={totalDueAmount}
-      currencyCode={currency_code}
-    />
+    <PageFormBigNumber label={intl.get('amount')} amount={totalFormatted} />
   );
 }
 

packages/webapp/src/containers/Sales/Estimates/EstimateForm/utils.tsx

@@ -245,6 +245,7 @@ export const useEstimateSubtotalFormatted = () => {
  */
 export const useEstimateDiscount = () => {
   const { values } = useFormikContext();
+  const subtotal = useEstimateSubtotal();
   const discount = toSafeNumber(values.discount);
 
   return values?.discount_type === 'percentage'

packages/webapp/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeader.tsx

@@ -1,10 +1,9 @@
 // @ts-nocheck
 import React from 'react';
 import intl from 'react-intl-universal';
-import { useFormikContext } from 'formik';
 import { Group, PageFormBigNumber } from '@/components';
 import InvoiceFormHeaderFields from './InvoiceFormHeaderFields';
-import { useInvoiceDueAmount } from './utils';
+import { useInvoiceTotalFormatted } from './utils';
 
 /**
  * Invoice form header section.
@@ -29,19 +28,11 @@ function InvoiceFormHeader() {
  * @returns {React.ReactNode}
  */
 function InvoiceFormBigTotal() {
-  const {
-    values: { currency_code },
-  } = useFormikContext();
-
   // Calculate the total due amount of invoice entries.
-  const totalDueAmount = useInvoiceDueAmount();
+  const totalFormatted = useInvoiceTotalFormatted();
 
   return (
-    <PageFormBigNumber
-      label={intl.get('due_amount')}
-      amount={totalDueAmount}
-      currencyCode={currency_code}
-    />
+    <PageFormBigNumber label={intl.get('due_amount')} amount={totalFormatted} />
   );
 }
 export default InvoiceFormHeader;

packages/webapp/src/containers/Sales/Invoices/InvoiceForm/utils.tsx

@@ -324,7 +324,7 @@ export const useInvoiceSubtotalFormatted = () => {
 export const useInvoiceDiscountAmount = () => {
   const { values } = useFormikContext();
   const subtotal = useInvoiceSubtotal();
-  const discount = parseFloat(values.discount);
+  const discount = toSafeNumber(values.discount);
 
   return values?.discount_type === 'percentage'
     ? (subtotal * discount) / 100
@@ -350,7 +350,7 @@ export const useInvoiceDiscountAmountFormatted = () => {
  */
 export const useInvoiceAdjustmentAmount = () => {
   const { values } = useFormikContext();
-  const adjustment = parseFloat(values.adjustment);
+  const adjustment = toSafeNumber(values.adjustment);
 
   return adjustment;
 };

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

@@ -1,10 +1,9 @@
 // @ts-nocheck
-import React, { useMemo } from 'react';
+import React from 'react';
 import intl from 'react-intl-universal';
-import { useFormikContext } from 'formik';
 import { Group, PageFormBigNumber } from '@/components';
 import ReceiptFormHeaderFields from './ReceiptFormHeaderFields';
-import { getEntriesTotal } from '@/containers/Entries/utils';
+import { useReceiptTotalFormatted } from './utils';
 
 /**
  * Receipt form header section.
@@ -35,19 +34,10 @@ function ReceiptFormHeader({
  * @returns {React.ReactNode}
  */
 function ReceiptFormHeaderBigTotal() {
-  const {
-    values: { currency_code, entries },
-  } = useFormikContext();
-
-  // Calculate the total due amount of bill entries.
-  const totalDueAmount = useMemo(() => getEntriesTotal(entries), [entries]);
+  const totalFormatted = useReceiptTotalFormatted();
 
   return (
-    <PageFormBigNumber
-      label={intl.get('due_amount')}
-      amount={totalDueAmount}
-      currencyCode={currency_code}
-    />
+    <PageFormBigNumber label={intl.get('due_amount')} amount={totalFormatted} />
   );
 }