@openmrs/esm-billing-app 1.0.2-pre.749 → 1.0.2-pre.753

package/dist/openmrs-esm-billing-app.js.buildmanifest.json

@@ -71,9 +71,9 @@
       "initial": false,
       "entry": false,
       "recorded": false,
-      "size": 1160950,
+      "size": 1169019,
       "sizes": {
-        "javascript": 1160908,
+        "javascript": 1168977,
         "consume-shared": 42
       },
       "names": [],
@@ -87,7 +87,7 @@
       "auxiliaryFiles": [
         "942.js.map"
       ],
-      "hash": "098f5ee4da4a74ea",
+      "hash": "07d8b49d56e0d2ac",
       "childrenByOrder": {}
     },
     {
@@ -544,9 +544,9 @@
       "initial": false,
       "entry": false,
       "recorded": false,
-      "size": 7145,
+      "size": 7784,
       "sizes": {
-        "javascript": 7145
+        "javascript": 7784
       },
       "names": [],
       "idHints": [],
@@ -558,7 +558,7 @@
         "4300.js"
       ],
       "auxiliaryFiles": [],
-      "hash": "2e6646e44cdf3fec",
+      "hash": "0a3134f69ef42cdf",
       "childrenByOrder": {}
     },
     {
@@ -659,9 +659,9 @@
       "initial": false,
       "entry": false,
       "recorded": false,
-      "size": 37846,
+      "size": 37992,
       "sizes": {
-        "javascript": 37846
+        "javascript": 37992
       },
       "names": [],
       "idHints": [],
@@ -675,7 +675,7 @@
       "auxiliaryFiles": [
         "4739.js.map"
       ],
-      "hash": "9effec24bd4f34f8",
+      "hash": "9eaad0c36391ca90",
       "childrenByOrder": {}
     },
     {
@@ -1209,10 +1209,10 @@
       "initial": true,
       "entry": true,
       "recorded": false,
-      "size": 5458780,
+      "size": 5466849,
       "sizes": {
         "consume-shared": 210,
-        "javascript": 5436125,
+        "javascript": 5444194,
         "share-init": 336,
         "runtime": 22109
       },
@@ -1229,7 +1229,7 @@
       "auxiliaryFiles": [
         "main.js.map"
       ],
-      "hash": "1cb9dee790fa6c89",
+      "hash": "20bbef786291d470",
       "childrenByOrder": {}
     },
     {

package/dist/routes.json

@@ -1 +1 @@
-{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":">=2.24.0","fhir2":">=1.2"},"pages":[{"component":"billableServicesHome","route":"billable-services"}],"extensions":[{"component":"billingDashboardLink","name":"billing-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"billing","title":"billing","slot":"billing-dashboard-slot"},"featureFlag":"billing"},{"component":"root","name":"billing-dashboard-root","slot":"billing-dashboard-slot"},{"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 history"},"featureFlag":"billing"},{"name":"billable-services-app-menu-item","component":"billableServicesAppMenuItem","slot":"app-menu-item-slot","meta":{"name":"Billable Services"}},{"name":"billing-checkin-form","slot":"extra-visit-attribute-slot","component":"billingCheckInForm","featureFlag":"billing"},{"slot":"system-admin-page-card-link-slot","component":"billableServicesCardLink","name":"billable-services-admin-card-link"},{"name":"patient-banner-billing-tags","component":"visitAttributeTags","slot":"patient-banner-tags-slot","order":2},{"name":"billing-home-tiles-ext","slot":"billing-home-tiles-slot","component":"serviceMetrics"},{"name":"edit-bill-line-item-dialog","component":"editBillLineItemModal","online":true,"offline":true}],"modals":[{"name":"add-cash-point-modal","component":"addCashPointModal"},{"name":"add-payment-mode-modal","component":"addPaymentModeModal"},{"name":"delete-payment-mode-modal","component":"deletePaymentModeModal"},{"name":"edit-bill-item-modal","component":"editBillLineItemModal"},{"name":"edit-billable-service-modal","component":"editBillableServiceModal"},{"name":"require-billing-modal","component":"requirePaymentModal"}],"workspaces":[{"name":"billing-form-workspace","title":"billingForm","component":"billingFormWorkspace","type":"form"}],"featureFlags":[{"flagName":"billing","label":"Billing module","description":"This feature introduces navigation links on the patient chart and home page to allow accessing the billing module features"}],"version":"1.0.2-pre.749"}
+{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":">=2.24.0","fhir2":">=1.2"},"pages":[{"component":"billableServicesHome","route":"billable-services"}],"extensions":[{"component":"billingDashboardLink","name":"billing-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"billing","title":"billing","slot":"billing-dashboard-slot"},"featureFlag":"billing"},{"component":"root","name":"billing-dashboard-root","slot":"billing-dashboard-slot"},{"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 history"},"featureFlag":"billing"},{"name":"billable-services-app-menu-item","component":"billableServicesAppMenuItem","slot":"app-menu-item-slot","meta":{"name":"Billable Services"}},{"name":"billing-checkin-form","slot":"extra-visit-attribute-slot","component":"billingCheckInForm","featureFlag":"billing"},{"slot":"system-admin-page-card-link-slot","component":"billableServicesCardLink","name":"billable-services-admin-card-link"},{"name":"patient-banner-billing-tags","component":"visitAttributeTags","slot":"patient-banner-tags-slot","order":2},{"name":"billing-home-tiles-ext","slot":"billing-home-tiles-slot","component":"serviceMetrics"},{"name":"edit-bill-line-item-dialog","component":"editBillLineItemModal","online":true,"offline":true}],"modals":[{"name":"add-cash-point-modal","component":"addCashPointModal"},{"name":"add-payment-mode-modal","component":"addPaymentModeModal"},{"name":"delete-payment-mode-modal","component":"deletePaymentModeModal"},{"name":"edit-bill-item-modal","component":"editBillLineItemModal"},{"name":"edit-billable-service-modal","component":"editBillableServiceModal"},{"name":"require-billing-modal","component":"requirePaymentModal"}],"workspaces":[{"name":"billing-form-workspace","title":"billingForm","component":"billingFormWorkspace","type":"form"}],"featureFlags":[{"flagName":"billing","label":"Billing module","description":"This feature introduces navigation links on the patient chart and home page to allow accessing the billing module features"}],"version":"1.0.2-pre.753"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-billing-app",
-  "version": "1.0.2-pre.749",
+  "version": "1.0.2-pre.753",
   "description": "O3 frontend module for handling billing concerns in healthcare settings",
   "browser": "dist/openmrs-esm-billing-app.js",
   "main": "src/index.ts",

