mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-26 12:27:06 +00:00 
			
		
		
		
	Remove jQuery from the repo commit functions (#29230)
- 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   --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: silverwind <me@silverwind.io>
This commit is contained in:
		| @@ -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', | ||||||
|     }); |     }); | ||||||
|   }); |   } | ||||||
| } | } | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 Yarden Shoham
					Yarden Shoham