fix: FastField re-rendering.

fix: Allocate landed cost dialog.

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeaderFields.js

@@ -10,7 +10,10 @@ import { FastField, Field, ErrorMessage } from 'formik';
 import { FormattedMessage as T } from 'components';
 import { momentFormatter, compose, tansformDateValue } from 'utils';
 import classNames from 'classnames';
-import { useObserveInvoiceNoSettings } from './utils';
+import {
+  useObserveInvoiceNoSettings,
+  customerNameFieldShouldUpdate,
+} from './utils';
 import { CLASSES } from 'common/classes';
 import {
   ContactSelecetList,
@@ -58,15 +61,16 @@ function InvoiceFormHeaderFields({
   };
 
   // Syncs invoice number settings with form.
-  useObserveInvoiceNoSettings(
-    invoiceNumberPrefix,
-    invoiceNextNumber,
-  );
+  useObserveInvoiceNoSettings(invoiceNumberPrefix, invoiceNextNumber);
 
   return (
     <div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
       {/* ----------- Customer name ----------- */}
-      <FastField name={'customer_id'}>
+      <FastField
+        name={'customer_id'}
+        customers={customers}
+        shouldUpdate={customerNameFieldShouldUpdate}
+      >
         {({ form, field: { value }, meta: { error, touched } }) => (
           <FormGroup
             label={<T id={'customer_name'} />}
@@ -168,7 +172,9 @@ function InvoiceFormHeaderFields({
                 }}
                 tooltip={true}
                 tooltipProps={{
-                  content: <T id={'setting_your_auto_generated_invoice_number'}/>,
+                  content: (
+                    <T id={'setting_your_auto_generated_invoice_number'} />
+                  ),
                   position: Position.BOTTOM_LEFT,
                 }}
               />

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceItemsEntriesEditorField.js

@@ -4,6 +4,7 @@ import classNames from 'classnames';
 import { CLASSES } from 'common/classes';
 import ItemsEntriesTable from 'containers/Entries/ItemsEntriesTable';
 import { useInvoiceFormContext } from './InvoiceFormProvider';
+import { entriesFieldShouldUpdate } from './utils';
 
 /**
  * Invoice items entries editor field.
@@ -13,7 +14,11 @@ export default function InvoiceItemsEntriesEditorField() {
 
   return (
     <div className={classNames(CLASSES.PAGE_FORM_BODY)}>
-      <FastField name={'entries'}>
+      <FastField
+        name={'entries'}
+        items={items}
+        shouldUpdate={entriesFieldShouldUpdate}
+      >
         {({
           form: { values, setFieldValue },
           field: { value },

client/src/containers/Sales/Invoices/InvoiceForm/utils.js

@@ -11,7 +11,7 @@ import { updateItemsEntriesTotal } from 'containers/Entries/utils';
 import { useFormikContext } from 'formik';
 import { Intent } from '@blueprintjs/core';
 
-import { orderingLinesIndexes } from 'utils';
+import { defaultFastFieldShouldUpdate } from 'utils';
 import intl from 'react-intl-universal';
 import { ERROR } from 'common/errors';
 import { AppToaster } from 'components';
@@ -100,4 +100,18 @@ export const useObserveInvoiceNoSettings = (prefix, nextNumber) => {
     const invoiceNo = transactionNumber(prefix, nextNumber);
     setFieldValue('invoice_no', invoiceNo);
   }, [setFieldValue, prefix, nextNumber]);
-};
+};
+
+export const customerNameFieldShouldUpdate = (newProps, oldProps) => {
+  return (
+    newProps.customers !== oldProps.customers ||
+    defaultFastFieldShouldUpdate(newProps, oldProps)
+  );
+};
+
+export const entriesFieldShouldUpdate = (newProps, oldProps) => {
+  return (
+    newProps.items !== oldProps.items ||
+    defaultFastFieldShouldUpdate(newProps, oldProps)
+  );
+};