From c3a69bc66aa465be6689f246b930555f68c45362 Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Thu, 19 Feb 2026 10:55:07 +0700
Subject: [PATCH] refactor(FE): Add Icon component and update table styles

---
 .../pages/closing/table/FinanceClosingTable.tsx   |  3 ++-
 .../sapronak/IncomingSapronaksSummaryTable.tsx    |  1 +
 .../table/sapronak/IncomingSapronaksTable.tsx     | 15 ++++++++++++++-
 .../sapronak/OutgoingSapronaksSummaryTable.tsx    |  1 +
 .../table/sapronak/OutgoingSapronaksTable.tsx     | 15 ++++++++++++++-
 5 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/src/components/pages/closing/table/FinanceClosingTable.tsx b/src/components/pages/closing/table/FinanceClosingTable.tsx
index 734e7a7b..1e1195fe 100644
--- a/src/components/pages/closing/table/FinanceClosingTable.tsx
+++ b/src/components/pages/closing/table/FinanceClosingTable.tsx
@@ -151,7 +151,7 @@ const FinanceClosingTable = ({
                         .filter((row) => row.code !== 'custom_row').length;
                       return dataRowsBefore + 1;
                     },
-                    footer: (props) => {
+                    footer: () => {
                       return 'HPP';
                     },
                   },
@@ -286,6 +286,7 @@ const FinanceClosingTable = ({
                   footerRowClassName: 'border-t-2 border-gray-300',
                   footerColumnClassName:
                     'px-4 py-3 text-xs text-gray-900 whitespace-nowrap',
+                  paginationClassName: 'hidden',
                 }}
                 renderCustomRow={(row) => {
                   const rowData = row.original;
diff --git a/src/components/pages/closing/table/sapronak/IncomingSapronaksSummaryTable.tsx b/src/components/pages/closing/table/sapronak/IncomingSapronaksSummaryTable.tsx
index ca16d143..9c43675c 100644
--- a/src/components/pages/closing/table/sapronak/IncomingSapronaksSummaryTable.tsx
+++ b/src/components/pages/closing/table/sapronak/IncomingSapronaksSummaryTable.tsx
@@ -5,6 +5,7 @@ import { useSearchParams } from 'next/navigation';
 import useSWR from 'swr';
 import { ColumnDef, SortingState } from '@tanstack/react-table';
 
+import { Icon } from '@iconify/react';
 import Table from '@/components/Table';
 import Card from '@/components/Card';
 
diff --git a/src/components/pages/closing/table/sapronak/IncomingSapronaksTable.tsx b/src/components/pages/closing/table/sapronak/IncomingSapronaksTable.tsx
index c8f225d9..0bbad454 100644
--- a/src/components/pages/closing/table/sapronak/IncomingSapronaksTable.tsx
+++ b/src/components/pages/closing/table/sapronak/IncomingSapronaksTable.tsx
@@ -5,6 +5,7 @@ import { useSearchParams } from 'next/navigation';
 import useSWR from 'swr';
 import { ColumnDef, SortingState } from '@tanstack/react-table';
 
+import { Icon } from '@iconify/react';
 import Table from '@/components/Table';
 import DebouncedTextInput from '@/components/input/DebouncedTextInput';
 import Card from '@/components/Card';
@@ -135,7 +136,19 @@ const ClosingIncomingSapronaksTable = ({
               placeholder='Cari Sapronak Masuk'
               value={tableFilterState.search}
               onChange={searchChangeHandler}
-              className={{ wrapper: 'sm:max-w-3xs' }}
+              startAdornment={
+                <Icon
+                  icon='heroicons:magnifying-glass'
+                  width={20}
+                  height={20}
+                />
+              }
+              className={{
+                wrapper: 'w-full min-w-24 max-w-3xs',
+                inputWrapper: 'rounded-xl! shadow-button-soft',
+                input:
+                  'placeholder:font-semibold placeholder:text-base-content/50',
+              }}
             />
           </div>
         </div>
diff --git a/src/components/pages/closing/table/sapronak/OutgoingSapronaksSummaryTable.tsx b/src/components/pages/closing/table/sapronak/OutgoingSapronaksSummaryTable.tsx
index e1c41b30..591b38d6 100644
--- a/src/components/pages/closing/table/sapronak/OutgoingSapronaksSummaryTable.tsx
+++ b/src/components/pages/closing/table/sapronak/OutgoingSapronaksSummaryTable.tsx
@@ -5,6 +5,7 @@ import { useSearchParams } from 'next/navigation';
 import useSWR from 'swr';
 import { ColumnDef, SortingState } from '@tanstack/react-table';
 
+import { Icon } from '@iconify/react';
 import Table from '@/components/Table';
 import Card from '@/components/Card';
 
diff --git a/src/components/pages/closing/table/sapronak/OutgoingSapronaksTable.tsx b/src/components/pages/closing/table/sapronak/OutgoingSapronaksTable.tsx
index d2179fb3..652b3f60 100644
--- a/src/components/pages/closing/table/sapronak/OutgoingSapronaksTable.tsx
+++ b/src/components/pages/closing/table/sapronak/OutgoingSapronaksTable.tsx
@@ -5,6 +5,7 @@ import { useSearchParams } from 'next/navigation';
 import useSWR from 'swr';
 import { ColumnDef, SortingState } from '@tanstack/react-table';
 
+import { Icon } from '@iconify/react';
 import Table from '@/components/Table';
 import DebouncedTextInput from '@/components/input/DebouncedTextInput';
 import Card from '@/components/Card';
@@ -135,7 +136,19 @@ const ClosingOutgoingSapronaksTable = ({
               placeholder='Cari Sapronak Keluar'
               value={tableFilterState.search}
               onChange={searchChangeHandler}
-              className={{ wrapper: 'sm:max-w-3xs' }}
+              startAdornment={
+                <Icon
+                  icon='heroicons:magnifying-glass'
+                  width={20}
+                  height={20}
+                />
+              }
+              className={{
+                wrapper: 'w-full min-w-24 max-w-3xs',
+                inputWrapper: 'rounded-xl! shadow-button-soft',
+                input:
+                  'placeholder:font-semibold placeholder:text-base-content/50',
+              }}
             />
           </div>
         </div>