[Technical] Prepare for template rename

The user links and language button are SkinVector22 features but
they are buried inside SkinVector.

When we rename the templates this code will become problematic
as SkinVector22 requires these modifications

Bug: T319349
Change-Id: Id5e5b97af0ea020ef20565a7e1acc685d7be0892
This commit is contained in:
Jon Robson 2022-10-27 16:46:19 -07:00 committed by Jdlrobson
parent 6ca407361b
commit 31b0fd08d2
5 changed files with 44 additions and 35 deletions

View file

@ -298,17 +298,24 @@ abstract class SkinVector extends SkinMustache {
/**
* Returns template data for UserLinks.mustache
* @param array $menuData existing menu template data to be transformed and copied for UserLinks
* FIXME: Move to component (T322089)
*
* @param array $userMenuData existing menu template data to be transformed and copied for UserLinks
* @param array $overflowMenuData existing menu template data to be transformed and copied for UserLinks
* @param User $user the context user
* @return array
*/
private function getUserLinksTemplateData( $menuData, $user ): array {
final protected function getUserLinksTemplateData(
array $userMenuData, array $overflowMenuData, User $user
): array {
$isAnon = !$user->isRegistered();
$isTempUser = $user->isTemp();
$returnto = $this->getReturnToParam();
$useCombinedLoginLink = $this->useCombinedLoginLink();
$userMenuOverflowData = $menuData[ 'data-vector-user-menu-overflow' ];
$userMenuData = $menuData[ 'data-user-menu' ];
$userMenuOverflowData = Hooks::updateDropdownMenuData( $overflowMenuData );
$userMenuData = Hooks::updateDropdownMenuData( $this->getUserMenuPortletData( $userMenuData ) );
unset( $userMenuOverflowData[ 'label' ] );
if ( $isAnon || $isTempUser ) {
$userMenuData[ 'html-before-portal' ] .= $this->getAnonMenuBeforePortletHTML(
$returnto,
@ -329,7 +336,7 @@ abstract class SkinVector extends SkinMustache {
$moreItems = substr_count( $userMenuOverflowData['html-items'], '<li' );
return [
'is-wide' => $moreItems > 3,
'data-user-menu-overflow' => $menuData[ 'data-vector-user-menu-overflow' ],
'data-user-menu-overflow' => $userMenuOverflowData,
'data-user-menu' => $userMenuData
];
}
@ -497,11 +504,6 @@ abstract class SkinVector extends SkinMustache {
}
if ( !$this->isLegacy() ) {
$commonSkinData['data-vector-user-links'] = $this->getUserLinksTemplateData(
$commonSkinData['data-portlets'],
$user
);
// T295555 Add language switch alert message temporarily (to be removed).
if ( $this->shouldLanguageAlertBeInSidebar() ) {
$languageSwitchAlert = [
@ -676,12 +678,13 @@ abstract class SkinVector extends SkinMustache {
/**
* Creates portlet data for the ULS button in the header
*
* @param string $className
* @param array $langData
* @param int $numLanguages
* @param bool $atTop
* @return array
*/
private function getULSPortletData( string $className, bool $atTop ) {
$numLanguages = count( $this->getLanguagesCached() );
final protected function getULSPortletData( array $langData, int $numLanguages, bool $atTop ) {
$className = $langData['class'] ?? '';
$languageButtonData = [
'id' => 'p-lang-btn',
@ -701,11 +704,16 @@ abstract class SkinVector extends SkinMustache {
$languageButtonData['class'] .= ' mw-portlet-empty';
}
return $languageButtonData;
return Hooks::updateDropdownMenuData(
array_merge(
$langData, $languageButtonData
)
);
}
/**
* Creates portlet data for the user menu dropdown
* FIXME: Move to SkinVector22
*
* @param array $portletData
* @return array
@ -722,7 +730,7 @@ abstract class SkinVector extends SkinMustache {
// completion of T319356.
//
// Also, add target class to apply different icon to personal menu dropdown for logged in users.
$portletData['class'] = 'mw-portlet mw-portlet-personal vector-user-menu';
$portletData['class'] = 'mw-portlet mw-portlet-personal vector-user-menu vector-menu-dropdown';
$portletData['class'] .= $this->loggedin ?
' vector-user-menu-logged-in' :
' vector-user-menu-logged-out';
@ -850,23 +858,6 @@ abstract class SkinVector extends SkinMustache {
break;
}
if ( $key === 'data-languages' && $this->isLanguagesInContent() ) {
$portletData = array_merge( $portletData,
$this->getULSPortletData(
$portletData[ 'class' ] ?? '',
$this->isLanguagesInContentAt( 'top' )
)
);
}
if ( $key === 'data-user-menu' && !$this->isLegacy() ) {
$portletData = $this->getUserMenuPortletData( $portletData );
}
if ( $key === 'data-vector-user-menu-overflow' ) {
$portletData['class'] .= ' vector-user-menu-overflow';
}
$isDropdown = $type === self::MENU_TYPE_DROPDOWN;
if ( $isDropdown && !$isIconDropdown ) {
$portletData['class'] .= ' vector-menu-dropdown-noicon';

View file

@ -216,6 +216,22 @@ class SkinVector22 extends SkinVector {
}
$parentData = $this->mergeViewOverflowIntoActions( $parentData );
// FIXME: Move to component (T322089)
$parentData['data-vector-user-links'] = $this->getUserLinksTemplateData(
$parentData['data-portlets']['data-user-menu'],
$parentData['data-portlets'][ 'data-vector-user-menu-overflow' ],
$this->getUser()
);
$langData = $parentData['data-portlets']['data-languages'] ?? null;
if ( $langData ) {
$parentData['data-lang-btn'] = $this->getULSPortletData(
$langData,
count( $this->getLanguagesCached() ),
$this->isLanguagesInContentAt( 'top' )
);
}
return array_merge( $parentData, [
'is-language-in-content' => $this->isLanguagesInContent(),
'is-language-in-content-top' => $this->isLanguagesInContentAt( 'top' ),

View file

@ -20,9 +20,9 @@
{{{html-title-heading}}}
{{#is-language-in-content-top}}
{{#data-portlets.data-languages}}
{{#data-lang-btn}}
{{>Menu}}
{{/data-portlets.data-languages}}
{{/data-lang-btn}}
{{/is-language-in-content-top}}
{{^is-language-in-content-top}}

View file

@ -65,7 +65,7 @@
{{{html-categories}}}
</div>
{{#is-language-in-content-bottom}}
{{#data-portlets.data-languages}}{{>Menu}}{{/data-portlets.data-languages}}
{{#data-lang-btn}}{{>Menu}}{{/data-lang-btn}}
{{/is-language-in-content-bottom}}
</main>
{{{html-after-content}}}

View file

@ -59,6 +59,8 @@
/**
* Horizontal links menu - logged in and logged out.
*/
// FIXME: vector-user-menu-overflow for cached HTML only.
.vector-user-links .mw-portlet-vector-user-menu-overflow,
.vector-user-menu-overflow {
.vector-feature-visual-enhancement-next-enabled & {
margin-right: 8px;