Add reset confirmation

internal/service/static/main.js

@@ -28,6 +28,7 @@ class Odidere {
     this.isProcessing = false;
     this.isRecording = false;
     this.isMuted = false;
+    this.isResetPending = false;
     this.mediaRecorder = null;
 
     // DOM Elements
@@ -143,8 +144,9 @@ class Odidere {
     // Send button
     this.$send.addEventListener('click', () => this.#submitText());
 
-    // Reset button
-    this.$reset.addEventListener('click', () => this.reset());
+    // Reset button: two-press safety
+    this.$reset.addEventListener('click', () => this.#handleResetClick());
+    this.document.addEventListener('click', (e) => this.#handleResetCancel(e));
 
     // File attachment
     this.$attach.addEventListener('click', () => this.$fileInput.click());
@@ -327,6 +329,33 @@ class Odidere {
     this.$fileInput.value = '';
   }
 
+  /**
+   * #handleResetClick toggles the pending state on first press,
+   * executes the reset on second press.
+   */
+  #handleResetClick() {
+    if (this.isResetPending) {
+      this.isResetPending = false;
+      this.$reset.classList.remove('footer__toolbar-btn--pending');
+      this.reset();
+    } else {
+      this.isResetPending = true;
+      this.$reset.classList.add('footer__toolbar-btn--pending');
+    }
+  }
+
+  /**
+   * #handleResetCancel clears the pending reset state when the user
+   * clicks anywhere outside the reset button.
+   * @param {MouseEvent} event
+   */
+  #handleResetCancel(event) {
+    if (!this.isResetPending) return;
+    if (this.$reset.contains(event.target)) return;
+    this.isResetPending = false;
+    this.$reset.classList.remove('footer__toolbar-btn--pending');
+  }
+
   // ====================
   // AUDIO RECORDING
   // ====================