diff --git a/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx b/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx
index 09a96b23..794c45d6 100644
--- a/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx
+++ b/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx
@@ -40,10 +40,10 @@ interface PurchasesPerSupplierTabProps {
 }
 
 interface FilterParams {
-  area_ids?: string;
-  supplier_ids?: string;
-  product_ids?: string;
-  product_category_ids?: string;
+  area_id?: string;
+  supplier_id?: string;
+  product_id?: string;
+  product_category_id?: string;
   start_date?: string;
   end_date?: string;
   sort_by?: string;
@@ -107,7 +107,7 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
 
   const handleFilterModalOpen = () => {
     filterModal.openModal();
-    formik.resetForm({ values: formik.values });
+    formik.validateForm();
   };
 
   // ===== FORMIK SETUP =====
@@ -123,19 +123,19 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
       sort_by: null,
     },
     validationSchema: PurchasesPerSupplierFilterSchema,
-    onSubmit: (values, { resetForm }) => {
+    onSubmit: (values, { setSubmitting }) => {
       setFilterParams({
         start_date: values.start_date?.toString() || undefined,
         end_date: values.end_date?.toString() || undefined,
-        area_ids:
+        area_id:
           values.area_ids?.map((v) => String(v.value)).join(',') || undefined,
-        supplier_ids:
+        supplier_id:
           values.supplier_ids?.map((v) => String(v.value)).join(',') ||
           undefined,
-        product_ids:
+        product_id:
           values.product_ids?.map((v) => String(v.value)).join(',') ||
           undefined,
-        product_category_ids:
+        product_category_id:
           values.product_category_ids?.map((v) => String(v.value)).join(',') ||
           undefined,
         filter_by: values.filter_by?.value?.toString() || undefined,
@@ -144,7 +144,7 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
       filterModal.closeModal();
       setIsSubmitted(true);
       setCurrentPage(1);
-      resetForm({ values });
+      setSubmitting(false);
     },
     onReset: () => {
       setFilterParams({});
@@ -228,19 +228,19 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
       count += 1;
     }
 
-    if (filterParams.area_ids) {
+    if (filterParams.area_id) {
       count += 1;
     }
 
-    if (filterParams.supplier_ids) {
+    if (filterParams.supplier_id) {
       count += 1;
     }
 
-    if (filterParams.product_ids) {
+    if (filterParams.product_id) {
       count += 1;
     }
 
-    if (filterParams.product_category_ids) {
+    if (filterParams.product_category_id) {
       count += 1;
     }
 
@@ -262,10 +262,10 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
     isSubmitted
       ? () => {
           const params = {
-            area_ids: filterParams.area_ids,
-            supplier_ids: filterParams.supplier_ids,
-            product_ids: filterParams.product_ids,
-            product_category_ids: filterParams.product_category_ids,
+            area_id: filterParams.area_id,
+            supplier_id: filterParams.supplier_id,
+            product_id: filterParams.product_id,
+            product_category_id: filterParams.product_category_id,
             start_date: filterParams.start_date,
             end_date: filterParams.end_date,
             sort_by: filterParams.sort_by,
@@ -279,10 +279,10 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
       : null,
     ([, params]) =>
       LogisticApi.getLogisticPurchasePerSupplierReport(
-        params.area_ids,
-        params.supplier_ids,
-        params.product_ids,
-        params.product_category_ids,
+        params.area_id,
+        params.supplier_id,
+        params.product_id,
+        params.product_category_id,
         params.filter_by === 'received_date' ? params.start_date : undefined,
         params.filter_by === 'po_date' ? params.start_date : undefined,
         params.start_date,
@@ -313,10 +313,10 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
     LogisticPurchasePerSupplierReport[] | null
   > => {
     const params = {
-      area_ids: filterParams.area_ids,
-      supplier_ids: filterParams.supplier_ids,
-      product_ids: filterParams.product_ids,
-      product_category_ids: filterParams.product_category_ids,
+      area_id: filterParams.area_id,
+      supplier_id: filterParams.supplier_id,
+      product_id: filterParams.product_id,
+      product_category_id: filterParams.product_category_id,
       start_date: filterParams.start_date,
       end_date: filterParams.end_date,
       sort_by: filterParams.sort_by,
@@ -326,10 +326,10 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
     };
 
     const response = await LogisticApi.getLogisticPurchasePerSupplierReport(
-      params.area_ids,
-      params.supplier_ids,
-      params.product_ids,
-      params.product_category_ids,
+      params.area_id,
+      params.supplier_id,
+      params.product_id,
+      params.product_category_id,
       params.filter_by === 'received_date' ? params.start_date : undefined,
       params.filter_by === 'po_date' ? params.start_date : undefined,
       params.start_date,
@@ -383,37 +383,37 @@ const PurchasesPerSupplierTab = ({ tabId }: PurchasesPerSupplierTabProps) => {
         return;
       }
 
-      const areaName = filterParams.area_ids
+      const areaName = filterParams.area_id
         ? areaOptions
             .filter((opt) =>
-              filterParams.area_ids?.split(',').includes(String(opt.value))
+              filterParams.area_id?.split(',').includes(String(opt.value))
             )
             .map((opt) => opt.label)
             .join(', ') || 'Semua Area'
         : 'Semua Area';
 
-      const supplierName = filterParams.supplier_ids
+      const supplierName = filterParams.supplier_id
         ? supplierOptions
             .filter((opt) =>
-              filterParams.supplier_ids?.split(',').includes(String(opt.value))
+              filterParams.supplier_id?.split(',').includes(String(opt.value))
             )
             .map((opt) => opt.label)
             .join(', ') || 'Semua Supplier'
         : 'Semua Supplier';
 
-      const productName = filterParams.product_ids
+      const productName = filterParams.product_id
         ? productOptions
             .filter((opt) =>
-              filterParams.product_ids?.split(',').includes(String(opt.value))
+              filterParams.product_id?.split(',').includes(String(opt.value))
             )
             .map((opt) => opt.label)
             .join(', ') || 'Semua Produk'
         : 'Semua Produk';
 
-      const productCategoryName = filterParams.product_category_ids
+      const productCategoryName = filterParams.product_category_id
         ? productCategoryOptions
             .filter((opt) =>
-              filterParams.product_category_ids
+              filterParams.product_category_id
                 ?.split(',')
                 .includes(String(opt.value))
             )