From 2f932cb2bb9add10014181d978331efcf61d30f5 Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Thu, 3 Aug 2023 01:51:10 +0200
Subject: [PATCH] Add client-side timeout on resend confirmation button
 (#26300)

---
 app/javascript/packs/sign_up.js     | 26 ++++++++++++++++++++++++++
 app/views/auth/setup/show.html.haml |  2 +-
 2 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/app/javascript/packs/sign_up.js b/app/javascript/packs/sign_up.js
index 9aae9c11b..cf9c83777 100644
--- a/app/javascript/packs/sign_up.js
+++ b/app/javascript/packs/sign_up.js
@@ -13,4 +13,30 @@ ready(() => {
       console.error(error);
     });
   }, 5000);
+
+  document.querySelectorAll('.timer-button').forEach(button => {
+    let counter = 30;
+
+    const container = document.createElement('span');
+
+    const updateCounter = () => {
+      container.innerText = ` (${counter})`;
+    };
+
+    updateCounter();
+
+    const countdown = setInterval(() => {
+      counter--;
+
+      if (counter === 0) {
+        button.disabled = false;
+        button.removeChild(container);
+        clearInterval(countdown);
+      } else {
+        updateCounter();
+      }
+    }, 1000);
+
+    button.appendChild(container);
+  });
 });
diff --git a/app/views/auth/setup/show.html.haml b/app/views/auth/setup/show.html.haml
index 64deca334..97c826d70 100644
--- a/app/views/auth/setup/show.html.haml
+++ b/app/views/auth/setup/show.html.haml
@@ -19,6 +19,6 @@
     = f.input :email, required: true, hint: false, input_html: { 'aria-label': t('simple_form.labels.defaults.email'), autocomplete: 'off' }
 
   .actions
-    = f.submit t('auth.resend_confirmation'), class: 'button'
+    = f.button :button, t('auth.resend_confirmation'), type: :submit, class: 'button timer-button', disabled: true
 
 .form-footer= render 'auth/shared/links'