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

package/src/discounts/request-discount.modal.tsx

@@ -0,0 +1,253 @@
+import React, { useState } from 'react';
+import {
+  Button,
+  FormGroup,
+  InlineLoading,
+  ModalBody,
+  ModalFooter,
+  ModalHeader,
+  NumberInput,
+  RadioButton,
+  RadioButtonGroup,
+  Stack,
+  TextArea,
+} from '@carbon/react';
+import { useTranslation } from 'react-i18next';
+import { getCoreTranslation, showSnackbar, useConfig } from '@openmrs/esm-framework';
+import type { BillingConfig } from '../config-schema';
+import { convertToCurrency } from '../helpers';
+import { BillDiscountType } from '../types';
+import { requestDiscount } from './discounts.resource';
+import styles from './request-discount.modal.scss';
+
+interface Props {
+  closeModal: () => void;
+  bill: {
+    uuid: string;
+    total: number;
+    amountDue: number;
+    receiptNumber?: string;
+    lineItemCount?: number;
+  };
+  lineItem?: {
+    uuid: string;
+    display: string;
+    total: number;
+    quantity?: number;
+    price?: number;
+  };
+  onMutate?: () => void;
+}
+
+const RequestDiscountModal: React.FC<Props> = ({ closeModal, bill, lineItem, onMutate }) => {
+  const { t } = useTranslation();
+  const { defaultCurrency } = useConfig<BillingConfig>();
+  const [discountType, setDiscountType] = useState<BillDiscountType>(BillDiscountType.PERCENTAGE);
+  const [value, setValue] = useState<number | null>(null);
+  const [justification, setJustification] = useState('');
+  const [submitting, setSubmitting] = useState(false);
+
+  const isLineItem = !!lineItem;
+  const scopeTotal = lineItem?.total ?? bill.total;
+
+  const trimmedJustification = justification.trim();
+
+  const discountAmount =
+    value != null && !Number.isNaN(value) && value > 0
+      ? discountType === BillDiscountType.PERCENTAGE
+        ? (scopeTotal * value) / 100
+        : value
+      : null;
+
+  const justificationPlaceholder = isLineItem
+    ? t('lineItemJustificationPlaceholder', 'e.g., damaged item, wrong quantity billed, expired stock')
+    : t('billJustificationPlaceholder', 'e.g., hardship assistance, charity case, write-off');
+
+  const justificationError =
+    justification.length > 1000 ? t('justificationTooLong', 'Justification cannot exceed 1000 characters') : null;
+
+  const valueError = (() => {
+    if (value == null || Number.isNaN(value)) return null;
+    if (value <= 0) return t('valueMustBePositive', 'Value must be greater than 0');
+    if (discountType === BillDiscountType.PERCENTAGE && value > 100)
+      return t('percentageTooHigh', 'Percentage cannot exceed 100');
+    if (discountAmount == null) return null;
+    if (discountAmount > bill.amountDue) return t('discountExceedsAmountDue', 'Discount cannot exceed the amount due');
+    if (lineItem && discountAmount > lineItem.total)
+      return t('discountExceedsLineTotal', 'Discount cannot exceed the line item total');
+    return null;
+  })();
+
+  const canSubmit =
+    !submitting && value != null && trimmedJustification.length > 0 && !justificationError && !valueError;
+
+  const handleSubmit = async () => {
+    if (!canSubmit || value == null) return;
+    setSubmitting(true);
+    try {
+      await requestDiscount({
+        bill: bill.uuid,
+        lineItem: lineItem?.uuid,
+        discountType,
+        discountValue: value,
+        justification: trimmedJustification,
+      });
+      onMutate?.();
+      showSnackbar({
+        title: t('discountRequested', 'Discount request submitted'),
+        subtitle: t('discountPendingReview', 'An admin will review your request'),
+        kind: 'success',
+      });
+      closeModal();
+    } catch (err: unknown) {
+      const subtitle = (err as any)?.responseBody?.error?.message ?? (err instanceof Error ? err.message : undefined);
+      showSnackbar({
+        title: t('discountRequestFailed', 'Could not submit discount request'),
+        subtitle,
+        kind: 'error',
+      });
+    } finally {
+      setSubmitting(false);
+    }
+  };
+
+  return (
+    <>
+      <ModalHeader closeModal={closeModal} title={t('requestDiscount', 'Request discount')} />
+      <ModalBody className={styles.modalBody}>
+        <Stack gap={5}>
+          <section className={styles.scopePanel} aria-label={t('discountScope', 'Discount scope')}>
+            <div className={styles.scopePrimary}>
+              {isLineItem ? lineItem.display : t('wholeBillScope', 'Whole bill')}
+            </div>
+            <ul className={styles.scopeMeta}>
+              {bill.receiptNumber && <li>{t('invoiceLabel', 'Invoice {{number}}', { number: bill.receiptNumber })}</li>}
+              {isLineItem && lineItem.quantity != null && lineItem.price != null && (
+                <li>
+                  {t('qtyTimesPrice', 'Qty {{quantity}} × {{price}}', {
+                    quantity: lineItem.quantity,
+                    price: convertToCurrency(lineItem.price, defaultCurrency),
+                  })}
+                </li>
+              )}
+              {!isLineItem && bill.lineItemCount != null && (
+                <li>{t('lineItemCount', '{{count}} line items', { count: bill.lineItemCount })}</li>
+              )}
+              <li className={styles.scopeTotal}>
+                {isLineItem
+                  ? t('lineTotalLabel', 'Line total {{total}}', {
+                      total: convertToCurrency(scopeTotal, defaultCurrency),
+                    })
+                  : t('billTotalLabel', 'Bill total {{total}}', {
+                      total: convertToCurrency(scopeTotal, defaultCurrency),
+                    })}
+              </li>
+            </ul>
+          </section>
+
+          <FormGroup legendText={t('discount', 'Discount')} className={styles.discountGroup}>
+            <Stack gap={4}>
+              <RadioButtonGroup
+                legendText=""
+                name="discount-type"
+                valueSelected={discountType}
+                onChange={(v) => setDiscountType(v as BillDiscountType)}>
+                <RadioButton labelText={t('percentage', 'Percentage')} value={BillDiscountType.PERCENTAGE} />
+                <RadioButton labelText={t('fixedAmount', 'Fixed amount')} value={BillDiscountType.FIXED_AMOUNT} />
+              </RadioButtonGroup>
+
+              <NumberInput
+                id="discount-value"
+                label={
+                  discountType === BillDiscountType.PERCENTAGE
+                    ? t('valuePercentLabel', 'Value (%)')
+                    : t('valueAmountLabel', 'Value ({{currency}})', { currency: defaultCurrency })
+                }
+                allowEmpty
+                min={0}
+                value={value ?? ''}
+                invalid={!!valueError}
+                invalidText={valueError ?? ''}
+                onChange={(_e, { value: v }) => {
+                  if (v === '' || v == null) {
+                    setValue(null);
+                    return;
+                  }
+                  const n = typeof v === 'string' ? parseFloat(v) : v;
+                  setValue(Number.isNaN(n) ? null : n);
+                }}
+              />
+            </Stack>
+          </FormGroup>
+
+          {discountAmount != null && (
+            <section className={styles.summaryCard} aria-label={t('discountSummary', 'Discount summary')}>
+              <span className={styles.summaryLabel}>
+                {isLineItem ? t('lineTotal', 'Line total') : t('billTotal', 'Bill total')}
+              </span>
+              <span className={styles.summaryValue}>{convertToCurrency(scopeTotal, defaultCurrency)}</span>
+
+              <span className={styles.summaryLabel}>
+                {discountType === BillDiscountType.PERCENTAGE && value != null
+                  ? t('discountWithPercent', 'Discount ({{percent}}%)', { percent: value })
+                  : t('discountLabel', 'Discount')}
+              </span>
+              <span className={`${styles.summaryValue} ${styles.summaryDiscount}`}>
+                −{convertToCurrency(discountAmount, defaultCurrency)}
+              </span>
+
+              {isLineItem && (
+                <>
+                  <span className={styles.summaryLabel}>{t('lineAfterDiscount', 'Line after discount')}</span>
+                  <span className={styles.summaryValue}>
+                    {convertToCurrency(scopeTotal - discountAmount, defaultCurrency)}
+                  </span>
+                </>
+              )}
+
+              <span className={styles.summaryDivider} aria-hidden="true" />
+
+              <span className={styles.summaryLabel}>{t('outstanding', 'Outstanding')}</span>
+              <span className={styles.summaryValue}>{convertToCurrency(bill.amountDue, defaultCurrency)}</span>
+
+              <span className={styles.summaryTotalLabel}>
+                {t('amountDueOnBillAfterDiscount', 'Amount due on bill after discount')}
+              </span>
+              <span className={styles.summaryTotalValue}>
+                {convertToCurrency(bill.amountDue - discountAmount, defaultCurrency)}
+              </span>
+            </section>
+          )}
+
+          <TextArea
+            id="discount-justification"
+            labelText={t('justification', 'Justification')}
+            placeholder={justificationPlaceholder}
+            maxCount={1000}
+            enableCounter
+            required
+            rows={3}
+            value={justification}
+            invalid={!!justificationError}
+            invalidText={justificationError ?? ''}
+            onChange={(e) => setJustification(e.target.value)}
+          />
+        </Stack>
+      </ModalBody>
+      <ModalFooter>
+        <Button kind="secondary" onClick={closeModal}>
+          {getCoreTranslation('cancel')}
+        </Button>
+        <Button kind="primary" onClick={handleSubmit} disabled={!canSubmit}>
+          {submitting ? (
+            <InlineLoading description={t('submitting', 'Submitting') + '...'} />
+          ) : (
+            <span>{t('submitRequest', 'Submit request')}</span>
+          )}
+        </Button>
+      </ModalFooter>
+    </>
+  );
+};
+
+export default RequestDiscountModal;

