refactor(FE): Fix dependency array in ExpenseRealizationForm useCallback

src/components/pages/expense/form/ExpenseRealizationForm.tsx

@@ -66,7 +66,7 @@ const ExpenseRealizationForm = ({
       toast.success(createExpenseRes?.message as string);
       router.push('/expense');
     },
-    [router]
+    [router, initialValues?.id]
   );
 
   const updateExpenseHandler = useCallback(

src/components/pages/expense/form/ExpenseRequestForm.tsx

@@ -178,12 +178,14 @@ const ExpenseRequestForm = ({
     setInputValue: setLocationInputValue,
     options: locationOptions,
     isLoadingOptions: isLoadingLocationOptions,
+    loadMore: loadMoreLocationOptions,
   } = useSelect<Location>(LocationApi.basePath, 'id', 'name');
 
   const {
     setInputValue: setVendorInputValue,
     options: supplierOptions,
     isLoadingOptions: isLoadingVendorOptions,
+    loadMore: loadMoreVendorOptions,
   } = useSelect<Supplier>(SupplierApi.basePath, 'id', 'name');
 
   const categoryChangeHandler = (val: OptionType | OptionType[] | null) => {
@@ -414,6 +416,7 @@ const ExpenseRequestForm = ({
               errorMessage={formik.errors.location_id as string}
               isClearable
               className={{ wrapper: 'col-span-12 sm:col-span-4' }}
+              onMenuScrollToBottom={loadMoreLocationOptions}
             />
 
             <DateInput
@@ -457,6 +460,7 @@ const ExpenseRequestForm = ({
               }
               errorMessage={formik.errors.supplier_id as string}
               className={{ wrapper: 'col-span-12' }}
+              onMenuScrollToBottom={loadMoreVendorOptions}
             />
 
             <RequirePermission permissions='lti.expense.document'>