@kenyaemr/esm-billing-app 5.4.1-pre.2108 → 5.4.1-pre.2113

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":"billingDashboardLink","name":"billing-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"billing","title":"billing","slot":"billing-dashboard-slot"}},{"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-link-slot"},{"component":"paymentHistoryLink","name":"payment-history-link","slot":"billing-dashboard-link-slot"},{"component":"paymentPointsLink","name":"payment-points-link","slot":"billing-dashboard-link-slot"},{"component":"paymentModesLink","name":"payment-modes-link","slot":"billing-dashboard-link-slot"},{"component":"billManagerLink","name":"bill-manager-link","slot":"billing-dashboard-link-slot"},{"component":"chargeableItemsLink","name":"chargeable-items-link","slot":"billing-dashboard-link-slot"},{"component":"billableExemptionsLink","name":"billable-exemptions-link","slot":"billing-dashboard-link-slot"},{"component":"claimsManagementSideNavGroup","name":"claims-management-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"claims-management","title":"Claims management Overview","slot":"case-management-slot"},"featureFlag":"healthInformationExchange"},{"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":"bill-deposit-workspace","component":"billDepositWorkspace","title":"Bill Deposit Workspace","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"}],"version":"5.4.1-pre.2108"}
+{"$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":"billingDashboardLink","name":"billing-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"billing","title":"billing","slot":"billing-dashboard-slot"}},{"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-link-slot"},{"component":"paymentHistoryLink","name":"payment-history-link","slot":"billing-dashboard-link-slot"},{"component":"paymentPointsLink","name":"payment-points-link","slot":"billing-dashboard-link-slot"},{"component":"paymentModesLink","name":"payment-modes-link","slot":"billing-dashboard-link-slot"},{"component":"billManagerLink","name":"bill-manager-link","slot":"billing-dashboard-link-slot"},{"component":"chargeableItemsLink","name":"chargeable-items-link","slot":"billing-dashboard-link-slot"},{"component":"billableExemptionsLink","name":"billable-exemptions-link","slot":"billing-dashboard-link-slot"},{"component":"claimsManagementSideNavGroup","name":"claims-management-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"claims-management","title":"Claims management Overview","slot":"case-management-slot"},"featureFlag":"healthInformationExchange"},{"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":"bill-deposit-workspace","component":"billDepositWorkspace","title":"Bill Deposit Workspace","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"}],"version":"5.4.1-pre.2113"}

package/package.json

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

package/src/claims/dashboard/table/claims-table.component.tsx

