@openmrs/esm-billing-app 1.1.2-pre.8 → 1.2.0

package/e2e/specs/bill-discounts.spec.ts

@@ -0,0 +1,255 @@
+import { expect } from '@playwright/test';
+import { test } from '../core/test';
+import { deleteBill, ensureServiceHasPrices, extractNumericValue, waitForSuccessNotification } from '../commands';
+import {
+  BillingDashboardPage,
+  BillingFormPage,
+  DiscountRequestModal,
+  DiscountRequestsAdminPage,
+  InvoicePage,
+  PaymentPage,
+  ReviewBillDiscountsModal,
+} from '../pages';
+
+test.describe('Bill discount workflow', () => {
+  test.describe.configure({ mode: 'serial' });
+
+  let testServiceName: string;
+  let expectedServicePrice: number;
+  const billsToCleanup = new Set<string>();
+
+  test.beforeAll(async ({ api }) => {
+    const serviceUuid = process.env.E2E_TEST_SERVICE_UUID;
+    if (!serviceUuid) {
+      throw new Error('E2E_TEST_SERVICE_UUID must be configured in .env file');
+    }
+
+    const service = await ensureServiceHasPrices(api, serviceUuid, 30.0);
+    testServiceName = service.name;
+
+    const cashPrice = service.servicePrices.find((sp) => sp.name === 'Cash');
+    if (!cashPrice) {
+      throw new Error('Cash price not found for test service');
+    }
+    expectedServicePrice = parseFloat(cashPrice.price);
+  });
+
+  test.afterEach(async ({ api }) => {
+    for (const billUuid of billsToCleanup) {
+      try {
+        await deleteBill(api, billUuid);
+      } catch (error) {
+        console.error(`Failed to delete bill ${billUuid}:`, error);
+      }
+    }
+    billsToCleanup.clear();
+  });
+
+  test('Approved line-item discount reduces the bill amount due and payment settles the bill', async ({
+    page,
+    api,
+    patient,
+  }) => {
+    const billingDashboardPage = new BillingDashboardPage(page);
+    const billingFormPage = new BillingFormPage(page);
+    const invoicePage = new InvoicePage(page);
+    const paymentPage = new PaymentPage(page);
+    const requestDiscountModal = new DiscountRequestModal(page);
+    const discountRequestsPage = new DiscountRequestsAdminPage(page);
+    const reviewModal = new ReviewBillDiscountsModal(page);
+
+    const patientUuid = patient.uuid;
+    const patientName = patient.person.display;
+    const discountPercentage = 10;
+    const expectedDiscountAmount = (expectedServicePrice * discountPercentage) / 100;
+    const expectedNetAmount = expectedServicePrice - expectedDiscountAmount;
+    const justification = `e2e line-item discount ${Date.now()}`;
+    let billUuid: string;
+    let lineItemUuid: string;
+
+    await test.step('Given a finalized (POSTED) bill exists for the patient', async () => {
+      await page.goto(`patient/${patientUuid}/chart/billing-history`);
+      await page.getByRole('button', { name: /launch bill form|add bill|create bill/i }).click();
+
+      await billingFormPage.searchAndSelectBillableService(testServiceName);
+      await billingFormPage.selectPaymentMethodIfVisible();
+      await billingFormPage.saveBill();
+      await waitForSuccessNotification(page, /bill processed successfully/i);
+
+      const billsResponse = await api.get(`billing/bill?patient=${patientUuid}&v=full`);
+      const billsData = await billsResponse.json();
+      billUuid = billsData.results[0].uuid;
+      lineItemUuid = billsData.results[0].lineItems[0].uuid;
+      billsToCleanup.add(billUuid);
+
+      await billingDashboardPage.goto();
+      await billingDashboardPage.waitForBillsTableToLoad();
+      await billingDashboardPage.selectFilter('Pending confirmation');
+      await billingDashboardPage.waitForBillsTableToLoad();
+      await billingDashboardPage.clickInvoiceNumberLink(patientName);
+      await invoicePage.waitForInvoiceToLoad();
+
+      await invoicePage.finalizeBill();
+      await waitForSuccessNotification(page, /bill finalized/i);
+      await expect.poll(async () => await invoicePage.getInvoiceStatus()).toBe('POSTED');
+    });
+
+    await test.step('When the cashier requests a 10% discount on the line item', async () => {
+      // Open the line-item overflow menu and click "Request discount".
+      // The test ids on these controls embed the line item uuid, which keeps
+      // the selector stable even if Carbon menu structure changes.
+      await page.getByTestId(`action-menu-${lineItemUuid}`).click();
+      await page.getByTestId(`request-discount-button-${lineItemUuid}`).click();
+
+      await requestDiscountModal.submitPercentageDiscount(discountPercentage, justification);
+      await waitForSuccessNotification(page, /discount request submitted/i);
+      await expect(requestDiscountModal.modal()).toBeHidden();
+    });
+
+    await test.step('Then the discount appears as PENDING via the API and does not yet affect amount due', async () => {
+      const discountsResponse = await api.get(`billing/billDiscount?bill=${billUuid}&v=default`);
+      const discountsData = await discountsResponse.json();
+      expect(discountsData.results).toHaveLength(1);
+      const [discount] = discountsData.results;
+      expect(discount.status).toBe('PENDING');
+      expect(discount.lineItemUuid).toBe(lineItemUuid);
+      expect(discount.discountAmount).toBeCloseTo(expectedDiscountAmount, 2);
+
+      // Bill totals should still reflect the original price until approval.
+      const billResponse = await api.get(`billing/bill/${billUuid}`);
+      const billData = await billResponse.json();
+      expect(billData.amountAfterDiscount ?? billData.total).toBeCloseTo(expectedServicePrice, 2);
+    });
+
+    await test.step('When the admin approves the discount from the discount requests dashboard', async () => {
+      await discountRequestsPage.goto();
+      await discountRequestsPage.waitForLoaded();
+      await discountRequestsPage.openReviewForPatient(patientName);
+
+      await reviewModal.waitForLoaded();
+      await reviewModal.approveFirstPending();
+      await waitForSuccessNotification(page, /discount approved/i);
+    });
+
+    await test.step('Then the discount is APPROVED and net amount drops by the discount', async () => {
+      await expect
+        .poll(async () => {
+          const res = await api.get(`billing/billDiscount?bill=${billUuid}&v=default`);
+          const data = await res.json();
+          return data.results[0]?.status;
+        })
+        .toBe('APPROVED');
+
+      const billResponse = await api.get(`billing/bill/${billUuid}`);
+      const billData = await billResponse.json();
+      expect(billData.amountAfterDiscount).toBeCloseTo(expectedNetAmount, 2);
+    });
+
+    await test.step('And the invoice page shows the discounted net amount and matching amount due', async () => {
+      await invoicePage.goto(patientUuid, billUuid);
+      await invoicePage.waitForInvoiceToLoad();
+
+      const amountDue = extractNumericValue(await invoicePage.getAmountDue());
+      expect(amountDue).toBeCloseTo(expectedNetAmount, 2);
+    });
+
+    await test.step('When the cashier processes a payment that matches the discounted amount due', async () => {
+      await paymentPage.waitForPaymentForm();
+      await paymentPage.addPayment('Cash', expectedNetAmount);
+      expect(await paymentPage.isProcessPaymentButtonEnabled()).toBe(true);
+      await paymentPage.processPayment();
+      await waitForSuccessNotification(page, /payment processed successfully/i);
+    });
+
+    await test.step('Then the bill is marked PAID with no outstanding balance', async () => {
+      await page.reload();
+      await invoicePage.waitForInvoiceToLoad();
+      await expect.poll(async () => await invoicePage.getInvoiceStatus()).toBe('PAID');
+      expect(extractNumericValue(await invoicePage.getAmountDue())).toBe(0);
+
+      const billResponse = await api.get(`billing/bill/${billUuid}`);
+      const billData = await billResponse.json();
+      expect(billData.status).toBe('PAID');
+    });
+  });
+
+  test('Rejected discount leaves the bill amount due unchanged', async ({ page, api, patient }) => {
+    const billingDashboardPage = new BillingDashboardPage(page);
+    const billingFormPage = new BillingFormPage(page);
+    const invoicePage = new InvoicePage(page);
+    const requestDiscountModal = new DiscountRequestModal(page);
+    const discountRequestsPage = new DiscountRequestsAdminPage(page);
+    const reviewModal = new ReviewBillDiscountsModal(page);
+
+    const patientUuid = patient.uuid;
+    const patientName = patient.person.display;
+    const justification = `e2e rejected discount ${Date.now()}`;
+    let billUuid: string;
+    let lineItemUuid: string;
+
+    await test.step('Given a finalized bill with a pending line-item discount request', async () => {
+      await page.goto(`patient/${patientUuid}/chart/billing-history`);
+      await page.getByRole('button', { name: /launch bill form|add bill|create bill/i }).click();
+
+      await billingFormPage.searchAndSelectBillableService(testServiceName);
+      await billingFormPage.selectPaymentMethodIfVisible();
+      await billingFormPage.saveBill();
+      await waitForSuccessNotification(page, /bill processed successfully/i);
+
+      const billsResponse = await api.get(`billing/bill?patient=${patientUuid}&v=full`);
+      const billsData = await billsResponse.json();
+      billUuid = billsData.results[0].uuid;
+      lineItemUuid = billsData.results[0].lineItems[0].uuid;
+      billsToCleanup.add(billUuid);
+
+      await billingDashboardPage.goto();
+      await billingDashboardPage.waitForBillsTableToLoad();
+      await billingDashboardPage.selectFilter('Pending confirmation');
+      await billingDashboardPage.waitForBillsTableToLoad();
+      await billingDashboardPage.clickInvoiceNumberLink(patientName);
+      await invoicePage.waitForInvoiceToLoad();
+      await invoicePage.finalizeBill();
+      await waitForSuccessNotification(page, /bill finalized/i);
+      await expect.poll(async () => await invoicePage.getInvoiceStatus()).toBe('POSTED');
+
+      await page.getByTestId(`action-menu-${lineItemUuid}`).click();
+      await page.getByTestId(`request-discount-button-${lineItemUuid}`).click();
+      await requestDiscountModal.submitPercentageDiscount(15, justification);
+      await waitForSuccessNotification(page, /discount request submitted/i);
+    });
+
+    await test.step('When the admin rejects the discount request', async () => {
+      await discountRequestsPage.goto();
+      await discountRequestsPage.waitForLoaded();
+      await discountRequestsPage.openReviewForPatient(patientName);
+
+      await reviewModal.waitForLoaded();
+      await reviewModal.rejectFirstPending();
+      await waitForSuccessNotification(page, /discount rejected/i);
+    });
+
+    await test.step('Then the discount is REJECTED and the bill total is unchanged', async () => {
+      await expect
+        .poll(async () => {
+          const res = await api.get(`billing/billDiscount?bill=${billUuid}&v=default`);
+          const data = await res.json();
+          return data.results[0]?.status;
+        })
+        .toBe('REJECTED');
+
+      const billResponse = await api.get(`billing/bill/${billUuid}`);
+      const billData = await billResponse.json();
+      // Net amount equals the original total when no discount is approved.
+      expect(billData.amountAfterDiscount ?? billData.total).toBeCloseTo(expectedServicePrice, 2);
+    });
+
+    await test.step('And the rejected request is no longer in the pending queue', async () => {
+      await discountRequestsPage.goto();
+      await discountRequestsPage.waitForLoaded();
+      await discountRequestsPage.searchInput().fill(patientName);
+      await expect(
+        discountRequestsPage.requestsTable().locator('tbody tr').filter({ hasText: patientName }),
+      ).toHaveCount(0);
+    });
+  });
+});