package/src/index.ts

@@ -1,22 +1,27 @@
-import { configSchema } from './config-schema';
+import { FinancialAssets, Settings, TagGroup, Wallet } from '@carbon/react/icons';
 import { createDashboard, defineConfigSchema, getAsyncLifecycle, getSyncLifecycle } from '@openmrs/esm-framework';
 import { createLeftPanelLink } from './left-panel-link.component';
-import { dashboardMeta } from './dashboard.meta';
-import { Settings, Wallet } from '@carbon/react/icons';
 import { createBillableServicesLeftPanelLink } from './billable-services/billable-services-left-panel-link.component';
 import { createBillableServicesLeftPanelMenu } from './billable-services/billable-services-left-panel-menu.component';
-import AddCashPointModal from './billable-services/cash-point/add-cash-point.modal';
+import { createDiscountRequestsLeftPanelLink } from './discounts/admin/discount-requests-left-panel-link.component';
+import { createRefundRequestsLeftPanelLink } from './refunds/admin/refund-requests-left-panel-link.component';
 import appMenu from './billable-services/billable-services-menu-item/item.component';
 import BillableServiceHome from './billable-services/billable-services-home.component';
 import BillableServicesCardLink from './billable-services-admin-card-link.component';
 import BillHistory from './bill-history/bill-history.component';
 import BillingCheckInForm from './billing-form/billing-checkin-form.component';