package/src/bill-item-actions/edit-bill-item.modal.tsx

@@ -110,7 +110,6 @@ const EditBillLineItemModal: React.FC<EditBillLineItemModalProps> = ({ bill, clo
         title: t('saveBill', 'Save Bill'),
         subtitle: t('billProcessingSuccess', 'Bill processing has been successful'),
         kind: 'success',
-        timeoutInMs: 3000,
       });
       closeModal();
     } catch (error) {

package/src/bill-item-actions/edit-bill-item.test.tsx

@@ -110,7 +110,6 @@ describe('ChangeStatus component', () => {
         title: 'Save Bill',
         subtitle: 'Bill processing has been successful',
         kind: 'success',
-        timeoutInMs: 3000,
       });
       expect(closeModalMock).toHaveBeenCalled();
     });

package/src/billable-services/billable-service.resource.ts

@@ -1,8 +1,7 @@
 import useSWR from 'swr';
 import { type OpenmrsResource, openmrsFetch, restBaseUrl, useOpenmrsFetchAll, useConfig } from '@openmrs/esm-framework';
-import { type ServiceConcept } from '../types';
 import { apiBasePath } from '../constants';
-import { type BillableService } from '../types/index';
+import { type BillableService, type ServiceConcept } from '../types';
 import type { BillingConfig } from '../config-schema';
 
 type ResponseObject = {
@@ -29,10 +28,14 @@ export function useServiceTypes() {
 
   const { data, error, isLoading } = useSWR<{ data }>(url, openmrsFetch);
 
+  const sortedServiceTypes = data?.data.setMembers
+    ? [...data.data.setMembers].sort((a, b) => a.display.localeCompare(b.display))
+    : [];
+
   return {
-    serviceTypes: data?.data.setMembers ?? [],
+    serviceTypes: sortedServiceTypes,
     error,
-    isLoading,
+    isLoadingServiceTypes: isLoading,
   };
 }
 
@@ -41,10 +44,14 @@ export const usePaymentModes = () => {
 
   const { data, error, isLoading } = useSWR<{ data: ResponseObject }>(url, openmrsFetch);
 
+  const sortedPaymentModes = data?.data.results
+    ? [...data.data.results].sort((a, b) => a.name.localeCompare(b.name))
+    : [];
+
   return {
-    paymentModes: data?.data.results ?? [],
+    paymentModes: sortedPaymentModes,
     error,
-    isLoading,
+    isLoadingPaymentModes: isLoading,
   };
 };
 

package/src/billable-services/billable-services.component.tsx

@@ -21,14 +21,15 @@ import {
 } from '@carbon/react';
 import { ArrowRight } from '@carbon/react/icons';
 import {
-  useLayoutType,
-  isDesktop,
-  useConfig,
-  usePagination,
   ErrorState,
+  getCoreTranslation,
+  isDesktop,
   navigate,
   showModal,
-  getCoreTranslation,
+  useConfig,
+  useLayoutType,
+  usePagination,
+  type LayoutType,
 } from '@openmrs/esm-framework';
 import { EmptyState } from '@openmrs/esm-patient-common-lib';
 import { type BillableService } from '../types/index';
@@ -36,6 +37,14 @@ import { useBillableServices } from './billable-service.resource';
 import type { BillingConfig } from '../config-schema';
 import styles from './billable-services.scss';
 
+interface FilterableTableHeaderProps {
+  layout: LayoutType;
+  handleSearch: (e: React.ChangeEvent<HTMLInputElement>) => void;
+  isValidating: boolean;
+  responsiveSize: 'sm' | 'md' | 'lg';
+  t: (key: string, fallback: string) => string;
+}
+
 const BillableServices = () => {
   const { t } = useTranslation();
   const { billableServices, isLoading, isValidating, error, mutate } = useBillableServices();
@@ -67,10 +76,6 @@ const BillableServices = () => {
       header: t('prices', 'Prices'),
       key: 'prices',
     },
-    {
-      header: getCoreTranslation('actions'),
-      key: 'actions',
-    },
   ];
 
   const launchBillableServiceForm = useCallback(() => {
@@ -81,8 +86,9 @@ const BillableServices = () => {
     const flatBillableServices = Array.isArray(billableServices) ? billableServices.flat() : billableServices;
 
     if (flatBillableServices !== undefined && flatBillableServices.length > 0) {
-      if (searchString && searchString.trim() !== '') {
-        const search = searchString.toLowerCase();
+      const trimmedSearch = searchString.trim();
+      if (trimmedSearch) {
+        const search = trimmedSearch.toLowerCase();
         return flatBillableServices.filter((service: BillableService) =>
           Object.entries(service).some(([header, value]) => {
             return header === 'uuid' ? false : `${value}`.toLowerCase().includes(search);
@@ -97,21 +103,16 @@ const BillableServices = () => {
   const rowData = [];
 
   if (results) {
-    results.forEach((service, index) => {
+    results.forEach((service) => {
       const s = {
-        id: `${index}`,
+        id: service.uuid,
         uuid: service.uuid,
         serviceName: service.name,
         shortName: service.shortName,
         serviceType: service?.serviceType?.display,
         status: service.serviceStatus,
-        prices: '--',
+        prices: service.servicePrices.map((price) => `${price.name} (${price.price})`).join(', ') || '--',
       };
-      let cost = '';
-      service.servicePrices.forEach((price) => {
-        cost += `${price.name} (${price.price}) `;
-      });
-      s.prices = cost;
       rowData.push(s);
     });
   }
@@ -123,29 +124,33 @@ const BillableServices = () => {
     },
     [goTo, setSearchString],
   );
+
   const handleEditService = useCallback(
-    (service) => {
-      showModal('edit-billable-service-modal', {
-        editingService: service,
+    (service: BillableService) => {
+      const dispose = showModal('edit-billable-service-modal', {
+        serviceToEdit: service,
         onServiceUpdated: mutate,
+        closeModal: () => dispose(),
       });
     },
     [mutate],
   );
 
   if (isLoading) {
-    return <InlineLoading status="active" iconDescription="Loading" description="Loading data..." />;
+    return (
+      <InlineLoading status="active" iconDescription={getCoreTranslation('loading')} description="Loading data..." />
+    );
   }
 
   if (error) {
-    return <ErrorState headerTitle={t('billableService', 'Billable Service')} error={error} />;
+    return <ErrorState headerTitle={t('billableService', 'Billable service')} error={error} />;
   }
 
   if (billableServices.length === 0) {
     return (
       <EmptyState
         displayText={t('billableServices__lower', 'billable services')}
-        headerTitle={t('billableService', 'Billable Service')}
+        headerTitle={t('billableService', 'Billable service')}
         launchForm={launchBillableServiceForm}
       />
     );
@@ -164,16 +169,24 @@ const BillableServices = () => {
         isSortable
         rows={rowData}
         headers={headerData}
+        overflowMenuOnHover={isDesktop(layout)}
         size={responsiveSize}
-        useZebraStyles={rowData?.length > 1 ? true : false}>
-        {({ rows, headers, getRowProps, getTableProps }) => (
+        useZebraStyles={rowData?.length > 1}>
+        {({ rows, headers, getHeaderProps, getRowProps, getTableProps }) => (
           <TableContainer>
             <Table {...getTableProps()} aria-label="service list">
               <TableHead>
                 <TableRow>
                   {headers.map((header) => (
-                    <TableHeader key={header.key}>{header.header}</TableHeader>
+                    <TableHeader
+                      {...getHeaderProps({
+                        header,
+                      })}
+                      key={header.key}>
+                      {header.header}
+                    </TableHeader>
                   ))}
+                  <TableHeader aria-label={getCoreTranslation('actions')} />
                 </TableRow>
               </TableHead>
               <TableBody>
@@ -187,10 +200,10 @@ const BillableServices = () => {
                       <TableCell key={cell.id}>{cell.value}</TableCell>
                     ))}
                     <TableCell className="cds--table-column-menu">
-                      <OverflowMenu size="sm" flipped>
+                      <OverflowMenu size="lg" flipped>
                         <OverflowMenuItem
                           className={styles.menuItem}
-                          itemText={t('editBillableService', 'Edit Billable Service')}
+                          itemText={t('editBillableService', 'Edit billable service')}
                           onClick={() => handleEditService(results.find((service) => service.uuid === row.id))}
                         />
                       </OverflowMenu>
@@ -216,8 +229,8 @@ const BillableServices = () => {
       )}
       {paginated && (
         <Pagination
-          forwardText="Next page"
-          backwardText="Previous page"
+          forwardText={t('nextPage', 'Next page')}
+          backwardText={t('previousPage', 'Previous page')}
           page={currentPage}
           pageSize={pageSize}
           pageSizes={pageSizes}
@@ -238,7 +251,7 @@ const BillableServices = () => {
   );
 };
 
-function FilterableTableHeader({ layout, handleSearch, isValidating, responsiveSize, t }) {
+function FilterableTableHeader({ layout, handleSearch, isValidating, responsiveSize, t }: FilterableTableHeaderProps) {
   return (
     <>
       <div className={styles.headerContainer}>
@@ -274,4 +287,5 @@ function FilterableTableHeader({ layout, handleSearch, isValidating, responsiveS
     </>
   );
 }
+
 export default BillableServices;

package/src/billable-services/cash-point/cash-point-configuration.component.tsx

@@ -39,8 +39,9 @@ const CashPointConfiguration: React.FC = () => {
   }, [fetchCashPoints]);
 
   const handleAddCashPoint = () => {
-    showModal('add-cash-point-modal', {
+    const dispose = showModal('add-cash-point-modal', {
       onCashPointAdded: fetchCashPoints,
+      closeModal: () => dispose(),
     });
   };