@kenyaemr/esm-billing-app 5.4.2-pre.2259 → 5.4.2-pre.2265

package/dist/routes.json

@@ -1 +1 @@
-{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"kenyaemr":"^19.0.0"},"pages":[{"component":"billableServicesHome","route":"billable-services"},{"component":"requirePaymentModal","routeRegex":"^patient/.+/chart","online":true,"offline":false}],"extensions":[{"component":"benefitsPackageDashboardLink","name":"benefits-package-dashboard-link","slot":"patient-chart-dashboard-slot","meta":{"name":"benefits-package","slot":"patient-chart-benefits-dashboard-slot","path":"insurance-benefits","columns":1,"columnSpan":1},"featureFlag":"healthInformationExchange"},{"component":"benefitsPackage","name":"benefits-package","slot":"patient-chart-benefits-dashboard-slot"},{"component":"root","name":"billing-dashboard-root","slot":"billing-dashboard-slot"},{"component":"benefitsEligibilyRequestForm","name":"benefits-eligibility-request-form"},{"component":"benefitsPreAuthForm","name":"benefits-pre-auth-form"},{"name":"billing-patient-summary","component":"billingPatientSummary","slot":"patient-chart-billing-dashboard-slot","order":10,"meta":{"columnSpan":4}},{"name":"billing-summary-dashboard-link","component":"billingSummaryDashboardLink","slot":"patient-chart-dashboard-slot","order":11,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-billing-dashboard-slot","path":"Billing","layoutMode":"anchored"}},{"name":"billing-check-in-form","slot":"extra-visit-attribute-slot","component":"billingCheckInForm"},{"name":"require-billing-modal","component":"requirePaymentModal"},{"name":"patient-banner-billing-tags","component":"visitAttributeTags","slot":"patient-banner-tags-slot","order":2},{"name":"initiate-payment-modal","component":"initiatePaymentDialog"},{"name":"delete-billableservice-modal","component":"deleteBillableServiceModal"},{"name":"refund-bill-modal","component":"refundBillModal"},{"name":"delete-bill-modal","component":"deleteBillModal"},{"name":"lab-order-billable-item","component":"labOrder","slot":"top-of-lab-order-form-slot"},{"name":"procedure-order-billable-item","component":"procedureOrder","slot":"top-of-procedure-order-form-slot"},{"name":"imaging-order-billable-item","component":"imagingOrder","slot":"top-of-imaging-order-form-slot"},{"name":"price-info-order","component":"priceInfoOrder"},{"name":"drug-order-billable-item","component":"drugOrder","slot":"medication-info-slot"},{"name":"order-action-button","component":"orderActionButton","slots":["prescription-action-button-slot","imaging-orders-action","procedure-orders-action","tests-ordered-actions-slot"],"order":0},{"component":"billingOverviewLink","name":"billing-overview-link","order":0,"slot":"billing-dashboard-group-nav-slot"},{"component":"billDepositDashboardLink","name":"bill-deposit-dashboard-link","slot":"billing-dashboard-group-nav-slot"},{"component":"paymentHistoryLink","name":"payment-history-link","slot":"billing-dashboard-group-nav-slot"},{"component":"paymentPointsLink","name":"payment-points-link","slot":"billing-dashboard-group-nav-slot"},{"component":"paymentModesLink","name":"payment-modes-link","slot":"billing-dashboard-group-nav-slot"},{"component":"billManagerLink","name":"bill-manager-link","slot":"billing-dashboard-group-nav-slot"},{"component":"chargeableItemsLink","name":"chargeable-items-link","slot":"billing-dashboard-group-nav-slot"},{"component":"billableExemptionsLink","name":"billable-exemptions-link","slot":"billing-dashboard-group-nav-slot"},{"component":"claimsManagementOverviewDashboardLink","name":"claims-management-overview-link","order":0,"slot":"claims-management-dashboard-link-slot"},{"component":"preAuthRequestsDashboardLink","name":"preauthrequest-overview-link","slot":"claims-management-dashboard-link-slot"},{"component":"claimsOverview","name":"claims-overview-dashboard-link","slot":"claims-management-overview-slot"},{"component":"waiveBillActionButton","name":"waive-bill-action-button","slot":"bill-actions-slot"},{"component":"deleteBillActionButton","name":"delete-bill-action-button","slot":"bill-actions-slot"},{"component":"refundLineItem","name":"refund-line-item","slot":"bill-actions-overflow-menu-slot"},{"name":"edit-line-item","component":"editLineItem","slot":"bill-actions-overflow-menu-slot"},{"name":"cancel-line-item","component":"cancelLineItem","slot":"bill-actions-overflow-menu-slot"}],"workspaces":[{"name":"create-bill-workspace","component":"createBillWorkspace","title":"Create Bill Workspace","type":"other-form"},{"name":"waive-bill-form","component":"waiveBillForm","title":"Waive Bill Form","type":"other-form"},{"name":"edit-bill-form","component":"editBillForm","title":"Edit Bill Form","type":"other-form"},{"name":"billable-service-form","component":"addServiceForm","title":"Create Charge Item Form","type":"other-form"},{"name":"commodity-form","component":"addCommodityForm","title":"Create Charge Item Form","type":"other-form"},{"name":"billing-form","component":"billingForm","title":"Billing Form","type":"other-form","width":"extra-wide"},{"name":"payment-mode-workspace","component":"paymentModeWorkspace","title":"Payment Mode Workspace","type":"other-form"},{"name":"cancel-bill-workspace","component":"cancelBillWorkspace","title":"Cancel Bill Workspace","type":"other-form"},{"name":"add-deposit-workspace","component":"addDepositWorkspace","title":"Add Deposit","type":"other-form"},{"name":"deposit-transaction-workspace","component":"depositTransactionWorkspace","title":"Deposit Transaction","type":"other-form"}],"modals":[{"name":"create-payment-point","component":"createPaymentPoint"},{"name":"clock-out-modal","component":"clockOut"},{"name":"bulk-import-billable-services-modal","component":"bulkImportBillableServicesModal"},{"name":"delete-payment-mode-modal","component":"deletePaymentModeModal"},{"name":"manage-claim-request-modal","component":"manageClaimRequestModal"},{"name":"paid-bill-receipt-print-preview-modal","component":"paidBillReceiptPrintPreviewModal"},{"name":"clock-in-modal","component":"clockIn"},{"name":"create-bill-item-modal","component":"createBillItemModal"},{"name":"delete-deposit-modal","component":"deleteDepositModal"},{"name":"reverse-transaction-modal","component":"reverseTransactionModal"}],"version":"5.4.2-pre.2259"}
+{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"kenyaemr":"^19.0.0"},"pages":[{"component":"billableServicesHome","route":"billable-services"},{"component":"requirePaymentModal","routeRegex":"^patient/.+/chart","online":true,"offline":false}],"extensions":[{"component":"benefitsPackageDashboardLink","name":"benefits-package-dashboard-link","slot":"patient-chart-dashboard-slot","meta":{"name":"benefits-package","slot":"patient-chart-benefits-dashboard-slot","path":"insurance-benefits","columns":1,"columnSpan":1},"featureFlag":"healthInformationExchange"},{"component":"benefitsPackage","name":"benefits-package","slot":"patient-chart-benefits-dashboard-slot"},{"component":"root","name":"billing-dashboard-root","slot":"billing-dashboard-slot"},{"component":"benefitsEligibilyRequestForm","name":"benefits-eligibility-request-form"},{"component":"benefitsPreAuthForm","name":"benefits-pre-auth-form"},{"name":"billing-patient-summary","component":"billingPatientSummary","slot":"patient-chart-billing-dashboard-slot","order":10,"meta":{"columnSpan":4}},{"name":"billing-summary-dashboard-link","component":"billingSummaryDashboardLink","slot":"patient-chart-dashboard-slot","order":11,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-billing-dashboard-slot","path":"Billing","layoutMode":"anchored"}},{"name":"billing-check-in-form","slot":"extra-visit-attribute-slot","component":"billingCheckInForm"},{"name":"require-billing-modal","component":"requirePaymentModal"},{"name":"patient-banner-billing-tags","component":"visitAttributeTags","slot":"patient-banner-tags-slot","order":2},{"name":"initiate-payment-modal","component":"initiatePaymentDialog"},{"name":"delete-billableservice-modal","component":"deleteBillableServiceModal"},{"name":"refund-bill-modal","component":"refundBillModal"},{"name":"delete-bill-modal","component":"deleteBillModal"},{"name":"lab-order-billable-item","component":"labOrder","slot":"top-of-lab-order-form-slot"},{"name":"procedure-order-billable-item","component":"procedureOrder","slot":"top-of-procedure-order-form-slot"},{"name":"imaging-order-billable-item","component":"imagingOrder","slot":"top-of-imaging-order-form-slot"},{"name":"price-info-order","component":"priceInfoOrder"},{"name":"drug-order-billable-item","component":"drugOrder","slot":"medication-info-slot"},{"name":"order-action-button","component":"orderActionButton","slots":["prescription-action-button-slot","imaging-orders-action","procedure-orders-action","tests-ordered-actions-slot"],"order":0},{"component":"billingOverviewLink","name":"billing-overview-link","order":0,"slot":"billing-dashboard-group-nav-slot"},{"component":"billDepositDashboardLink","name":"bill-deposit-dashboard-link","slot":"billing-dashboard-group-nav-slot"},{"component":"paymentHistoryLink","name":"payment-history-link","slot":"billing-dashboard-group-nav-slot"},{"component":"paymentPointsLink","name":"payment-points-link","slot":"billing-dashboard-group-nav-slot"},{"component":"paymentModesLink","name":"payment-modes-link","slot":"billing-dashboard-group-nav-slot"},{"component":"billManagerLink","name":"bill-manager-link","slot":"billing-dashboard-group-nav-slot"},{"component":"chargeableItemsLink","name":"chargeable-items-link","slot":"billing-dashboard-group-nav-slot"},{"component":"billableExemptionsLink","name":"billable-exemptions-link","slot":"billing-dashboard-group-nav-slot"},{"component":"claimsManagementOverviewDashboardLink","name":"claims-management-overview-link","order":0,"slot":"claims-management-dashboard-link-slot"},{"component":"preAuthRequestsDashboardLink","name":"preauthrequest-overview-link","slot":"claims-management-dashboard-link-slot"},{"component":"claimsOverview","name":"claims-overview-dashboard-link","slot":"claims-management-overview-slot"},{"component":"waiveBillActionButton","name":"waive-bill-action-button","slot":"bill-actions-slot"},{"component":"deleteBillActionButton","name":"delete-bill-action-button","slot":"bill-actions-slot"},{"component":"refundLineItem","name":"refund-line-item","slot":"bill-actions-overflow-menu-slot"},{"name":"edit-line-item","component":"editLineItem","slot":"bill-actions-overflow-menu-slot"},{"name":"cancel-line-item","component":"cancelLineItem","slot":"bill-actions-overflow-menu-slot"}],"workspaces":[{"name":"create-bill-workspace","component":"createBillWorkspace","title":"Create Bill Workspace","type":"other-form"},{"name":"waive-bill-form","component":"waiveBillForm","title":"Waive Bill Form","type":"other-form"},{"name":"edit-bill-form","component":"editBillForm","title":"Edit Bill Form","type":"other-form"},{"name":"billable-service-form","component":"addServiceForm","title":"Create Charge Item Form","type":"other-form"},{"name":"commodity-form","component":"addCommodityForm","title":"Create Charge Item Form","type":"other-form"},{"name":"billing-form","component":"billingForm","title":"Billing Form","type":"other-form","width":"extra-wide"},{"name":"payment-mode-workspace","component":"paymentModeWorkspace","title":"Payment Mode Workspace","type":"other-form"},{"name":"cancel-bill-workspace","component":"cancelBillWorkspace","title":"Cancel Bill Workspace","type":"other-form"},{"name":"add-deposit-workspace","component":"addDepositWorkspace","title":"Add Deposit","type":"other-form"},{"name":"deposit-transaction-workspace","component":"depositTransactionWorkspace","title":"Deposit Transaction","type":"other-form"}],"modals":[{"name":"create-payment-point","component":"createPaymentPoint"},{"name":"clock-out-modal","component":"clockOut"},{"name":"bulk-import-billable-services-modal","component":"bulkImportBillableServicesModal"},{"name":"delete-payment-mode-modal","component":"deletePaymentModeModal"},{"name":"manage-claim-request-modal","component":"manageClaimRequestModal"},{"name":"clock-in-modal","component":"clockIn"},{"name":"create-bill-item-modal","component":"createBillItemModal"},{"name":"delete-deposit-modal","component":"deleteDepositModal"},{"name":"reverse-transaction-modal","component":"reverseTransactionModal"},{"name":"print-preview-modal","component":"printPreviewModal"}],"version":"5.4.2-pre.2265"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kenyaemr/esm-billing-app",
-  "version": "5.4.2-pre.2259",
+  "version": "5.4.2-pre.2265",
   "description": "Billing app for KenyaEMR",
   "browser": "dist/kenyaemr-esm-billing-app.js",
   "main": "src/index.ts",

package/src/{invoice/print-bill-receipt/print-bill-receipt.resource.ts → hooks/usePrintPreview.tsx}

@@ -1,4 +1,3 @@
-import { restBaseUrl } from '@openmrs/esm-framework';
 import useSWR from 'swr';
 
 const fetcher = async (url: string) => {
@@ -12,8 +11,7 @@ const fetcher = async (url: string) => {
   return URL.createObjectURL(blob);
 };
 
-export const usePaidBillReceiptFileObjectUrl = (billId: number) => {
-  const url = `/openmrs${restBaseUrl}/cashier/receipt?billId=${billId}`;
+export const usePrintPreview = (url: string) => {
   const { data, isLoading, error, mutate } = useSWR<String>(url, fetcher);
-  return { url: data, isLoading, error, mutate };
+  return { data, isLoading, error, mutate };
 };

package/src/index.ts

@@ -57,7 +57,6 @@ import ClaimsManagementOverview from './claims/claims-management/main/claims-ove
 import { ManageClaimRequest } from './claims/claims-management/table/manage-claim-request.modal';
 import InitiatePaymentDialog from './invoice/payments/initiate-payment/initiate-payment.component';
 import VisitAttributeTags from './invoice/payments/visit-tags/visit-attribute.component';
-import ReceiptPrintPreviewModal from './invoice/print-bill-receipt/receipt-print-preview.modal';
 import DeletePaymentModeModal from './payment-modes/delete-payment-mode.modal';
 import PaymentModeWorkspace from './payment-modes/payment-mode.workspace';
 import RequirePaymentModal from './prompt-payment/prompt-payment-modal.component';
@@ -74,6 +73,9 @@ import DeleteDepositModal from './bill-deposit/components/modal/delete-deposit.m
 import ReverseTransactionModal from './bill-deposit/components/modal/reverse-transaction.modal';
 import DepositTransactionWorkspace from './bill-deposit/components/forms/deposit-transactions/deposit-transaction.workspace';
 
+// Print Preview Components
+import PrintPreviewModal from './print-preview/print-preview.modal';
+
 // Translation
 export const importTranslation = require.context('../translations', false, /.json$/, 'lazy');
 
@@ -212,7 +214,6 @@ export const visitAttributeTags = getSyncLifecycle(VisitAttributeTags, options);
 export const initiatePaymentDialog = getSyncLifecycle(InitiatePaymentDialog, options);
 export const paymentModeWorkspace = getSyncLifecycle(PaymentModeWorkspace, options);
 export const deletePaymentModeModal = getSyncLifecycle(DeletePaymentModeModal, options);
-export const paidBillReceiptPrintPreviewModal = getSyncLifecycle(ReceiptPrintPreviewModal, options);
 
 // Payment Points Components
 export const createPaymentPoint = getSyncLifecycle(CreatePaymentPoint, options);
@@ -234,6 +235,10 @@ export const addDepositWorkspace = getSyncLifecycle(AddDepositWorkspace, options
 export const deleteDepositModal = getSyncLifecycle(DeleteDepositModal, options);
 export const depositTransactionWorkspace = getSyncLifecycle(DepositTransactionWorkspace, options);
 export const reverseTransactionModal = getSyncLifecycle(ReverseTransactionModal, options);
+
+// Print Preview Components
+export const printPreviewModal = getSyncLifecycle(PrintPreviewModal, options);
+
 // App Startup
 export function startupApp() {
   defineConfigSchema(moduleName, configSchema);

package/src/invoice/invoice.component.tsx

@@ -17,11 +17,10 @@ import {
   useVisitContextStore,
 } from '@openmrs/esm-framework';
 import { ErrorState } from '@openmrs/esm-patient-common-lib';
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom';
-import { useReactToPrint } from 'react-to-print';
-import { useBill, useDefaultFacility } from '../billing.resource';
+import { useBill } from '../billing.resource';
 import { spaBasePath } from '../constants';
 import { convertToCurrency } from '../helpers';
 import { usePaymentsReconciler } from '../hooks/use-payments-reconciler';
@@ -31,16 +30,14 @@ import { useShaFacilityStatus } from './invoice.resource';
 import styles from './invoice.scss';
 import Payments from './payments/payments.component';
 import ReceiptPrintButton from './print-bill-receipt/receipt-print-button.component';
-import PrintableInvoice from './printable-invoice/printable-invoice.component';
 import capitalize from 'lodash-es/capitalize';
 import { mutate } from 'swr';
+import startCase from 'lodash-es/startCase';
 
 const Invoice: React.FC = () => {
   const { t } = useTranslation();
-  const { data: facilityInfo } = useDefaultFacility();
   const { shaFacilityStatus } = useShaFacilityStatus();
   const { billUuid, patientUuid } = useParams();
-  const [isPrinting, setIsPrinting] = useState(false);
   const { patient, isLoading: isLoadingPatient, error: patientError } = usePatient(patientUuid);
   const { bill, isLoading: isLoadingBill, error: billingError } = useBill(billUuid);
   const isInsurancePayment = (payments) => {
@@ -50,7 +47,6 @@ const Invoice: React.FC = () => {
   const { activeVisit, isLoading: isVisitLoading, error: visitError } = useVisit(patientUuid);
   const { patientUuid: visitStorePatientUuid, manuallySetVisitUuid } = useVisitContextStore();
   const [selectedLineItems, setSelectedLineItems] = useState([]);
-  const componentRef = useRef<HTMLDivElement>(null);
   const isProcessClaimsFormEnabled = useFeatureFlag('healthInformationExchange');
 
   const isShaFacilityStatusValid =
@@ -65,19 +61,13 @@ const Invoice: React.FC = () => {
     setSelectedLineItems(uniqueLineItems);
   };
 
-  const handlePrint = useReactToPrint({
-    contentRef: componentRef,
-    documentTitle: `Invoice ${bill?.receiptNumber} - ${patient?.name?.[0]?.given?.join(' ')} ${
-      patient?.name?.[0].family
-    }`,
-    onBeforePrint: async () => {
-      setIsPrinting(true);
-      return Promise.resolve();
-    },
-    onAfterPrint() {
-      setIsPrinting(false);
-    },
-  });
+  const handlePrint = () => {
+    const dispose = showModal('print-preview-modal', {
+      onClose: () => dispose(),
+      title: `${t('invoice', 'Invoice')} ${bill?.receiptNumber} - ${startCase(bill?.patientName)}`,
+      documentUrl: `/openmrs${restBaseUrl}/cashier/print?documentType=invoice&billId=${bill?.id}`,
+    });
+  };
 
   const handleBillPayment = () => {
     const dispose = showModal('initiate-payment-modal', {
@@ -185,11 +175,10 @@ const Invoice: React.FC = () => {
           onClick={handlePrint}
           kind="tertiary"
           size="sm"
-          disabled={isPrinting}
           renderIcon={Printer}
           iconDescription="Add"
           tooltipPosition="right">
-          {isPrinting ? t('printingInvoice', 'Printing invoice...') : t('printInvoice', 'Print invoice')}
+          {t('printInvoice', 'Print invoice')}
         </Button>
         <Button
           onClick={handleBillPayment}
@@ -217,21 +206,11 @@ const Invoice: React.FC = () => {
 
       <InvoiceTable bill={bill} isLoadingBill={isLoadingBill} onSelectItem={handleSelectItem} />
       <Payments bill={bill} selectedLineItems={selectedLineItems} />
-
-      <div className={styles.printContainer}>
-        <PrintableInvoice
-          ref={componentRef}
-          facilityInfo={facilityInfo}
-          bill={bill}
-          patient={patient}
-          isPrinting={isPrinting}
-        />
-      </div>
     </div>
   );
 };
 
-function InvoiceSummary({ bill }: { readonly bill: MappedBill }) {
+export function InvoiceSummary({ bill }: { readonly bill: MappedBill }) {
   const { t } = useTranslation();
   return (
     <>
@@ -271,7 +250,7 @@ function InvoiceSummary({ bill }: { readonly bill: MappedBill }) {
   );
 }
 
-function InvoiceSummaryItem({ label, value }: { readonly label: string; readonly value: string | number }) {
+export function InvoiceSummaryItem({ label, value }: { readonly label: string; readonly value: string | number }) {
   return (
     <div className={styles.invoiceSummaryItem}>
       <span className={styles.label}>{label}</span>

package/src/invoice/print-bill-receipt/receipt-print-button.component.tsx

@@ -1,9 +1,10 @@
 import { Button } from '@carbon/react';
 import { Printer } from '@carbon/react/icons';
-import { showModal } from '@openmrs/esm-framework';
+import { restBaseUrl, showModal } from '@openmrs/esm-framework';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { MappedBill, PaymentStatus } from '../../types';
+import startCase from 'lodash-es/startCase';
 
 interface ReceiptPrintButtonProps {
   bill: MappedBill;
@@ -15,9 +16,10 @@ const ReceiptPrintButton: React.FC<ReceiptPrintButtonProps> = ({ bill }) => {
   const isPrintingDisabled = shouldDisablePrinting(bill);
 
   const handlePrintClick = () => {
-    const dispose = showModal('paid-bill-receipt-print-preview-modal', {
+    const dispose = showModal('print-preview-modal', {
       onClose: () => dispose(),
-      bill,
+      title: `${t('receipt', 'Receipt')} ${bill?.receiptNumber} - ${startCase(bill?.patientName)}`,
+      documentUrl: `/openmrs${restBaseUrl}/cashier/receipt?billId=${bill.id}`,
     });
   };
 

package/src/payment-modes/payment-mode-dashboard.compont.tsx

@@ -22,7 +22,7 @@ import {
 } from '@carbon/react';
 
 import styles from './payment-mode-dashboard.scss';
-import { formatDate, launchWorkspace, showModal, useDebounce } from '@openmrs/esm-framework';
+import { formatDate, launchWorkspace, showModal, useDebounce, useLayoutType } from '@openmrs/esm-framework';
 import { PaymentMode } from '../types';
 import startCase from 'lodash/startCase';
 
@@ -30,7 +30,7 @@ type PaymentModeDashboardProps = {};
 
 const PaymentModeDashboard: React.FC<PaymentModeDashboardProps> = () => {
   const { t } = useTranslation();
-  const size = 'md';
+  const size = useLayoutType() === 'tablet' ? 'md' : 'sm';
   const { paymentModes = [], isLoading } = usePaymentModes(false);
   const [searchTerm, setSearchTerm] = useState('');
 

package/src/payment-modes/payment-mode.workspace.test.tsx

@@ -99,7 +99,7 @@ describe('PaymentModeWorkspace', () => {
     // Key in attribute type name, description, required and format
     const attributeTypeNameInput = screen.getByRole('textbox', { name: /Attribute name/i });
     const attributeTypeDescriptionInput = screen.getByRole('textbox', { name: /Attribute description/i });
-    const attributeRegExpInput = screen.getByRole('textbox', { name: /Enter regular expression/i });
+    const attributeRegExpInput = screen.getByRole('textbox', { name: /Regular expression/i });
     const attributeRetiredToggle = screen.getByRole('switch', { name: /Attribute retired/i });
     const attributeRequiredToggle = screen.getByRole('switch', { name: /Attribute required/i });
 
@@ -148,4 +148,60 @@ describe('PaymentModeWorkspace', () => {
       '',
     );
   });
+
+  test('should submit payload with attributeTypes and uuid when in edit mode', async () => {
+    const initialPaymentMode = {
+      uuid: '123',
+      name: 'Test Name',
+      description: 'Test Description',
+      retired: false,
+      attributeTypes: [
+        {
+          name: 'Test Attribute Name',
+          uuid: '456',
+          format: 'java.lang.String',
+          regExp: null,
+          attributeOrder: 0,
+          foreignKey: null,
+          description: 'Test Attribute Description',
+          retired: false,
+          required: false,
+        },
+      ],
+    };
+
+    const user = userEvent.setup();
+    render(<PaymentModeWorkspace {...testProps} initialPaymentMode={initialPaymentMode} />);
+
+    // make the attribute type required
+    const attributeRequiredToggle = screen.getByRole('switch', { name: /Attribute required/i });
+    await user.click(attributeRequiredToggle);
+
+    // click save and close
+    const saveAndCloseButton = screen.getByRole('button', { name: /Save & Close/i });
+    await user.click(saveAndCloseButton);
+
+    // should call createPaymentMode with attributeTypes and uuid
+    expect(mockCreatePaymentMode).toHaveBeenCalledWith(
+      {
+        description: 'Test Description',
+        name: 'Test Name',
+        attributeTypes: [
+          {
+            name: 'Test Attribute Name',
+            uuid: '456',
+            description: 'Test Attribute Description',
+            retired: false,
+            required: true,
+            format: 'java.lang.String',
+            regExp: null,
+            attributeOrder: 0,
+            foreignKey: null,
+          },
+        ],
+        retired: false,
+      },
+      '123',
+    );
+  });
 });

package/src/payment-modes/payment-mode.workspace.tsx

@@ -54,16 +54,22 @@ const PaymentModeWorkspace: React.FC<PaymentModeWorkspaceProps> = ({
   });
 
   const mappedAttributeTypes = (attributes) => {
-    return {
+    const uuid = initialPaymentMode?.uuid
+      ? initialPaymentMode.attributeTypes.find((a) => a.name === attributes.name)?.uuid
+      : null;
+
+    const attributeType = {
       name: attributes.name,
       description: attributes.description,
       retired: attributes.retired,
       attributeOrder: attributes?.attributeOrder ?? 0,
       format: attributes?.format ?? '',
       foreignKey: attributes?.foreignKey ?? null,
-      regExp: attributes?.regExp ?? '',
+      regExp: attributes?.regExp ?? null,
       required: attributes.required,
     };
+
+    return uuid ? { ...attributeType, uuid } : attributeType;
   };
 
   const onSubmit = async (data: PaymentModeFormSchema) => {
@@ -192,7 +198,7 @@ const PaymentModeWorkspace: React.FC<PaymentModeWorkspaceProps> = ({
           </Stack>
         </div>
         <ButtonSet className={classNames({ [styles.tablet]: isTablet, [styles.desktop]: !isTablet })}>
-          <Button style={{ maxWidth: '50%' }} kind="secondary" onClick={() => closeWorkspace}>
+          <Button style={{ maxWidth: '50%' }} kind="secondary" onClick={() => closeWorkspace()}>
             {t('cancel', 'Cancel')}
           </Button>
           <Button

package/src/payment-modes/usePaymentModeFormSchema.tsx

@@ -8,7 +8,7 @@ const usePaymentModeFormSchema = () => {
       retired: z.boolean().default(false),
       retiredReason: z.string().optional(),
       format: z.string().optional(),
-      regExp: z.string().optional(),
+      regExp: z.union([z.string(), z.null()]).optional(),
       required: z.boolean().default(false),
     })
     .refine(

package/src/print-preview/print-preview.modal.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { usePrintPreview } from '../hooks/usePrintPreview';
+import { useTranslation } from 'react-i18next';
+import { ModalBody, ModalHeader, InlineLoading, ModalFooter, Button } from '@carbon/react';
+import { ErrorState } from '@openmrs/esm-framework';
+import styles from './print-preview.scss';
+
+type PrintPreviewModalProps = {
+  onClose: () => void;
+  title?: string;
+  documentUrl?: string;
+};
+
+const PrintPreviewModal: React.FC<PrintPreviewModalProps> = ({ onClose, title, documentUrl }) => {
+  const { t } = useTranslation();
+
+  const { data, isLoading, error } = usePrintPreview(documentUrl);
+  return (
+    <div>
+      <>
+        <ModalHeader closeModal={onClose} className={styles.title}>
+          {t('printPreview', 'Print Preview {{title}}', { title })}
+        </ModalHeader>
+        <ModalBody>
+          {isLoading && (
+            <InlineLoading
+              status="active"
+              iconDescription="Loading"
+              description={t('loadingReceipt', 'Loading Receipt')}
+            />
+          )}
+          {error && <ErrorState error={error} headerTitle={t('previewError', 'Preview Error')} />}
+          {data && !isLoading && <iframe src={String(data)} title="Receipt Preview" className={styles.previewFrame} />}
+        </ModalBody>
+        <ModalFooter>
+          <Button kind="secondary" onClick={onClose} type="button" className={styles.btn}>
+            {t('close', 'Close')}
+          </Button>
+        </ModalFooter>
+      </>
+    </div>
+  );
+};
+
+export default PrintPreviewModal;

package/src/routes.json

@@ -302,10 +302,6 @@
       "name": "manage-claim-request-modal",
       "component": "manageClaimRequestModal"
     },
-    {
-      "name": "paid-bill-receipt-print-preview-modal",
-      "component": "paidBillReceiptPrintPreviewModal"
-    },
     {
       "name": "clock-in-modal",
       "component": "clockIn"
@@ -321,6 +317,10 @@
     {
       "name": "reverse-transaction-modal",
       "component": "reverseTransactionModal"
+    },
+    {
+      "name": "print-preview-modal",
+      "component": "printPreviewModal"
     }
   ]
 }

package/translations/en.json

@@ -33,7 +33,6 @@
   "billDate": "Date",
   "billDepositForm": "Bill Deposit Form",
   "billedItems": "Billed Items",
-  "billedTo": "Billed to",
   "billErrorService": "Bill service error",
   "billing": "Billing",
   "billingForm": "Billing Form",
@@ -134,7 +133,6 @@
   "filterTable": "Filter table",
   "finalDiagnosis": "Final Diagnosis",
   "formTitle": "Fill in the form details",
-  "generatedMessage": "The invoice has been electronically generated and is a valid document. It was created by {{userName}} on {{date}} at {{time}}",
   "hieVerificationFailure": "HIE verification failure",
   "home": "Home",
   "identifier": "Identifier",
@@ -232,7 +230,6 @@
   "previousPage": "Previous page",
   "price": "Price",
   "prices": "Prices",
-  "printingInvoice": "Printing invoice...",
   "printInvoice": "Print invoice",
   "printReceipt": "Print receipt",
   "proceedToCare": "Proceed to care",
@@ -244,6 +241,7 @@
   "providerMessage": "By clicking Proceed to care, you acknowledge that you have advised the patient to settle the bill.",
   "providerName": "Provider Name",
   "quantity": "Quantity",
+  "receipt": "Receipt",
   "referenceCodes": " Reference Codes",
   "referenceNumber": "Reference number",
   "refundItem": "Refund item",