Open Merge and Discard confirmations beside their buttons

web/src/task.ts

@@ -139,6 +139,7 @@ function taskHead(rerender: () => void): Head {
       const merge = h(
         "button",
         {
+          class: "merge-button",
           disabled: busy || held || unmerged?.taskId !== task.id || !unmerged.has,
           title: held
             ? "Waiting for the merge in progress in this project to finish"
@@ -159,7 +160,7 @@ function taskHead(rerender: () => void): Head {
       };
       const discard = h("button", { class: "danger", disabled: busy, title: "Delete the worktree and branch without merging" }, "Discard");
       discard.onclick = () =>
-        confirmThen(`Discard "${task.title}"?`, "Discard", true, async () => {
+        confirmThen(`Discard "${task.title}"?`, "Discard", true, discard, async () => {
           await post("/api/tasks/{taskId}/discard", { path: { taskId: task.id } });
           await setFocus({ task_id: null });
         });
@@ -1081,7 +1082,7 @@ export async function confirmMerge(taskId: string): Promise<void> {
     void showAlert(errorText(err));
     return;
   }
-  await confirmThen(mergeQuestion(task.merge_title, target, coAuthors), "Merge", false, async () => {
+  await confirmThen(mergeQuestion(task.merge_title, target, coAuthors), "Merge", false, document.querySelector(".merge-button"), async () => {
     await post("/api/tasks/{taskId}/merge", { path: { taskId } });
   });
 }
@@ -1099,8 +1100,8 @@ function mergeQuestion(title: string, target: string, coAuthors: Participant[]):
   return lines.join("\n");
 }
 
-async function confirmThen(question: string, action: string, danger: boolean, act: () => Promise<void>) {
-  if (!(await showConfirm(question, action, danger))) {
+async function confirmThen(question: string, action: string, danger: boolean, anchor: Element | null, act: () => Promise<void>) {
+  if (!(await showConfirm(question, action, danger, anchor))) {
     return;
   }
   try {