feat(Sales & Purchases ): add exchange rate input.

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

@@ -15,7 +15,9 @@ import {
   CustomerSelectField,
   FieldRequiredHint,
   Icon,
+  If,
   InputPrependButton,
+  ExchangeRateInputGroup,
 } from 'components';
 import withSettings from 'containers/Settings/withSettings';
 import withDialogActions from 'containers/Dialog/withDialogActions';
@@ -49,7 +51,8 @@ function ReceiptFormHeader({
   receiptNextNumber,
   receiptNumberPrefix,
 }) {
-  const { accounts, customers } = useReceiptFormContext();
+  const { accounts, customers, isForeignCustomer, setSelectCustomer } =
+    useReceiptFormContext();
 
   const handleReceiptNumberChange = useCallback(() => {
     openDialog('receipt-number-form', {});
@@ -92,8 +95,9 @@ function ReceiptFormHeader({
               contacts={customers}
               selectedContactId={value}
               defaultSelectText={<T id={'select_customer_account'} />}
-              onContactSelected={(contact) => {
-                form.setFieldValue('customer_id', contact.id);
+              onContactSelected={(customer) => {
+                form.setFieldValue('customer_id', customer.id);
+                setSelectCustomer(customer);
               }}
               popoverFill={true}
               allowCreate={true}
@@ -102,6 +106,16 @@ function ReceiptFormHeader({
         )}
       </FastField>
 
+      {/* ----------- Exchange rate ----------- */}
+      <If condition={isForeignCustomer}>
+        <ExchangeRateInputGroup
+          fromCurrency={'USD'}
+          toCurrency={'LYD'}
+          name={'exchange_rate'}
+          formGroupProps={{ label: ' ', inline: true }}
+        />
+      </If>
+
       {/* ----------- Deposit account ----------- */}
       <FastField
         name={'deposit_account_id'}

src/containers/Sales/Receipts/ReceiptForm/ReceiptFormPage.js

@@ -4,18 +4,25 @@ import { useParams } from 'react-router-dom';
 import 'style/pages/SaleReceipt/PageForm.scss';
 
 import ReceiptFrom from './ReceiptForm';
+import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
 import { ReceiptFormProvider } from './ReceiptFormProvider';
 
+import { compose } from 'utils';
+
 /**
  * Receipt form page.
  */
-export default function ReceiptFormPage() {
+function ReceiptFormPage({
+  // #withCurrentOrganization
+  organization: { base_currency },
+}) {
   const { id } = useParams();
   const idInt = parseInt(id, 10);
 
   return (
-    <ReceiptFormProvider receiptId={idInt}>
+    <ReceiptFormProvider receiptId={idInt} baseCurrency={base_currency}>
       <ReceiptFrom />
     </ReceiptFormProvider>
   );
 }
+export default compose(withCurrentOrganization())(ReceiptFormPage);

src/containers/Sales/Receipts/ReceiptForm/ReceiptFormProvider.js

@@ -1,4 +1,6 @@
 import React, { createContext, useState } from 'react';
+import { isEmpty, pick, isEqual, isUndefined } from 'lodash';
+
 import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import {
   useReceipt,
@@ -17,7 +19,7 @@ const ReceiptFormContext = createContext();
 /**
  * Receipt form provider.
  */
-function ReceiptFormProvider({ receiptId, ...props }) {
+function ReceiptFormProvider({ receiptId, baseCurrency, ...props }) {
   // Fetch sale receipt details.
   const { data: receipt, isLoading: isReceiptLoading } = useReceipt(receiptId, {
     enabled: !!receiptId,
@@ -84,10 +86,17 @@ function ReceiptFormProvider({ receiptId, ...props }) {
 
   const [submitPayload, setSubmitPayload] = useState({});
 
+  const [selectCustomer, setSelectCustomer] = React.useState(null);
+
   const isNewMode = !receiptId;
 
   const isFeatureLoading = isWarehouesLoading || isBranchesLoading;
 
+  // Determines whether the foreign customer.
+  const isForeignCustomer =
+    !isEqual(selectCustomer?.currency_code, baseCurrency) &&
+    !isUndefined(selectCustomer?.currency_code);
+
   const provider = {
     receiptId,
     receipt,
@@ -97,6 +106,9 @@ function ReceiptFormProvider({ receiptId, ...props }) {
     branches,
     warehouses,
     submitPayload,
+    baseCurrency,
+    selectCustomer,
+    setSelectCustomer,
 
     isNewMode,
     isReceiptLoading,
@@ -109,6 +121,7 @@ function ReceiptFormProvider({ receiptId, ...props }) {
     isSettingLoading,
     isBranchesSuccess,
     isWarehousesSuccess,
+    isForeignCustomer,
 
     createReceiptMutate,
     editReceiptMutate,