feat(manual journal): add exchange rate input.

src/common/features.js

@@ -2,5 +2,6 @@
 
 export const Features = {
   Warehouses: 'warehouses',
-  Branches: 'branches'
+  Branches: 'branches',
+  ManualJournal: 'manualJournal',
 }

src/containers/Accounting/MakeJournal/MakeJournalEntriesHeaderFields.js

@@ -9,6 +9,7 @@ import { FastField, ErrorMessage } from 'formik';
 import { DateInput } from '@blueprintjs/datetime';
 import { FormattedMessage as T } from 'components';
 import classNames from 'classnames';
+import { Features } from 'common';
 
 import { CLASSES } from 'common/classes';
 import {
@@ -23,8 +24,11 @@ import {
   FieldHint,
   FieldRequiredHint,
   Icon,
+  If,
+  FeatureCan,
   InputPrependButton,
   CurrencySelectList,
+  ExchangeRateInputGroup,
 } from 'components';
 import withSettings from 'containers/Settings/withSettings';
 import { useMakeJournalFormContext } from './MakeJournalProvider';
@@ -48,7 +52,12 @@ function MakeJournalEntriesHeader({
   journalNextNumber,
   journalNumberPrefix,
 }) {
-  const { currencies } = useMakeJournalFormContext();
+  const {
+    currencies,
+    isForeignJournal,
+    baseCurrency,
+    setSelactJournalCurrency,
+  } = useMakeJournalFormContext();
 
   // Handle journal number change.
   const handleJournalNumberChange = () => {
@@ -185,29 +194,44 @@ function MakeJournalEntriesHeader({
       </FastField>
 
       {/*------------ Currency  -----------*/}
-      <FastField
+      {/* <FeatureCan feature={Features.ManualJournal}> */}
-        name={'currency_code'}
+        <FastField
-        currencies={currencies}
+          name={'currency_code'}
-        shouldUpdate={currenciesFieldShouldUpdate}
+          currencies={currencies}
-      >
+          shouldUpdate={currenciesFieldShouldUpdate}
-        {({ form, field: { value }, meta: { error, touched } }) => (
+        >
-          <FormGroup
+          {({ form, field: { value }, meta: { error, touched } }) => (
-            label={<T id={'currency'} />}
+            <FormGroup
-            className={classNames('form-group--currency', CLASSES.FILL)}
+              label={<T id={'currency'} />}
-            inline={true}
+              className={classNames('form-group--currency', CLASSES.FILL)}
-          >
+              inline={true}
-            <CurrencySelectList
+            >
-              currenciesList={currencies}
+              <CurrencySelectList
-              selectedCurrencyCode={value}
+                currenciesList={currencies}
-              onCurrencySelected={(currencyItem) => {
+                selectedCurrencyCode={value}
-                form.setFieldValue('currency_code', currencyItem.currency_code);
+                onCurrencySelected={(currencyItem) => {
-              }}
+                  form.setFieldValue(
-              defaultSelectText={value}
+                    'currency_code',
-              disabled={true}
+                    currencyItem.currency_code,
-            />
+                  );
-          </FormGroup>
+                  setSelactJournalCurrency(currencyItem);
-        )}
+                }}
-      </FastField>
+                defaultSelectText={value}
+              />
+            </FormGroup>
+          )}
+        </FastField>
+      {/* </FeatureCan> */}
+
+      {/* ----------- Exchange rate ----------- */}
+      <If condition={isForeignJournal}>
+        <ExchangeRateInputGroup
+          fromCurrency={'USD'}
+          toCurrency={'LYD'}
+          name={'exchange_rate'}
+          formGroupProps={{ label: ' ', inline: true }}
+        />
+      </If>
     </div>
   );
 }

src/containers/Accounting/MakeJournal/MakeJournalEntriesPage.js

@@ -6,15 +6,22 @@ import 'style/pages/ManualJournal/MakeJournal.scss';
 import MakeJournalEntriesForm from './MakeJournalEntriesForm';
 import { MakeJournalProvider } from './MakeJournalProvider';
 
+import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
+import { compose } from 'utils';
+
 /**
  * Make journal entries page.
  */
-export default function MakeJournalEntriesPage() {
+function MakeJournalEntriesPage({
+  // #withCurrentOrganization
+  organization: { base_currency },
+}) {
   const { id: journalId } = useParams();
-  
+
   return (
-    <MakeJournalProvider journalId={journalId}>
+    <MakeJournalProvider journalId={journalId} baseCurrency={base_currency}>
       <MakeJournalEntriesForm />
     </MakeJournalProvider>
   );
 }
+export default compose(withCurrentOrganization())(MakeJournalEntriesPage);

src/containers/Accounting/MakeJournal/MakeJournalProvider.js

@@ -1,4 +1,5 @@
 import React, { createContext, useState } from 'react';
+import { isEqual, isUndefined } from 'lodash';
 import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import {
   useAccounts,
@@ -8,7 +9,7 @@ import {
   useCreateJournal,
   useEditJournal,
   useSettings,
-  useSettingsManualJournals
+  useSettingsManualJournals,
 } from 'hooks/query';
 
 const MakeJournalFormContext = createContext();
@@ -16,15 +17,13 @@ const MakeJournalFormContext = createContext();
 /**
  * Make journal form provider.
  */
-function MakeJournalProvider({ journalId, ...props }) {
+function MakeJournalProvider({ journalId, baseCurrency, ...props }) {
   // Load the accounts list.
   const { data: accounts, isLoading: isAccountsLoading } = useAccounts();
 
   // Load the customers list.
-  const {
+  const { data: contacts, isLoading: isContactsLoading } =
-    data: contacts,
+    useAutoCompleteContacts();
-    isLoading: isContactsLoading,
-  } = useAutoCompleteContacts();
 
   // Load the currencies list.
   const { data: currencies, isLoading: isCurrenciesLoading } = useCurrencies();
@@ -45,12 +44,18 @@ function MakeJournalProvider({ journalId, ...props }) {
 
   // Submit form payload.
   const [submitPayload, setSubmitPayload] = useState({});
+  const [selectJournalCurrency, setSelactJournalCurrency] = useState(null);
+
+  const isForeignJournal =
+    !isEqual(selectJournalCurrency?.currency_code, baseCurrency) &&
+    !isUndefined(selectJournalCurrency?.currency_code);
 
   const provider = {
     accounts,
     contacts,
     currencies,
     manualJournal,
+    baseCurrency,
 
     createJournalMutate,
     editJournalMutate,
@@ -60,11 +65,13 @@ function MakeJournalProvider({ journalId, ...props }) {
     isCurrenciesLoading,
     isJournalLoading,
     isSettingsLoading,
-
+    isForeignJournal,
     isNewMode: !journalId,
 
     submitPayload,
-    setSubmitPayload
+    setSubmitPayload,
+    selectJournalCurrency,
+    setSelactJournalCurrency,
   };
 
   return (
@@ -73,7 +80,7 @@ function MakeJournalProvider({ journalId, ...props }) {
         isJournalLoading ||
         isAccountsLoading ||
         isCurrenciesLoading ||
-        isContactsLoading || 
+        isContactsLoading ||
         isSettingsLoading
       }
       name={'make-journal-page'}