@kenyaemr/esm-billing-app 5.4.2-pre.2890 → 5.4.2-pre.2898

package/src/invoice/payments/payments.component.tsx

@@ -8,7 +8,6 @@ import { useTranslation } from 'react-i18next';
 import { mutate } from 'swr';
 import { z } from 'zod';
 import { processBillPayment } from '../../billing.resource';
-import { convertToCurrency } from '../../helpers';
 import { useClockInStatus } from '../../bill-administration/payment-points/use-clock-in-status';
 import { LineItem, PaymentFormValue, PaymentStatus, type MappedBill } from '../../types';
 import { computeWaivedAmount, extractErrorMessagesFromResponse } from '../../utils';
@@ -18,6 +17,7 @@ import PaymentHistory from './payment-history/payment-history.component';
 import styles from './payments.scss';
 import { createPaymentPayload } from './utils';
 import { usePaymentSchema } from '../../hooks/usePaymentSchema';
+import { useCurrencyFormatting } from '../../helpers/currency';
 
 type PaymentProps = {
   bill: MappedBill;
@@ -26,6 +26,8 @@ type PaymentProps = {
 
 const Payments: React.FC<PaymentProps> = ({ bill, selectedLineItems }) => {
   const { t } = useTranslation();
+  const { format: formatCurrency } = useCurrencyFormatting();
+
   const paymentSchema = usePaymentSchema(bill);
   const { globalActiveSheet } = useClockInStatus();
 
@@ -118,7 +120,7 @@ const Payments: React.FC<PaymentProps> = ({ bill, selectedLineItems }) => {
                   'incompletePaymentSubtitle',
                   'Please ensure all selected line items are fully paid, Total amount expected is {{selectedLineItemsAmountDue}}',
                   {
-                    selectedLineItemsAmountDue: convertToCurrency(selectedLineItemsAmountDue),
+                    selectedLineItemsAmountDue: formatCurrency(selectedLineItemsAmountDue),
                   },
                 )}
                 lowContrast
@@ -133,8 +135,8 @@ const Payments: React.FC<PaymentProps> = ({ bill, selectedLineItems }) => {
                   'overPaymentSubtitle',
                   'Amount paid {{totalAmountTendered}} should not be greater than amount due {{selectedLineItemsAmountDue}} for selected line items',
                   {
-                    totalAmountTendered: convertToCurrency(totalAmountTendered),
-                    selectedLineItemsAmountDue: convertToCurrency(selectedLineItemsAmountDue),
+                    totalAmountTendered: formatCurrency(totalAmountTendered),
+                    selectedLineItemsAmountDue: formatCurrency(selectedLineItemsAmountDue),
                   },
                 )}
                 lowContrast
@@ -147,20 +149,17 @@ const Payments: React.FC<PaymentProps> = ({ bill, selectedLineItems }) => {
         </div>
         <div className={styles.divider} />
         <div className={styles.paymentTotals}>
-          <InvoiceBreakDown label={t('totalAmount', 'Total Amount')} value={convertToCurrency(bill.totalAmount)} />
-          <InvoiceBreakDown
-            label={t('totalDeposits', 'Total Deposits')}
-            value={convertToCurrency(bill.totalDeposits)}
-          />
+          <InvoiceBreakDown label={t('totalAmount', 'Total Amount')} value={formatCurrency(bill.totalAmount)} />
+          <InvoiceBreakDown label={t('totalDeposits', 'Total Deposits')} value={formatCurrency(bill.totalDeposits)} />
           <InvoiceBreakDown
             label={t('totalTendered', 'Total Tendered')}
-            value={convertToCurrency(bill.tenderedAmount + totalAmountTendered)}
+            value={formatCurrency(bill.tenderedAmount + totalAmountTendered)}
           />
           <InvoiceBreakDown label={t('discount', 'Discount')} value={'--'} />
           <InvoiceBreakDown
             hasBalance={amountDue < 0}
             label={amountDueDisplay(amountDue)}
-            value={convertToCurrency(amountDue)}
+            value={formatCurrency(amountDue)}
           />
           <div className={styles.processPayments}>
             <Button onClick={handleNavigateToBillingDashboard} kind="secondary">

package/src/metrics-cards/metrics.resource.ts

@@ -1,4 +1,4 @@
-import { convertToCurrency } from '../helpers';
+import { useCurrencyFormatting } from '../helpers/currency';
 import { MappedBill, PaymentStatus } from '../types';
 
 /**
@@ -20,11 +20,13 @@ export const useBillMetrics = (
   exemptedBills: string;
 } => {
   const { paidTotal, pendingTotal, cumulativeTotal, exemptedTotal } = calculateBillTotals(bills);
+  const { format: formatCurrency } = useCurrencyFormatting();
+
   return {
-    totalBills: convertToCurrency(cumulativeTotal),
-    pendingBills: convertToCurrency(pendingTotal),
-    paidBills: convertToCurrency(paidTotal),
-    exemptedBills: convertToCurrency(exemptedTotal),
+    totalBills: formatCurrency(cumulativeTotal),
+    pendingBills: formatCurrency(pendingTotal),
+    paidBills: formatCurrency(paidTotal),
+    exemptedBills: formatCurrency(exemptedTotal),
   };
 };
 

package/src/modal/bill-action.modal.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import { ModalBody, ModalFooter, ModalHeader, Button, TextArea } from '@carbon/react';
 import { type MappedBill } from '../types';
 import { useTranslation } from 'react-i18next';
-import { convertToCurrency } from '../helpers';
 import { reOpenOrCloseBill } from '../invoice/invoice.resource';
 import { showSnackbar } from '@openmrs/esm-framework';
 import { mutate } from 'swr';
@@ -10,6 +9,7 @@ import { Controller, useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import styles from './bill-action.modal.scss';
+import { useCurrencyFormatting } from '../helpers/currency';
 
 type BillActionModalProps = {
   closeModal: () => void;
@@ -26,6 +26,8 @@ type FormData = z.infer<typeof formSchema>;
 const BillActionModal: React.FC<BillActionModalProps> = (props) => {
   const { closeModal, bill, action } = props;
   const { t } = useTranslation();
+  const { format: formatCurrency } = useCurrencyFormatting();
+
   const formMethod = useForm({
     defaultValues: {
       reason: '',
@@ -80,7 +82,7 @@ const BillActionModal: React.FC<BillActionModalProps> = (props) => {
           action: action === 'close' ? t('close', 'Close') : t('reopen', 'Reopen'),
           receiptNumber: bill?.receiptNumber,
           status: bill?.status,
-          amount: bill?.totalAmount ? `${convertToCurrency(bill?.totalAmount)}` : 'N/A',
+          amount: bill?.totalAmount ? `${formatCurrency(bill?.totalAmount)}` : 'N/A',
         })}
         title={t('billAction', '{{action}} Bill', {
           action: action === 'close' ? t('close', 'Close') : t('reopen', 'Reopen'),

package/src/past-patient-bills/patient-bills.component.tsx

@@ -17,11 +17,11 @@ import { ConfigurableLink, getPatientName, usePatient, setCurrentVisit } from '@
 import { getPatientChartStore, useLaunchWorkspaceRequiringVisit } from '@openmrs/esm-patient-common-lib';
 import capitalize from 'lodash/capitalize';
 
-import { convertToCurrency } from '../helpers';
 import { type MappedBill } from '../types';
 import EmptyPatientBill from './patient-bills-dashboard/empty-patient-bill.component';
 
 import styles from './patient-bills.scss';
+import { useCurrencyFormatting } from '../helpers/currency';
 
 type PatientBillsProps = {
   patientUuid: string;
@@ -38,6 +38,8 @@ export const patientBillsHeaders = [
 
 export const PatientBills: React.FC<PatientBillsProps> = ({ bills, onCancel, patientUuid }) => {
   const { t } = useTranslation();
+  const { format: formatCurrency } = useCurrencyFormatting();
+
   const { patient, isLoading, error } = usePatient(patientUuid);
   if (isLoading) {
     return <InlineLoading status="active" description={t('loading', 'Loading...')} />;
@@ -68,7 +70,7 @@ export const PatientBills: React.FC<PatientBillsProps> = ({ bills, onCancel, pat
         {bill.lineItems.map((item) => item?.billableService?.split(':')[1]).join(', ')}
       </ConfigurableLink>
     ),
-    totalAmount: convertToCurrency(bill.totalAmount),
+    totalAmount: formatCurrency(bill.totalAmount),
     status: bill.status,
   }));
 

package/src/prompt-payment/prompt-payment-modal.component.tsx

@@ -14,16 +14,19 @@ import {
   Heading,
 } from '@carbon/react';
 import styles from './prompt-payment.scss';
-import { convertToCurrency, extractString } from '../helpers';
+import { extractString } from '../helpers';
 import { navigate, useConfig } from '@openmrs/esm-framework';
 import { BillingConfig } from '../config-schema';
 import { getPatientUuidFromStore } from '@openmrs/esm-patient-common-lib';
 import { useBillingPrompt } from './prompt-payment.resource';
+import { useCurrencyFormatting } from '../helpers/currency';
 
 type PromptPaymentModalProps = {};
 
 const PromptPaymentModal: React.FC<PromptPaymentModalProps> = () => {
   const { t } = useTranslation();
+  const { format: formatCurrency } = useCurrencyFormatting();
+
   const patientUuid = getPatientUuidFromStore();
   const { shouldShowBillingPrompt, isLoading, bills } = useBillingPrompt(patientUuid, 'patient-chart');
   const [showModal, setShowModal] = useState({ loadingModal: true, billingModal: true });
@@ -82,9 +85,9 @@ const PromptPaymentModal: React.FC<PromptPaymentModalProps> = () => {
                   <StructuredListRow key={lineItem.uuid}>
                     <StructuredListCell>{extractString(lineItem.billableService || lineItem.item)}</StructuredListCell>
                     <StructuredListCell>{lineItem.quantity}</StructuredListCell>
-                    <StructuredListCell>{convertToCurrency(lineItem.price)}</StructuredListCell>
+                    <StructuredListCell>{formatCurrency(lineItem.price)}</StructuredListCell>
                     <StructuredListCell>{lineItem.paymentStatus}</StructuredListCell>
-                    <StructuredListCell>{convertToCurrency(lineItem.quantity * lineItem.price)}</StructuredListCell>
+                    <StructuredListCell>{formatCurrency(lineItem.quantity * lineItem.price)}</StructuredListCell>
                   </StructuredListRow>
                 );
               })}