@@ -34,6 +34,7 @@ type ClaimsTableProps = {
 
 const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, isLoadingBill, onSelectItem }) => {
   const { t } = useTranslation();
+  const { lineItems } = bill;
   const layout = useLayoutType();
   const responsiveSize = isDesktop(layout) ? 'sm' : 'lg';
   const [selectedLineItems, setSelectedLineItems] = useState<LineItem[]>([]);
@@ -42,33 +43,20 @@ const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, is
   const [currentPage, setCurrentPage] = useState(1);
   const [pageSize, setPageSize] = useState(10);
 
-  // Filter line items that are paid and paid through Insurance
-  const insurancePaidLineItems = useMemo(() => {
-    return (bill.lineItems || []).filter((lineItem) => {
-      // Check if payment status is PAID
-      const isPaid = lineItem.paymentStatus === 'PAID';
-
-      // Check if there's an Insurance payment for this line item
-      const hasInsurancePayment = bill.payments?.some(
-        (payment) => payment.billLineItem?.uuid === lineItem.uuid && payment.instanceType?.name === 'Insurance',
-      );
-
-      return isPaid && hasInsurancePayment;
-    });
-  }, [bill.lineItems, bill.payments]);
+  const paidLineItems = useMemo(() => (lineItems || []).filter((item) => item.paymentStatus === 'PAID'), [lineItems]);
 
   const filteredLineItems = useMemo(() => {
     if (!debouncedSearchTerm) {
-      return insurancePaidLineItems;
+      return paidLineItems;
     }
 
     return fuzzy
-      .filter(debouncedSearchTerm, insurancePaidLineItems, {
-        extract: (lineItem: LineItem) => `${lineItem.item || lineItem.billableService}`,
+      .filter(debouncedSearchTerm, paidLineItems, {
+        extract: (lineItem: LineItem) => `${lineItem.item}`,
       })
       .sort((r1, r2) => r1.score - r2.score)
       .map((result) => result.original);
-  }, [debouncedSearchTerm, insurancePaidLineItems]);
+  }, [debouncedSearchTerm, paidLineItems]);
 
   const paginatedLineItems = useMemo(() => {
     const startIndex = (currentPage - 1) * pageSize;
@@ -81,20 +69,11 @@ const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, is
     { header: t('serialNo', 'Serial No'), key: 'serialno' },
     { header: t('billItem', 'Bill Item'), key: 'inventoryname' },
     { header: t('status', 'Status'), key: 'status' },
-    { header: t('paymentMethod', 'Payment Method'), key: 'paymentMethod' },
     { header: t('totalAmount', 'Total amount'), key: 'total' },
     { header: t('billCreationDate', 'Bill creation date'), key: 'dateofbillcreation' },
   ];
 
-  const processBillItem = (item) => {
-    const itemName = item?.item || item?.billableService;
-    return itemName?.split(':')[1]?.trim() || itemName;
-  };
-
-  const getPaymentMethod = (lineItemUuid: string) => {
-    const payment = bill.payments?.find((p) => p.billLineItem?.uuid === lineItemUuid);
-    return payment?.instanceType?.name || 'Unknown';
-  };
+  const processBillItem = (item) => (item?.item || item?.billableService)?.split(':')[1];
 
   const tableRows: Array<typeof DataTableRow> = useMemo(
     () =>
@@ -105,12 +84,11 @@ const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, is
           inventoryname: processBillItem(item),
           serialno: bill.receiptNumber,
           status: item.paymentStatus,
-          paymentMethod: getPaymentMethod(item.uuid),
           total: item.price * item.quantity,
           dateofbillcreation: formatDate(new Date(bill.dateCreated), { mode: 'standard' }),
         };
       }) ?? [],
