add suppliers

frontend/src/app/contacts/page.tsx

@@ -54,6 +54,8 @@ function ContactsContent() {
 
   const [searchTerm, setSearchTerm] = useState('')
   const [selectedType, setSelectedType] = useState('all')
+  const [selectedSpecialization, setSelectedSpecialization] = useState('all')
+  const [createDefaultType, setCreateDefaultType] = useState('INDIVIDUAL')
   const [selectedStatus, setSelectedStatus] = useState('all')
   const [selectedSource, setSelectedSource] = useState('all')
   const [selectedRating, setSelectedRating] = useState('all')
@@ -82,6 +84,7 @@ function ContactsContent() {
 
       if (searchTerm) filters.search = searchTerm
       if (selectedType !== 'all') filters.type = selectedType
+      if (selectedSpecialization !== 'all') filters.specialization = selectedSpecialization
       if (selectedStatus !== 'all') filters.status = selectedStatus
       if (selectedSource !== 'all') filters.source = selectedSource
       if (selectedRating !== 'all') filters.rating = parseInt(selectedRating)
@@ -97,7 +100,7 @@ function ContactsContent() {
     } finally {
       setLoading(false)
     }
-  }, [currentPage, searchTerm, selectedType, selectedStatus, selectedSource, selectedRating, selectedCategory])
+  }, [currentPage, searchTerm, selectedType, selectedStatus, selectedSource, selectedRating, selectedCategory, selectedSpecialization])
 
   useEffect(() => {
     const debounce = setTimeout(() => {
@@ -109,7 +112,7 @@ function ContactsContent() {
 
   useEffect(() => {
     fetchContacts()
-  }, [currentPage, selectedType, selectedStatus, selectedSource, selectedRating, selectedCategory])
+  }, [currentPage, selectedType, selectedStatus, selectedSource, selectedRating, selectedCategory, selectedSpecialization])
 
   const handleCreate = async (data: CreateContactData) => {
     setSubmitting(true)
@@ -247,6 +250,21 @@ function ContactsContent() {
   return (contact as any).nameAr || ''
 }
 
+  const supplierSpecializations = [
+    'كاميرات',
+    'شبكات',
+    'أجهزة كومبيوتر',
+    'projectors',
+    'مقاسم هاتفية',
+    ' Mobile - Tablet',
+    'firewall',
+    'طاقة بديلة',
+    'حديد',
+    ' باركود - POS',
+    'أجهزة منزلية',
+    'تكييف وتبريد',
+  ]
+
   return (
     <div className="min-h-screen bg-gray-50">
       <header className="bg-white shadow-sm border-b">
@@ -307,8 +325,20 @@ function ContactsContent() {
               <button
                 onClick={() => {
                   resetForm()
+                  setCreateDefaultType('SUPPLIER')
                   setShowCreateModal(true)
                 }}
+                className="flex items-center gap-2 px-4 py-2 bg-emerald-600 text-white rounded-lg hover:bg-emerald-700 transition-colors"
+              >
+                <Plus className="h-4 w-4" />
+                إضافة موردين
+              </button>
+              <button
+               onClick={() => {
+                resetForm()
+                setCreateDefaultType('INDIVIDUAL')
+                setShowCreateModal(true)
+              }}
                 className="flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
               >
                 <Plus className="h-4 w-4" />
@@ -406,8 +436,10 @@ function ContactsContent() {
                 <option value="UN">UN</option>
                 <option value="NGO">NGO</option>
                 <option value="INSTITUTION">Institution</option>
+                <option value="SUPPLIER">Suppliers - موردين</option>
               </select>
 
+
               <select
                 value={selectedStatus}
                 onChange={(e) => setSelectedStatus(e.target.value)}
@@ -452,7 +484,23 @@ function ContactsContent() {
                       <option value="OTHER">Other</option>
                     </select>
                   </div>
-
+                  <div>
+                    <label className="block text-sm font-medium text-gray-700 mb-2">
+                      اختصاص المورد
+                    </label>
+                    <select
+                      value={selectedSpecialization}
+                      onChange={(e) => setSelectedSpecialization(e.target.value)}
+                      className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white text-gray-900"
+                    >
+                      <option value="all">كل الاختصاصات</option>
+                      {supplierSpecializations.map((item) => (
+                        <option key={item} value={item}>
+                          {item}
+                        </option>
+                      ))}
+                    </select>
+                  </div>
                   <div>
                     <label className="block text-sm font-medium text-gray-700 mb-2">Rating</label>
                     <select
@@ -493,6 +541,7 @@ function ContactsContent() {
                         setSelectedRating('all')
                         setSelectedCategory('all')
                         setCurrentPage(1)
+                        setSelectedSpecialization('all')
                       }}
                       className="w-full px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
                     >
@@ -528,8 +577,8 @@ function ContactsContent() {
                 onClick={() => setShowCreateModal(true)}
                 className="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700"
               >
-                Create First Contact
-              </button>
+                {createDefaultType === 'SUPPLIER' ? 'إضافة مورد' : 'Create New Contact'} 
+             </button>
             </div>
           ) : (
             <>
@@ -732,7 +781,8 @@ function ContactsContent() {
         size="xl"
       >
         <ContactForm
-          key="create-contact"
+          key={`create-${createDefaultType}`}
+          defaultType={createDefaultType}
           onSubmit={async (data) => {
             await handleCreate(data as CreateContactData)
           }}