Optimize bulk deletion flow and handle UI residuals

- Check for existing delete button before initiating deletion.
- Remove lingering delete button from DOM if present.
- Ensure sequential deletion of selected conversations.

bulkDeleteConversations.js

@@ -1,84 +1,86 @@
+const Selectors = {
+  conversationsCheckbox: '.conversation-checkbox:checked',
+  deleteButton: 'nav div a>div>button:nth-child(2)',
+  confirmDeleteButton: 'button.btn.btn-danger',
+};
+
 async function bulkDeleteConversations() {
   const selectedConversations = getSelectedConversations();
 
   if (selectedConversations.length === 0) {
-      console.log("No conversations to delete.");
-      removeAllCheckboxes();
-      return;
+    console.log("No conversations to delete.");
+    removeAllCheckboxes();
+    return;
+  }
+
+  let deleteButton = document.querySelector(Selectors.deleteButton);
+  if (deleteButton) {
+    deleteButton.remove();
   }
 
   console.log("Selected Conversations:", selectedConversations);
 
-  // 使用 for 循环按顺序删除选中的对话
   for (const element of selectedConversations) {
     await deleteConversation(element);
+    await delay(300);
   }
 }
 
 function getSelectedConversations() {
-  return [...document.querySelectorAll('.conversation-checkbox:checked')];
+  return [...document.querySelectorAll(Selectors.conversationsCheckbox)];
 }
 
 function removeAllCheckboxes() {
-  const allCheckboxes = document.querySelectorAll('.conversation-checkbox');
+  const allCheckboxes = document.querySelectorAll(Selectors.conversationsCheckbox);
   allCheckboxes.forEach(checkbox => checkbox.remove());
 }
 
 async function deleteConversation(checkbox) {
-  const conversationElement = await checkbox.closest('.flex.p-3.items-center.gap-3.relative.rounded-md')
+  const conversationElement = await checkbox.closest('.flex.p-3.items-center.gap-3.relative.rounded-md');
 
-  console.log("1. 点击对话", conversationElement);
-  conversationElement.click(); // 点击对话
+  console.log("1. Clicking conversation", conversationElement);
+  conversationElement.click();
 
-  // debugger
-
-  const deleteButton = await waitForElement("nav div a>div>button:nth-child(2)");
+  const deleteButton = await waitForElement(Selectors.deleteButton);
 
   if (deleteButton) {
-      console.log("2. 点击删除按钮");
+    console.log("2. Clicking delete button", deleteButton);
 
-      deleteButton.click(); // 点击删除按钮
-      await delay(300);
+    deleteButton.click();
+    const confirmButton = await waitForElement(Selectors.confirmDeleteButton);
 
-      // 等待确认删除对话框的按钮出现
-      const confirmButton = await waitForElement('button.btn.btn-danger');
+    if (confirmButton) {
+      console.log("3. Clicking confirm button");
+      confirmButton.click();
 
-      if (confirmButton) {
-          console.log("3. 点击确认按钮");
-          confirmButton.click();
-
-          // 等待删除按钮消失
-          await waitForElementToDisappear('button.btn.btn-danger');
-      }
+      await waitForElementToDisappear(Selectors.confirmDeleteButton);
+    }
   }
 
-  console.log("4. 完成删除");
+  console.log("4. Deletion completed");
 }
 
-// 用于等待某元素出现的函数
-async function waitForElement(selector, timeout = 5000) {
+async function waitForElement(selector, timeout = 2000) {
   const startedAt = Date.now();
   while ((Date.now() - startedAt) < timeout) {
-      const element = document.querySelector(selector);
-      if (element) return element;
-      await delay(100);
+    const element = document.querySelector(selector);
+    if (element) return element;
+    await delay(100);
   }
-  console.log('do not found delete confirm button')
+  console.log(`Element ${selector} not found within ${timeout}ms`);
   throw new Error(`Element ${selector} not found within ${timeout}ms`);
 }
 
-// 用于等待某元素消失的函数
-async function waitForElementToDisappear(selector, timeout = 5000) {
+async function waitForElementToDisappear(selector, timeout = 2000) {
   const startedAt = Date.now();
   while ((Date.now() - startedAt) < timeout) {
-      const element = document.querySelector(selector);
-      if (!element) return;
-      await delay(100);
+    const element = document.querySelector(selector);
+    if (!element) return;
+    await delay(100);
   }
   throw new Error(`Element ${selector} did not disappear within ${timeout}ms`);
 }
 
-// 延迟函数
 function delay(ms) {
   return new Promise(resolve => setTimeout(resolve, ms));
 }