Added map for home

app/properties/page.js

@@ -33,6 +33,7 @@ import {
 import Image from 'next/image';
 import Link from 'next/link';
 
+
 const PropertyCard = ({ property, viewMode = 'grid' }) => {
   const [isFavorite, setIsFavorite] = useState(false);
   const [currentImage, setCurrentImage] = useState(0);
@@ -315,11 +316,11 @@ const FilterBar = ({ filters, onFilterChange }) => {
 
   const cities = [
     { id: 'all', label: 'جميع المدن' },
-    { id: 'damascus', label: 'دمشق' },
-    { id: 'aleppo', label: 'حلب' },
-    { id: 'homs', label: 'حمص' },
-    { id: 'latakia', label: 'اللاذقية' },
-    { id: 'daraa', label: 'درعا' }
+    { id: 'دمشق', label: 'دمشق' },
+    { id: 'حلب', label: 'حلب' },
+    { id: 'حمص', label: 'حمص' },
+    { id: 'اللاذقية', label: 'اللاذقية' },
+    { id: 'درعا', label: 'درعا' }
   ];
 
   return (
@@ -495,7 +496,7 @@ const FilterBar = ({ filters, onFilterChange }) => {
 };
 
 export default function PropertiesPage() {
-  const [viewMode, setViewMode] = useState('grid');
+  const [viewMode, setViewMode] = useState('grid'); 
   const [sortBy, setSortBy] = useState('newest');
   const [filters, setFilters] = useState({
     search: '',
@@ -670,6 +671,7 @@ export default function PropertiesPage() {
                 className={`p-2 rounded-xl transition-colors ${
                   viewMode === 'grid' ? 'bg-gray-800 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'
                 }`}
+                title="عرض شبكي"
               >
                 <Grid3x3 className="w-5 h-5" />
               </button>
@@ -678,6 +680,7 @@ export default function PropertiesPage() {
                 className={`p-2 rounded-xl transition-colors ${
                   viewMode === 'list' ? 'bg-gray-800 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'
                 }`}
+                title="عرض قائمة"
               >
                 <List className="w-5 h-5" />
               </button>