[skip ci] fix filter card on module search member

src/pages/members/search-member/blocks/FilterCard.tsx

@@ -1,5 +1,6 @@
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { useState } from 'react';
 
 const CustomerFilterForm = ({ 
@@ -9,55 +10,69 @@ const CustomerFilterForm = ({
   onFilter: (filters: { username?: string; msisdn?: string }) => void;
   onReset?: () => void;
 }) => {
-  const [username, setUsername] = useState('');
+  const [searchType, setSearchType] = useState<'username' | 'msisdn'>('username');
-  const [msisdn, setMsisdn] = useState('');
+  const [searchValue, setSearchValue] = useState('');
 
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault();
     
-    if (!username.trim() && !msisdn.trim()) {
+    if (!searchValue.trim()) {
-      alert('Please fill at least one search field');
+      alert('Please fill the search field');
       return;
     }
     
-    onFilter({ username, msisdn });
+    const filters = searchType === 'username' 
+      ? { username: searchValue, msisdn: '' }
+      : { username: '', msisdn: searchValue };
+    
+    onFilter(filters);
   };
 
   const handleReset = () => {
-    setUsername('');
+    setSearchType('username');
-    setMsisdn('');
+    setSearchValue('');
     if (onReset) {
       onReset();
     }
   };
 
+  const getPlaceholder = () => {
+    return searchType === 'username' ? 'Enter username' : 'Enter phone number';
+  };
+
+  const getLabel = () => {
+    return searchType === 'username' ? 'Username' : 'Phone Number';
+  };
+
   return (
     <div className="flex items-center justify-center">
       <div className="card max-w-[1200px] w-full">
         <div className="card-body p-16">
           <form onSubmit={handleSubmit} className="space-y-8">
             <div>
-              <label htmlFor="username" className="block text-base font-medium text-gray-700 mb-2">
+              <label htmlFor="searchType" className="block text-base font-medium text-gray-700 mb-2">
-                Username
+                Type Search
               </label>
-              <Input
+              <Select value={searchType} onValueChange={(value: 'username' | 'msisdn') => setSearchType(value)}>
-                id="username"
+                <SelectTrigger className="w-full h-12 text-base">
-                value={username}
+                  <SelectValue placeholder="Select search type" />
-                onChange={(e) => setUsername(e.target.value)}
+                </SelectTrigger>
-                placeholder="Search Username"
+                <SelectContent>
-                className="w-full h-12 text-base"
+                  <SelectItem value="username">Username</SelectItem>
-              />
+                  <SelectItem value="msisdn">Phone Number</SelectItem>
+                </SelectContent>
+              </Select>
             </div>
             
             <div>
-              <label htmlFor="msisdn" className="block text-base font-medium text-gray-700 mb-2">
+              <label htmlFor="searchValue" className="block text-base font-medium text-gray-700 mb-2">
-                MSISDN (Phone Number) <span className="text-red-500">*</span>
+                Search
               </label>
               <Input
-                id="msisdn"
+                id="searchValue"
-                value={msisdn}
+                value={searchValue}
-                onChange={(e) => setMsisdn(e.target.value)}
+                onChange={(e) => setSearchValue(e.target.value)}
-                placeholder="Search MSISDN"
+                placeholder={getPlaceholder()}
                 className="w-full h-12 text-base"
               />
             </div>