Add block-based site menus (fixes #554)

[sushanthaaa]

Summary

Replaces the page-tree-based show_in_menus navigation with block-based StreamField menus managed as snippets in the Wagtail admin. Both the main navigation and the footer are now fully editable, supporting custom labels, reordering, external URLs, document links, and a draft/publish workflow with live preview.

Closes #554 .

Motivation

The existing navigation relies on the show_in_menus page flag, which limits editors to:

• Only showing Wagtail pages (no external links or documents)
• Using the page's own title (no custom labels)
• Ordering by page tree position (no reordering)

This PR introduces block-based menus following the wagtail.org navigation pattern, giving editors full control over both the main menu and footer navigation.

Changes

New blocks (base/blocks.py)

• MenuItemLinkBlock — StreamBlock (max_num=1) with page, external URL, and document link types
• MenuItemBlock — StructBlock combining an optional custom title with a link
• MenuSectionBlock — StructBlock with a heading and a ListBlock of menu items (footer only)

New models (base/models.py)

• FooterMenu — sectioned footer navigation (sections → items → links)
• MainMenu — flat top navigation (items → links)

Both use DraftStateMixin, RevisionMixin, and PreviewableMixin, following the same pattern as the existing FooterText model.

Updated files

• wagtail_hooks.py — FooterMenuViewSet and MainMenuViewSet added to BakerySnippetViewSetGroup
• navigation_tags.py — get_footer_menu and get_main_menu inclusion tags replace old top_menu
• header.html — Uses {% get_main_menu %} instead of {% top_menu %}
• footer.html — Includes {% get_footer_menu %}
• main.css — Responsive footer menu styles (vanilla CSS)

New files

• templates/base/include/footer_menu.html
• templates/base/include/main_menu.html
• migrations/0028_footermenu.py
• migrations/0029_mainmenu.py
• tests/test_footer_menu.py (7 tests)
• tests/test_main_menu.py (6 tests)

How to test

1. Run migrations: python manage.py migrate
2. Start the dev server: python manage.py runserver
3. In the admin, go to Bakery Misc → Main Menus → create a menu with page links → Publish
4. In the admin, go to Bakery Misc → Footer Menus → create a sectioned footer menu → Publish
5. Visit the homepage to see both menus rendered
6. Run tests: python manage.py test bakerydemo.base.tests.test_footer_menu bakerydemo.base.tests.test_main_menu

Test results

Ran 13 tests in 3.236s — OK

Screenshots

Main_menu

Footer_menu

Admin Panel -
Main_menu

Footer_menu

AI usage

Used Claude Code with model Opus 4.6 for assistance in coding and writing this PR and Reviewed the code and Verified the output personally by me