feat(integrations): redesign configure view

[chickenn00dle]

All Submissions:

• Have you followed the Newspack Contributing guideline?
• Does your code follow the WordPress' coding standards and VIP Go coding standards?
• Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

Redesigns the per-integration configure view to match the Figma designs from DSGNEWS-156.

configure-view-demo.mp4

PHP:

• Added Metadata::get_grouped_default_fields() to return outgoing metadata fields grouped by section (Identity, Registration, Engagement, etc.)
• Added grouped_options to the outgoing metadata field in the REST API response (backward-compatible addition alongside existing options)

Frontend:

• Redesigned configure-view.js from a flat single-column layout to a 2-column sectioned layout (matching the content-gates edit pattern)
• Settings split into 3 sections separated by dividers: Settings (ESP-specific fields), Inbound (incoming metadata checkboxes), Outbound (accordion groups by category)
• Save button moved from inline to header actions via setHeaderData
• Integration name and description now set dynamically in the section header
• Added defaultOpen prop to the shared Accordion component

Closes DSGNEWS-156.

How to test the changes in this Pull Request:

1. Enable the integrations feature flag (NEWSPACK_SYNC_METADATA_VERSION_1) and ensure Newspack Newsletters is configured with an ESP
2. Navigate to Newspack > Audience > Integrations
3. Click "Configure" on the Newsletter ESP card
4. Verify the 3-section layout: Settings fields at top, Inbound checkboxes in the middle, Outbound accordion groups at the bottom
5. Verify the first Outbound accordion group (Identity) is expanded by default, others are collapsed
6. Verify the Save button appears in the header and works correctly
7. Verify back navigation returns to the integrations list

Other information:

• Have you added an explanation of what your changes do and why you'd like us to include them?
• Have you written new tests for your changes, as applicable?
• Have you successfully ran tests with your changes locally?

[Copilot]

Pull request overview

Redesigns the Audience → Integrations “Configure” view to match the new sectioned/2-column layout, while extending the Reader Activation Sync metadata API to provide outbound fields grouped by category for the new accordion UI.

Changes:

• Add grouped outbound metadata field options in PHP (grouped_options) alongside the existing flat options.
• Refactor the integrations configure view into Settings / Inbound / Outbound sections, with header-level Save action and grouped outbound accordions.
• Enhance the shared Accordion component with a defaultOpen prop to support “first group expanded” behavior.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
src/wizards/audience/views/integrations/settings-section.js	Adds a wrapper class to target updated wizard spacing/styling.
src/wizards/audience/views/integrations/index.js	Adjusts wizard section config for the hidden configure route and dynamic header usage.
src/wizards/audience/views/integrations/configure-view.scss	Adds layout/styling rules for the redesigned configure view and wizard header spacing.
src/wizards/audience/views/integrations/configure-view.js	Implements the new 3-section configure UI, header actions, and grouped outbound accordion rendering.
packages/components/src/accordion/index.js	Adds defaultOpen behavior and controlled open/close handling.
includes/reader-activation/sync/class-metadata.php	Adds grouped outbound metadata defaults for the REST response.
includes/reader-activation/integrations/class-integration.php	Includes grouped_options in the outgoing metadata field REST config.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[chickenn00dle]

This one is ready for review, but depends on #4665. I'm gonna add the blocked label until that PR is approved and merged.