+import VisitAttributeTags from './invoice/payments/visit-tags/visit-attribute.component';
 import DeletePaymentModeModal from './billable-services/payment-modes/delete-payment-mode.modal';
 import EditBillLineItemModal from './bill-item-actions/edit-bill-item.modal';
 import PaymentModeFormModal from './billable-services/payment-modes/payment-mode-form.modal';
 import RequirePaymentModal from './modal/require-payment.modal';
+import AddCashPointModal from './billable-services/cash-point/add-cash-point.modal';
+import RequestDiscountModal from './discounts/request-discount.modal';
+import ReviewBillDiscountsModal from './discounts/admin/review-bill-discounts/review-bill-discounts.modal';
 import RootComponent from './root.component';
-import VisitAttributeTags from './invoice/payments/visit-tags/visit-attribute.component';
+import PaymentStatusTag from './payment-status-tag/payment-status-tag.component';
+import { configSchema } from './config-schema';
+import { dashboardMeta } from './dashboard.meta';
 
 const moduleName = '@openmrs/esm-billing-app';
 
@@ -54,6 +59,8 @@ export const billingCheckInForm = getSyncLifecycle(BillingCheckInForm, options);
 
 export const billingPatientSummary = getSyncLifecycle(BillHistory, options);
 
+export const visitBillsPanel = getAsyncLifecycle(() => import('./visit-bills/visit-bills-panel.component'), options);
+
 export const requirePaymentModal = getSyncLifecycle(RequirePaymentModal, options);
 
 export const paymentModeFormModal = getSyncLifecycle(PaymentModeFormModal, options);
