mirror of
				https://gitee.com/gitea/gitea
				synced 2025-11-04 16:40:24 +08:00 
			
		
		
		
	Remove customized (unmaintained) dropdown, improve aria a11y for dropdown (#19861)
* Remove customized (unmaintained) dropdown, improve aria a11y for dropdown * fix repo permission * use action instead of onChange * re-order the CSS selector * fix dropdown behavior for repo permissions, make elements inside menu item non-focusable * use menu/menuitem instead of combobox/option. use tooltip(data-content) for aria-label, prevent from repeated attaching * click menu item when pressing Enter * code format * fix repo permission * repo setting: prevent from misleading users when error occurs * fine tune the repo collaboration access mode dropdown (in case the access mode is undefined in the template) Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
		@@ -6,12 +6,37 @@ const {appSubUrl, csrfToken} = window.config;
 | 
			
		||||
 | 
			
		||||
export function initRepoSettingsCollaboration() {
 | 
			
		||||
  // Change collaborator access mode
 | 
			
		||||
  $('.access-mode.menu .item').on('click', function () {
 | 
			
		||||
    const $menu = $(this).parent();
 | 
			
		||||
    $.post($menu.data('url'), {
 | 
			
		||||
      _csrf: csrfToken,
 | 
			
		||||
      uid: $menu.data('uid'),
 | 
			
		||||
      mode: $(this).data('value')
 | 
			
		||||
  $('.page-content.repository .ui.dropdown.access-mode').each((_, e) => {
 | 
			
		||||
    const $dropdown = $(e);
 | 
			
		||||
    const $text = $dropdown.find('> .text');
 | 
			
		||||
    $dropdown.dropdown({
 | 
			
		||||
      action(_text, value) {
 | 
			
		||||
        const lastValue = $dropdown.attr('data-last-value');
 | 
			
		||||
        $.post($dropdown.attr('data-url'), {
 | 
			
		||||
          _csrf: csrfToken,
 | 
			
		||||
          uid: $dropdown.attr('data-uid'),
 | 
			
		||||
          mode: value,
 | 
			
		||||
        }).fail(() => {
 | 
			
		||||
          $text.text('(error)'); // prevent from misleading users when error occurs
 | 
			
		||||
          $dropdown.attr('data-last-value', lastValue);
 | 
			
		||||
        });
 | 
			
		||||
        $dropdown.attr('data-last-value', value);
 | 
			
		||||
        $dropdown.dropdown('hide');
 | 
			
		||||
      },
 | 
			
		||||
      onChange(_value, text, _$choice) {
 | 
			
		||||
        $text.text(text); // update the text when using keyboard navigating
 | 
			
		||||
      },
 | 
			
		||||
      onHide() {
 | 
			
		||||
        // 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 = $dropdown.dropdown('get item', $dropdown.attr('data-last-value'));
 | 
			
		||||
          if ($item) {
 | 
			
		||||
            $dropdown.dropdown('set selected', $dropdown.attr('data-last-value'));
 | 
			
		||||
          } else {
 | 
			
		||||
            $text.text('(N/A)'); // prevent from misleading users when the access mode is undefined
 | 
			
		||||
          }
 | 
			
		||||
        }, 0);
 | 
			
		||||
      }
 | 
			
		||||
    });
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user