package/e2e/specs/billing-dashboard.spec.ts

@@ -175,11 +175,11 @@ test.describe('Billing Dashboard workflow', () => {
         expect(lineItem.status).toBe('PAID');
       });
 
-      // Also verify backend line items have paymentStatus set to PAID
+      // Also verify backend line items have status set to PAID
       const billResponse = await api.get(`billing/bill/${billUuid}`);
       const billData = await billResponse.json();
-      billData.lineItems.forEach((lineItem: { paymentStatus: string }) => {
-        expect(lineItem.paymentStatus).toBe('PAID');
+      billData.lineItems.forEach((lineItem: { status: string }) => {
+        expect(lineItem.status).toBe('PAID');
       });
     });
 

package/e2e/specs/billing-patient-chart.spec.ts

@@ -535,8 +535,8 @@ test.describe('Billing: Patient Chart workflow', () => {
       // Verify backend state
       const billResponse = await api.get(`billing/bill/${billUuid}?v=full`);
       const billData = await billResponse.json();
-      billData.lineItems.forEach((lineItem: { paymentStatus: string }) => {
-        expect(lineItem.paymentStatus).toBe('PAID');
+      billData.lineItems.forEach((lineItem: { status: string }) => {
+        expect(lineItem.status).toBe('PAID');
       });
     });
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-billing-app",
-  "version": "1.1.2-pre.8",
+  "version": "1.2.0",
   "description": "O3 frontend module for handling billing concerns in healthcare settings",
   "browser": "dist/openmrs-esm-billing-app.js",
   "main": "src/index.ts",
@@ -9,18 +9,18 @@
   "homepage": "https://github.com/openmrs/openmrs-esm-billing-app#readme",
   "scripts": {
     "start": "openmrs develop",
-    "analyze": "webpack --mode=production --env.analyze=true",
-    "build": "webpack --mode production",
-    "coverage": "yarn test --coverage",
+    "analyze": "rspack --mode=production --env.analyze=true",
+    "build": "rspack --mode production",
     "debug": "npm run serve",
     "extract-translations": "i18next 'src/**/*.component.tsx' 'src/**/*.workspace.tsx' 'src/**/*.modal.tsx' 'src/index.ts' --config ./tools/i18next-parser.config.js",
     "lint": "eslint src --ext ts,tsx --max-warnings=0",
     "postinstall": "husky install",
     "prettier": "prettier --config prettier.config.js --write \"src/**/*.{ts,tsx,css,scss}\" \"e2e/**/*.ts\"",
-    "serve": "webpack serve --mode=development",
+    "serve": "rspack serve --mode=development",
     "test-e2e": "playwright test",
-    "test": "cross-env TZ=UTC jest --config jest.config.js --verbose false --passWithNoTests",
-    "test:watch": "cross-env TZ=UTC jest --watch --config jest.config.js",
+    "test": "cross-env TZ=UTC vitest run --passWithNoTests",
+    "test:watch": "cross-env TZ=UTC vitest watch",
+    "coverage": "cross-env TZ=UTC vitest run --coverage --passWithNoTests",
     "typescript": "tsc",
     "verify": "turbo lint && turbo typescript && turbo test --color --concurrency=5"
   },
@@ -51,7 +51,7 @@
     "zod": "^3.22.4"
   },
   "peerDependencies": {
-    "@openmrs/esm-framework": "9.x",
+    "@openmrs/esm-framework": "10.x",
     "react": "18.x",
     "react-dom": "18.x",
     "react-i18next": "16.x",
@@ -61,21 +61,17 @@
   "devDependencies": {
     "@openmrs/esm-framework": "next",
     "@playwright/test": "^1.53.2",
-    "@swc/cli": "^0.3.2",
-    "@swc/core": "^1.3.106",
-    "@swc/jest": "^0.2.31",
     "@testing-library/dom": "^9.3.4",
     "@testing-library/jest-dom": "^6.3.0",
     "@testing-library/react": "14.3.1",
     "@testing-library/user-event": "^14.5.2",
-    "@types/jest": "^29.5.11",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^18.3.21",
     "@types/react-dom": "^18.3.0",
     "@types/webpack-env": "^1.18.4",
     "@typescript-eslint/eslint-plugin": "^8.0.0",
     "@typescript-eslint/parser": "^8.0.0",
-    "babel-preset-minify": "^0.5.2",
+    "@vitest/coverage-v8": "^4.0.18",
     "concurrently": "^8.2.2",
     "cross-env": "^7.0.3",
     "d3-selection": "^3.0.0",
@@ -91,29 +87,24 @@
     "i18next": "^25.0.0",
     "i18next-parser": "^9.3.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^29.7.0",
-    "jest-cli": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "jsdom": "^29.0.2",
     "lint-staged": "^15.2.10",
     "lodash": "^4.17.21",
     "openmrs": "next",
-    "pinst": "^3.0.0",
     "prettier": "^3.2.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-i18next": "^16.0.0",
     "react-router-dom": "^6.21.3",
     "rxjs": "^6.6.7",
-    "sass": "^1.70.0",
-    "swr": "^2.2.4",
+    "swr": "2.2.5",
     "turbo": "^2.5.2",
     "typescript": "^5.0.0",
-    "webpack-dev-server": "^5.2.1"
+    "vitest": "^4.0.18"
   },
   "lint-staged": {
     "*.{ts,tsx}": "eslint --cache --fix --max-warnings 0",
     "*.{css,scss,ts,tsx}": "prettier --write --list-different"
   },
-  "packageManager": "yarn@4.10.3",
-  "stableVersion": "1.1.1"
+  "packageManager": "yarn@4.10.3"
 }

package/rspack.config.js

@@ -0,0 +1 @@
+module.exports = require('openmrs/default-rspack-config');

package/src/bill-history/bill-action-menu.component.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Layer, OverflowMenu, OverflowMenuItem } from '@carbon/react';
-import { isDesktop, launchWorkspace2, useLayoutType } from '@openmrs/esm-framework';
+import { isDesktop, launchWorkspace2, showModal, useLayoutType } from '@openmrs/esm-framework';
 import { useTranslation } from 'react-i18next';
