From a639101e28395dc7a2e93abbc69e3d045c4a9c77 Mon Sep 17 00:00:00 2001
From: elforjani13 <39470382+elforjani13@users.noreply.github.com>
Date: Sun, 6 Mar 2022 23:26:09 +0200
Subject: [PATCH] feat(cashflow): add exchange rate muted.

---
 .../ExchangeRate/ExchangeRateMutedField.js    | 40 +++++++++++--------
 .../OtherIncome/OtherIncomeFormFields.js      |  2 +-
 .../OwnerContributionFormFields.js            |  2 +-
 .../TransferFromAccountFormFields.js          |  2 +-
 .../OtherExpense/OtherExpnseFormFields.js     |  2 +-
 .../OwnerDrawings/OwnerDrawingsFormFields.js  |  2 +-
 .../TransferToAccountFormFields.js            |  2 +-
 7 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/src/components/ExchangeRate/ExchangeRateMutedField.js b/src/components/ExchangeRate/ExchangeRateMutedField.js
index 10bd7fbe3..720f082c4 100644
--- a/src/components/ExchangeRate/ExchangeRateMutedField.js
+++ b/src/components/ExchangeRate/ExchangeRateMutedField.js
@@ -29,16 +29,15 @@ export function ExchangeRateMutedField({
   if (isEqual(toCurrency, fromCurrency) && !isUndefined(toCurrency)) {
     return null;
   }
-
   const content = (
-    <Menu>
+    <ExchangeRateFormGroupContent>
       <ExchangeRateInputGroup
         name={name}
         fromCurrency={fromCurrency}
         toCurrency={toCurrency}
         {...ExchangeRateprops}
       />
-    </Menu>
+    </ExchangeRateFormGroupContent>
   );
 
   return (
@@ -53,12 +52,16 @@ export function ExchangeRateMutedField({
           offset: { offset: '0, 4' },
         }}
         minimal={true}
+        usePortal={false}
+        target={<div />}
       >
-        <ExchangeRateButton
-          className={Classes.MINIMAL}
-          rightIcon={<Icon icon="pen-18" />}
-        >
+        <ExchangeRateButton>
           1 {fromCurrency} = {exchangeRate} {toCurrency}
+          <Button
+            className={Classes.MINIMAL}
+            rightIcon={<Icon icon="pen-18" />}
+            small={true}
+          />
         </ExchangeRateButton>
       </Popover>
     </ExchangeRateFormGroup>
@@ -69,16 +72,21 @@ const ExchangeRateFormGroup = styled(FormGroup)`
   .bp3-label {
     font-size: 12px !important;
     opacity: 0.7;
-    line-height: 0.1rem;
+    line-height: 0.5rem;
   }
 `;
 
-const ExchangeRateButton = styled(Button)`
-  .bp3-button-text {
-    display: flex;
-    font-size: 13px;
-    font-weight: 500;
-    color: #0d244a;
-  }
-  padding: 0;
+const ExchangeRateButton = styled.div`
+  display: flex;
+  align-items: center;
+  font-size: 13px;
+  font-weight: 500;
+  color: #0d244a;
+`;
+
+const ExchangeRateFormGroupContent = styled.div`
+  .bp3-form-group {
+    padding: 2px;
+    margin: 2px 4px !important;
+  }
 `;
diff --git a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js b/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
index 03aecd55f..bdb970378 100644
--- a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
+++ b/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
@@ -112,8 +112,8 @@ function OtherIncomeFormFields({
             </FormGroup>
           </Col>
         </Row>
-      </FeatureCan>
       <BranchRowDivider />
+      </FeatureCan>
 
       <Row>
         <Col xs={5}>
diff --git a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
index 976e95665..85492f150 100644
--- a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
+++ b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
@@ -112,8 +112,8 @@ function OwnerContributionFormFields({
             </FormGroup>
           </Col>
         </Row>
+        <BranchRowDivider />
       </FeatureCan>
-      <BranchRowDivider />
       <Row>
         <Col xs={5}>
           {/*------------ Date -----------*/}
diff --git a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
index aaa06773e..59437b75f 100644
--- a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
+++ b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
@@ -110,8 +110,8 @@ function TransferFromAccountFormFields({
             </FormGroup>
           </Col>
         </Row>
+        <BranchRowDivider />
       </FeatureCan>
-      <BranchRowDivider />
       <Row>
         <Col xs={5}>
           {/*------------ Date -----------*/}
diff --git a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js
index 089c8e743..7e0d443c7 100644
--- a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js
+++ b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js
@@ -111,8 +111,8 @@ function OtherExpnseFormFields({
             </FormGroup>
           </Col>
         </Row>
+        <BranchRowDivider />
       </FeatureCan>
-      <BranchRowDivider />
       <Row>
         <Col xs={5}>
           {/*------------ Date -----------*/}
diff --git a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js
index c59fb030a..cde64d3b6 100644
--- a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js
+++ b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js
@@ -109,8 +109,8 @@ function OwnerDrawingsFormFields({
             </FormGroup>
           </Col>
         </Row>
+        <BranchRowDivider />
       </FeatureCan>
-      <BranchRowDivider />
       <Row>
         <Col xs={5}>
           {/*------------ Date -----------*/}
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js
index 628322f51..b1652b8c4 100644
--- a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js
+++ b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js
@@ -110,8 +110,8 @@ function TransferToAccountFormFields({
             </FormGroup>
           </Col>
         </Row>
+        <BranchRowDivider />
       </FeatureCan>
-      <BranchRowDivider />
       <Row>
         <Col xs={5}>
           {/*------------ Date -----------*/}