From f307ff6c85bef9a3ab3f7e215498055704b61029 Mon Sep 17 00:00:00 2001
From: unknown <benhurchrinstoper@gmail.com>
Date: Thu, 8 May 2025 14:18:09 +0700
Subject: [PATCH] add phone number

---
 .../members/manage-members/blocks/ListToolBar.tsx   | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/src/pages/members/manage-members/blocks/ListToolBar.tsx b/src/pages/members/manage-members/blocks/ListToolBar.tsx
index 3815442..b17a730 100644
--- a/src/pages/members/manage-members/blocks/ListToolBar.tsx
+++ b/src/pages/members/manage-members/blocks/ListToolBar.tsx
@@ -22,11 +22,17 @@ const ListToolbar = ({ createMember, onReload, isReloading, groups }: ListToolba
 
   const [groupFilter, setGroupFilter] = useState('');
   const [usernameFilter, setUsernameFilter] = useState('');
+  const [msisdnFilter, setMsisdnFilter] = useState('');
   const {table}=useDataGrid();
+  
   const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setUsernameFilter(e.target.value);
     table.getColumn('username')?.setFilterValue(e.target.value);
   };
+  const handleMsisdnChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setMsisdnFilter(e.target.value);
+    table.getColumn('msisdn')?.setFilterValue(e.target.value);
+  };
 
   const handleGroupChange = (e: any) => {
     let value = e.target.value;
@@ -60,6 +66,13 @@ const ListToolbar = ({ createMember, onReload, isReloading, groups }: ListToolba
                 ))}
               </SelectContent>
             </Select>
+            <input
+              type="text"
+              placeholder="Search Phone Number"
+              value={msisdnFilter}
+              onChange={handleMsisdnChange}
+              className="input w-40"
+            />
           </div>
           <div className="flex gap-3 items-center">
             <Button variant="outline" className="h-7.5 text-[0.8rem]" onClick={createMember}>