Added translation to all site with edit style

app/components/home/HeroSearch.js

@@ -21,46 +21,46 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
   const [showLoginDialog, setShowLoginDialog] = useState(false);
 
   const cities = [
-    { id: 'all', label: 'جميع المدن' },
-    { id: 'دمشق', label: 'دمشق' },
-    { id: 'حلب', label: 'حلب' },
-    { id: 'حمص', label: 'حمص' },
-    { id: 'اللاذقية', label: 'اللاذقية' },
-    { id: 'درعا', label: 'درعا' }
+    { id: 'all', label: t('allCities') },
+    { id: 'دمشق', label: t('damascus') },
+    { id: 'حلب', label: t('aleppo') },
+    { id: 'حمص', label: t('homs') },
+    { id: 'اللاذقية', label: t('latakia') },
+    { id: 'درعا', label: t('daraa') }
   ];
 
   const propertyTypes = [
-    { id: 'all', label: 'الكل' },
-    { id: 'apartment', label: 'شقق سكنية' },
-    { id: 'studio', label: 'استوديو' },
-    { id: 'commercial', label: 'عقار تجاري' },
-    { id: 'villa', label: 'فيلا / مزرعة' }
+    { id: 'all', label: t('all') },
+    { id: 'apartment', label: t('residentialApartments') },
+    { id: 'studio', label: t('studio') },
+    { id: 'commercial', label: t('commercialProperty') },
+    { id: 'villa', label: t('villaFarm') }
   ];
 
   const priceRanges = [
-    { id: 'all', label: 'جميع الأسعار' },
-    { id: '0-500', label: 'أقل من 50$' },
-    { id: '500-1000', label: '50$ - 100$' },
-    { id: '1000-2000', label: '100$ - 200$' },
-    { id: '2000-3000', label: '200$ - 300$' },
-    { id: '3000+', label: 'أكثر من 300$' }
+    { id: 'all', label: t('allPrices') },
+    { id: '0-500', label: t('priceRange1') },
+    { id: '500-1000', label: t('priceRange2') },
+    { id: '1000-2000', label: t('priceRange3') },
+    { id: '2000-3000', label: t('priceRange4') },
+    { id: '3000+', label: t('priceRange5') }
   ];
 
   const identityTypes = [
-    { id: 'syrian', label: 'هوية سورية' },
-    { id: 'passport', label: 'جواز سفر' }
+    { id: 'syrian', label: t('syrianId') },
+    { id: 'passport', label: t('passport') }
   ];
 
   const ownerSources = [
-    { id: 'all', label: 'الكل' },
-    { id: 'owner', label: 'من المالك' },
-    { id: 'agency', label: 'من مكتب عقاري' }
+    { id: 'all', label: t('all') },
+    { id: 'owner', label: t('fromOwner') },
+    { id: 'agency', label: t('fromAgency') }
   ];
 
   const rentPeriods = [
-    { id: 'all', label: 'الكل' },
-    { id: 'daily', label: 'إيجار يومي' },
-    { id: 'monthly', label: 'إيجار شهري' }
+    { id: 'all', label: t('all') },
+    { id: 'daily', label: t('dailyRent') },
+    { id: 'monthly', label: t('monthlyRent') }
   ];
 
   const handleTabClick = (tab) => {
@@ -190,7 +190,7 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
         <div>
           <label className="block text-sm font-medium text-white mb-2">
             <div className="flex items-center gap-1">
-              نوع الوثيقة
+              {t("identityTypeLabel")}
             </div>
           </label>
           <select
@@ -213,7 +213,7 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
       </div>
       <div className="grid grid-cols-1 md:grid-cols-4 gap-4 mt-4">
         <div>
-          <label className="block text-sm font-medium text-white mb-2">مصدر العرض</label>
+          <label className="block text-sm font-medium text-white mb-2">{t("ownerSourceLabel")}</label>
           <select
             value={filters.ownerSource}
             onChange={(e) => setFilters({ ...filters, ownerSource: e.target.value })}
@@ -236,7 +236,7 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
 
         {activeTab === 'rent' && (
           <div>
-            <label className="block text-sm font-medium text-white mb-2">نوع الإيجار</label>
+            <label className="block text-sm font-medium text-white mb-2">{t("rentTypeLabel")}</label>
             <select
               value={filters.rentPeriod}
               onChange={(e) => setFilters({ ...filters, rentPeriod: e.target.value })}
@@ -266,7 +266,7 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
               onChange={(e) => setFilters({ ...filters, availableToday: e.target.checked })}
               className="w-5 h-5 text-amber-500 rounded border-gray-300 bg-white"
             />
-            <span className="font-medium">عرض فقط العقارات المتاحة من اليوم</span>
+            <span className="font-medium">{t("availableToday")}</span>
           </label>
         </div>
       </div>
@@ -289,13 +289,13 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
           <div className="flex items-center gap-3 mb-5">
             <ShieldCheck className="w-7 h-7 text-amber-500" />
             <div>
-              <h3 className="text-lg font-semibold text-gray-900">يرجى تسجيل الدخول</h3>
-              <p className="text-sm text-gray-600">للوصول إلى خيارات التأجير والبيع، يجب أن تكون مسجلاً.</p>
+              <h3 className="text-lg font-semibold text-gray-900">{t("loginRequired")}</h3>
+              <p className="text-sm text-gray-600">{t("loginRequiredDesc")}</p>
             </div>
           </div>
           <div className="space-y-4">
             <div className="rounded-2xl bg-gray-50 p-4">
-              <p className="text-sm text-gray-700">اضغط على تسجيل الدخول لاستكمال البحث أو إدارة عقاراتك.</p>
+              <p className="text-sm text-gray-700">{t("loginPrompt")}</p>
             </div>
             <div className="flex flex-col gap-3 sm:flex-row sm:justify-end">
               <button
@@ -303,13 +303,13 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
                 onClick={() => setShowLoginDialog(false)}
                 className="w-full sm:w-auto px-5 py-3 rounded-xl border border-gray-300 text-gray-700 hover:bg-gray-100 transition-colors"
               >
-                إغلاق
+                {t("close")}
               </button>
               <Link
                 href="/login"
                 className="w-full sm:w-auto px-5 py-3 rounded-xl bg-amber-500 text-white font-semibold text-center hover:bg-amber-600 transition-colors"
               >
-                تسجيل الدخول
+                {t("login")}
               </Link>
             </div>
           </div>
@@ -318,4 +318,4 @@ export default function HeroSearch({ onSearch, isAuthenticated }) {
     )}
     </>
   );
-}
+}