Open My Books as a popover menu in the header - #13654

Closes #

feature

"My Books" in the header was a plain link to the My Books overview. To reach a specific shelf, loans, lists, notes or the import page, patrons had to land on the overview first and then find the page in its sidebar. Browse, sitting right next to it, already opens a menu of destinations, so the two nav items behaved differently.

My Books now opens a popover built the same way as Browse. The top three rows are featured with an icon and a short description (My Books, Loans & History, My Lists). Below them are the four Reading Log shelves, then My Feed, My Notes, My Reviews, My Reading Stats and Import & Export Options. It also appears in the mobile tray, just like Browse.

Technical

The destinations live in a new mybooks_links() in plugins/openlibrary/nav.py, next to the existing browse_links(). It returns groups rather than a flat list: the first group is featured, and each later group is set off by a divider. Every link uses an /account/... path, which redirects to the patron's own page (or to login when signed out), so the template doesn't need the username. As with Browse, the icons and blurbs stay in the template (lib/mybooks_popover.html), with fallbacks so a new destination can't break the header.

To avoid copying Browse's CSS, its classes are renamed to shared ones: browse-popover__* becomes nav-popover__*, and browse-feature* becomes nav-feature*. Each popover keeps its own root class (browse-popover, mybooks-popover). The open-tracking listener in main.js now matches .nav-popover[data-ol-open-track], so both menus send an open event. This sets up a pattern where any future header menu can use the nav-popover classes and a *_links() function in nav.py.

Analytics follow the Browse format: MainNav|<Destination>|<rank> for clicks, and MainNav|MyBooksOpen for opens (MainNavMobile in the mobile tray). The previous single link sent MainNav|MyBooks, which becomes MainNav|MyBooks|1.

lib/header_dropdown.html has no remaining callers, so it's deleted along with its two attribute-escaping tests. The .header-dropdown CSS and the jQuery close handlers stay because the language picker still uses them.

Testing

• Log in, click My Books in the header: the popover opens with the three featured rows and two link groups.
• Each link resolves to the logged-in patron's page. (My Reading Stats 500s in my local dev environment, but it does the same on master.)
• Browse popover still renders and is styled as before.
• Narrow the window below the tablet breakpoint: My Books opens in the mobile tray.
• pytest openlibrary/tests/test_link_track_attribute_escaping.py passes.

Screenshot

Stakeholders