Add a confirmation dialog before deleting a guest

app/ui/guests/table.tsx

@@ -3,7 +3,7 @@
 'use client';
 
 import { AbstractApi } from '@/app/api/abstract-api';
-import { Guest , GuestSerializer} from '@/app/lib/guest';
+import { Guest, GuestSerializer } from '@/app/lib/guest';
 import { PencilIcon, TrashIcon } from '@heroicons/react/24/outline';
 import clsx from 'clsx';
 import TableOfContents from '../components/table-of-contents';
@@ -48,7 +48,12 @@ export default function guestsTable({ guests, onUpdate, onEdit }: {
           </td>
           <td>
             <div className="flex flex-row items-center">
-              <TrashIcon className='size-6 cursor-pointer' onClick={() => { api.destroy(serializer, guest, onUpdate)}} />
+              <TrashIcon className='size-6 cursor-pointer' onClick={() => {
+                if (window.confirm(`Are you sure you want to delete guest "${guest.name}"?`)) {
+                  api.destroy(serializer, guest, onUpdate)
+                }
+              }}
+              />
               <PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(guest)} />
             </div>
           </td>