Delete property

components/ProfileProperties.jsx

@@ -2,9 +2,29 @@
 import { useState } from 'react';
 import Image from 'next/image';
 import Link from 'next/link';
+import deleteProperty from '@/app/actions/deleteProperty';
 
 const ProfileProperties = ({ properties: initialProperties }) => {
   const [properties, setProperties] = useState(initialProperties);
+
+  const handleDeleteProperty = async (propertyId) => {
+    const confirmed = window.confirm(
+      'Are you sure you want to delete this property?'
+    );
+
+    if (!confirmed) return;
+
+    const deletePropertyById = deleteProperty.bind(null, propertyId);
+
+    await deletePropertyById();
+
+    const updatedProperties = properties.filter(
+      (property) => property._id !== propertyId
+    );
+
+    setProperties(updatedProperties);
+  };
+
   return properties.map((property) => (
     <div key={property._id} className='mb-10'>
       <Link href={`/properties/${property._id}`}>
@@ -32,6 +52,7 @@ const ProfileProperties = ({ properties: initialProperties }) => {
           Edit
         </Link>
         <button
+          onClick={() => handleDeleteProperty(property._id)}
           className='bg-red-500 text-white px-3 py-2 rounded-md hover:bg-red-600'
           type='button'
         >