Enhance icons of previously added items

If addPortletLink is called prior to setup.js only the last
link will be enhanced. To avoid this problem, check existing links
when registering the hook.

Bug: T240910
Change-Id: Ifd46b26401b8eb20686882577edf404a15eaf155
This commit is contained in:
jdlrobson 2021-09-23 15:44:49 -07:00 committed by Jdlrobson
parent 7565ce548a
commit e9e336a679
2 changed files with 37 additions and 5 deletions

View file

@ -3,14 +3,27 @@
* @return {Object} of arrays with mandatory class names for list item elements.
*/
function getClassesForItem( $item ) {
// eslint-disable-next-line no-jquery/no-class-state
var isToggleList = $item.parent().hasClass( 'toggle-list__list' );
var $parent = $item.parent(),
// eslint-disable-next-line no-jquery/no-class-state
isPageActionList = $parent.hasClass( 'page-actions-menu__list' ),
// eslint-disable-next-line no-jquery/no-class-state
isToggleList = $parent.hasClass( 'toggle-list__list' );
if ( isToggleList ) {
return {
li: [ 'toggle-list-item' ],
span: [ 'toggle-list-item__label' ],
a: [ 'toggle-list-item__anchor' ]
};
} else if ( isPageActionList ) {
return {
li: [ 'page-actions-menu__list-item' ],
span: [
'mw-ui-icon', 'mw-ui-icon-element',
'mw-ui-icon-with-label-desktop', 'mw-ui-button', 'mw-ui-quiet'
],
a: []
};
} else {
return {
li: [],
@ -39,19 +52,37 @@ function insertIcon( $link, id ) {
*/
function hookHandler( listItem, data ) {
var $item, $a, classes,
id = data.id || 'unknowngadget';
id = data.id;
if ( listItem ) {
if ( listItem && !listItem.dataset.minervaPortlet ) {
$item = $( listItem );
classes = getClassesForItem( $item );
$item.addClass( classes.li );
$a = $item.find( 'a' );
$a.addClass( classes.a );
$item.find( 'a > span' ).addClass( classes.span );
insertIcon( $a, id );
listItem.dataset.minervaPortlet = true;
if ( id && classes.span.indexOf( 'mw-ui-icon' ) === -1 ) {
insertIcon( $a, id );
}
}
}
/**
* Init portlet link items added by gadgets prior to Minerva
* loading.
*/
function init() {
Array.prototype.forEach.call(
document.querySelectorAll( '.mw-list-item-js' ),
function ( item ) {
hookHandler( item, {
id: item.getAttribute( 'id' )
} );
}
);
}
module.exports = {
init: init,
hookHandler: hookHandler
};

View file

@ -23,6 +23,7 @@ function init() {
require( './searchSuggestReveal.js' )();
}
addPortletLink.init();
mw.hook( 'util.addPortletLink' ).add(
addPortletLink.hookHandler
);