From 68867d63b4f23f6b847fc2f5fdeb05a97a8fcb17 Mon Sep 17 00:00:00 2001
From: Tim Down <158919+timdown@users.noreply.github.com>
Date: Wed, 27 Nov 2024 14:12:21 +0000
Subject: [PATCH] Merge pull request #21955 from overleaf/rd-bs5-loading-button

Buttons should not be interactive when they are disabled

GitOrigin-RevId: 2b8b1e8b317dc3b62200b48dac66df7eff8a7268
---
 .../frontend/js/features/ui/components/bootstrap-5/button.tsx   | 2 ++
 .../web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss  | 1 +
 2 files changed, 3 insertions(+)

diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
index 1e21058d28..4eec23475a 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
@@ -50,6 +50,8 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
         variant={variant}
         {...props}
         ref={ref}
+        disabled={isLoading || props.disabled}
+        data-ol-loading={isLoading}
       >
         {isLoading && (
           <span className="spinner-container">
diff --git a/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss b/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss
index cab51b5272..e94d955f49 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss
@@ -42,6 +42,7 @@
     color: var(--bs-btn-color);
     background-color: var(--bs-btn-bg);
     border-color: var(--bs-btn-border-color);
+    opacity: 1;
   }
 }