Fix filter

src/pages/members/agent-balance/AgentBalance.tsx

@@ -71,6 +71,7 @@ const AgentBalance = () => {
         order_field: 'created_at',
         order_direction: 'DESC',
         filter: JSON.stringify(filter),
+        specialFilter: true
       }
     });
     let temp = 1;
@@ -80,15 +81,6 @@ const AgentBalance = () => {
       return el;
     });
     return { data: resBalance, totalCount: balances?.data.data.total_count }
-    // setIsReloading(true);
-    // try {
-    //   // setDataBalance(resBalance);
-    // } catch (error: any) {
-    //   alert(error.message);
-    //   console.log(error);
-    // } finally {
-    //   setIsReloading(false);
-    // }
   }
 
   const openDialog = () => setIsDialogOpen(true);

src/pages/members/agent-balance/ListToolbar.tsx

@@ -9,58 +9,63 @@ interface ListToolBarProps {
 }
 
 const ListToolBar = ({ createGroup, onReload, isReloading }: ListToolBarProps) => {
-  const { table } = useDataGrid();
+  const { table, reload } = useDataGrid();
   const [usernameFilter, setUsernameFilter] = useState('');
   const [msisdn, setMsisdn] = useState('');
+  const [typeSearchValue, setSearchTypeValue] = useState<string>();
+  const [searchValue, setSearchValue] = useState<string>();
   const [fullname, setFullname] = useState('');
   const [merchantName, setMerchantName] = useState('');
 
   const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setUsernameFilter(e.target.value);
-    table.getColumn('username')?.setFilterValue(e.target.value);
   };
 
   const filtermsisdn = (e: React.ChangeEvent<HTMLInputElement>) => {
     setMsisdn(e.target.value);
-    table.getColumn('msisdn')?.setFilterValue(e.target.value);
   };
 
   const filterfullname = (e: React.ChangeEvent<HTMLInputElement>) => {
     setFullname(e.target.value);
-    table.getColumn('fullname')?.setFilterValue(e.target.value);
   };
 
   const filtermerchantname = (e: React.ChangeEvent<HTMLInputElement>) => {
     setMerchantName(e.target.value);
-    table.getColumn('agent_name')?.setFilterValue(e.target.value);
+  };
+
+  const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {
+    e.preventDefault()
+     table.getColumn('username')?.setFilterValue(usernameFilter);
+     table.getColumn('msisdn')?.setFilterValue(msisdn);
+     table.getColumn('fullname')?.setFilterValue(fullname);
+     table.getColumn('agent_name')?.setFilterValue(merchantName);
+    // if (!merchantName && !fullname && !msisdn && !usernameFilter) reload()
   };
 
   return (
     <div className="card-header flex-wrap gap-2 border-b-0 px-5">
       <div className="flex flex-wrap gap-2 lg:gap-5 w-full">
         <div className="flex justify-between w-full items-center">
-          <div className="flex w-[50%] gap-3 items-center">
+
+          <form onSubmit={(e:any) => handleSearch(e)}>
+            <div className="flex gap-3 items-center">
                 <label className="input input-sm w-1/3">
-              <KeenIcon icon="magnifier" />
                   <input type="text" placeholder="Search phone" value={msisdn} onChange={filtermsisdn}/>
                 </label>
                 <label className="input input-sm w-1/3">
-              <KeenIcon icon="magnifier" />
                   <input type="text" placeholder="Search fullname" value={fullname} onChange={filterfullname}/>
                 </label>
                 <label className="input input-sm w-1/3">
-              <KeenIcon icon="magnifier" />
                   <input type="text" placeholder="Search username" value={usernameFilter} onChange={handleUsernameChange}/>
                 </label>
                 <label className="input input-sm w-1/3">
-              <KeenIcon icon="magnifier" />
                   <input type="text" placeholder="Search merchant name" value={merchantName} onChange={filtermerchantname}/>
                 </label>
+              <Button variant="outline" className="h-7.5"><KeenIcon icon="magnifier" /></Button>
               </div>
+          </form>
+
           <div className="flex gap-3 items-center">
-            {/* <Button variant="outline" className="h-7.5 text-[0.8rem]" onClick={createGroup}>
-              Add Data
-            </Button> */}
             <DefaultTooltip title={isReloading ? 'Refreshing...' : 'Refresh'} placement={'top'}>
               <Button variant="outline" className="h-7.5" onClick={onReload} disabled={isReloading}>
                 {isReloading ? (

src/pages/members/manage-members/blocks/ListToolBar.tsx

@@ -41,7 +41,6 @@ const ListToolbar = ({ createMember, onReload, isReloading, groups }: ListToolba
     if (userloginrole === 'Admin') setisAdmin(true);
   }
 
-
   const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {
     e.preventDefault()
     // setSearchValue(e.target.value)