fix: FastField re-rendering.

fix: Allocate landed cost dialog.

client/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormHeaderFields.js

@@ -28,7 +28,11 @@ import {
   inputIntent,
 } from 'utils';
 import { useReceiptFormContext } from './ReceiptFormProvider';
-import { useObserveReceiptNoSettings } from './utils';
+import {
+  accountsFieldShouldUpdate,
+  customersFieldShouldUpdate,
+  useObserveReceiptNoSettings,
+} from './utils';
 
 /**
  * Receipt form header fields.
@@ -70,7 +74,11 @@ function ReceiptFormHeader({
   return (
     <div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
       {/* ----------- Customer name ----------- */}
-      <FastField name={'customer_id'}>
+      <FastField
+        name={'customer_id'}
+        customers={customers}
+        shouldUpdate={customersFieldShouldUpdate}
+      >
         {({ form, field: { value }, meta: { error, touched } }) => (
           <FormGroup
             label={<T id={'customer_name'} />}
@@ -94,7 +102,11 @@ function ReceiptFormHeader({
       </FastField>
 
       {/* ----------- Deposit account ----------- */}
-      <FastField name={'deposit_account_id'}>
+      <FastField
+        name={'deposit_account_id'}
+        accounts={accounts}
+        shouldUpdate={accountsFieldShouldUpdate}
+      >
         {({ form, field: { value }, meta: { error, touched } }) => (
           <FormGroup
             label={<T id={'deposit_account'} />}

client/src/containers/Sales/Receipts/ReceiptForm/ReceiptItemsEntriesEditor.js

@@ -4,13 +4,14 @@ import { FastField } from 'formik';
 import ItemsEntriesTable from 'containers/Entries/ItemsEntriesTable';
 import { CLASSES } from 'common/classes';
 import { useReceiptFormContext } from './ReceiptFormProvider';
+import { entriesFieldShouldUpdate } from './utils';
 
 export default function ReceiptItemsEntriesEditor({ defaultReceipt }) {
   const { items } = useReceiptFormContext();
 
   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/Receipts/ReceiptForm/utils.js

@@ -1,7 +1,12 @@
 import React from 'react';
 import { useFormikContext } from 'formik';
 import moment from 'moment';
-import { transactionNumber, repeatValue, transformToForm } from 'utils';
+import {
+  defaultFastFieldShouldUpdate,
+  transactionNumber,
+  repeatValue,
+  transformToForm,
+} from 'utils';
 
 export const MIN_LINES_NUMBER = 4;
 
@@ -42,7 +47,6 @@ export const transformToEditForm = (receipt) => ({
   ],
 });
 
-
 export const useObserveReceiptNoSettings = (prefix, nextNumber) => {
   const { setFieldValue } = useFormikContext();
 
@@ -50,4 +54,34 @@ export const useObserveReceiptNoSettings = (prefix, nextNumber) => {
     const receiptNo = transactionNumber(prefix, nextNumber);
     setFieldValue('receipt_number', receiptNo);
   }, [setFieldValue, prefix, nextNumber]);
-}
+};
+
+/**
+ * Detarmines entries fast field should update.
+ */
+export const entriesFieldShouldUpdate = (newProps, oldProps) => {
+  return (
+    newProps.items !== oldProps.items ||
+    defaultFastFieldShouldUpdate(newProps, oldProps)
+  );
+};
+
+/**
+ * Detarmines accounts fast field should update.
+ */
+export const accountsFieldShouldUpdate = (newProps, oldProps) => {
+  return (
+    newProps.accounts !== oldProps.accounts ||
+    defaultFastFieldShouldUpdate(newProps, oldProps)
+  );
+};
+
+/**
+ * Detarmines customers fast field should update.
+ */
+export const customersFieldShouldUpdate = (newProps, oldProps) => {
+  return (
+    newProps.customers !== oldProps.customers ||
+    defaultFastFieldShouldUpdate(newProps, oldProps)
+  );
+};