-import type { MappedBill } from '../types';
+import { BillStatus, type MappedBill } from '../types';
 import styles from './bill-action-menu.scss';
 
 type BillActionMenuProps = {
@@ -14,6 +14,15 @@ type BillActionMenuProps = {
 const BillActionMenu: React.FC<BillActionMenuProps> = ({ bill, patientUuid, onMutate }) => {
   const { t } = useTranslation();
   const layout = useLayoutType();
+  const isPending = bill?.status === BillStatus.PENDING;
+
+  const handleDeleteBill = () => {
+    const dispose = showModal('delete-bill-confirmation-modal', {
+      bill,
+      onSuccess: onMutate,
+      closeModal: () => dispose(),
+    });
+  };
 
   return (
     <Layer>
@@ -33,6 +42,15 @@ const BillActionMenu: React.FC<BillActionMenuProps> = ({ bill, patientUuid, onMu
             })
           }
         />
+        {isPending && (
+          <OverflowMenuItem
+            className={styles.menuItem}
+            hasDivider
+            isDelete
+            itemText={t('deleteBill', 'Delete bill')}
+            onClick={handleDeleteBill}
+          />
+        )}
       </OverflowMenu>
     </Layer>
   );

package/src/bill-history/bill-history.test.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
 import userEvent from '@testing-library/user-event';
 import { render, screen } from '@testing-library/react';
 import { getDefaultsFromConfigSchema, launchWorkspace2, useConfig } from '@openmrs/esm-framework';
@@ -6,11 +7,11 @@ import { configSchema, type BillingConfig } from '../config-schema';
 import { useBills } from '../billing.resource';
 import BillHistory from './bill-history.component';
 
-const mockUseConfig = jest.mocked(useConfig<BillingConfig>);
-const mockUseBills = jest.mocked<typeof useBills>(useBills);
+const mockUseConfig = vi.mocked(useConfig<BillingConfig>);
+const mockUseBills = vi.mocked<typeof useBills>(useBills);
 
-jest.mock('../billing.resource', () => ({
-  useBills: jest.fn(() => ({
+vi.mock('../billing.resource', () => ({
+  useBills: vi.fn(() => ({
     bills: mockBillData,
     isLoading: false,
     isValidating: false,
@@ -46,13 +47,13 @@ describe('BillHistory', () => {
     mockUseConfig.mockReturnValue({ ...getDefaultsFromConfigSchema(configSchema), defaultCurrency: 'USD' });
   });
 
-  test('should render loading datatable skeleton', () => {
+  it('should render loading datatable skeleton', () => {
     mockUseBills.mockReturnValueOnce({
       isLoading: true,
       isValidating: false,
       error: null,
       bills: [],
-      mutate: jest.fn(),
+      mutate: vi.fn(),
     });
     render(<BillHistory {...testProps} />);
     const loadingSkeleton = screen.getByRole('table');
@@ -60,27 +61,27 @@ describe('BillHistory', () => {
     expect(loadingSkeleton).toHaveClass('cds--skeleton cds--data-table cds--data-table--zebra');
   });
 
-  test('should render error state when API call fails', () => {
+  it('should render error state when API call fails', () => {
     mockUseBills.mockReturnValueOnce({
       isLoading: false,
       isValidating: false,
       error: new Error('some error'),
       bills: [],
-      mutate: jest.fn(),
+      mutate: vi.fn(),
     });
     render(<BillHistory {...testProps} />);
     const errorState = screen.getByText(/Error/);
     expect(errorState).toBeInTheDocument();
   });
 
-  test('should render bills table', async () => {
+  it('should render bills table', async () => {
     const user = userEvent.setup();
     mockUseBills.mockReturnValueOnce({
       isLoading: false,
       isValidating: false,
       error: null,
       bills: mockBillData as any,
-      mutate: jest.fn(),
+      mutate: vi.fn(),
     });
     render(<BillHistory {...testProps} />);
 
@@ -108,34 +109,34 @@ describe('BillHistory', () => {
     await user.click(expandAllRowButton);
   });
 
-  test('should render empty state view when there are no bills', () => {
+  it('should render empty state view when there are no bills', () => {
     mockUseBills.mockReturnValueOnce({
       isLoading: false,
       isValidating: false,
       error: null,
       bills: [],
-      mutate: jest.fn(),
+      mutate: vi.fn(),
     });
     render(<BillHistory {...testProps} />);
     const emptyState = screen.getByText(/There are no bills to display./);
     expect(emptyState).toBeInTheDocument();
   });
 
-  test('should show overflow menu with "Add items to bill" for PENDING bills', async () => {
+  it('should show overflow menu with "Add items to bill" for PENDING bills', async () => {
     const user = userEvent.setup();
     const pendingBill = {
       ...mockBillData[0],
       status: 'PENDING',
       dateCreated: '2024-01-01',
       receiptNumber: 'REC-001',
-      lineItems: [{ uuid: 'item-1', item: 'Test', quantity: 1, price: 100, paymentStatus: 'PENDING' }],
+      lineItems: [{ uuid: 'item-1', item: 'Test', quantity: 1, price: 100, status: 'PENDING' }],
     };
     mockUseBills.mockReturnValueOnce({
       isLoading: false,
       isValidating: false,
       error: null,
       bills: [pendingBill] as any,
-      mutate: jest.fn(),
+      mutate: vi.fn(),
     });
     render(<BillHistory {...testProps} />);
 
@@ -145,36 +146,36 @@ describe('BillHistory', () => {
     expect(screen.getByText(/add items to bill/i)).toBeInTheDocument();
   });
 
-  test('should not show overflow menu for PAID bills', () => {
+  it('should not show overflow menu for PAID bills', () => {
     const paidBill = {
       ...mockBillData[0],
       status: 'PAID',
       dateCreated: '2024-01-01',
       receiptNumber: 'REC-001',
-      lineItems: [{ uuid: 'item-1', item: 'Test', quantity: 1, price: 100, paymentStatus: 'PAID' }],
+      lineItems: [{ uuid: 'item-1', item: 'Test', quantity: 1, price: 100, status: 'PAID' }],
     };
     mockUseBills.mockReturnValueOnce({
       isLoading: false,
       isValidating: false,
       error: null,
       bills: [paidBill] as any,
-      mutate: jest.fn(),
+      mutate: vi.fn(),
     });
     render(<BillHistory {...testProps} />);
 
     expect(screen.queryByTestId('action-menu-1')).not.toBeInTheDocument();
   });
 
-  test('should launch workspace with billUuid when "Add items to bill" is clicked', async () => {
+  it('should launch workspace with billUuid when "Add items to bill" is clicked', async () => {
     const user = userEvent.setup();
-    const mockMutate = jest.fn();
-    const mockLaunchWorkspace2 = jest.mocked(launchWorkspace2);
+    const mockMutate = vi.fn();
+    const mockLaunchWorkspace2 = vi.mocked(launchWorkspace2);
     const pendingBill = {
       ...mockBillData[0],
       status: 'PENDING',
       dateCreated: '2024-01-01',
       receiptNumber: 'REC-001',
-      lineItems: [{ uuid: 'item-1', item: 'Test', quantity: 1, price: 100, paymentStatus: 'PENDING' }],
+      lineItems: [{ uuid: 'item-1', item: 'Test', quantity: 1, price: 100, status: 'PENDING' }],
     };
     mockUseBills.mockReturnValueOnce({
       isLoading: false,

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

@@ -161,7 +161,7 @@ const EditBillLineItemModal: React.FC<EditBillLineItemModalProps> = ({ bill, clo
                 {t('currentPrice', 'Current price')}: {convertToCurrency(item?.price, defaultCurrency)}
               </p>
               <p className={styles.label}>
-                {t('serviceStatus', 'Service status')}: {item?.paymentStatus}
+                {t('serviceStatus', 'Service status')}: {item?.status}
               </p>
               <Controller
                 name="quantity"