implemented a marked as complete button

app.jsx

@@ -134,6 +134,17 @@ function App() {
     } catch(e) {}
   };
 
+  const completeTask = async (taskId) => {
+    try {
+      await api.updateTask(taskId, { status: 'closed' });
+      await api.addAudit({ actor: meId, action: 'task_completed', summary: 'Marked task as completed', target: taskId });
+      setOpenTaskId(null);
+    } catch(e) {
+      console.error(e);
+      alert("Failed to complete task: " + e.message);
+    }
+  };
+
   const dismissHU = (id) => setHeadsUp(h => h.filter(x => x.id !== id));
   const openTaskFromAnywhere = (id) => { setOpenTaskId(id); setShowLogs(false); };
 
@@ -191,7 +202,7 @@ function App() {
 
       <AddTaskModal open={!!adding} onClose={() => setAdding(null)} onSubmit={addTask} defaultAssignee={adding} me={me} />
       {mappedOpenTask && (
-        <TaskDetail task={mappedOpenTask} allAudit={frontendAudit} onClose={() => setOpenTaskId(null)} onMove={moveTask} onPriority={setPriority} />
+        <TaskDetail task={mappedOpenTask} allAudit={frontendAudit} onClose={() => setOpenTaskId(null)} onMove={moveTask} onPriority={setPriority} onComplete={() => completeTask(mappedOpenTask.id)} />
       )}
       {showLogs && (
         <Modal title="Audit log" onClose={() => setShowLogs(false)} wide>