-    [bill.dateCreated, bill.receiptNumber, bill.payments, paginatedLineItems],
+    [bill.dateCreated, bill.receiptNumber, paginatedLineItems],
   );
 
   if (isLoadingBill) {
@@ -148,10 +126,10 @@ const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, is
             className={styles.tableContainer}
             description={
               <span className={styles.tableDescription}>
-                <span>{t('insurancePaidItems', 'Items paid through Insurance')}</span>
+                <span>{t('selectitemstobeclaimed', 'Select items that are to be included in the claims')}</span>
               </span>
             }
-            title={t('claimableItems', 'Claimable Items')}>
+            title={t('lineItems', 'Line items')}>
             <div className={styles.toolbarWrapper}>
               <TableToolbar {...getToolbarProps()} className={styles.tableToolbar} size={responsiveSize}>
                 <TableToolbarContent className={styles.headerContainer}>
@@ -165,7 +143,7 @@ const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, is
                 </TableToolbarContent>
               </TableToolbar>
             </div>
-            <Table {...getTableProps()} aria-label="insurance claim line items" className={styles.table}>
+            <Table {...getTableProps()} aria-label="claim line items" className={styles.table}>
               <TableHead>
                 <TableRow>
                   {isSelectable ? <TableHeader /> : null}
@@ -206,13 +184,14 @@ const ClaimsTable: React.FC<ClaimsTableProps> = ({ bill, isSelectable = true, is
           <Layer>
             <Tile className={styles.filterEmptyStateTile}>
               <p className={styles.filterEmptyStateContent}>
-                {t('noInsurancePaidItems', 'No items paid through insurance found')}
+                {t('noMatchingItemsToDisplay', 'No matching items to display')}
               </p>
+              <p className={styles.filterEmptyStateHelper}>{t('checkFilters', 'Check the filters above')}</p>
             </Tile>
           </Layer>
         </div>
       )}
-      {filteredLineItems.length > pageSize && (
+      {tableRows.length > pageSize && (
         <Pagination
           forwardText="Next page"
           backwardText="Previous page"

package/src/hooks/useInterventions.ts

@@ -97,8 +97,8 @@ export const useInterventions = (filters: InterventionsFilter) => {
   const { isLoading, error, data } = useSWR<FetchResponse<{ results: Array<Intervention> }>>(url, openmrsFetch);
 
   // Mapper function to transform intervention data
-  const mapper = ({ benefitCode, name, parentBenefitCode }: Intervention): SHAIntervention => ({
-    interventionCode: benefitCode,
+  const mapper = ({ code, name, parentBenefitCode }: Intervention): SHAIntervention => ({
+    interventionCode: code,
     interventionName: name,
     interventionPackage: parentBenefitCode,
     ...({} as any),
@@ -112,9 +112,9 @@ export const useInterventions = (filters: InterventionsFilter) => {
 
     const packageCodes = filters.package_code?.split(',').filter(Boolean) || [];
 
-    // Filter based on criteria
-    const filteredResults = data.data.results.filter((intervention) => {
+    const filteredResults = data.data.results.filter((intervention, i) => {
       // Filter by package code (only if defined)
+
       if (packageCodes.length > 0 && !packageCodes.includes(intervention.parentBenefitCode)) {
         return false;
       }
@@ -128,9 +128,14 @@ export const useInterventions = (filters: InterventionsFilter) => {
         return false;
       }
 
-      // Filter by facility level
-      if (level && intervention.levelsApplicable && !intervention.levelsApplicable.some((l) => level.includes(l))) {
-        return false;
+      // // Filter by facility level
+      if (level && intervention.levelsApplicable && Array.isArray(intervention.levelsApplicable)) {
+        // Check if level starts with any of the intervention.levelsApplicable values
+        const levelMatched = intervention.levelsApplicable.some((appLevel) => level.startsWith(appLevel));
+
+        if (!levelMatched) {
+          return false;
+        }
       }
 
       return true; // Keep item if it passes all filters
@@ -139,12 +144,7 @@ export const useInterventions = (filters: InterventionsFilter) => {
     // Map to the required format and ensure uniqueness by interventionCode
     const mappedInterventions = filteredResults.map(mapper);
 
-    // Remove duplicates based on interventionCode
-    const uniqueInterventions = Array.from(
-      new Map(mappedInterventions.map((item) => [item.interventionCode, item])),
-    ).map(([, value]) => value);
-
-    return uniqueInterventions;
+    return mappedInterventions;
   }, [data, filters, level]);
 
   // Map all interventions without filtering

package/src/hooks/usePaymentSchema.tsx

@@ -23,7 +23,6 @@ export function usePaymentSchema(bill: MappedBill) {
         return amountDue >= 0 && value > 0;
       }, 'Amount paid should not be greater than amount due'),
       referenceCode: z.string(),
-      lineItemUuid: z.string().uuid().nonempty({ message: 'Line item selection is required' }),
     })
     .refine(
       (data) => {

package/src/invoice/invoice-table.component.tsx

@@ -151,7 +151,7 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isSelectable = true,
                       {...getRowProps({
                         row,
                       })}>
-                      {isSelectable && (
+                      {rows.length > 1 && isSelectable && (
                         <TableSelectRow
                           aria-label="Select row"
                           {...getSelectionProps({ row })}

package/src/invoice/payments/payment-form/payment-form.component.tsx

@@ -6,33 +6,23 @@ import { Button, Dropdown, NumberInputSkeleton, TextInput, NumberInput } from '@
 import { ErrorState } from '@openmrs/esm-patient-common-lib';
 import styles from './payment-form.scss';
 import { usePaymentModes } from '../../../billing.resource';
-import { type LineItem, PaymentFormValue, PaymentMethod } from '../../../types';
-import { extractBillableName } from '../../../utils';
+import { PaymentFormValue, PaymentMethod } from '../../../types';
 
 type PaymentFormProps = {
   disablePayment: boolean;
   amountDue: number;
-  append: (obj: { method: PaymentMethod; amount: number; referenceCode: string; lineItemUuid: string }) => void;
+  append: (obj: { method: PaymentMethod; amount: number; referenceCode: string }) => void;
   fields: FieldArrayWithId<PaymentFormValue, 'payment', 'id'>[];
   remove: UseFieldArrayRemove;
-  selectedLineItems: Array<LineItem>;
 };
 
-const PaymentForm: React.FC<PaymentFormProps> = ({
-  disablePayment,
-  amountDue,
-  append,
-  remove,
-  fields,
-  selectedLineItems,
-}) => {
+const PaymentForm: React.FC<PaymentFormProps> = ({ disablePayment, amountDue, append, remove, fields }) => {
   const { t } = useTranslation();
   const {
     control,
     formState: { errors },
     setFocus,
     getValues,
-    watch,
   } = useFormContext<PaymentFormValue>();
   const { paymentModes, isLoading, error } = usePaymentModes();
 
@@ -41,26 +31,9 @@ const PaymentForm: React.FC<PaymentFormProps> = ({
     const attributes = formValues?.payment?.[index]?.method?.attributeTypes ?? [];
     return attributes.some((attribute) => attribute.required) || attributes?.length > 0;
   };
-  const paymentValues = watch('payment');
 
-  const getUsedItemUuids = (currentIndex: number) => {
-    return paymentValues
-      .map((payment, index) => (index !== currentIndex ? payment?.lineItemUuid : null))
-      .filter(Boolean);
-  };
-  const getAvailableLineItems = (currentIndex: number) => {
-    const usedUuids = getUsedItemUuids(currentIndex);
-    return selectedLineItems.filter((item) => item.paymentStatus === 'PENDING' && !usedUuids.includes(item.uuid));
-  };
   const handleAppendPaymentMode = useCallback(() => {
-    const availableItems = getAvailableLineItems(fields.length);
-    const initialItemUuid = availableItems.length === 1 ? availableItems[0].uuid : '';
-    append({
-      method: null,
-      amount: null,
-      referenceCode: '',
-      lineItemUuid: initialItemUuid,
-    });
+    append({ method: null, amount: null, referenceCode: '' });
     setFocus(`payment.${fields.length}.method`);
   }, [append, fields.length, setFocus]);
 
@@ -80,91 +53,67 @@ const PaymentForm: React.FC<PaymentFormProps> = ({
 
   return (
     <div className={styles.container}>
-      {fields.map((field, index) => {
-        const availableLineItems = getAvailableLineItems(index);
-        return (
-          <div key={field.id} className={styles.paymentMethodContainer}>
-            <Controller
-              control={control}
-              name={`payment.${index}.lineItemUuid`}
-              render={({ field }) => (
-                <Dropdown
-                  {...field}
-                  id="paymentLineItem"
-                  onChange={({ selectedItem }) => {
-                    field.onChange(selectedItem?.uuid);
-                    setFocus(`payment.${index}.method`);
-                  }}
-                  titleText={t('selectLineItemToPay', 'Select line item to pay')}
-                  label={t('selectLineItemToPay', 'Select line item to pay')}
-                  items={availableLineItems}
-                  itemToString={(item) => extractBillableName(item)}
-                  invalid={!!errors?.payment?.[index]?.lineItemUuid}
-                  invalidText={errors?.payment?.[index]?.lineItemUuid?.message}
-                  className={styles.lineItemDropdown}
-                />
-              )}
-            />
-            <Controller
-              control={control}
-              name={`payment.${index}.method`}
-              render={({ field }) => (
-                <Dropdown
-                  {...field}
-                  id="paymentMethod"
-                  onChange={({ selectedItem }) => {
-                    setFocus(`payment.${index}.amount`);
-                    field.onChange(selectedItem);
-                  }}
-                  titleText={t('paymentMethod', 'Payment method')}
-                  label={t('selectPaymentMethod', 'Select payment method')}
-                  items={paymentModes}
-                  itemToString={(item) => (item ? item.name : '')}
-                  invalid={!!errors?.payment?.[index]?.method}
-                  invalidText={errors?.payment?.[index]?.method?.message}
-                />
-              )}
-            />
+      {fields.map((field, index) => (
+        <div key={field.id} className={styles.paymentMethodContainer}>
+          <Controller
+            control={control}
+            name={`payment.${index}.method`}
+            render={({ field }) => (
+              <Dropdown
+                {...field}
+                id="paymentMethod"
+                onChange={({ selectedItem }) => {
+                  setFocus(`payment.${index}.amount`);
+                  field.onChange(selectedItem);
+                }}
+                titleText={t('paymentMethod', 'Payment method')}
+                label={t('selectPaymentMethod', 'Select payment method')}
+                items={paymentModes}
+                itemToString={(item) => (item ? item.name : '')}
+                invalid={!!errors?.payment?.[index]?.method}
+                invalidText={errors?.payment?.[index]?.method?.message}
+              />
+            )}
+          />
+          <Controller
+            control={control}
+            name={`payment.${index}.amount`}
+            render={({ field }) => (
+              <NumberInput
+                {...field}
+                id="paymentAmount"
+                onChange={(e) => field.onChange(Number(e.target.value))}
+                invalid={!!errors?.payment?.[index]?.amount}
+                invalidText={errors?.payment?.[index]?.amount?.message}
+                label={t('amount', 'Amount')}
+                placeholder={t('enterAmount', 'Enter amount')}
+              />
+            )}
+          />
+          {shouldShowReferenceCode(index) && (
             <Controller
+              name={`payment.${index}.referenceCode`}
               control={control}
-              name={`payment.${index}.amount`}
               render={({ field }) => (
-                <NumberInput
+                <TextInput
                   {...field}
-                  id="paymentAmount"
-                  onChange={(e) => field.onChange(Number(e.target.value))}
-                  invalid={!!errors?.payment?.[index]?.amount}
-                  invalidText={errors?.payment?.[index]?.amount?.message}
-                  label={t('amount', 'Amount')}
-                  placeholder={t('enterAmount', 'Enter amount')}
+                  id="paymentReferenceCode"
+                  labelText={t('referenceNumber', 'Reference number')}
+                  placeholder={t('enterReferenceNumber', 'Enter ref. number')}
+                  type="text"
+                  invalid={!!errors?.payment?.[index]?.referenceCode}
+                  invalidText={errors?.payment?.[index]?.referenceCode?.message}
                 />
               )}
             />
-            {shouldShowReferenceCode(index) && (
-              <Controller
-                name={`payment.${index}.referenceCode`}
-                control={control}
-                render={({ field }) => (
-                  <TextInput
-                    {...field}
-                    id="paymentReferenceCode"
-                    labelText={t('referenceNumber', 'Reference number')}
-                    placeholder={t('enterReferenceNumber', 'Enter ref. number')}
-                    type="text"
-                    invalid={!!errors?.payment?.[index]?.referenceCode}
-                    invalidText={errors?.payment?.[index]?.referenceCode?.message}
-                  />
-                )}
-              />
-            )}
-            <div className={styles.removeButtonContainer}>
-              <TrashCan onClick={() => handleRemovePaymentMode(index)} className={styles.removeButton} size={20} />
-            </div>
+          )}
+          <div className={styles.removeButtonContainer}>
+            <TrashCan onClick={() => handleRemovePaymentMode(index)} className={styles.removeButton} size={20} />
           </div>
-        );
-      })}
+        </div>
+      ))}
       <Button
-        disabled={disablePayment || !selectedLineItems.length}
+        disabled={disablePayment}
         size="md"
         onClick={handleAppendPaymentMode}
         className={styles.paymentButtons}

package/src/invoice/payments/payment-form/payment-form.scss

@@ -19,9 +19,9 @@
 
 .paymentMethodContainer {
   display: grid;
-  grid-template-columns: repeat(5, minmax(auto, 1fr));
+  grid-template-columns: repeat(4, minmax(auto, 1fr));
   align-items: flex-start;
-  column-gap: layout.$spacing-02;
+  column-gap: 1rem;
   margin: 0.625rem 0;
   width: 100%;
 }
@@ -52,6 +52,3 @@
 .removeButton {
   color: colors.$red-60;
 }
-.lineItemDropdown {
-  min-width: 10rem;
-}

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

@@ -67,6 +67,7 @@ const Payments: React.FC<PaymentProps> = ({ bill, selectedLineItems }) => {
       globalActiveSheet,
     );
     remove();
+
     processBillPayment(paymentPayload, bill.uuid).then(
       (resp) => {
         showSnackbar({
@@ -141,12 +142,7 @@ const Payments: React.FC<PaymentProps> = ({ bill, selectedLineItems }) => {
                 className={styles.paymentError}
               />
             )}
-            <PaymentForm
-              {...formArrayMethods}
-              selectedLineItems={selectedLineItems}
-              disablePayment={amountDue <= 0}
-              amountDue={amountDue}
-            />
+            <PaymentForm {...formArrayMethods} disablePayment={amountDue <= 0} amountDue={amountDue} />
           </div>
         </div>
         <div className={styles.divider} />

package/src/invoice/payments/payments.test.tsx

@@ -6,7 +6,6 @@ import { mockBill, mockedActiveSheet, mockLineItems, mockPaymentModes } from '..
 import { processBillPayment, usePaymentModes } from '../../billing.resource';
 import { useClockInStatus } from '../../payment-points/use-clock-in-status';
 import Payments from './payments.component';
-
 const mockProcessBillPayment = processBillPayment as jest.MockedFunction<typeof processBillPayment>;
 const mockUsePaymentModes = usePaymentModes as jest.MockedFunction<typeof usePaymentModes>;
 const mockShowSnackbar = showSnackbar as jest.MockedFunction<typeof showSnackbar>;
@@ -32,7 +31,6 @@ describe('Payment', () => {
         },
       },
     };
-
     mockProcessBillPayment.mockRejectedValueOnce(mockFieldErrorResponse);
     mockUsePaymentModes.mockReturnValue({
       paymentModes: mockPaymentModes,
@@ -51,19 +49,10 @@ describe('Payment', () => {
     });
 
     render(<Payments bill={mockBill as any} selectedLineItems={mockLineItems} />);
-
     const addPaymentMethod = screen.getByRole('button', { name: /Add payment option/i });
     await user.click(addPaymentMethod);
-
-    const lineItemDropdown = await screen.findByRole('combobox', { name: /Select line item to pay/i });
-    await user.click(lineItemDropdown);
-
-    const lineItemOptions = await screen.findAllByRole('option');
-    await user.click(lineItemOptions[0]);
-
-    const paymentMethodDropdown = await screen.findByRole('combobox', { name: /Payment method/i });
-    await user.click(paymentMethodDropdown);
-    const cashOption = await screen.findByRole('option', { name: /Cash/i });
+    await user.click(screen.getByRole('combobox', { name: /Payment method/i }));
+    const cashOption = screen.getByRole('option', { name: /Cash/i });
     await user.click(cashOption);
 
     const amountInput = screen.getByRole('spinbutton', { name: /Amount/i });
@@ -82,8 +71,6 @@ describe('Payment', () => {
             billableService: 'c15d25b9-12bb-441d-9241-cae541dd4575',
             display: 'BillLineItem',
             item: 'c15d25b9-12bb-441d-9241-cae541dd4575',
-            itemOrServiceConceptUuid: 'c42525b9-12bb-441d-9241-cae541dd4575',
-            serviceTypeUuid: '915d25b9-12bb-441d-9241-cae541dd4575',
             lineItemOrder: 0,
             order: null,
             paymentStatus: 'PAID',
@@ -100,8 +87,6 @@ describe('Payment', () => {
             billableService: '04be5832-5440-44d0-83d2-5c0dfd0ac7de',
             display: 'BillLineItem',
             item: '04be5832-5440-44d0-83d2-5c0dfd0ac7de',
-            itemOrServiceConceptUuid: 'c42525b9-12bb-441d-9241-cae541dd4575',
-            serviceTypeUuid: '915d25b9-12bb-441d-9241-cae541dd4575',
             lineItemOrder: 1,
             order: null,
             paymentStatus: 'PAID',
@@ -118,8 +103,6 @@ describe('Payment', () => {
             billableService: '3f5d0684-a280-477e-a67b-2a956a1f6dca',
             display: 'BillLineItem',
             item: '3f5d0684-a280-477e-a67b-2a956a1f6dca',
-            itemOrServiceConceptUuid: 'c42525b9-12bb-441d-9241-cae541dd4575',
-            serviceTypeUuid: '915d25b9-12bb-441d-9241-cae541dd4575',
             lineItemOrder: 2,
             order: null,
             paymentStatus: 'PAID',
@@ -150,13 +133,7 @@ describe('Payment', () => {
         ],
         patient: 'b2fcf02b-7ee3-4d16-a48f-576be2b103aa',
         payments: [
-          {
-            amount: 100,
-            amountTendered: 100,
-            attributes: [],
-            instanceType: '63eff7a4-6f82-43c4-a333-dbcc58fe9f74',
-            billLineItem: '314c25fd-2c90-4a7f-9f98-c99cd3f153e8',
-          },
+          { amount: 100, amountTendered: 100, attributes: [], instanceType: '63eff7a4-6f82-43c4-a333-dbcc58fe9f74' },
         ],
         status: 'PENDING',
       },
@@ -181,27 +158,18 @@ describe('Payment', () => {
       error: null,
       mutate: jest.fn(),
     });
-
     render(<Payments bill={mockBill as any} selectedLineItems={mockLineItems} />);
-
     const addPaymentMethod = screen.getByRole('button', { name: /Add payment option/i });
     await user.click(addPaymentMethod);
 
-    const lineItemDropdown = await screen.findByRole('combobox', { name: /Select line item to pay/i });
-    expect(lineItemDropdown).toHaveFocus();
-
-    await user.click(lineItemDropdown);
-    const lineItemOptions = await screen.findAllByRole('option');
-    await user.click(lineItemOptions[0]);
-
-    const paymentMethodField = await screen.findByRole('combobox', { name: /Payment method/i });
-    expect(paymentMethodField).toHaveFocus();
-
-    await user.click(paymentMethodField);
-    const cashOption = await screen.findByRole('option', { name: /Cash/i });
+    // Check if the payment method field is focused
+    expect(screen.getByRole('combobox', { name: /Payment method/i })).toHaveFocus();
+    await user.click(screen.getByRole('combobox', { name: /Payment method/i }));
+    const cashOption = screen.getByRole('option', { name: /Cash/i });
     await user.click(cashOption);
-
+    // Check if the amount field is focused
+    expect(screen.getByRole('spinbutton', { name: /Amount/i })).toHaveFocus();
     const amountInput = screen.getByRole('spinbutton', { name: /Amount/i });
-    expect(amountInput).toHaveFocus();
+    await user.type(amountInput, '100');
   });
 });

package/src/invoice/payments/utils.ts

@@ -126,7 +126,6 @@ export const createPaymentPayload = (
       value: attribute.value,
     })),
     instanceType: payment.instanceType.uuid,
-    billLineItem: payment.billLineItem?.uuid,
   }));
 
   // Transform new payments
@@ -138,7 +137,6 @@ export const createPaymentPayload = (
       value: formValue.referenceCode,
     })),
     instanceType: formValue.method?.uuid,
-    billLineItem: formValue.lineItemUuid,
   }));
 
   // Combine and calculate payments