Fix: Change Customer & Vendor List to ContactSelectList

client/src/containers/Sales/Receipt/ReceiptFormHeader.js

@@ -15,7 +15,7 @@ import classNames from 'classnames';
 import { CLASSES } from 'common/classes';
 import {
   AccountsSelectList,
-  ListSelect,
+  ContactSelecetList,
   ErrorMessage,
   FieldRequiredHint,
   Icon,
@@ -44,32 +44,6 @@ function ReceiptFormHeader({
     [setFieldValue],
   );
 
-  const CustomerRenderer = useCallback(
-    (cutomer, { handleClick }) => (
-      <MenuItem
-        key={cutomer.id}
-        text={cutomer.display_name}
-        onClick={handleClick}
-      />
-    ),
-    [],
-  );
-
-  // Filter Customer
-  const filterCustomer = (query, customer, _index, exactMatch) => {
-    const normalizedTitle = customer.display_name.toLowerCase();
-    const normalizedQuery = query.toLowerCase();
-    if (exactMatch) {
-      return normalizedTitle === normalizedQuery;
-    } else {
-      return (
-        `${customer.display_name} ${normalizedTitle}`.indexOf(
-          normalizedQuery,
-        ) >= 0
-      );
-    }
-  };
-
   // handle change
   const onChangeSelect = useCallback(
     (filedName) => {
@@ -108,17 +82,11 @@ function ReceiptFormHeader({
             <ErrorMessage name={'customer_id'} {...{ errors, touched }} />
           }
         >
-          <ListSelect
-            items={customers}
-            noResults={<MenuItem disabled={true} text="No results." />}
-            itemRenderer={CustomerRenderer}
-            itemPredicate={filterCustomer}
-            popoverProps={{ minimal: true }}
-            onItemSelect={onChangeSelect('customer_id')}
-            selectedItem={values.customer_id}
-            selectedItemProp={'id'}
-            defaultText={<T id={'select_customer_account'} />}
-            labelProp={'display_name'}
+          <ContactSelecetList
+            contactsList={customers}
+            selectedContactId={values.customer_id}
+            defaultSelectText={<T id={'select_customer_account'} />}
+            onContactSelected={onChangeSelect('customer_id')}
           />
         </FormGroup>