Add prevention for duplicate form submissions

Author: kerwin612

templates/repo/pulls/fork.tmpl

@@ -6,7 +6,7 @@
 		</h3>
 		<div class="ui attached segment">
 			{{template "base/alert" .}}
-			<form class="ui form left-right-form" action="{{.Link}}" method="post">
+			<form class="ui form left-right-form" action="{{.Link}}" method="post" data-prevent-duplicate>
 				{{.CsrfTokenHtml}}
 				<div class="inline required field {{if .Err_Owner}}error{{end}}">
 					<label>{{ctx.Locale.Tr "repo.owner"}}</label>
@@ -75,7 +75,7 @@
 
 				<div class="inline field">
 					<label></label>
-					<button class="ui primary button{{if not .CanForkRepoInNewOwner}} disabled{{end}}">
+					<button class="ui primary button{{if not .CanForkRepoInNewOwner}} disabled{{end}}" type="submit">
 						{{ctx.Locale.Tr "repo.fork_repo"}}
 					</button>
 				</div>

web_src/js/index.ts

@@ -65,6 +65,7 @@ import {initGlobalButtonClickOnEnter, initGlobalButtons, initGlobalDeleteButton}
 import {initGlobalComboMarkdownEditor, initGlobalEnterQuickSubmit, initGlobalFormDirtyLeaveConfirm} from './features/common-form.ts';
 import {callInitFunctions} from './modules/init.ts';
 import {initRepoViewFileTree} from './features/repo-view-file-tree.ts';
+import {initFormSubmitHandlers} from './modules/form.ts';
 
 initGiteaFomantic();
 initSubmitEventPolyfill();
@@ -85,6 +86,7 @@ onDomReady(() => {
     initGlobalComboMarkdownEditor,
     initGlobalDeleteButton,
     initGlobalInput,
+    initFormSubmitHandlers,
 
     initCommonOrganization,
     initCommonIssueListQuickGoto,

web_src/js/modules/form.ts

@@ -0,0 +1,30 @@
+/**
+ * Form handling utilities
+ */
+
+import {addDelegatedEventListener} from '../utils/dom.ts';
+
+/**
+ * Prevent duplicate form submission
+ * @param form The form element
+ * @param submitter The submit button element
+ */
+function preventDuplicateSubmit(form: HTMLFormElement, submitter: HTMLElement) {
+  form.addEventListener('submit', () => {
+    submitter.classList.add('disabled');
+    submitter.setAttribute('disabled', 'disabled');
+  });
+}
+
+/**
+ * Initialize form submit handlers
+ */
+export function initFormSubmitHandlers() {
+  // Add delegated event listener for forms with data-prevent-duplicate attribute
+  addDelegatedEventListener(document, 'submit', 'form[data-prevent-duplicate]', (form: HTMLFormElement) => {
+    const submitter = form.querySelector<HTMLElement>('button[type="submit"]');
+    if (submitter) {
+      preventDuplicateSubmit(form, submitter);
+    }
+  });
+}