feat(invoice): fix invoice currency tag.

src/components/BaseCurrency.js

@@ -1,38 +1,18 @@
 import React from 'react';
 import * as R from 'ramda';
 import styled from 'styled-components';
-
 import { CurrencyTag } from 'components';
+
 import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
 
 /**
- * base currency sign.
+ * base currecncy.
  */
 function BaseCurrency({
   // #withCurrentOrganization
   organization: { base_currency },
-  isForeignCustomer,
 }) {
-  
-  if (isForeignCustomer) {
-    return null;
-  }
-
-  return (
-    <BaseCurrencySign>
-      <CurrencyTag>{base_currency}</CurrencyTag>
-    </BaseCurrencySign>
-  );
+  return <CurrencyTag>{base_currency}</CurrencyTag>;
 }
 
 export default R.compose(withCurrentOrganization())(BaseCurrency);
-
-const BaseCurrencySign = styled.div`
-  display: flex;
-  align-items: center;
-  font-size: 10px;
-  margin-left: 5px;
-  span {
-    background: #5c7080;
-  }
-`;

src/components/index.js

@@ -54,7 +54,8 @@ import AvaterCell from './AvaterCell';
 
 import { ItemsMultiSelect } from './Items';
 import MoreMenuItems from './MoreMenutItems';
-import CustomSelectList from './CustomSelectList'
+import CustomSelectList from './CustomSelectList';
+import BaseCurrency from './BaseCurrency';
 
 export * from './Dialog';
 export * from './Menu';
@@ -89,8 +90,8 @@ export * from './TextStatus';
 export * from './Tags';
 export * from './CommercialDoc';
 export * from './Card';
-export * from './Customers'
-export * from './Vendors'
+export * from './Customers';
+export * from './Vendors';
 export * from './Table';
 export * from './Skeleton';
 export * from './FinancialStatement';
@@ -162,6 +163,8 @@ export {
   MoneyFieldCell,
   ItemsMultiSelect,
   AvaterCell,
+  BaseCurrency,
   MoreMenuItems,
-  CustomSelectList
+  CustomSelectList,
+ 
 };

src/containers/Sales/Invoices/InvoiceForm/InvoiceFormCurrencyTag.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import { BaseCurrency } from 'components';
+import { useInvoiceFormContext } from './InvoiceFormProvider';
+
+/**
+ * Invoice form currency tag.
+ */
+export default function InvoiceFormCurrencyTag() {
+  const { isForeignCustomer } = useInvoiceFormContext();
+
+  if (!isForeignCustomer) {
+    return null;
+  }
+
+  return (
+    <BaseCurrencyTag>
+      <BaseCurrency />
+    </BaseCurrencyTag>
+  );
+}
+
+const BaseCurrencyTag = styled.div`
+  display: flex;
+  align-items: center;
+  font-size: 10px;
+  margin-left: 4px;
+  span {
+    background: #5c7080;
+  }
+`;

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

@@ -33,7 +33,7 @@ import { useInvoiceFormContext } from './InvoiceFormProvider';
 import withSettings from 'containers/Settings/withSettings';
 import withDialogActions from 'containers/Dialog/withDialogActions';
 import { inputIntent, handleDateChange } from 'utils';
-import BaseCurrency from './BaseCurrency';
+import InvoiceCurrencyTag from './InvoiceFormCurrencyTag';
 
 const Data = [
   {
@@ -104,7 +104,7 @@ function InvoiceFormHeaderFields({
             intent={inputIntent({ error, touched })}
             helperText={<ErrorMessage name={'customer_id'} />}
           >
-            <ControlGroup>
+            <ControlCustomerGroup>
               <CustomerSelectField
                 contacts={customers}
                 selectedContactId={value}
@@ -115,47 +115,49 @@ function InvoiceFormHeaderFields({
                 popoverFill={true}
                 allowCreate={true}
               />
-              <BaseCurrency isForeignCustomer={isForeignCustomer} />
-            </ControlGroup>
+              <InvoiceCurrencyTag isForeignCustomer={isForeignCustomer} />
+            </ControlCustomerGroup>
           </FormGroup>
         )}
       </FastField>
 
       {/* ----------- Exchange reate ----------- */}
-      <ExchangeRateField>
-        <Field name={'exchange_rate'}>
-          {({
-            form: { values, setFieldValue },
-            field,
-            meta: { error, touched },
-          }) => (
-            <FormGroup
-              intent={inputIntent({ error, touched })}
-              inline={true}
-              className={'form-group--exchange_rate'}
-              helperText={<ErrorMessage name="exchange_rate" />}
-            >
-              <ControlGroup>
-                <ExchangeRateTag>
-                  <FlagTag flage={'US'} /> 1 USD =
-                </ExchangeRateTag>
-                <MoneyInputGroup
-                  value={field.value}
-                  allowDecimals={false}
-                  allowNegativeValue={true}
-                  onChange={(value) => {
-                    setFieldValue('exchange_rate', value);
-                  }}
-                  intent={inputIntent({ error, touched })}
-                />
-                <ExchangeRateTag>
-                  <FlagTag flage={'LY'} /> LYD
-                </ExchangeRateTag>
-              </ControlGroup>
-            </FormGroup>
-          )}
-        </Field>
-      </ExchangeRateField>
+      <If condition={isForeignCustomer}>
+        <ExchangeRateField>
+          <Field name={'exchange_rate'}>
+            {({
+              form: { values, setFieldValue },
+              field,
+              meta: { error, touched },
+            }) => (
+              <FormGroup
+                intent={inputIntent({ error, touched })}
+                inline={true}
+                className={'form-group--exchange_rate'}
+                helperText={<ErrorMessage name="exchange_rate" />}
+              >
+                <ControlGroup>
+                  <ExchangeRateTag>
+                    <FlagTag flage={'US'} /> 1 USD =
+                  </ExchangeRateTag>
+                  <MoneyInputGroup
+                    value={field.value}
+                    allowDecimals={false}
+                    allowNegativeValue={true}
+                    onChange={(value) => {
+                      setFieldValue('exchange_rate', value);
+                    }}
+                    intent={inputIntent({ error, touched })}
+                  />
+                  <ExchangeRateTag>
+                    <FlagTag flage={'LY'} /> LYD
+                  </ExchangeRateTag>
+                </ControlGroup>
+              </FormGroup>
+            )}
+          </Field>
+        </ExchangeRateField>
+      </If>
 
       <Row>
         <Col xs={6}>
@@ -325,3 +327,9 @@ const ExchangeRateTag = styled.div`
   font-size: 10px;
   line-height: 1.6;
 `;
+
+const ControlCustomerGroup = styled(ControlGroup)`
+  display: flex;
+  align-items: center;
+  transform: none;
+`;

src/containers/Sales/Invoices/InvoiceForm/InvoiceFormProvider.js

@@ -78,7 +78,7 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
   const isFeatureLoading = isWarehouesLoading || isBranchesLoading;
 
   // Determines whether the foreign customer.
-  const isForeignCustomer = true;
+  const isForeignCustomer = false;
 
   // Provider payload.
   const provider = {