@@ -68,6 +75,8 @@ export const root = getSyncLifecycle(RootComponent, options);
 
 export const visitAttributeTags = getSyncLifecycle(VisitAttributeTags, options);
 
+export const patientPaymentStatusTag = getSyncLifecycle(PaymentStatusTag, options);
+
 export const billingFormWorkspace = getAsyncLifecycle(() => import('./billing-form/billing-form.workspace'), options);
 
 export const billableServiceFormWorkspace = getAsyncLifecycle(
@@ -86,22 +95,6 @@ export const billableServicesLeftPanelLink = getSyncLifecycle(
   options,
 );
 
-// t('billWaiver', 'Bill waiver')
-// Bill waiver feature disabled - O3-5057
-// The following export is commented out along with:
-// - BillWaiver component import and route in billable-services-home.component.tsx
-// - bill-waiver-left-panel-link extension removed from routes.json
-// export const billWaiverLeftPanelLink = getSyncLifecycle(
-//   createBillableServicesLeftPanelLink({
-//     name: 'bill-waiver',
-//     title: 'billWaiver',
-//     path: 'waive-bill',
-//     icon: Money,
-//     privilege: 'coreapps.systemAdministration',
-//   }),
-//   options,
-// );
-
 // t('billingSettings', 'Billing settings')
 // t('cashPointConfig', 'Cash point configuration')
 // t('paymentModesConfig', 'Payment modes configuration')
@@ -135,3 +128,41 @@ export const finalizeBillConfirmationModal = getAsyncLifecycle(
   () => import('./modal/finalize-bill-confirmation.modal'),
   options,
 );
+
+export const deleteBillConfirmationModal = getAsyncLifecycle(
+  () => import('./modal/delete-bill-confirmation.modal'),
+  options,
+);
+
+export const requestDiscountModal = getSyncLifecycle(RequestDiscountModal, options);
+
+export const reviewBillDiscountsModal = getSyncLifecycle(ReviewBillDiscountsModal, options);
+
+// t('discountRequests', 'Discount requests')
+export const discountRequestsLeftPanelLink = getSyncLifecycle(
+  createDiscountRequestsLeftPanelLink({
+    name: 'discount-requests',
+    title: 'discountRequests',
+    path: 'discount-requests',
+    icon: TagGroup,
+  }),
+  options,
+);
+
+export const requestRefundModal = getAsyncLifecycle(() => import('./refunds/request-refund.modal'), options);
+
+export const reviewBillRefundsModal = getAsyncLifecycle(
+  () => import('./refunds/admin/review-bill-refunds/review-bill-refunds.modal'),
+  options,
+);
+
+// t('refundRequests', 'Refund requests')
+export const refundRequestsLeftPanelLink = getSyncLifecycle(
+  createRefundRequestsLeftPanelLink({
+    name: 'refund-requests',
+    title: 'refundRequests',
+    path: 'refund-requests',
+    icon: FinancialAssets,
+  }),
+  options,
+);

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

@@ -16,20 +16,30 @@ import {
   TableToolbarSearch,
   Tile,
 } from '@carbon/react';
-import { getCoreTranslation, isDesktop, useConfig, useDebounce, useLayoutType } from '@openmrs/esm-framework';
-import { type LineItem, type MappedBill } from '../types';
+import {
+  getCoreTranslation,
+  isDesktop,
+  showModal,
+  useConfig,
+  useDebounce,
+  useLayoutType,
+} from '@openmrs/esm-framework';
+import LineItemActionMenu from './line-item-action-menu.component';
 import { convertToCurrency } from '../helpers';
 import type { BillingConfig } from '../config-schema';
-import LineItemActionMenu from './line-item-action-menu.component';
+import { BillStatus, RefundStatus, type LineItem, type MappedBill } from '../types';
 import styles from './invoice-table.scss';
 
+const getLineItemTotal = (item: LineItem) => (item.price ?? 0) * (item.quantity ?? 0);
+
 type InvoiceTableProps = {
   bill: MappedBill;
   isLoadingBill?: boolean;
   onMutate?: () => void;
+  viewOnly?: boolean;
 };
 
-const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMutate }) => {
+const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMutate, viewOnly }) => {
   const { t } = useTranslation();
   const { defaultCurrency } = useConfig<BillingConfig>();
   const layout = useLayoutType();
@@ -38,6 +48,78 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMuta
   const [searchTerm, setSearchTerm] = useState('');
   const debouncedSearchTerm = useDebounce(searchTerm);
 
+  const discounts = useMemo(() => (bill?.discounts ?? []).filter((d) => !d.voided), [bill?.discounts]);
+  const billStatusEligible = bill?.status === BillStatus.PENDING || bill?.status === BillStatus.POSTED;
+  const hasBillLevelDiscount = discounts.some((d) => !d.lineItemUuid);
+
+  const billRefunds = useMemo(() => (bill?.refunds ?? []).filter((r) => !r.voided), [bill?.refunds]);
+  const billStatusRefundEligible =
+    bill?.status === BillStatus.PAID ||
+    bill?.status === BillStatus.PARTIALLY_REFUNDED ||
+    bill?.status === BillStatus.REFUND_REQUESTED;
+  const activeRefunds = billRefunds.filter(
+    (r) => r.status === RefundStatus.REQUESTED || r.status === RefundStatus.APPROVED,
+  );
+  const activeBillLevelRefund = activeRefunds.some((r) => !r.lineItemUuid);
+
+  const lineHasActiveRefund = (lineItemUuid: string) => activeRefunds.some((r) => r.lineItemUuid === lineItemUuid);
+
+  const showLineItemRefundRequest = (lineItem: LineItem) =>
+    billStatusRefundEligible && !activeBillLevelRefund && !lineHasActiveRefund(lineItem.uuid ?? '') && !!lineItem.uuid;
+
+  const lineHasActiveDiscount = (lineItemUuid: string) => discounts.some((d) => d.lineItemUuid === lineItemUuid);
+
+  const showLineItemRequest = (lineItem: LineItem) =>
+    billStatusEligible && !hasBillLevelDiscount && !lineHasActiveDiscount(lineItem.uuid);
+
+  const handleLineItemRefundRequest = (item: LineItem) => {
+    if (!item.uuid) return;
+    const lineTotal = getLineItemTotal(item);
+    const lineCommittedRefunds = billRefunds.filter(
+      (r) =>
+        r.lineItemUuid === item.uuid && (r.status === RefundStatus.APPROVED || r.status === RefundStatus.COMPLETED),
+    );
+    const remaining = lineTotal - lineCommittedRefunds.reduce((s, r) => s + r.refundAmount, 0);
+    const dispose = showModal('request-refund-modal', {
+      bill: {
+        uuid: bill.uuid,
+        total: bill.totalAmount ?? 0,
+        amountAfterDiscount: bill.netAmount ?? bill.totalAmount ?? 0,
+      },
+      lineItem: {
+        uuid: item.uuid,
+        display: item.item || item.billableService || '--',
+        total: lineTotal,
+        quantity: item.quantity,
+        price: item.price,
+      },
+      remainingRefundable: Math.max(0, remaining),
+      onMutate: () => onMutate?.(),
+      closeModal: () => dispose(),
+    });
+  };
+
+  const handleLineItemRequest = (lineItem: LineItem) => {
+    const dispose = showModal('request-discount-modal', {
+      bill: {
+        uuid: bill.uuid,
+        total: bill.totalAmount ?? 0,
+        amountDue: Math.max(0, (bill.netAmount ?? bill.totalAmount ?? 0) - (bill.tenderedAmount ?? 0)),
+        receiptNumber: bill.receiptNumber,
+        lineItemCount: lineItems.length,
+      },
+      lineItem: {
+        uuid: lineItem.uuid,
+        display: lineItem.item || lineItem.billableService || '--',
+        total: getLineItemTotal(lineItem),
+        quantity: lineItem.quantity,
+        price: lineItem.price,
+      },
+      onMutate: () => onMutate?.(),
+      closeModal: () => dispose(),
+    });
+  };
+
   const filteredLineItems = useMemo(() => {
     if (!debouncedSearchTerm) {
       return lineItems;
@@ -68,10 +150,10 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMuta
         no: `${index + 1}`,
         id: `${item.uuid}`,
         billItem: item.billableService ? item.billableService : item?.item,
-        status: item.paymentStatus,
+        status: item.status,
         quantity: item.quantity,
         price: convertToCurrency(item.price, defaultCurrency),
-        total: convertToCurrency(item.price * item.quantity, defaultCurrency),
+        total: convertToCurrency(getLineItemTotal(item), defaultCurrency),
       })) ?? [],
     [filteredLineItems, defaultCurrency],
   );
