fix: background shade for only refunded line items

palladiumkenya · Aug 6, 2024 · cc8fa22 · cc8fa22
1 parent 2c36e08
commit cc8fa22
Showing 1 changed file with 8 additions and 3 deletions.
diff --git a/packages/esm-billing-app/src/billable-services/bill-manager/bill-line-items.component.tsx b/packages/esm-billing-app/src/billable-services/bill-manager/bill-line-items.component.tsx
@@ -41,11 +41,16 @@ const BillLineItems: React.FC<{ bill: MappedBill }> = ({ bill }) => {
 };
 
 const LineItemRow = ({ lineItem, bill }: { lineItem: LineItem; bill: MappedBill }) => {
+  const refundedLineItemUUIDs = bill.lineItems.filter((li) => Math.sign(li.price) === -1).map((li) => li.uuid);
+  const isRefundedLineItem = refundedLineItemUUIDs.includes(lineItem.uuid);
+
   const refundedLineItemBillableServiceUUIDs = bill.lineItems
     .filter((li) => Math.sign(li.price) === -1)
     .map((li) => li.billableService.split(':').at(0));
 
-  const isRefundedItem = refundedLineItemBillableServiceUUIDs.includes(lineItem.billableService.split(':').at(0));
+  const isRefundedBillableService = refundedLineItemBillableServiceUUIDs.includes(
+    lineItem.billableService.split(':').at(0),
+  );
 
   const { t } = useTranslation();
 
@@ -77,7 +82,7 @@ const LineItemRow = ({ lineItem, bill }: { lineItem: LineItem; bill: MappedBill
   };
 
   return (
-    <StructuredListRow className={isRefundedItem && styles.refundedItem}>
+    <StructuredListRow className={isRefundedLineItem && styles.refundedItem}>
       <StructuredListCell>
         {lineItem.item === '' ? extractString(lineItem.billableService) : extractString(lineItem.item)}
       </StructuredListCell>
@@ -88,7 +93,7 @@ const LineItemRow = ({ lineItem, bill }: { lineItem: LineItem; bill: MappedBill
         <OverflowMenu aria-label="overflow-menu">
           <OverflowMenuItem itemText="Edit Item" onClick={() => handleOpenEditLineItemWorkspace(lineItem)} />
           <OverflowMenuItem itemText="Cancel Item" onClick={handleOpenCancelLineItemModal} />
-          {!isRefundedItem && (
+          {!isRefundedBillableService && (
             <OverflowMenuItem itemText="Refund Item" onClick={() => handleOpenRefundLineItemModal(lineItem)} />
           )}
           <OverflowMenuItem itemText="Delete Item" onClick={handleOpenDeleteLineItemModal} />