[Refactor] simplify watchlist link generation and adopt new icon

Bug: T289619
Change-Id: I8309492881142d47eec4da5cc4aa5c6febbd1b35
This commit is contained in:
Jon Robson 2022-01-12 15:44:18 -08:00 committed by Jdlrobson
parent 699579e646
commit 591e1d296c
3 changed files with 48 additions and 42 deletions

View File

@ -216,21 +216,15 @@ class Hooks {
* @param array &$content_navigation
*/
private static function updateUserLinksItems( $sk, &$content_navigation ) {
$COLLAPSE_MENU_ITEM_CLASS = 'user-links-collapsible-item';
// For logged-in users in modern Vector, rearrange some links in the personal toolbar.
if ( $sk->loggedin ) {
if ( $sk->getUser()->isRegistered() ) {
// Remove user page from personal menu dropdown for logged in users at higher resolutions.
self::appendClassToListItem(
$content_navigation['user-menu']['userpage'],
$COLLAPSE_MENU_ITEM_CLASS
self::makeMenuItemCollapsible(
$content_navigation['user-menu']['userpage']
);
self::makeMenuItemCollapsible(
$content_navigation['user-menu']['watchlist']
);
if ( VectorServices::getFeatureManager()->isFeatureEnabled( Constants::FEATURE_USER_LINKS_WATCHLIST ) ) {
self::appendClassToListItem(
$content_navigation['user-menu']['watchlist'],
$COLLAPSE_MENU_ITEM_CLASS
);
}
// Remove logout link from user-menu and recreate it in SkinVector,
unset( $content_navigation['user-menu']['logout'] );
// Don't show icons for anon menu items (besides login and create account).
@ -255,15 +249,13 @@ class Hooks {
// ULS and user page links are hidden at lower resolutions.
if ( $content_navigation['user-interface-preferences'] ) {
self::appendClassToListItem(
$content_navigation['user-interface-preferences']['uls'],
$COLLAPSE_MENU_ITEM_CLASS
self::makeMenuItemCollapsible(
$content_navigation['user-interface-preferences']['uls']
);
}
if ( $content_navigation['user-page'] ) {
self::appendClassToListItem(
$content_navigation['user-page']['userpage'],
$COLLAPSE_MENU_ITEM_CLASS
self::makeMenuItemCollapsible(
$content_navigation['user-page']['userpage']
);
// Style the user page link as mw-ui-button.
@ -275,6 +267,19 @@ class Hooks {
}
}
/**
* Modifies list item to make it collapsible.
*
* @param array &$item
*/
private static function makeMenuItemCollapsible( array &$item ) {
$COLLAPSE_MENU_ITEM_CLASS = 'user-links-collapsible-item';
self::appendClassToListItem(
$item,
$COLLAPSE_MENU_ITEM_CLASS
);
}
/**
* Make an icon
*
@ -297,10 +302,15 @@ class Hooks {
foreach ( $content_navigation[$menu] as $key => $item ) {
$hasButton = $item['button'] ?? false;
$hideText = $item['text-hidden'] ?? false;
$isCollapsible = $item['collapsible'] ?? false;
$icon = $item['icon'] ?? '';
unset( $item['button'] );
unset( $item['icon'] );
unset( $item['text-hidden'] );
unset( $item['collapsible'] );
if ( $isCollapsible ) {
self::makeMenuItemCollapsible( $item );
}
if ( $hasButton ) {
$item['link-class'][] = 'mw-ui-button mw-ui-quiet';
@ -308,7 +318,7 @@ class Hooks {
if ( $icon ) {
if ( $hideText ) {
$item['link-class'][] = 'mw-ui-icon mw-ui-icon-element mw-ui-icon-' . $icon;
$item['link-class'][] = 'mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-' . $icon;
} else {
$item['link-html'] = self::makeIcon( $icon );
}
@ -338,6 +348,20 @@ class Hooks {
self::updateActionsMenu( $content_navigation );
}
// watchlist item is not present if not logged in.
$wlItem = $content_navigation['user-menu']['watchlist'] ?? null;
if ( $wlItem !== null ) {
$content_navigation['vector-user-menu-overflow'] = [
'watchlist' => $wlItem + [
'button' => true,
'collapsible' => true,
'text-hidden' => true,
'id' => 'pt-watchlist-2',
],
];
self::updateMenuItems( $content_navigation, 'vector-user-menu-overflow' );
}
if ( isset( $content_navigation['user-menu'] ) ) {
if ( self::isSkinVersionLegacy() ) {
// Remove user page from personal toolbar since it will be inside the personal menu for logged-in

View File

@ -298,27 +298,11 @@ class SkinVector extends SkinMustache {
/**
* Returns HTML for the watchlist link inside user links
* @param array|null $watchlistMenuData (optional)
* @return string
*/
private function getWatchlistHTML() {
$title = $this->getTitle();
$pageurl = $title->getLocalURL();
$href = self::makeSpecialUrl( 'Watchlist' );
$watchlistData = [
'text' => $this->msg( 'mywatchlist' )->text(),
'href' => $href,
'active' => ( $href == $pageurl ),
'single-id' => 'pt-watchlist',
'class' => [
self::CLASS_QUIET_BUTTON,
self::CLASS_ICON_BUTTON,
self::iconClass( 'unStar' )
]
];
$featureManager = VectorServices::getFeatureManager();
return $featureManager->isFeatureEnabled( Constants::FEATURE_USER_LINKS_WATCHLIST ) ?
$this->makeLink( 'watchlist', $watchlistData ) : '';
private function getWatchlistHTML( $watchlistMenuData = null ) {
return $watchlistMenuData ? $watchlistMenuData['html-items'] : '';
}
/**
@ -408,7 +392,7 @@ class SkinVector extends SkinMustache {
'data-user-interface-preferences' => $menuData[ 'data-user-interface-preferences' ],
'data-notifications' => $menuData[ 'data-notifications' ],
'data-user-page' => $menuData[ 'data-user-page' ],
'html-vector-watchlist' => $this->getWatchlistHTML(),
'html-vector-watchlist' => $this->getWatchlistHTML( $menuData[ 'data-vector-user-menu-overflow' ] ?? null ),
] );
$userMoreData = [
'id' => 'p-personal-more',

View File

@ -7,7 +7,5 @@
{{^is-anon}}
{{#data-user-page}}{{{html-items}}}{{/data-user-page}}
{{#data-notifications}}{{{html-items}}}{{/data-notifications}}
<li id="pt-watchlist-2" class="user-links-collapsible-item">
{{{html-vector-watchlist}}}
</li>
{{{html-vector-watchlist}}}
{{/is-anon}}