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

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

@@ -0,0 +1,137 @@
+import React, { useCallback, useMemo, useState } from 'react';
+import classNames from 'classnames';
+import { useTranslation } from 'react-i18next';
+import {
+  Button,
+  DataTable,
+  InlineLoading,
+  Table,
+  TableBody,
+  TableCell,
+  TableContainer,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@carbon/react';
+import { isDesktop, showSnackbar, useConfig, useLayoutType, useSession } from '@openmrs/esm-framework';
+import type { BillingConfig } from '../config-schema';
+import { convertToCurrency } from '../helpers';
+import { actOnRefund } from './refunds.resource';
+import { RefundStatus, type BillRefund, type MappedBill } from '../types';
+import styles from './refunds-table.scss';
+
+interface Props {
+  bill: MappedBill;
+  onMutate?: () => void;
+}
+
+function resolveScope(r: BillRefund, bill: MappedBill, fallback: string) {
+  if (!r.lineItemUuid) return fallback;
+  const li = bill.lineItems?.find((l) => l.uuid === r.lineItemUuid);
+  return li?.item || li?.billableService || fallback;
+}
+
+const RefundsTable: React.FC<Props> = ({ bill, onMutate }) => {
+  const { t } = useTranslation();
+  const { defaultCurrency } = useConfig<BillingConfig>();
+  const session = useSession();
+  const layout = useLayoutType();
+  const responsiveSize = isDesktop(layout) ? 'sm' : 'lg';
+  const [processingId, setProcessingId] = useState<string | null>(null);
+
+  const tableHeaders = [
+    { header: t('refundItem', 'Item'), key: 'item' },
+    { header: t('refundAmount', 'Refund amount'), key: 'amount' },
+    { header: t('reason', 'Reason'), key: 'reason' },
+    { header: t('status', 'Status'), key: 'status' },
+    { header: t('action', 'Action'), key: 'action' },
+  ];
+
+  const refunds = useMemo(() => (bill.refunds ?? []).filter((r) => !r.voided), [bill.refunds]);
+
+  const handleProcess = useCallback(
+    async (r: BillRefund) => {
+      setProcessingId(r.uuid);
+      try {
+        await actOnRefund(r.uuid, { status: RefundStatus.COMPLETED, completer: session.user?.uuid });
+        showSnackbar({ title: t('refundProcessed', 'Refund processed'), kind: 'success' });
+        onMutate?.();
+      } catch (err: unknown) {
+        const subtitle = (err as any)?.responseBody?.error?.message ?? (err instanceof Error ? err.message : undefined);
+        showSnackbar({ title: t('refundProcessFailed', 'Could not process refund'), subtitle, kind: 'error' });
+      } finally {
+        setProcessingId(null);
+      }
+    },
+    [onMutate, session.user?.uuid, t],
+  );
+
+  const tableRows = useMemo(
+    () =>
+      (refunds ?? []).map((r) => ({
+        id: r.uuid,
+        item: resolveScope(r, bill, t('wholeBill', 'Whole bill')),
+        amount: convertToCurrency(r.refundAmount, defaultCurrency),
+        reason: r.reason,
+        status: t(r.status.toLowerCase(), r.status),
+        action: (
+          <Button
+            kind="primary"
+            size="sm"
+            disabled={processingId === r.uuid || r.status !== RefundStatus.APPROVED}
+            onClick={() => handleProcess(r)}>
+            {processingId === r.uuid ? (
+              <InlineLoading description={t('processing', 'Processing') + '...'} />
+            ) : (
+              t('processRefund', 'Process refund')
+            )}
+          </Button>
+        ),
+      })),
+    [refunds, bill, defaultCurrency, processingId, t, handleProcess],
+  );
+
+  if (!refunds || refunds.length === 0) {
+    return null;
+  }
+
+  return (
+    <div className={styles.refundsWrapper}>
+      <DataTable headers={tableHeaders} rows={tableRows} size={responsiveSize} useZebraStyles>
+        {({ rows, headers, getRowProps, getTableProps }) => (
+          <TableContainer
+            description={
+              <span className={styles.tableDescription}>
+                <span>{t('refundsOnBill', 'Refunds on this bill')}</span>
+              </span>
+            }
+            title={t('refunds', 'Refunds')}>
+            <Table
+              {...getTableProps()}
+              aria-label={t('billRefunds', 'Bill refunds')}
+              className={classNames(styles.refundsTable, 'billingTable')}>
+              <TableHead>
+                <TableRow>
+                  {headers.map((header) => (
+                    <TableHeader key={header.key}>{header.header}</TableHeader>
+                  ))}
+                </TableRow>
+              </TableHead>
+              <TableBody>
+                {rows.map((row) => (
+                  <TableRow key={row.id} {...getRowProps({ row })}>
+                    {row.cells.map((cell) => (
+                      <TableCell key={cell.id}>{cell.value}</TableCell>
+                    ))}
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          </TableContainer>
+        )}
+      </DataTable>
+    </div>
+  );
+};
+
+export default RefundsTable;

package/src/refunds/refunds-table.scss

@@ -0,0 +1,37 @@
+@use '@carbon/colors';
+@use '@carbon/layout';
+@use '@carbon/type';
+@use '@openmrs/esm-styleguide/src/vars' as *;
+
+.refundsWrapper {
+  border: 1px solid colors.$gray-20;
+  background-color: colors.$white;
+  margin-bottom: layout.$spacing-05;
+}
+
+.refundsTable {
+  width: 100%;
+
+  td {
+    border-bottom: none !important;
+  }
+}
+
+.tableDescription {
+  display: flex;
+  align-items: flex-start;
+  margin-top: layout.$spacing-02;
+  column-gap: layout.$spacing-01;
+
+  ::after {
+    content: '';
+    display: block;
+    width: layout.$spacing-07;
+    padding-top: 0.188rem;
+    border-bottom: 0.375rem solid var(--brand-03);
+  }
+
+  & > span {
+    @include type.type-style('body-01');
+  }
+}

package/src/refunds/refunds-table.test.tsx

@@ -0,0 +1,105 @@
+import React from 'react';
+import { describe, expect, it, vi, beforeEach } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { useSession, useConfig } from '@openmrs/esm-framework';
+import RefundsTable from './refunds-table.component';
+import { actOnRefund } from './refunds.resource';
+import { RefundStatus, type MappedBill } from '../types';
+
+vi.mock('@openmrs/esm-framework', () => ({
+  useSession: vi.fn(),
+  useConfig: vi.fn(),
+  useLayoutType: () => 'desktop',
+  isDesktop: () => true,
+  showSnackbar: vi.fn(),
+  restBaseUrl: '/ws/rest/v1',
+}));
+vi.mock('./refunds.resource');
+
+globalThis.i18next = { language: 'en-US' } as any;
+
+const mockRefund = (overrides = {}) => ({
+  uuid: 'r1',
+  billUuid: 'b1',
+  lineItemUuid: null,
+  refundAmount: 500,
+  reason: 'overcharged',
+  initiator: { uuid: 'u1', display: 'cashier' },
+  approver: null,
+  completer: null,
+  dateApproved: null,
+  dateCompleted: null,
+  dateCreated: '2026-05-21T00:00:00.000+0000',
+  status: RefundStatus.REQUESTED,
+  voided: false,
+  ...overrides,
+});
+
+const makeBill = (refunds: any[] = []): MappedBill => ({ uuid: 'b1', lineItems: [], refunds }) as unknown as MappedBill;
+
+beforeEach(() => {
+  vi.clearAllMocks();
+  vi.mocked(useSession).mockReturnValue({ user: { uuid: 'u-cashier' } } as any);
+  vi.mocked(useConfig).mockReturnValue({ defaultCurrency: 'USD' } as any);
+});
+
+describe('RefundsTable', () => {
+  it('returns null when bill has no refunds', () => {
+    const { container } = render(<RefundsTable bill={makeBill([])} />);
+    expect(container).toBeEmptyDOMElement();
+  });
+
+  it('renders rows for each refund', () => {
+    render(<RefundsTable bill={makeBill([mockRefund(), mockRefund({ uuid: 'r2', status: RefundStatus.APPROVED })])} />);
+    expect(screen.getByText(/requested/i)).toBeInTheDocument();
+    expect(screen.getByText(/approved/i)).toBeInTheDocument();
+  });
+
+  it('enables the "Process refund" button only for APPROVED non-voided rows', () => {
+    render(
+      <RefundsTable
+        bill={makeBill([
+          mockRefund({ uuid: 'r1', status: RefundStatus.REQUESTED }),
+          mockRefund({ uuid: 'r2', status: RefundStatus.APPROVED }),
+        ])}
+      />,
+    );
+    const buttons = screen.getAllByRole('button', { name: /process refund/i });
+    expect(buttons).toHaveLength(2);
+    expect(buttons[0]).toBeDisabled();
+    expect(buttons[1]).toBeEnabled();
+  });
+
+  it('calls actOnRefund with COMPLETED status on process click', async () => {
+    const onMutate = vi.fn();
+    vi.mocked(actOnRefund).mockResolvedValue({} as any);
+    const user = userEvent.setup();
+    render(
+      <RefundsTable bill={makeBill([mockRefund({ uuid: 'r2', status: RefundStatus.APPROVED })])} onMutate={onMutate} />,
+    );
+    await user.click(screen.getByRole('button', { name: /process refund/i }));
+    await waitFor(() =>
+      expect(actOnRefund).toHaveBeenCalledWith('r2', { status: RefundStatus.COMPLETED, completer: 'u-cashier' }),
+    );
+    expect(onMutate).toHaveBeenCalled();
+  });
+
+  // Finding 3: null session.user must not crash handleProcess
+  it('passes undefined as completer and does not throw when session.user is null', async () => {
+    vi.mocked(useSession).mockReturnValue({ user: null } as any);
+    vi.mocked(actOnRefund).mockResolvedValue({} as any);
+    const user = userEvent.setup();
+    render(<RefundsTable bill={makeBill([mockRefund({ uuid: 'r2', status: RefundStatus.APPROVED })])} />);
+    await user.click(screen.getByRole('button', { name: /process refund/i }));
+    await waitFor(() =>
+      expect(actOnRefund).toHaveBeenCalledWith('r2', { status: RefundStatus.COMPLETED, completer: undefined }),
+    );
+  });
+
+  // Finding 5: voided APPROVED refunds must not appear in the table
+  it('does not render a row or process button for voided APPROVED refunds', () => {
+    render(<RefundsTable bill={makeBill([mockRefund({ uuid: 'r3', status: RefundStatus.APPROVED, voided: true })])} />);
+    expect(screen.queryByRole('button', { name: /process refund/i })).not.toBeInTheDocument();
+  });
+});

package/src/refunds/refunds.resource.test.ts

@@ -0,0 +1,44 @@
+import { describe, expect, it, vi, beforeEach } from 'vitest';
+import { openmrsFetch } from '@openmrs/esm-framework';
+import { requestRefund, actOnRefund, voidRefund } from './refunds.resource';
+import { RefundStatus } from '../types';
+
+vi.mock('@openmrs/esm-framework', () => ({
+  openmrsFetch: vi.fn(),
+  restBaseUrl: '/ws/rest/v1',
+}));
+
+beforeEach(() => vi.clearAllMocks());
+
+describe('requestRefund', () => {
+  it('POSTs to billRefund endpoint', async () => {
+    vi.mocked(openmrsFetch).mockResolvedValue({ data: { uuid: 'r-new' } } as any);
+    await requestRefund({ bill: 'b1', refundAmount: 500, reason: 'overcharged' });
+    expect(openmrsFetch).toHaveBeenCalledWith(
+      expect.stringContaining('billRefund'),
+      expect.objectContaining({ method: 'POST' }),
+    );
+  });
+});
+
+describe('actOnRefund', () => {
+  it('POSTs to billRefund/:uuid', async () => {
+    vi.mocked(openmrsFetch).mockResolvedValue({ data: { uuid: 'r1' } } as any);
+    await actOnRefund('r1', { status: RefundStatus.APPROVED, approver: 'u1' });
+    expect(openmrsFetch).toHaveBeenCalledWith(
+      expect.stringContaining('billRefund/r1'),
+      expect.objectContaining({ method: 'POST' }),
+    );
+  });
+});
+
+describe('voidRefund', () => {
+  it('DELETEs with reason query param', async () => {
+    vi.mocked(openmrsFetch).mockResolvedValue({} as any);
+    await voidRefund('r1', 'entered in error');
+    expect(openmrsFetch).toHaveBeenCalledWith(
+      expect.stringContaining('billRefund/r1?reason='),
+      expect.objectContaining({ method: 'DELETE' }),
+    );
+  });
+});

package/src/refunds/refunds.resource.ts

@@ -0,0 +1,42 @@
+import { openmrsFetch, useOpenmrsFetchAll } from '@openmrs/esm-framework';
+import { apiBasePath } from '../constants';
+import type { BillRefund, DecideRefundPayload, PatientInvoice, RefundStatus, RequestRefundPayload } from '../types';
+
+const refundUrl = `${apiBasePath}billRefund`;
+const billUrl = `${apiBasePath}bill`;
+
+interface UseRefundRequestsArgs {
+  statuses: RefundStatus[];
+}
+
+export function useRefundRequests({ statuses }: UseRefundRequestsArgs) {
+  const qs = new URLSearchParams({
+    refundStatus: statuses.join(','),
+    v: 'default',
+  });
+  const url = `${billUrl}?${qs.toString()}`;
+  const { data, isLoading, error, mutate, isValidating } = useOpenmrsFetchAll<PatientInvoice>(url);
+  return { bills: data ?? [], isLoading, error, mutate, isValidating };
+}
+
+export async function requestRefund(payload: RequestRefundPayload): Promise<BillRefund> {
+  const response = await openmrsFetch<BillRefund>(refundUrl, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: payload,
+  });
+  return response.data;
+}
+
+export async function actOnRefund(uuid: string, payload: DecideRefundPayload): Promise<BillRefund> {
+  const response = await openmrsFetch<BillRefund>(`${refundUrl}/${uuid}`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: payload,
+  });
+  return response.data;
+}
+
+export async function voidRefund(uuid: string, reason: string): Promise<void> {
+  await openmrsFetch(`${refundUrl}/${uuid}?reason=${encodeURIComponent(reason)}`, { method: 'DELETE' });
+}

package/src/refunds/refunds.types.test.ts

@@ -0,0 +1,15 @@
+import { describe, expect, it } from 'vitest';
+import { BillStatus, RefundStatus } from '../types';
+
+describe('RefundStatus', () => {
+  it('exports all four statuses', () => {
+    expect(RefundStatus.REQUESTED).toBe('REQUESTED');
+    expect(RefundStatus.APPROVED).toBe('APPROVED');
+    expect(RefundStatus.REJECTED).toBe('REJECTED');
+    expect(RefundStatus.COMPLETED).toBe('COMPLETED');
+  });
+
+  it('BillStatus includes PARTIALLY_REFUNDED', () => {
+    expect(BillStatus.PARTIALLY_REFUNDED).toBe('PARTIALLY_REFUNDED');
+  });
+});

package/src/refunds/request-refund.modal.scss

@@ -0,0 +1,84 @@
+@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/styles/scss/type' as *;
+
+.modalBody {
+  padding-bottom: $spacing-05;
+}
+
+.scopePanel {
+  background: var(--cds-layer);
+  border-left: 3px solid var(--cds-border-interactive);
+  padding: $spacing-04 $spacing-05;
+}
+
+.scopePrimary {
+  @include type-style('heading-compact-01');
+  color: var(--cds-text-primary);
+  margin-bottom: $spacing-02;
+  word-break: break-word;
+}
+
+.scopeMeta {
+  @include type-style('label-01');
+  color: var(--cds-text-secondary);
+  display: flex;
+  flex-wrap: wrap;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+
+  li+li::before {
+    content: '·';
+    margin: 0 $spacing-03;
+    color: var(--cds-text-helper);
+  }
+}
+
+.scopeTotal {
+  color: var(--cds-text-primary);
+  font-variant-numeric: tabular-nums;
+}
+
+.summaryCard {
+  background: var(--cds-layer);
+  padding: $spacing-04 $spacing-05;
+  display: grid;
+  grid-template-columns: 1fr auto;
+  row-gap: $spacing-03;
+  column-gap: $spacing-05;
+  align-items: baseline;
+}
+
+.summaryLabel {
+  @include type-style('body-compact-01');
+  color: var(--cds-text-secondary);
+}
+
+.summaryValue {
+  @include type-style('body-compact-01');
+  color: var(--cds-text-primary);
+  font-variant-numeric: tabular-nums;
+  text-align: right;
+}
+
+.summaryRefund {
+  color: var(--cds-text-error);
+}
+
+.summaryDivider {
+  grid-column: 1 / -1;
+  height: 1px;
+  background: var(--cds-border-subtle);
+}
+
+.summaryTotalLabel {
+  @include type-style('heading-compact-01');
+  color: var(--cds-text-primary);
+}
+
+.summaryTotalValue {
+  @include type-style('heading-compact-01');
+  color: var(--cds-text-primary);
+  font-variant-numeric: tabular-nums;
+  text-align: right;
+}

package/src/refunds/request-refund.modal.test.tsx

@@ -0,0 +1,204 @@
+import React from 'react';
+import { describe, expect, it, vi, beforeEach } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { showSnackbar } from '@openmrs/esm-framework';
+import RequestRefundModal from './request-refund.modal';
+import { requestRefund } from './refunds.resource';
+
+vi.mock('@openmrs/esm-framework', () => ({
+  showSnackbar: vi.fn(),
+  useConfig: vi.fn().mockReturnValue({ defaultCurrency: 'USD' }),
+  getCoreTranslation: (key: string) => key,
+  restBaseUrl: '/ws/rest/v1',
+}));
+vi.mock('./refunds.resource');
+
+globalThis.i18next = { language: 'en-US' } as any;
+
+const closeModal = vi.fn();
+const onMutate = vi.fn();
+
+beforeEach(() => vi.clearAllMocks());
+
+describe('RequestRefundModal', () => {
+  it('blocks submit when reason is empty', () => {
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000, receiptNumber: 'INV-1' }}
+        remainingRefundable={5000}
+        onMutate={onMutate}
+      />,
+    );
+    expect(screen.getByRole('button', { name: /submit request/i })).toBeDisabled();
+  });
+
+  it('shows a clear message when no refundable amount remains', async () => {
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        remainingRefundable={0}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '1');
+    expect(screen.getByText(/no refundable amount remaining/i)).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: /submit request/i })).toBeDisabled();
+  });
+
+  it('blocks submit when amount exceeds remainingRefundable', async () => {
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        remainingRefundable={300}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '500');
+    await user.type(screen.getByLabelText(/reason/i), 'overcharged');
+    expect(screen.getByRole('button', { name: /submit request/i })).toBeDisabled();
+    expect(screen.getByText(/cannot exceed/i)).toBeInTheDocument();
+  });
+
+  it('submits a valid request and closes', async () => {
+    vi.mocked(requestRefund).mockResolvedValue({ uuid: 'r-new' } as any);
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        remainingRefundable={5000}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '500');
+    await user.type(screen.getByLabelText(/reason/i), 'overcharged');
+    await user.click(screen.getByRole('button', { name: /submit request/i }));
+    await waitFor(() =>
+      expect(requestRefund).toHaveBeenCalledWith({
+        bill: 'b1',
+        refundAmount: 500,
+        reason: 'overcharged',
+      }),
+    );
+    await waitFor(() => expect(closeModal).toHaveBeenCalled());
+    expect(onMutate).toHaveBeenCalled();
+    expect(showSnackbar).toHaveBeenCalledWith(expect.objectContaining({ kind: 'success' }));
+  });
+
+  it('submits with lineItem uuid when lineItem prop is provided', async () => {
+    vi.mocked(requestRefund).mockResolvedValue({ uuid: 'r-new' } as any);
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        lineItem={{ uuid: 'li1', display: 'Consultation', total: 1000 }}
+        remainingRefundable={1000}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '200');
+    await user.type(screen.getByLabelText(/reason/i), 'duplicate charge');
+    await user.click(screen.getByRole('button', { name: /submit request/i }));
+    await waitFor(() =>
+      expect(requestRefund).toHaveBeenCalledWith(
+        expect.objectContaining({ bill: 'b1', lineItem: 'li1', refundAmount: 200 }),
+      ),
+    );
+  });
+
+  it('shows already-refunded row when prior refunds exist on a discounted bill', async () => {
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        // bill.total=200, discount=50 → amountAfterDiscount=150, prior refund=40 → remainingRefundable=110
+        bill={{ uuid: 'b1', total: 200, amountAfterDiscount: 150 }}
+        remainingRefundable={110}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '30');
+
+    expect(screen.getByText(/already refunded/i)).toBeInTheDocument();
+    // summary shows amountAfterDiscount (150) as bill total, prior refund (40), and remainder (80)
+    expect(screen.getByText('$150.00')).toBeInTheDocument();
+    expect(screen.getByText('$80.00')).toBeInTheDocument();
+  });
+
+  it('hides already-refunded row when there are no prior refunds', async () => {
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 200, amountAfterDiscount: 150 }}
+        remainingRefundable={150}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '30');
+
+    expect(screen.queryByText(/already refunded/i)).not.toBeInTheDocument();
+  });
+
+  it('shows already-refunded row for a line item with a prior completed refund', async () => {
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        // line total=100, completed refund=20 → remainingRefundable=80
+        lineItem={{ uuid: 'li1', display: 'Lab Test', total: 100 }}
+        remainingRefundable={80}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '50');
+
+    expect(screen.getByText(/already refunded/i)).toBeInTheDocument();
+    // amount after refund: remainingRefundable − amount = 80 − 50 = 30
+    expect(screen.getByText('$30.00')).toBeInTheDocument();
+  });
+
+  it('hides already-refunded row for a line item with no prior refunds', async () => {
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        lineItem={{ uuid: 'li1', display: 'Lab Test', total: 100 }}
+        remainingRefundable={100}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '50');
+
+    expect(screen.queryByText(/already refunded/i)).not.toBeInTheDocument();
+  });
+
+  it('shows an error snackbar and keeps modal open on failure', async () => {
+    vi.mocked(requestRefund).mockRejectedValue({
+      responseBody: { error: { message: 'billing.error.refund.exceedsTotal' } },
+    });
+    const user = userEvent.setup();
+    render(
+      <RequestRefundModal
+        closeModal={closeModal}
+        bill={{ uuid: 'b1', total: 5000, amountAfterDiscount: 5000 }}
+        remainingRefundable={5000}
+        onMutate={onMutate}
+      />,
+    );
+    await user.type(screen.getByLabelText(/amount/i), '100');
+    await user.type(screen.getByLabelText(/reason/i), 'x');
+    await user.click(screen.getByRole('button', { name: /submit request/i }));
+    await waitFor(() => expect(showSnackbar).toHaveBeenCalledWith(expect.objectContaining({ kind: 'error' })));
+    expect(closeModal).not.toHaveBeenCalled();
+  });
+});