Refactor repo-settings.ts (#33785)

and remove jQuery
pull/33784/head
wxiaoguang 1 week ago committed by GitHub
parent 163bbca0eb
commit ca0ce003ab
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -1,10 +1,10 @@
import $ from 'jquery';
import {minimatch} from 'minimatch';
import {createMonaco} from './codeeditor.ts';
import {onInputDebounce, queryElems, toggleElem} from '../utils/dom.ts';
import {POST} from '../modules/fetch.ts';
import {initAvatarUploaderWithCropper} from './comp/Cropper.ts';
import {initRepoSettingsBranchesDrag} from './repo-settings-branches.ts';
import {fomanticQuery} from '../modules/fomantic/base.ts';
const {appSubUrl, csrfToken} = window.config;
@ -12,11 +12,12 @@ function initRepoSettingsCollaboration() {
// Change collaborator access mode
for (const dropdownEl of queryElems(document, '.page-content.repository .ui.dropdown.access-mode')) {
const textEl = dropdownEl.querySelector(':scope > .text');
$(dropdownEl).dropdown({
const $dropdown = fomanticQuery(dropdownEl);
$dropdown.dropdown({
async action(text: string, value: string) {
dropdownEl.classList.add('is-loading', 'loading-icon-2px');
const lastValue = dropdownEl.getAttribute('data-last-value');
$(dropdownEl).dropdown('hide');
$dropdown.dropdown('hide');
try {
const uid = dropdownEl.getAttribute('data-uid');
await POST(dropdownEl.getAttribute('data-url'), {data: new URLSearchParams({uid, 'mode': value})});
@ -33,9 +34,9 @@ function initRepoSettingsCollaboration() {
// set to the really selected value, defer to next tick to make sure `action` has finished
// its work because the calling order might be onHide -> action
setTimeout(() => {
const $item = $(dropdownEl).dropdown('get item', dropdownEl.getAttribute('data-last-value'));
const $item = $dropdown.dropdown('get item', dropdownEl.getAttribute('data-last-value'));
if ($item) {
$(dropdownEl).dropdown('set selected', dropdownEl.getAttribute('data-last-value'));
$dropdown.dropdown('set selected', dropdownEl.getAttribute('data-last-value'));
} else {
textEl.textContent = '(none)'; // prevent from misleading users when the access mode is undefined
}
@ -49,32 +50,32 @@ function initRepoSettingsSearchTeamBox() {
const searchTeamBox = document.querySelector('#search-team-box');
if (!searchTeamBox) return;
$(searchTeamBox).search({
fomanticQuery(searchTeamBox).search({
minCharacters: 2,
searchFields: ['name', 'description'],
showNoResults: false,
rawResponse: true,
apiSettings: {
url: `${appSubUrl}/org/${searchTeamBox.getAttribute('data-org-name')}/teams/-/search?q={query}`,
headers: {'X-Csrf-Token': csrfToken},
onResponse(response: any) {
const items: Array<Record<string, any>> = [];
$.each(response.data, (_i, item) => {
for (const item of response.data) {
items.push({
title: item.name,
description: `${item.permission} access`, // TODO: translate this string
});
});
}
return {results: items};
},
},
searchFields: ['name', 'description'],
showNoResults: false,
});
}
function initRepoSettingsGitHook() {
if (!$('.edit.githook').length) return;
if (!document.querySelector('.page-content.repository.settings.edit.githook')) return;
const filename = document.querySelector('.hook-filename').textContent;
createMonaco($('#content')[0] as HTMLTextAreaElement, filename, {language: 'shell'});
createMonaco(document.querySelector<HTMLTextAreaElement>('#content'), filename, {language: 'shell'});
}
function initRepoSettingsBranches() {
@ -121,32 +122,31 @@ function initRepoSettingsBranches() {
}
function initRepoSettingsOptions() {
if ($('.repository.settings.options').length > 0) {
// Enable or select internal/external wiki system and issue tracker.
$('.enable-system').on('change', function (this: HTMLInputElement) { // eslint-disable-line @typescript-eslint/no-deprecated
if (this.checked) {
$($(this).data('target')).removeClass('disabled');
if (!$(this).data('context')) $($(this).data('context')).addClass('disabled');
} else {
$($(this).data('target')).addClass('disabled');
if (!$(this).data('context')) $($(this).data('context')).removeClass('disabled');
}
});
$('.enable-system-radio').on('change', function (this: HTMLInputElement) { // eslint-disable-line @typescript-eslint/no-deprecated
if (this.value === 'false') {
$($(this).data('target')).addClass('disabled');
if ($(this).data('context') !== undefined) $($(this).data('context')).removeClass('disabled');
} else if (this.value === 'true') {
$($(this).data('target')).removeClass('disabled');
if ($(this).data('context') !== undefined) $($(this).data('context')).addClass('disabled');
}
});
const $trackerIssueStyleRadios = $('.js-tracker-issue-style');
$trackerIssueStyleRadios.on('change input', () => {
const checkedVal = $trackerIssueStyleRadios.filter(':checked').val();
$('#tracker-issue-style-regex-box').toggleClass('disabled', checkedVal !== 'regexp');
});
}
const pageContent = document.querySelector('.page-content.repository.settings.options');
if (!pageContent) return;
const toggleClass = (elems: NodeListOf<Element>, className: string, value: boolean) => {
for (const el of elems) el.classList.toggle(className, value);
};
// Enable or select internal/external wiki system and issue tracker.
queryElems<HTMLInputElement>(pageContent, '.enable-system', (el) => el.addEventListener('change', () => {
const elTargets = document.querySelectorAll(el.getAttribute('data-target'));
const elContexts = document.querySelectorAll(el.getAttribute('data-context'));
toggleClass(elTargets, 'disabled', !el.checked);
toggleClass(elContexts, 'disabled', el.checked);
}));
queryElems<HTMLInputElement>(pageContent, '.enable-system-radio', (el) => el.addEventListener('change', () => {
const elTargets = document.querySelectorAll(el.getAttribute('data-target'));
const elContexts = document.querySelectorAll(el.getAttribute('data-context'));
toggleClass(elTargets, 'disabled', el.value === 'false');
toggleClass(elContexts, 'disabled', el.value === 'true');
}));
queryElems<HTMLInputElement>(pageContent, '.js-tracker-issue-style', (el) => el.addEventListener('change', () => {
const checkedVal = el.value;
pageContent.querySelector('#tracker-issue-style-regex-box').classList.toggle('disabled', checkedVal !== 'regexp');
}));
}
export function initRepoSettings() {

Loading…
Cancel
Save