properties

frontend/src/components/Properties/PropertyForm.js

@@ -38,8 +38,7 @@ const PropertyForm = ({ onSubmit, onCancel, initialData = null }) => {
     name: initialData?.name || '',
     address: initialData?.address || '',
     latitude: initialData?.latitude || '',
-    longitude: initialData?.longitude || '',
-    totalArea: initialData?.totalArea || ''
+    longitude: initialData?.longitude || ''
   });
   
   const [mapPosition, setMapPosition] = useState(
@@ -136,8 +135,7 @@ const PropertyForm = ({ onSubmit, onCancel, initialData = null }) => {
     const propertyData = {
       ...formData,
       latitude: markerPosition ? markerPosition[0] : (formData.latitude ? parseFloat(formData.latitude) : null),
-      longitude: markerPosition ? markerPosition[1] : (formData.longitude ? parseFloat(formData.longitude) : null),
-      totalArea: formData.totalArea ? parseFloat(formData.totalArea) : null
+      longitude: markerPosition ? markerPosition[1] : (formData.longitude ? parseFloat(formData.longitude) : null)
     };
 
     try {
@@ -154,30 +152,16 @@ const PropertyForm = ({ onSubmit, onCancel, initialData = null }) => {
       </h3>
       
       <form onSubmit={handleSubmit} className="space-y-6">
-        <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-          <div>
-            <label className="label">Property Name *</label>
-            <input
-              type="text"
-              required
-              className="input"
-              value={formData.name}
-              onChange={(e) => setFormData({ ...formData, name: e.target.value })}
-              placeholder="e.g., Main Lawn, Front Yard"
-            />
-          </div>
-          
-          <div>
-            <label className="label">Total Area (sq ft)</label>
-            <input
-              type="number"
-              step="any"
-              className="input"
-              value={formData.totalArea}
-              onChange={(e) => setFormData({ ...formData, totalArea: e.target.value })}
-              placeholder="5000"
-            />
-          </div>
+        <div>
+          <label className="label">Property Name *</label>
+          <input
+            type="text"
+            required
+            className="input"
+            value={formData.name}
+            onChange={(e) => setFormData({ ...formData, name: e.target.value })}
+            placeholder="e.g., Main Lawn, Front Yard"
+          />
         </div>
 
         {/* Address Autocomplete */}
@@ -258,12 +242,13 @@ const PropertyForm = ({ onSubmit, onCancel, initialData = null }) => {
               <div style={{ height: '400px', width: '100%' }}>
                 <MapContainer
                   center={mapPosition}
-                  zoom={16}
+                  zoom={18}
                   style={{ height: '100%', width: '100%' }}
                 >
+                  {/* Esri Satellite Imagery */}
                   <TileLayer
-                    attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
-                    url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
+                    attribution='&copy; <a href="https://www.esri.com/">Esri</a> &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
+                    url="https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}"
                   />
                   <LocationMarker 
                     position={markerPosition}