@@ -104,13 +186,15 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMuta
               </span>
             }
             title={t('lineItems', 'Line items')}>
-            <TableToolbarSearch
-              className={styles.searchbox}
-              expanded
-              onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSearchTerm(e.target.value)}
-              placeholder={t('searchThisTable', 'Search this table')}
-              size={responsiveSize}
-            />
+            {!viewOnly && (
+              <TableToolbarSearch
+                className={styles.searchbox}
+                expanded
+                onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSearchTerm(e.target.value)}
+                placeholder={t('searchThisTable', 'Search this table')}
+                size={responsiveSize}
+              />
+            )}
             <Table
               {...getTableProps()}
               aria-label={t('invoiceLineItems', 'Invoice line items')}
@@ -120,7 +204,7 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMuta
                   {headers.map((header) => (
                     <TableHeader key={header.key}>{header.header}</TableHeader>
                   ))}
-                  <TableHeader aria-label={getCoreTranslation('actions')} />
+                  {!viewOnly && <TableHeader aria-label={getCoreTranslation('actions')} />}
                 </TableRow>
               </TableHead>
               <TableBody>
@@ -131,9 +215,21 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMuta
                       {row.cells.map((cell) => (
                         <TableCell key={cell.id}>{cell.value}</TableCell>
                       ))}
