fix(FE): implement lazy loading select button on finance module

src/components/pages/finance/FinanceTable.tsx

@@ -1,21 +1,17 @@
 import { ChangeEventHandler, useMemo, useState } from 'react';
-import { CellContext, Row } from '@tanstack/react-table';
+import { CellContext } from '@tanstack/react-table';
 import { useSearchParams } from 'next/navigation';
 import useSWR from 'swr';
 
 import Button from '@/components/Button';
 import Card from '@/components/Card';
-import Dropdown from '@/components/dropdown/Dropdown';
 import DateInput from '@/components/input/DateInput';
 import DebouncedTextInput from '@/components/input/DebouncedTextInput';
 import SelectInput, {
   OptionType,
   useSelect,
 } from '@/components/input/SelectInput';
-import Menu from '@/components/menu/Menu';
-import MenuItem from '@/components/menu/MenuItem';
 import Table from '@/components/Table';
-import Tooltip from '@/components/Tooltip';
 import { formatCurrency, formatDate, formatTitleCase } from '@/lib/helper';
 import { useTableFilter } from '@/services/hooks/useTableFilter';
 import { Finance } from '@/types/api/finance/finance';
@@ -23,11 +19,10 @@ import {
   FINANCE_INITIAL_BALANCE_STATUS,
   FINANCE_INJECTION_STATUS,
   FINANCE_TRANSACTION_STATUS,
-  ROWS_OPTIONS,
 } from '@/config/constant';
 import { FinanceApi } from '@/services/api/finance';
 import { isResponseSuccess } from '@/lib/api-helper';
-import { BankApi, CustomerApi, SupplierApi } from '@/services/api/master-data';
+import { BankApi } from '@/services/api/master-data';
 import { Bank } from '@/types/api/master-data/bank';
 import { useModal } from '@/components/Modal';
 import ConfirmationModal from '@/components/modal/ConfirmationModal';
@@ -219,15 +214,12 @@ const FinanceTable = () => {
       { label: 'Tanggal Dibuat', value: 'created_at' },
     ];
   }, []);
-  const { options: bankOptions, rawData: bankRawData } = useSelect<Bank>(
-    BankApi.basePath,
-    'id',
-    'alias',
-    '',
-    {
-      limit: 'limit',
-    }
-  );
+  const {
+    options: bankOptions,
+    rawData: bankRawData,
+    setInputValue: bankInputValue,
+    loadMore: bankLoadMore,
+  } = useSelect<Bank>(BankApi.basePath, 'id', 'alias');
 
   // ===== Handler =====
   const searchChangeHandler: ChangeEventHandler<HTMLInputElement> = (e) => {
@@ -501,6 +493,8 @@ const FinanceTable = () => {
             label='Bank'
             value={selectedBank}
             onChange={bankChangeHandler}
+            onInputChange={bankInputValue}
+            onMenuScrollToBottom={bankLoadMore}
             isClearable
           />
           <SelectInput