Background
In preparation for the page tools dropdown, we want to start to decouple menu data from their presentation as different UI components. This allows us to reduce the amount of logic in SkinVector relating to how menus are rendered (decoratePortletData, updatePortletClasses) and give us more flexibility with updating menu data. Ultimately this will make it easier for us to render multiple menu groups in a dropdown or other component.
Current:
Proposed:
TODO
- Menu.template is split into the Dropdown.template, Tabs.template, Portals.template, and MenuGroup.template
- 'vector-menu-dropdown', 'vector-menu-portal', 'vector-menu-tabs' classes are now handled by their corresponding template
- SkinVector::decoratePortletsData is restricted to legacy Vector
- Update CSS files to match new template names
- Storybook is disabled from CI
- The Dropdown template is separated in such a way that supports composition
QA
- No visual changes on https://pixel.wmcloud.org/
- Make sure gadgets (mw.util.addPortletLink function) works as before on all menus we touch (run code [1] and check all links appear in UI)
[1] `
mw.util.addPortletLink('p-views', '#', 'test' );mw.util.addPortletLink('p-associated-pages', '#', 'test' ); mw.util.addPortletLink('p-personal', '#', 'test' );mw.util.addPortletLink('p-tb', '#', 'test' );
== QA Results - Beta | **AC** | **Status** | **Details** | | ----- | ----- | ----- | | 1 | ✅ | T319349#8403407 | | 2 | ✅ | T319349#8403407 | == QA Results - Prod | **AC** | **Status** | **Details** | | ----- | ----- | ----- | | 1 | ✅ | T319349#8404676 | | 2 | ✅ | T319349#8404676 |
