fix: content tweaks in rates re-calc popover

packages/webapp/src/components/ExchangeRate/ExchangeRateInput.tsx

@@ -8,6 +8,7 @@ import {
   ControlGroup,
   Intent,
   Popover,
+  Position,
   Spinner,
 } from '@blueprintjs/core';
 import { FlagIcon } from '../Tags';
@@ -106,15 +107,22 @@ export function ExchangeRateInputGroup({
   const popoverConfirmContent = (
     <PopoverContent>
       <p>
-        Are you want to re-calculate item prices based on this exchange rate
+        Are you want to re-calculate item prices based on this exchange rate.
       </p>
       <div
         style={{
           display: 'flex',
-          justifyContent: 'flex-end',
           marginTop: 15,
         }}
       >
+        <Button
+          intent={Intent.WARNING}
+          className={Classes.POPOVER_DISMISS}
+          onClick={handleRecalcConfirmBtn}
+          small
+        >
+          Calculate
+        </Button>
         <Button
           className={Classes.POPOVER_DISMISS}
           style={{ marginRight: 10 }}
@@ -124,14 +132,6 @@ export function ExchangeRateInputGroup({
         >
           Cancel
         </Button>
-        <Button
-          intent={Intent.WARNING}
-          className={Classes.POPOVER_DISMISS}
-          onClick={handleRecalcConfirmBtn}
-          small
-        >
-          Re-calculate
-        </Button>
       </div>
     </PopoverContent>
   );
@@ -144,7 +144,11 @@ export function ExchangeRateInputGroup({
         </ExchangeRatePrepend>
 
         {withPopoverRecalcConfirm ? (
-          <Popover isOpen={isOpen} content={popoverConfirmContent}>
+          <Popover
+            isOpen={isOpen}
+            content={popoverConfirmContent}
+            position={Position.RIGHT}
+          >
             {exchangeRateField}
           </Popover>
         ) : (

packages/webapp/src/containers/Sales/Invoices/InvoiceForm/Dialogs/InvoiceExchangeRateChangeDialog.tsx

@@ -10,9 +10,7 @@ import { Button, Classes, Intent } from '@blueprintjs/core';
  */
 function InvoiceExchangeRateChangeDialog({
   dialogName,
-  payload: { initialFormValues },
   isOpen,
-  onConfirm,
   // #withDialogActions
   closeDialog,
 }) {
@@ -23,6 +21,7 @@ function InvoiceExchangeRateChangeDialog({
   return (
     <Dialog
       name={dialogName}
+      title={'Kindly take care of new rates'}
       autoFocus={true}
       canEscapeKeyClose={true}
       isOpen={isOpen}
@@ -31,18 +30,13 @@ function InvoiceExchangeRateChangeDialog({
       <DialogSuspense>
         <div className={Classes.DIALOG_BODY}>
           <p>
-            You have changed customer's currency after adding items to the
+            The item rates have been <strong>adjusted</strong> to the new
-            Invoice.
+            currency using realtime exchange rate.
-          </p>
-
-          <p>
-            The item rates have been adjusted to the new currency using exchange
-            rate feeds.
           </p>
 
           <p style={{ marginBottom: '30px' }}>
-            Before saving the transaction, ensure that the item rates align with
+            Make sure to check that the item rates match the current exchange
-            the current exchange rate of the newly selected currency.
+            rate of the newly selected currency before saving the transaction.
           </p>
         </div>