-                      <TableCell className="cds--table-column-menu">
-                        {item && <LineItemActionMenu bill={bill} item={item} onMutate={onMutate} />}
-                      </TableCell>
+                      {!viewOnly && (
+                        <TableCell className="cds--table-column-menu">
+                          {item && (
+                            <LineItemActionMenu
+                              bill={bill}
+                              item={item}
+                              onMutate={onMutate}
+                              showDiscountRequest={showLineItemRequest(item)}
+                              onDiscountRequest={() => handleLineItemRequest(item)}
+                              showRefundRequest={showLineItemRefundRequest(item)}
+                              onRefundRequest={() => handleLineItemRefundRequest(item)}
+                            />
+                          )}
+                        </TableCell>
+                      )}
                     </TableRow>
                   );
                 })}
@@ -149,7 +245,9 @@ const InvoiceTable: React.FC<InvoiceTableProps> = ({ bill, isLoadingBill, onMuta
               <p className={styles.filterEmptyStateContent}>
                 {t('noMatchingItemsToDisplay', 'No matching items to display')}
               </p>
-              <p className={styles.filterEmptyStateHelper}>{t('checkFilters', 'Check the filters above')}</p>
+              {!viewOnly && (
+                <p className={styles.filterEmptyStateHelper}>{t('checkFilters', 'Check the filters above')}</p>
+              )}
             </Tile>
           </Layer>
         </div>