add 'select/deselect all' buttons for custom events in webhooks

Author: TimurRin

options/locale/locale_en-US.ini

@@ -2382,6 +2382,8 @@ settings.event_desc = Trigger On:
 settings.event_push_only = Push Events
 settings.event_send_everything = All Events
 settings.event_choose = Custom Events…
+settings.event_button_select_all = Select All
+settings.event_button_deselect_all = Deselect All
 settings.event_header_repository = Repository Events
 settings.event_create = Create
 settings.event_create_desc = Branch or tag created.

templates/repo/settings/webhook/settings.tmpl

@@ -80,6 +80,16 @@
 	</div>
 
 	<div class="events fields ui grid {{if not .Webhook.ChooseEvents}}tw-hidden{{end}}">
+		<div class="fourteen wide column">
+			<div class="field">
+				<button type="button" class="ui tiny button" id="event-select-all">
+					{{ctx.Locale.Tr "repo.settings.event_button_select_all"}}
+				</button>
+				<button type="button" class="ui tiny button" id="event-deselect-all">
+					{{ctx.Locale.Tr "repo.settings.event_button_deselect_all"}}
+				</button>
+			</div>
+		</div>
 		<!-- Repository Events -->
 		<div class="fourteen wide column">
 			<label>{{ctx.Locale.Tr "repo.settings.event_header_repository"}}</label>
@@ -354,3 +364,20 @@
 		>{{ctx.Locale.Tr "repo.settings.delete_webhook"}}</a>
 	{{end}}
 </div>
+
+<script>
+	(function () {
+		const section = document.querySelector('.events.fields.ui.grid');
+		if (!section) return;
+
+		const all = section.querySelectorAll('input[type="checkbox"]');
+
+		document.getElementById('event-select-all')?.addEventListener('click', () => {
+			all.forEach(i => { i.checked = true; });
+		});
+
+		document.getElementById('event-deselect-all')?.addEventListener('click', () => {
+			all.forEach(i => { i.checked = false; });
+		});
+	})();
+</script>