Story 2410: Legal Pages Wagtail Integration

[julhoang]

Issue: #2410

⚠️ Base branch ⚠️ : this PR is stacked on top of #2100 — please review and merge that first.

Summary & Context

Migrates Privacy Policy and Terms of Use content out of hardcoded templates into Wagtail-managed LegalPage instances, and consolidates the two near-identical templates into one shared legal_page.html. Editors can now update copy and the "Last Updated" date from the Wagtail admin instead of editing templates.

• Figma link: https://www.figma.com/design/5j0fQssrV9ipoU16P7hfKy/Website-Deliverables?node-id=1787-46785&m=dev
• Content Link from Prod:
  1. https://www.boost.org/privacy/
  2. https://www.boost.org/terms-of-use/
• Link to components/page:
  1. http://localhost:8000/privacy/
  2. http://localhost:8000/terms-of-use/
• Wagtail CMS: http://localhost:8000/cms/

Changes

• Add LegalPage Wagtail model (pages/models.py) — BasePage subclass with a RichTextField body using the project's RICH_TEXT_FEATURES, parented under RoutableHomePage.
• Add migrations:
  • 0002_legalpage – schema for the new model.
  • 0003_create_legal_pages – data migration that seeds Privacy Policy and Terms of Use under RoutableHomePage with prod-matching copy, and a reverse op that deletes them by slug.
• Refactor Privacy Policy and Terms of Use into a single shared template:
  • templates/v3/legal_page.html – new template renders any LegalPage (title, last_published_at-driven "Last Updated", rich-text body).
  • templates/v3/privacy_policy.html, templates/v3/terms_of_use.html – removed.
• Refactor view layer in core/views.py:
  • TermsOfUseView / PrivacyPolicyView now resolve the corresponding LegalPage by slug (terms-of-use, privacy) and pass it to the template.
  • Removed the hardcoded last_updated strings — the visible date now comes from page.last_published_at, so republishing in Wagtail updates it automatically.
• Consolidate styles to static/css/v3/legal-page.css
• Tweak static/css/v3/header.css padding (--space-default / --space-large on desktop, reverts to --space-medium on mobile) to match the legal page layout.

Peer Review Testing (Wagtail CMS)

1. Run migrations to create the LegalPage model and seed the two pages:

docker compose exec web ./manage.py migrate pages

2. Verify the seeded pages render:

• Visit http://localhost:8000/privacy/ and http://localhost:8000/terms-of-use/.
• Confirm the title, "Last Updated" date, and rich-text body all display, and that both pages use the same layout/styles.

3. Log in to the Wagtail admin at http://localhost:8000/cms/ as a superuser (./manage.py createsuperuser if needed).
4. Locate the pages under Pages → Root → (your RoutableHomePage) — you should see Privacy Policy and Terms of Use as children.
5. Edit content:

• Open Privacy Policy, change a paragraph in the body, click Publish.
• Reload http://localhost:8000/privacy/ — the edit should appear immediately, and the "Last Updated" date should now reflect today.
• Repeat for Terms of Use.

6. Confirm rich-text features (headings, lists, links) render with the expected styling from legal-page.css.
7. Test the reverse migration (optional but recommended): docker compose exec web ./manage.py migrate pages 0002 → The two LegalPage rows should be deleted; re-running migrate pages should recreate them with the original seeded copy.

Risks & Considerations

• Both views now depend on the seeded LegalPage rows existing. The data migration creates them, but environments that skip migrations or restore from a snapshot taken before 0003_create_legal_pages ran will render an empty page. Confirm the migration runs on staging/prod.
• ‼️ Currently the Last Updated timestamp matches the publish date of Wagtail publish date, so it is not the same as 2024-02-22 from Prod – we need to manually adjust the CMS
• The seed copy in 0003_create_legal_pages was hand-matched to current prod
• Must merge jc/wagtail-integration first; rebasing this branch onto develop before that lands will surface unrelated changes.

Screenshots

Before	After

Self-review Checklist

• Tag at least one team member from each team to review this PR
• Link this PR to the related GitHub Project ticket

Frontend

• UI implementation matches Figma design
• Tested in light and dark mode
• Responsive / mobile verified
• Accessibility checked (keyboard navigation, etc.)
• Ensure design tokens are used for colors, spacing, typography, etc. – No hardcoded values
• Test without JavaScript (if applicable)
• No console errors or warnings