Mirrors/gitea
0
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2026-05-10 09:41:52 +02:00
Code Issues Activity

Merge 200633ad8e0d427f828886f4982003c0f044b034 into ce089f498bce32305b2d9e8c6adfd8cb7c82f88f

Browse Source
This commit is contained in:
silverwind 2026-05-09 17:33:36 +08:00 committed by GitHub
commit bda8081610
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
13 changed files with 190 additions and 1662 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
templates/admin/badge/users.tmpl
View File

@ -4,8 +4,8 @@
{{.Title}}
</h4>
<div class="ui attached segment">
<form class="ui form" action="{{.Link}}" method="post">
<div id="search-user-box" class="ui search input tw-align-middle">
<form class="ui form flex-text-block" action="{{.Link}}" method="post">
<div id="search-user-box" class="ui search input">
<input class="prompt" name="user" placeholder="{{ctx.Locale.Tr "search.user_kind"}}" autocomplete="off" autofocus required>
</div>
<button class="ui primary button">{{ctx.Locale.Tr "admin.badges.add_user"}}</button>

4
templates/repo/settings/actions_general.tmpl
View File

@ -86,8 +86,8 @@
</div>
{{end}}
<div class="ui bottom attached segment">
<form class="ui form form-fetch-action" action="{{.Link}}/collaborative_owner/add" method="post">
<div id="search-user-box" class="ui search input tw-align-middle" data-include-orgs="true">
<form class="ui form form-fetch-action flex-text-block" action="{{.Link}}/collaborative_owner/add" method="post">
<div id="search-user-box" class="ui search input" data-include-orgs="true">
<input class="prompt" name="collaborative_owner" placeholder="{{ctx.Locale.Tr "search.user_kind"}}" autocomplete="off" autofocus required>
</div>
<button class="ui primary button">{{ctx.Locale.Tr "actions.general.add_collaborative_owner"}}</button>

8
templates/repo/settings/collaboration.tmpl
View File

@ -39,8 +39,8 @@
</div>
{{end}}
<div class="ui bottom attached segment">
<form class="ui form" id="repo-collab-form" action="{{.Link}}" method="post">
<div id="search-user-box" class="ui search input tw-align-middle">
<form class="ui form flex-text-block" id="repo-collab-form" action="{{.Link}}" method="post">
<div id="search-user-box" class="ui search input">
<input class="prompt" name="collaborator" placeholder="{{ctx.Locale.Tr "search.user_kind"}}" autocomplete="off" autofocus required>
</div>
<button class="ui primary button">{{ctx.Locale.Tr "repo.settings.add_collaborator"}}</button>
@ -106,8 +106,8 @@
{{end}}
<div class="ui bottom attached segment">
{{if $allowedToChangeTeams}}
<form class="ui form" id="repo-collab-team-form" action="{{.Link}}/team" method="post">
<div id="search-team-box" class="ui search input tw-align-middle" data-org-name="{{.OrgName}}">
<form class="ui form flex-text-block" id="repo-collab-team-form" action="{{.Link}}/team" method="post">
<div id="search-team-box" class="ui search input" data-org-name="{{.OrgName}}">
<input class="prompt" name="team" placeholder="{{ctx.Locale.Tr "search.team_kind"}}" autocomplete="off" required>
</div>
<button class="ui primary button">{{ctx.Locale.Tr "repo.settings.add_team"}}</button>

24
tests/e2e/repo-collab.test.ts Normal file
View File

@ -0,0 +1,24 @@
import {env} from 'node:process';
import {test, expect} from '@playwright/test';
import {apiCreateRepo, apiCreateUser, login, randomString} from './utils.ts';
test('add collaborator search', async ({page, request}) => {
const userName = `repo-collab-${randomString(8)}`;
const repoName = `repo-collab-${randomString(8)}`;
await Promise.all([
apiCreateUser(request, userName),
apiCreateRepo(request, {name: repoName, autoInit: false}),
login(page),
]);
await page.goto(`/${env.GITEA_TEST_E2E_USER}/${repoName}/settings/collaboration`);
const input = page.locator('#search-user-box input.prompt');
await input.fill(userName.slice(-6));
const result = page.locator('#search-user-box .results .result').first();
await expect(result).toContainText(userName);
await result.click();
await expect(input).toHaveValue(userName);
await page.getByRole('button', {name: 'Add Collaborator'}).click();
await expect(page.locator('body')).toContainText(userName);
});

