diff options
author | wxiaoguang <wxiaoguang@gmail.com> | 2023-05-10 23:50:58 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-05-10 15:50:58 +0000 |
commit | 23ae939ef3ef03848038372de21490725855b5f9 (patch) | |
tree | faaf98dea14e8ac6fd0e60df67f0f94c8bee97d7 /web_src/js/features | |
parent | 54f399c4df7d3470fff570afc145cbec3f0dcd40 (diff) | |
download | gitea-23ae939ef3ef03848038372de21490725855b5f9.tar.gz gitea-23ae939ef3ef03848038372de21490725855b5f9.zip |
Improve "goto issue by number" button (#24577)
Follow #24479
![image](https://user-images.githubusercontent.com/2114189/236694114-c5cb42ff-456d-465a-bcb9-89ed5959d346.png)
![image](https://user-images.githubusercontent.com/2114189/236694119-052e689c-6264-4468-9ab3-0e5c97521bec.png)
![image](https://user-images.githubusercontent.com/2114189/236694139-f8940765-42ce-462d-b49e-50a416cc6f85.png)
![image](https://user-images.githubusercontent.com/2114189/236694154-6d8a000c-9ef3-4d07-af1c-59b0cf8f4d33.png)
![image](https://user-images.githubusercontent.com/2114189/236694166-3bc3e585-7955-44aa-af34-b33ae91e132f.png)
---------
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: Giteabot <teabot@gitea.io>
Diffstat (limited to 'web_src/js/features')
-rw-r--r-- | web_src/js/features/codeeditor.js | 4 | ||||
-rw-r--r-- | web_src/js/features/common-issue-list.js | 70 | ||||
-rw-r--r-- | web_src/js/features/common-issue-list.test.js | 17 | ||||
-rw-r--r-- | web_src/js/features/repo-issue.js | 29 |
4 files changed, 89 insertions, 31 deletions
diff --git a/web_src/js/features/codeeditor.js b/web_src/js/features/codeeditor.js index 3a925e08c1..76eeaa9898 100644 --- a/web_src/js/features/codeeditor.js +++ b/web_src/js/features/codeeditor.js @@ -1,5 +1,5 @@ import {basename, extname, isObject, isDarkTheme} from '../utils.js'; -import {debounce} from 'throttle-debounce'; +import {onInputDebounce} from '../utils/dom.js'; const languagesByFilename = {}; const languagesByExt = {}; @@ -164,7 +164,7 @@ export async function createCodeEditor(textarea, filenameInput) { ...getEditorConfigOptions(editorConfig), }); - filenameInput.addEventListener('input', debounce(500, () => { + filenameInput.addEventListener('input', onInputDebounce(() => { const filename = filenameInput.value; const previewable = previewableExts.has(extname(filename)); togglePreviewDisplay(previewable); diff --git a/web_src/js/features/common-issue-list.js b/web_src/js/features/common-issue-list.js new file mode 100644 index 0000000000..ecada11988 --- /dev/null +++ b/web_src/js/features/common-issue-list.js @@ -0,0 +1,70 @@ +import $ from 'jquery'; +import {isElemHidden, onInputDebounce, toggleElem} from '../utils/dom.js'; +const {appSubUrl} = window.config; + +const reIssueIndex = /^(\d+)$/; // eg: "123" +const reIssueSharpIndex = /^#(\d+)$/; // eg: "#123" +const reIssueOwnerRepoIndex = /^([-.\w]+)\/([-.\w]+)#(\d+)$/; // eg: "{owner}/{repo}#{index}" + +// if the searchText can be parsed to an "issue goto link", return the link, otherwise return empty string +export function parseIssueListQuickGotoLink(repoLink, searchText) { + searchText = searchText.trim(); + let targetUrl = ''; + if (repoLink) { + // try to parse it in current repo + if (reIssueIndex.test(searchText)) { + targetUrl = `${repoLink}/issues/${searchText}`; + } else if (reIssueSharpIndex.test(searchText)) { + targetUrl = `${repoLink}/issues/${searchText.substr(1)}`; + } + } else { + // try to parse it for a global search (eg: "owner/repo#123") + const matchIssueOwnerRepoIndex = searchText.match(reIssueOwnerRepoIndex); + if (matchIssueOwnerRepoIndex) { + const [_, owner, repo, index] = matchIssueOwnerRepoIndex; + targetUrl = `${appSubUrl}/${owner}/${repo}/issues/${index}`; + } + } + return targetUrl; +} + +export function initCommonIssueListQuickGoto() { + const $goto = $('#issue-list-quick-goto'); + if (!$goto.length) return; + + const $form = $goto.closest('form'); + const $input = $form.find('input[name=q]'); + const repoLink = $goto.attr('data-repo-link'); + + $form.on('submit', (e) => { + // if there is no goto button, or the form is submitted by non-quick-goto elements, submit the form directly + let doQuickGoto = !isElemHidden($goto); + const submitter = e.originalEvent.submitter; + if (submitter !== $form[0] && submitter !== $input[0] && submitter !== $goto[0]) doQuickGoto = false; + if (!doQuickGoto) return; + + // if there is a goto button, use its link + e.preventDefault(); + window.location.href = $goto.attr('data-issue-goto-link'); + }); + + const onInput = async () => { + const searchText = $input.val(); + + // try to check whether the parsed goto link is valid + let targetUrl = parseIssueListQuickGotoLink(repoLink, searchText); + if (targetUrl) { + const res = await fetch(`${targetUrl}/info`); + if (res.status !== 200) targetUrl = ''; + } + + // if the input value has changed, then ignore the result + if ($input.val() !== searchText) return; + + toggleElem($goto, Boolean(targetUrl)); + $goto.attr('data-issue-goto-link', targetUrl); + }; + + $input.on('input', onInputDebounce(onInput)); + onInput(); +} diff --git a/web_src/js/features/common-issue-list.test.js b/web_src/js/features/common-issue-list.test.js new file mode 100644 index 0000000000..271acc718a --- /dev/null +++ b/web_src/js/features/common-issue-list.test.js @@ -0,0 +1,17 @@ +import {test, expect} from 'vitest'; +import {parseIssueListQuickGotoLink} from './common-issue-list.js'; + +test('parseIssueListQuickGotoLink', () => { + expect(parseIssueListQuickGotoLink('/link', '')).toEqual(''); + expect(parseIssueListQuickGotoLink('/link', 'abc')).toEqual(''); + expect(parseIssueListQuickGotoLink('/link', '123')).toEqual('/link/issues/123'); + expect(parseIssueListQuickGotoLink('/link', '#123')).toEqual('/link/issues/123'); + expect(parseIssueListQuickGotoLink('/link', 'owner/repo#123')).toEqual(''); + + expect(parseIssueListQuickGotoLink('', '')).toEqual(''); + expect(parseIssueListQuickGotoLink('', 'abc')).toEqual(''); + expect(parseIssueListQuickGotoLink('', '123')).toEqual(''); + expect(parseIssueListQuickGotoLink('', '#123')).toEqual(''); + expect(parseIssueListQuickGotoLink('', 'owner/repo#')).toEqual(''); + expect(parseIssueListQuickGotoLink('', 'owner/repo#123')).toEqual('/owner/repo/issues/123'); +}); diff --git a/web_src/js/features/repo-issue.js b/web_src/js/features/repo-issue.js index 8ecc7aa4ca..d2942cd933 100644 --- a/web_src/js/features/repo-issue.js +++ b/web_src/js/features/repo-issue.js @@ -4,7 +4,6 @@ import {showTemporaryTooltip, createTippy} from '../modules/tippy.js'; import {hideElem, showElem, toggleElem} from '../utils/dom.js'; import {setFileFolding} from './file-fold.js'; import {getComboMarkdownEditor, initComboMarkdownEditor} from './comp/ComboMarkdownEditor.js'; -import {parseIssueHref} from '../utils.js'; const {appSubUrl, csrfToken} = window.config; @@ -638,34 +637,6 @@ export function initRepoIssueBranchSelect() { $('#branch-select > .item').on('click', changeBranchSelect); } -export function initRepoIssueGotoID() { - const issueidre = /^(?:\w+\/\w+#\d+|#\d+|\d+)$/; - const isGlobalIssuesArea = $('.repo.name.item').length > 0; // for global issues area or repository issues area - $('form.list-header-search').on('submit', (e) => { - const qval = e.target.q.value; - const aElm = document.activeElement; - if (!$('#hashtag-button').length || aElm.id === 'search-button' || (aElm.name === 'q' && !qval.includes('#')) || (isGlobalIssuesArea && !qval.includes('/')) || !issueidre.test(qval)) return; - const pathname = window.location.pathname; - let gotoUrl = qval.includes('/') ? `${qval.replace('#', '/issues/')}` : `${pathname}/${qval.replace('#', '')}`; - if (appSubUrl.length) { - gotoUrl = qval.includes('/') ? `/${appSubUrl}/${qval.replace('#', '/issues/')}` : `/${appSubUrl}/${pathname}/${qval.replace('#', '')}`; - } - const {owner, repo, type, index} = parseIssueHref(gotoUrl); - if (owner && repo && type && index) { - e.preventDefault(); - window.location.href = gotoUrl; - } - }); - $('form.list-header-search input[name=q]').on('input', (e) => { - const qval = e.target.value; - if (isGlobalIssuesArea && qval.includes('/') && issueidre.test(qval) || !isGlobalIssuesArea && issueidre.test(qval)) { - showElem($('#hashtag-button')); - } else { - hideElem($('#hashtag-button')); - } - }); -} - export function initSingleCommentEditor($commentForm) { // pages: // * normal new issue/pr page, no status-button |