Gitea-John71/Gitea
2
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2026-10-04 06:44:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

enhance(webhook): add select all and deselect all buttons for custom events (#35980)

Browse Source 
Adds `Select All` and `Deselect All` buttons to the custom events
section of the webhook form. This is useful when you need all events but
one.

- The buttons toggle every event checkbox and keep the unsaved-changes
prompt working
- Fix the "Trigger On" radio spacing by removing a leftover Fomantic
checkbox margin

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Timur Moziev
2026-10-03 17:27:17 +03:00
committed by GitHub
parent ab1979bcfb
commit f65e01226a
8 changed files with 59 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web_src/js/features/comp/WebHookEditor.ts
+30 -26
View File
@@ -1,42 +1,46 @@
import {registerGlobalEventFunc, registerGlobalInitFunc} from '../../modules/observer.ts';
import {POST} from '../../modules/fetch.ts';
import {hideElem, showElem, toggleElem} from '../../utils/dom.ts';
import {queryElems, toggleElem} from '../../utils/dom.ts';
export function initCompWebHookEditor() {
if (!document.querySelectorAll('.new.webhook').length) {
return;
}
function initCompWebHookEditorForm(el: HTMLElement) {
const elCustomEvents = el.querySelector('.js-webhook-custom-events')!;
for (const input of document.querySelectorAll<HTMLInputElement>('.events.checkbox input')) {
input.addEventListener('change', function () {
if (this.checked) {
showElem('.events.fields');
}
// Trigger On: use custom events or not
queryElems<HTMLInputElement>(el, 'input[name=events]', (input) => input.addEventListener('change', () => {
if (!input.checked) return;
toggleElem(elCustomEvents, input.value === 'choose_events');
}));
// Select All / Deselect All custom events
queryElems(el, 'button[data-events-select-all]', (btn) => btn.addEventListener('click', () => {
const checked = btn.getAttribute('data-events-select-all') === 'true';
queryElems<HTMLInputElement>(elCustomEvents, 'input[type=checkbox]', (input) => {
input.checked = checked;
input.dispatchEvent(new Event('change', {bubbles: true})); // for the areYouSure dirty tracking
});
}
for (const input of document.querySelectorAll<HTMLInputElement>('.non-events.checkbox input')) {
input.addEventListener('change', function () {
if (this.checked) {
hideElem('.events.fields');
}
});
}
}));
// some webhooks (like Gitea) allow to set the request method (GET/POST), and it would toggle the "Content Type" field
const httpMethodInput = document.querySelector<HTMLInputElement>('#http_method');
const httpMethodInput = el.querySelector<HTMLInputElement>('#http_method');
if (httpMethodInput) {
const updateContentType = function () {
const updateContentType = () => {
const visible = httpMethodInput.value === 'POST';
toggleElem(document.querySelector('#content_type')!.closest('.field')!, visible);
toggleElem(el.querySelector('#content_type')!.closest('.field')!, visible);
};
updateContentType();
httpMethodInput.addEventListener('change', updateContentType);
}
}
// Test delivery
document.querySelector<HTMLButtonElement>('#test-delivery')?.addEventListener('click', async function () {
this.classList.add('is-loading', 'disabled');
await POST(this.getAttribute('data-link')!);
function initCompWebHookEditorHistory() {
registerGlobalEventFunc('click', 'onWebhookTestDeliveryClick', async (el) => {
el.classList.add('is-loading', 'disabled');
await POST(el.getAttribute('data-link')!);
setTimeout(() => window.location.reload(), 5000);
});
}
export function initCompWebHookEditor() {
registerGlobalInitFunc('initCompWebHookEditorForm', initCompWebHookEditorForm);
initCompWebHookEditorHistory();
}