refactor(FE): Refactor Formik field updates to use setFieldValue

src/components/pages/master-data/supplier/SupplierTable.tsx

@@ -23,7 +23,6 @@ import RequirePermission from '@/components/helper/RequirePermission';
 import PopoverButton from '@/components/popover/PopoverButton';
 import PopoverContent from '@/components/popover/PopoverContent';
 import SupplierTableSkeleton from '@/components/pages/master-data/supplier/skeleton/SupplierTableSkeleton';
-import SelectInput from '@/components/input/SelectInput';
 import { OptionType } from '@/components/input/SelectInput';
 import ButtonFilter from '@/components/helper/ButtonFilter';
 
@@ -167,6 +166,8 @@ const SuppliersTable = () => {
     },
   });
 
+  const { setFieldValue } = formik;
+
   // ===== CATEGORY OPTIONS (SAPRONAK or BOP) =====
   const categoryOptions = useMemo(
     () => [
@@ -191,9 +192,9 @@ const SuppliersTable = () => {
       const option = val as OptionType | null;
       const categoryId = option?.value ? String(option.value) : null;
 
-      formik.setFieldValue('category_id', categoryId);
+      setFieldValue('category_id', categoryId);
     },
-    [formik]
+    [setFieldValue]
   );
 
   const handleFilterFlagChange = useCallback(
@@ -206,9 +207,9 @@ const SuppliersTable = () => {
             ? false
             : null;
 
-      formik.setFieldValue('flag', boolValue);
+      setFieldValue('flag', boolValue);
     },
-    [formik]
+    [setFieldValue]
   );
 
   // ===== FILTER HELPERS =====
@@ -238,9 +239,9 @@ const SuppliersTable = () => {
     if (filterModal.open) {
       const flagBoolValue =
         tableFilterState.flagFilter === 'EKSPEDISI' ? true : false;
-      formik.setFieldValue('flag', flagBoolValue);
+      setFieldValue('flag', flagBoolValue);
     }
-  }, [filterModal.open, tableFilterState.flagFilter]);
+  }, [filterModal.open, tableFilterState.flagFilter, setFieldValue]);
 
   useEffect(() => {
     updateFilter('search', searchValue);
@@ -508,6 +509,7 @@ const SuppliersTable = () => {
               options={flagOptions}
               value={flagValue}
               onChange={handleFilterFlagChange}
+              isClearable
               className={{ wrapper: 'w-full' }}
             />
           </div>