WIP make requests to the backend

app/ui/guests/table.tsx

@@ -6,11 +6,18 @@ import { Suspense } from 'react';
 import clsx from 'clsx';
 
 export function TableHeader() {
-  
+
 }
 
 export default async function guestsTable() {
 
+
+  function handleInviteGuest() {
+    fetch("http://localhost:3001/guests/123.json", {method: 'PATCH', body: JSON.stringify({guest: {status: 'Invited'}})})
+      .then((response) => console.log(response.json()))
+      .catch((error) => console.error(error));
+  }
+
   let guests: Guest[] = await fetch("http://localhost:3001/guests.json")
     .then((response) => response.json())
     .then((data) => {
@@ -50,6 +57,7 @@ export default async function guestsTable() {
             <th scope="col" className="px-6 py-3">
               Status
             </th>
+            <th>Actions</th>
           </tr>
         </thead>
         <tbody>
@@ -79,6 +87,11 @@ export default async function guestsTable() {
                   {guest.status}
                 </span>
               </td>
+              <td>
+                {guest.status === 'Considered' && (<button onClick={handleInviteGuest} className="bg-blue-300 hover:bg-blue-500 text-white py-1 px-2 rounded">
+                  Invite
+                </button>)}
+              </td>
             </tr>
           ))}
         </tbody>