1565
web_src/fomantic/build/components/search.js
View File

File diff suppressed because it is too large Load Diff

1
web_src/fomantic/build/fomantic.js
View File

@ -1,6 +1,5 @@
import './components/api.js';
import './components/dropdown.js';
import './components/modal.js';
import './components/search.js';
// Hard-forked from Fomantic UI 2.8.7, patches are commented with "GITEA-PATCH"

1
web_src/fomantic/theme.config.less
View File

@ -44,7 +44,6 @@
@progress : 'default';
@slider : 'default';
@rating : 'default';
@search : 'default';
@shape : 'default';
@sidebar : 'default';
@sticky : 'default';

4
web_src/js/features/common-fetch-action.ts
View File

@ -1,7 +1,7 @@
import {GET, request} from '../modules/fetch.ts';
import {hideToastsAll, showErrorToast} from '../modules/toast.ts';
import {addDelegatedEventListener, createElementFromHTML} from '../utils/dom.ts';
import {errorMessage} from '../modules/errors.ts';
import {errorMessage, errorName} from '../modules/errors.ts';
import {confirmModal, createConfirmModal} from './comp/ConfirmModal.ts';
import {ignoreAreYouSure} from '../vendor/jquery.are-you-sure.ts';
import {registerGlobalSelectorFunc} from '../modules/observer.ts';
@ -138,7 +138,7 @@ async function performActionRequest(el: HTMLElement, opt: FetchActionOpts) {
}
await handleFetchActionError(resp);
} catch (err) {
if ((err as Error).name !== 'AbortError') {
if (errorName(err) !== 'AbortError') {
console.error(`Fetch action request error:`, err);
showErrorToast(`Error: ${errorMessage(err)}`);
}

31
web_src/js/features/comp/SearchRepoBox.ts
View File

@ -1,31 +1,16 @@
import {fomanticQuery} from '../../modules/fomantic/base.ts';
import {htmlEscape} from '../../utils/html.ts';
import {attachSearchBox} from '../../modules/search.ts';
const {appSubUrl} = window.config;
type RepoSearchResponse = {data: Array<{repository: {full_name: string}}>};
export function initCompSearchRepoBox(el: HTMLElement) {
const uid = el.getAttribute('data-uid');
const exclusive = el.getAttribute('data-exclusive');
let url = `${appSubUrl}/repo/search?q={query}&uid=${uid}`;
if (exclusive === 'true') {
url += `&exclusive=true`;
}
fomanticQuery(el).search({
minCharacters: 2,
apiSettings: {
url,
onResponse(response: any) {
const items = [];
for (const item of response.data) {
items.push({
title: htmlEscape(item.repository.full_name.split('/')[1]),
description: htmlEscape(item.repository.full_name),
});
}
return {results: items};
},
},
searchFields: ['full_name'],
showNoResults: false,
});
if (exclusive === 'true') url += `&exclusive=true`;
attachSearchBox(el, url, (response: RepoSearchResponse) => response.data.map((item) => ({
title: item.repository.full_name.split('/')[1],
description: item.repository.full_name,
})));
}

61
web_src/js/features/comp/SearchUserBox.ts
View File

@ -1,49 +1,30 @@
import {htmlEscape} from '../../utils/html.ts';
import {fomanticQuery} from '../../modules/fomantic/base.ts';
import {attachSearchBox, type SearchResult} from '../../modules/search.ts';
const {appSubUrl} = window.config;
const looksLikeEmailAddressCheck = /^\S+@\S+$/;
type UserSearchResponse = {data: Array<{login: string; avatar_url: string; full_name: string}>};
export function initCompSearchUserBox() {
const searchUserBox = document.querySelector('#search-user-box');
if (!searchUserBox) return;
const box = document.querySelector<HTMLElement>('#search-user-box');
if (!box) return;
const allowEmailInput = searchUserBox.getAttribute('data-allow-email') === 'true';
const allowEmailDescription = searchUserBox.getAttribute('data-allow-email-description') ?? undefined;
const includeOrgs = searchUserBox.getAttribute('data-include-orgs') === 'true';
fomanticQuery(searchUserBox).search({
minCharacters: 2,
apiSettings: {
url: `${appSubUrl}/user/search_candidates?q={query}&orgs=${includeOrgs}`,
onResponse(response: any) {
const resultItems = [];
const searchQuery = searchUserBox.querySelector('input')!.value;
const searchQueryUppercase = searchQuery.toUpperCase();
for (const item of response.data) {
const resultItem = {
title: item.login,
image: item.avatar_url,
description: htmlEscape(item.full_name),
};
if (searchQueryUppercase === item.login.toUpperCase()) {
resultItems.unshift(resultItem); // add the exact match to the top
} else {
resultItems.push(resultItem);
}
}
const allowEmailInput = box.getAttribute('data-allow-email') === 'true';
const allowEmailDescription = box.getAttribute('data-allow-email-description') ?? undefined;
const includeOrgs = box.getAttribute('data-include-orgs') === 'true';
const url = `${appSubUrl}/user/search_candidates?q={query}&orgs=${includeOrgs}`;
if (allowEmailInput && !resultItems.length && looksLikeEmailAddressCheck.test(searchQuery)) {
const resultItem = {
title: searchQuery,
description: allowEmailDescription,
};
resultItems.push(resultItem);
}
return {results: resultItems};
},
},
searchFields: ['login', 'full_name'],
showNoResults: false,
attachSearchBox(box, url, (response: UserSearchResponse, query) => {
const items: SearchResult[] = [];
const queryUpper = query.toUpperCase();
for (const item of response.data) {
const result: SearchResult = {title: item.login, image: item.avatar_url, description: item.full_name};
if (queryUpper === item.login.toUpperCase()) items.unshift(result); // exact match floats to top
else items.push(result);
}
if (allowEmailInput && !items.length && looksLikeEmailAddressCheck.test(query)) {
items.push({title: query, description: allowEmailDescription});
}
return items;
});
}

33
web_src/js/features/repo-settings.ts
View File

@ -3,6 +3,7 @@ import {onInputDebounce, queryElems, toggleElem} from '../utils/dom.ts';
import {POST} from '../modules/fetch.ts';
import {initRepoSettingsBranchesDrag} from './repo-settings-branches.ts';
import {fomanticQuery} from '../modules/fomantic/base.ts';
import {attachSearchBox} from '../modules/search.ts';
import {globMatch} from '../utils/glob.ts';
const {appSubUrl} = window.config;
@ -45,29 +46,17 @@ function initRepoSettingsCollaboration() {
}
}
function initRepoSettingsSearchTeamBox() {
const searchTeamBox = document.querySelector('#search-team-box');
if (!searchTeamBox) return;
type TeamSearchResponse = {data: Array<{name: string; permission: string}>};
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}`,
onResponse(response: any) {
const items: Array<Record<string, any>> = [];
for (const item of response.data) {
items.push({
title: item.name,
description: `${item.permission} access`, // TODO: translate this string
});
}
return {results: items};
},
},
});
function initRepoSettingsSearchTeamBox() {
const box = document.querySelector<HTMLElement>('#search-team-box');
if (!box) return;
const url = `${appSubUrl}/org/${box.getAttribute('data-org-name')}/teams/-/search?q={query}`;
attachSearchBox(box, url, (response: TeamSearchResponse) => response.data.map((item) => ({
title: item.name,
description: `${item.permission} access`, // TODO: translate this string
})));
}
function initRepoSettingsGitHook() {

6
web_src/js/modules/errors.ts
View File

@ -2,10 +2,16 @@
import {html} from '../utils/html.ts';
import type {Intent} from '../types.ts';
/** Extract a message string from an unknown caught value. */
export function errorMessage(err: unknown): string {
return (err as Error)?.message || String(err);
}
/** Extract a name string from an unknown caught value. */
export function errorName(err: unknown): string {
return (err as Error)?.name ?? '';
}
export function showGlobalErrorMessage(msg: string, msgType: Intent = 'error', details?: string) {
const parentContainer = document.querySelector('.page-content') ?? document.body;
if (!parentContainer) {

110
web_src/js/modules/search.ts Normal file
View File

@ -0,0 +1,110 @@
import {debounce} from 'throttle-debounce';
import {GET} from './fetch.ts';
import {errorName} from './errors.ts';
import {html, htmlRaw} from '../utils/html.ts';
import {urlQueryEscape} from '../utils/url.ts';
export type SearchResult = {
title: string;
description?: string;
image?: string;
};
function buildResultHTML(result: SearchResult): string {
const img = result.image ? html`<div class="image"><img src="${result.image}" alt=""></div>` : '';
const desc = result.description ? html`<div class="description">${result.description}</div>` : '';
return html`${htmlRaw(img)}<div class="content"><div class="title">${result.title}</div>${htmlRaw(desc)}</div>`;
}
function buildResultElement(result: SearchResult): HTMLElement {
const item = document.createElement('div');
item.className = 'result';
item.innerHTML = buildResultHTML(result);
return item;
}
/** Attach an API-driven autocomplete to `container`. `parse` maps the raw JSON response into the rendered result list. The selected result's title is written to the input on selection. */
export function attachSearchBox<T = unknown>(container: HTMLElement, url: string, parse: (raw: T, query: string) => SearchResult[], {minCharacters = 2}: {minCharacters?: number} = {}): void {
const input = container.querySelector<HTMLInputElement>('input.prompt') ?? container.querySelector<HTMLInputElement>('input');
if (!input) return;
let resultsEl = container.querySelector<HTMLElement>(':scope > .results');
if (!resultsEl) {
resultsEl = document.createElement('div');
resultsEl.className = 'results';
container.append(resultsEl);
}
const itemResults = new Map<HTMLElement, SearchResult>();
let fetchController: AbortController | null = null;
let search: ReturnType<typeof debounce<(query: string) => Promise<void>>> | null = null;
const hide = () => {
search?.cancel();
fetchController?.abort();
resultsEl.style.display = 'none';
resultsEl.replaceChildren();
itemResults.clear();
};
const render = (results: SearchResult[]) => {
if (!results.length) return hide();
itemResults.clear();
resultsEl.replaceChildren(...results.map((result) => {
const item = buildResultElement(result);
itemResults.set(item, result);
return item;
}));
resultsEl.style.display = 'block';
};
const select = (item: HTMLElement) => {
input.value = itemResults.get(item)!.title;
input.dispatchEvent(new Event('change', {bubbles: true}));
hide();
};
search = debounce(200, async (query: string) => {
fetchController?.abort();
if (query.length < minCharacters) return hide();
const ctrl = (fetchController = new AbortController());
try {
const response = await GET(url.replaceAll('{query}', urlQueryEscape(query)), {signal: ctrl.signal});
if (!response.ok) return hide();
const results = parse(await response.json(), query);
// only render if the fetch wasn't aborted (e.g. by hide()) and the input still matches
if (!ctrl.signal.aborted && input.value === query) render(results);
} catch (err) {
if (errorName(err) !== 'AbortError') hide();
}
});
input.addEventListener('input', () => search(input.value));
input.addEventListener('focus', () => { if (itemResults.size) resultsEl.style.display = 'block'; });
input.addEventListener('blur', () => setTimeout(hide, 150)); // deferred so a result mousedown can land first
input.addEventListener('keydown', (event) => {
const resultEls = Array.from(resultsEl.querySelectorAll<HTMLElement>('.result'));
if (!resultEls.length) return;
const index = resultEls.findIndex((item) => item.classList.contains('active'));
if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
event.preventDefault();
resultEls[index]?.classList.remove('active');
const next = event.key === 'ArrowDown' ? (index + 1) % resultEls.length : index <= 0 ? resultEls.length - 1 : index - 1;
resultEls[next].classList.add('active');
} else if (event.key === 'Enter' && index >= 0) {
event.preventDefault();
select(resultEls[index]);
} else if (event.key === 'Escape') {
hide();
}
});
// mousedown fires before input blur so the selection registers before blur-hide kicks in
resultsEl.addEventListener('mousedown', (event) => {
const target = (event.target as HTMLElement).closest<HTMLElement>('.result');
if (!target) return;
event.preventDefault();
select(target);
});
document.addEventListener('click', (event) => {
if (!container.contains(event.target as Node)) hide();
});
}