From a0e63ea2d461400a3e59a3d8f1e9b0dc98cb88d5 Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Sat, 20 Dec 2025 09:37:42 +0700
Subject: [PATCH] refactor(FE-355): Use flexRender and prepend default row in
 table

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

diff --git a/src/components/pages/report/sale/tab/HppPerKandangTab.tsx b/src/components/pages/report/sale/tab/HppPerKandangTab.tsx
index ff35eb45..5248521f 100644
--- a/src/components/pages/report/sale/tab/HppPerKandangTab.tsx
+++ b/src/components/pages/report/sale/tab/HppPerKandangTab.tsx
@@ -13,7 +13,7 @@ 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, Row } from '@tanstack/react-table';
+import { ColumnDef, Row, flexRender } from '@tanstack/react-table';
 import { formatCurrency, formatNumber } from '@/lib/helper';
 import {
   HppPerKandangReport,
@@ -739,7 +739,23 @@ const HppPerKandangTab = () => {
   const renderCustomRow = useCallback(
     (row: Row<HppPerKandangReport['rows'][0]>) => {
       if (row.index === data.length - 1) {
-        const rows = [
+        const defaultRow = (
+          <tr
+            key={row.id}
+            className='hover:bg-gray-50 transition-colors border-b border-l border-r border-b-gray-200 border-l-gray-200 border-r-gray-200'
+          >
+            {row.getVisibleCells().map((cell) => (
+              <td
+                key={cell.id}
+                className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-200'
+              >
+                {flexRender(cell.column.columnDef.cell, cell.getContext())}
+              </td>
+            ))}
+          </tr>
+        );
+
+        const customRows = [
           <tr
             className='border-b border-l border-r border-b-gray-200 border-l-gray-200 border-r-gray-200'
             key={'rekapitulasi-row'}
@@ -754,7 +770,7 @@ const HppPerKandangTab = () => {
         ];
 
         if (perWeightRangeSummary.length > 0) {
-          rows.push(
+          customRows.push(
             <tr key={'summary-table-row'}>
               <td
                 colSpan={15}
@@ -812,7 +828,7 @@ const HppPerKandangTab = () => {
           );
         }
 
-        return rows;
+        return [defaultRow, ...customRows];
       }
 
       return null;