mirror of
https://github.com/go-gitea/gitea
synced 2025-07-04 17:47:19 +00:00
Fix some dropdown problems on the issue sidebar (#34308)
Also fix #34300
This commit is contained in:
@ -1,6 +1,6 @@
|
||||
import {fomanticQuery} from '../modules/fomantic/base.ts';
|
||||
import {POST} from '../modules/fetch.ts';
|
||||
import {queryElemChildren, queryElems, toggleElem} from '../utils/dom.ts';
|
||||
import {addDelegatedEventListener, queryElemChildren, queryElems, toggleElem} from '../utils/dom.ts';
|
||||
|
||||
// if there are draft comments, confirm before reloading, to avoid losing comments
|
||||
function issueSidebarReloadConfirmDraftComment() {
|
||||
@ -22,7 +22,7 @@ function issueSidebarReloadConfirmDraftComment() {
|
||||
window.location.reload();
|
||||
}
|
||||
|
||||
class IssueSidebarComboList {
|
||||
export class IssueSidebarComboList {
|
||||
updateUrl: string;
|
||||
updateAlgo: string;
|
||||
selectionMode: string;
|
||||
@ -95,9 +95,7 @@ class IssueSidebarComboList {
|
||||
}
|
||||
}
|
||||
|
||||
async onItemClick(e: Event) {
|
||||
const elItem = (e.target as HTMLElement).closest('.item');
|
||||
if (!elItem) return;
|
||||
async onItemClick(elItem: HTMLElement, e: Event) {
|
||||
e.preventDefault();
|
||||
if (elItem.hasAttribute('data-can-change') && elItem.getAttribute('data-can-change') !== 'true') return;
|
||||
|
||||
@ -146,16 +144,13 @@ class IssueSidebarComboList {
|
||||
}
|
||||
this.initialValues = this.collectCheckedValues();
|
||||
|
||||
this.elDropdown.addEventListener('click', (e) => this.onItemClick(e));
|
||||
addDelegatedEventListener(this.elDropdown, 'click', '.item', (el, e) => this.onItemClick(el, e));
|
||||
|
||||
fomanticQuery(this.elDropdown).dropdown('setting', {
|
||||
action: 'nothing', // do not hide the menu if user presses Enter
|
||||
fullTextSearch: 'exact',
|
||||
hideDividers: 'empty',
|
||||
onHide: () => this.onHide(),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export function initIssueSidebarComboList(container: HTMLElement) {
|
||||
new IssueSidebarComboList(container).init();
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
import {POST} from '../modules/fetch.ts';
|
||||
import {queryElems, toggleElem} from '../utils/dom.ts';
|
||||
import {initIssueSidebarComboList} from './repo-issue-sidebar-combolist.ts';
|
||||
import {IssueSidebarComboList} from './repo-issue-sidebar-combolist.ts';
|
||||
|
||||
function initBranchSelector() {
|
||||
// TODO: RemoveIssueRef: see "repo/issue/branch_selector_field.tmpl"
|
||||
@ -48,5 +48,5 @@ export function initRepoIssueSidebar() {
|
||||
initRepoIssueDue();
|
||||
|
||||
// init the combo list: a dropdown for selecting items, and a list for showing selected items and related actions
|
||||
queryElems<HTMLElement>(document, '.issue-sidebar-combo', (el) => initIssueSidebarComboList(el));
|
||||
queryElems<HTMLElement>(document, '.issue-sidebar-combo', (el) => new IssueSidebarComboList(el).init());
|
||||
}
|
||||
|
@ -228,12 +228,13 @@ function attachDomEvents(dropdown: HTMLElement, focusable: HTMLElement, menu: HT
|
||||
dropdown.addEventListener('keydown', (e: KeyboardEvent) => {
|
||||
// here it must use keydown event before dropdown's keyup handler, otherwise there is no Enter event in our keyup handler
|
||||
if (e.key === 'Enter') {
|
||||
const dropdownCall = fomanticDropdownFn.bind($(dropdown));
|
||||
let $item = dropdownCall('get item', dropdownCall('get value'));
|
||||
if (!$item) $item = $(menu).find('> .item.selected'); // when dropdown filters items by input, there is no "value", so query the "selected" item
|
||||
const elItem = menu.querySelector<HTMLElement>(':scope > .item.selected, .menu > .item.selected');
|
||||
// if the selected item is clickable, then trigger the click event.
|
||||
// we can not click any item without check, because Fomantic code might also handle the Enter event. that would result in double click.
|
||||
if ($item?.[0]?.matches('a, .js-aria-clickable')) $item[0].click();
|
||||
if (elItem?.matches('a, .js-aria-clickable') && !elItem.matches('.tw-hidden, .filtered')) {
|
||||
e.preventDefault();
|
||||
elItem.click();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
Reference in New Issue
Block a user