fedi/forgejo
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2024-11-22 21:49:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove jQuery from the repo commit functions (#29230)

Browse source 
- Switched to plain JavaScript
- Tested the commit ellipsis button functionality and it works as before
- Tested the commits statuses tippy functionality and it works as before
- Tested the last commit loader functionality and it works as before

# Demo using JavaScript without jQuery

![action](https://github.com/go-gitea/gitea/assets/20454870/465516f8-0ff3-438c-a17e-26cbab82750b)

![action](https://github.com/go-gitea/gitea/assets/20454870/968da210-9382-4b50-a4c2-09419dc86e07)

---------

Signed-off-by: Yarden Shoham <git@yardenshoham.com>
Co-authored-by: silverwind <me@silverwind.io>
(cherry picked from commit eaede2de98fbe0ac2156c9f4cd8b5899d2c7cbbf)
This commit is contained in:
Yarden Shoham 2024-02-22 19:13:25 +02:00 committed by Earl Warren
parent 60447a7097
commit 6db296f1cb
No known key found for this signature in database
GPG key ID: 0579CB2928A78A00
1 changed files with 48 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

96
web_src/js/features/repo-commit.js
View file

@ -1,70 +1,70 @@
import $ from 'jquery';
import {createTippy} from '../modules/tippy.js'; import {createTippy} from '../modules/tippy.js';
import {toggleElem} from '../utils/dom.js'; import {toggleElem} from '../utils/dom.js';
import {parseDom} from '../utils.js';
const {csrfToken} = window.config; import {POST} from '../modules/fetch.js';
export function initRepoEllipsisButton() { export function initRepoEllipsisButton() {
$('.js-toggle-commit-body').on('click', function (e) { for (const button of document.querySelectorAll('.js-toggle-commit-body')) {
e.preventDefault(); button.addEventListener('click', function (e) {
const expanded = $(this).attr('aria-expanded') === 'true'; e.preventDefault();
toggleElem($(this).parent().find('.commit-body')); const expanded = this.getAttribute('aria-expanded') === 'true';
$(this).attr('aria-expanded', String(!expanded)); toggleElem(this.parentElement.querySelector('.commit-body'));
}); this.setAttribute('aria-expanded', String(!expanded));
});
}
} }
export function initRepoCommitLastCommitLoader() { export async function initRepoCommitLastCommitLoader() {
const notReadyEls = document.querySelectorAll('table#repo-files-table tr.notready');
if (!notReadyEls.length) return;
const entryMap = {}; const entryMap = {};
const entries = [];
for (const el of notReadyEls) {
const entryname = el.getAttribute('data-entryname');
entryMap[entryname] = $(el);
entries.push(entryname);
}
const lastCommitLoaderURL = $('table#repo-files-table').data('lastCommitLoaderUrl'); const entries = Array.from(document.querySelectorAll('table#repo-files-table tr.notready'), (el) => {
const entryName = el.getAttribute('data-entryname');
entryMap[entryName] = el;
return entryName;
});
if (entries.length > 200) { if (entries.length === 0) {
$.post(lastCommitLoaderURL, {
_csrf: csrfToken,
}, (data) => {
$('table#repo-files-table').replaceWith(data);
});
return; return;
} }
$.post(lastCommitLoaderURL, { const lastCommitLoaderURL = document.querySelector('table#repo-files-table').getAttribute('data-last-commit-loader-url');
_csrf: csrfToken,
'f': entries, if (entries.length > 200) {
}, (data) => { // For more than 200 entries, replace the entire table
$(data).find('tr').each((_, row) => { const response = await POST(lastCommitLoaderURL);
if (row.className === 'commit-list') { const data = await response.text();
$('table#repo-files-table .commit-list').replaceWith(row); document.querySelector('table#repo-files-table').outerHTML = data;
return; return;
} }
// there are other <tr> rows in response (eg: <tr class="has-parent">)
// at the moment only the "data-entryname" rows should be processed // For fewer entries, update individual rows
const entryName = $(row).attr('data-entryname'); const response = await POST(lastCommitLoaderURL, {data: {'f': entries}});
if (entryName) { const data = await response.text();
entryMap[entryName].replaceWith(row); const doc = parseDom(data, 'text/html');
} for (const row of doc.querySelectorAll('tr')) {
}); if (row.className === 'commit-list') {
}); document.querySelector('table#repo-files-table .commit-list')?.replaceWith(row);
continue;
}
// there are other <tr> rows in response (eg: <tr class="has-parent">)
// at the moment only the "data-entryname" rows should be processed
const entryName = row.getAttribute('data-entryname');
if (entryName) {
entryMap[entryName]?.replaceWith(row);
}
}
} }
export function initCommitStatuses() { export function initCommitStatuses() {
$('[data-tippy="commit-statuses"]').each(function () { for (const element of document.querySelectorAll('[data-tippy="commit-statuses"]')) {
const top = $('.repository.file.list').length > 0 || $('.repository.diff').length > 0; const top = document.querySelector('.repository.file.list') || document.querySelector('.repository.diff');
createTippy(this, { createTippy(element, {
content: this.nextElementSibling, content: element.nextElementSibling,
placement: top ? 'top-start' : 'bottom-start', placement: top ? 'top-start' : 'bottom-start',
interactive: true, interactive: true,
role: 'dialog', role: 'dialog',
theme: 'box-with-header', theme: 'box-with-header',
}); });
}); }
} }