Extract common functionalities in module setup component into custom hooks

[nfmohit]

Feature Description

The current assets/js/components/setup/ModuleSetup.js hard-codes the entire setup screen, i.e., the header, progress indicator, content wrapper, intro title, the module's SetupComponent, and footer, and already carries module-specific conditionals for the Analytics initial-setup flow.

The planned upcoming work for Reader Revenue Manager Express Setup is set to add further complexity and module-specific logic to this component, which is not intended.

#12974 decomposes this component into smaller, independently composable, and reusable primitives. The intention behind this refactor is for a module to optionally own its entire setup screen when required, and when it does, it can import any of the above primitives to retain the default behavior for areas that do not require customization.

This issue is intended to extract shared behavior currently inlined in ModuleSetup, i.e., the finishSetup routine (cache clear, event tracking, redirect) and view tracking into custom hooks (e.g. useFinishSetup, useModuleSetupTracking). This allows module-specific screens to reuse core logic without duplication.

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

• Shared hooks encapsulate the module setup behaviors currently inlined in ModuleSetup: completing setup (cache clear, completion tracking, redirect) and view tracking on mount.
• A module that owns its own setup screen can import and use those hooks to get the same completion and view-tracking behavior as the default flow, without duplicating that logic.
• ModuleSetup consumes the shared hooks and no longer inlines the finishSetup routine or mount-time view tracking.
• Existing module setup behavior is unchanged:
  • Completing setup still clears the module_setup cache, fires the correct completion tracking event, and navigates to the Site Kit dashboard or an optional custom redirect URL.
  • Viewing a module setup screen still fires the correct view tracking event once on load.
  • Canceling setup from the default footer still fires the correct cancel tracking event.
• The initial Analytics setup-flow tracking events (setup_flow_v3_view_analytics_step, setup_flow_v3_complete_analytics_step) continue to fire under the same conditions as today, until relocated by Remove Analytics-specific quirks out of the core module setup component #12976.

Implementation Brief

• Add shared setup hooks under assets/js/components/setup/hooks/:
  • useFinishSetup: Extract the finishSetup callback from ModuleSetup.
    • Accept moduleSlug and any inputs needed to preserve current completion-tracking behavior (including the initial Analytics setup-flow variant for now).
    • Return an async finishSetup( redirectURL? ) function that:
      • Clears the module_setup cache.
      • Tracks the appropriate completion event.
      • Navigates to the provided redirect URL (with forwardable params merged in) or to the default Site Kit dashboard URL with the existing success notification params.
  • useModuleSetupTracking: Extract mount-time view tracking (and optionally the cancel-setup tracking callback used by the default footer).
    • Accept moduleSlug and any inputs needed to preserve current view-tracking behavior (including the initial Analytics setup-flow variant for now).
    • Fire the correct view event on mount.
    • Expose a reusable cancel-tracking callback if that keeps ModuleSetup free of inline tracking logic.
• Update assets/js/components/setup/ModuleSetup.js to use the new hooks instead of its inline implementations. Behavior and public props should remain the same.
• Export the hooks from a stable import path so module-specific setup screens can reuse them alongside the composable UI from Extract core module setup component into composable primitives #12974.

Test Coverage

• Add focused unit tests for useFinishSetup:
  • Clears the module_setup cache.
  • Tracks the standard complete_module_setup event for a normal module setup flow.
  • Tracks the initial Analytics setup-flow completion event when that flow is active.
  • Redirects to the default dashboard URL with expected query args when no custom URL is passed.
  • Redirects to a custom URL while preserving forwardable params and not overriding params already on the custom URL.
• Add focused unit tests for useModuleSetupTracking:
  • Fires the standard view_module_setup event on mount for a normal module setup flow.
  • Fires the initial Analytics setup-flow view event when that flow is active.
  • Fires the cancel_module_setup event when the cancel callback is invoked (if extracted into this hook).
• Keep existing ModuleSetup.test.js coverage passing; adjust only if assertions move to hook-level tests.

QA Brief

Changelog entry

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

Implementation Brief

Test Coverage

QA Brief

Changelog entry