From c56f5f9fe13056414406baebabeef82710f947b8 Mon Sep 17 00:00:00 2001
From: akastijn <akastijn@alttd.com>
Date: Mon, 24 Nov 2025 01:56:36 +0100
Subject: [PATCH] Prevent duplicate submissions in `sendForm` by adding a
 loading state guard and updating the submit button's disabled condition.

---
 .../pages/forms/appeal/appeal.component.html  |  2 +-
 .../pages/forms/appeal/appeal.component.ts    | 26 +++++++++++++------
 2 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/frontend/src/app/pages/forms/appeal/appeal.component.html b/frontend/src/app/pages/forms/appeal/appeal.component.html
index 4de1666..d33a9e3 100644
--- a/frontend/src/app/pages/forms/appeal/appeal.component.html
+++ b/frontend/src/app/pages/forms/appeal/appeal.component.html
@@ -130,7 +130,7 @@
                       }
                     </mat-form-field>
                   </div>
-                  <button mat-raised-button (click)="onSubmit()" [disabled]="form.invalid">
+                  <button mat-raised-button (click)="onSubmit()" [disabled]="formSubmitting || form.invalid">
                     Submit Appeal
                   </button>
                 </section>
diff --git a/frontend/src/app/pages/forms/appeal/appeal.component.ts b/frontend/src/app/pages/forms/appeal/appeal.component.ts
index 8a429b1..f9959b0 100644
--- a/frontend/src/app/pages/forms/appeal/appeal.component.ts
+++ b/frontend/src/app/pages/forms/appeal/appeal.component.ts
@@ -15,6 +15,7 @@ import {MatDialog} from '@angular/material/dialog';
 import {VerifyMailDialogComponent} from '@pages/forms/verify-mail-dialog/verify-mail-dialog.component';
 import {Router} from '@angular/router';
 import {FullSizeComponent} from '@shared-components/full-size/full-size.component';
+import {finalize} from 'rxjs';
 
 @Component({
   selector: 'app-appeal',
@@ -118,7 +119,12 @@ export class AppealComponent implements OnInit, OnDestroy {
 
   private router = inject(Router)
 
+  protected formSubmitting: boolean = false;
+
   private sendForm() {
+    if (this.formSubmitting) {
+      return;
+    }
     const rawValue = this.form.getRawValue();
     const uuid = this.authService.getUuid();
     if (uuid === null) {
@@ -132,14 +138,18 @@ export class AppealComponent implements OnInit, OnDestroy {
       username: this.authService.username()!,
       uuid: uuid
     }
-    this.appealsService.submitMinecraftAppeal(appeal).subscribe((result) => {
-      if (!result.verified_mail) {
-        throw new Error('Mail not verified');
-      }
-      this.router.navigate(['/forms/sent'], {
-        state: {message: result.message}
-      }).then();
-    })
+    this.appealsService.submitMinecraftAppeal(appeal)
+      .pipe(
+        finalize(() => this.formSubmitting = false)
+      )
+      .subscribe((result) => {
+        if (!result.verified_mail) {
+          throw new Error('Mail not verified');
+        }
+        this.router.navigate(['/forms/sent'], {
+          state: {message: result.message}
+        }).then();
+      })
   }
 
   public currentPageIndex: number = 0;