From c36d1ee1538516dad313852d391dff2c52037adf Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Fri, 19 Dec 2025 13:40:41 +0700
Subject: [PATCH] feat(FE-355): Add custom row renderer to HppPerKandangTab

---
 .../report/sale/tab/HppPerKandangTab.tsx      | 26 +++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/src/components/pages/report/sale/tab/HppPerKandangTab.tsx b/src/components/pages/report/sale/tab/HppPerKandangTab.tsx
index 7c9847c8..cc1b3945 100644
--- a/src/components/pages/report/sale/tab/HppPerKandangTab.tsx
+++ b/src/components/pages/report/sale/tab/HppPerKandangTab.tsx
@@ -13,8 +13,8 @@ import { LocationApi } from '@/services/api/master-data';
 import { KandangApi } from '@/services/api/master-data';
 import { SaleReportApi } from '@/services/api/report/marketing-sale';
 import Table from '@/components/Table';
-import { ColumnDef } from '@tanstack/react-table';
-import { formatCurrency, formatDate, formatNumber } from '@/lib/helper';
+import { ColumnDef, Row } from '@tanstack/react-table';
+import { formatCurrency, formatNumber } from '@/lib/helper';
 import { HppPerKandangReport } from '@/types/api/report/hpp-per-kandang';
 import { isResponseSuccess } from '@/lib/api-helper';
 import { useTableFilter } from '@/services/hooks/useTableFilter';
@@ -684,6 +684,27 @@ const HppPerKandangTab = () => {
     return tableColumns;
   };
 
+  // ===== CUSTOM ROW RENDERER =====
+  const renderCustomRow = useCallback(
+    (row: Row<HppPerKandangReport['rows'][0]>) => {
+      if (row.index === data.length - 1) {
+        return (
+          <tr className='border-b border-l border-r border-b-gray-200 border-l-gray-200 border-r-gray-200'>
+            <td
+              colSpan={15}
+              className='px-4 py-3 text-gray-900 text-center font-semibold'
+            >
+              Rekapitulasi per rentang bobot
+            </td>
+          </tr>
+        );
+      }
+
+      return null;
+    },
+    [data]
+  );
+
   return (
     <div className='w-full p-0 sm:p-4'>
       <Card
@@ -820,6 +841,7 @@ const HppPerKandangTab = () => {
             data={data}
             columns={getTableColumns()}
             renderFooter={data.length > 0}
+            renderCustomRow={renderCustomRow}
             className={{
               containerClassName: 'w-full mt-6',
               tableWrapperClassName: 'overflow-x-auto mt-4',