feat(aci): redirect alerts nav to monitors

[jasonyuezhang]

similar to getsentry#103129, redirects users with the workflow-engine-ui flag who click on Issues > Alerts to the All Monitors list with a banner

---

Copied from getsentry#103325
Original PR: getsentry#103325

[propel-test-bot]

Redirect Issues > Alerts navigation to Monitors with banner

Implements an on-click redirect from the Issues > Alerts secondary-nav item to the All Monitors list when the workflow-engine-ui feature flag is enabled and the user is not staff. A dismissible AlertsRedirectNotice is added to inform users that Alert Rules have moved. Existing behaviour is preserved for staff or when the flag is disabled.

Key Changes

• Created static/app/views/detectors/list/common/alertsRedirectNotice.tsx – dismissible info banner driven by alertsRedirect query param using nuqs state helpers.
• Updated static/app/views/nav/secondary/sections/issues/issuesSecondaryNav.tsx:
• Computes alertsLink via makeMonitorBasePathname() when workflow-engine-ui flag is active and user.isStaff is false.
• Replaces hard-coded /alerts/rules/ link with alertsLink for both to and activeTo props.
• Injected AlertsRedirectNotice into static/app/views/detectors/list/allMonitors.tsx so the banner appears at the top of the Monitors list.

Affected Areas

• Issues secondary navigation
• Monitors (All list) page layout
• New shared notice component for redirect banner

This summary was automatically generated by @propel-code-bot

[propel-test-bot]

[BestPractice]

The activeTo prop is set to the same value as to, which may cause navigation issues. When redirecting to the workflow engine UI, users will be taken to a different base path (/organizations/${org}/monitors), but activeTo will still reference that path. This means the nav item will show as active even when users navigate to sub-routes under /issues/alerts/ (the original path). Consider using a more specific pattern:

Suggested Change

Suggested change

	<SecondaryNav.Item
	to={`${baseUrl}/alerts/rules/`}
	activeTo={`${baseUrl}/alerts/`}
	to={alertsLink}
	activeTo={alertsLink}
	<SecondaryNav.Item
	to={alertsLink}
	activeTo={shouldRedirectToWorkflowEngineUI ? alertsLink : `${baseUrl}/alerts/`}
	analyticsItemName="issues_alerts"
	>

This ensures the active state matches the actual navigation behavior for both redirect and non-redirect scenarios.

⚡ Committable suggestion

Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Context for Agents

[**BestPractice**]

The `activeTo` prop is set to the same value as `to`, which may cause navigation issues. When redirecting to the workflow engine UI, users will be taken to a different base path (`/organizations/${org}/monitors`), but `activeTo` will still reference that path. This means the nav item will show as active even when users navigate to sub-routes under `/issues/alerts/` (the original path). Consider using a more specific pattern:

<details>
<summary>Suggested Change</summary>

```suggestion
      <SecondaryNav.Item
        to={alertsLink}
        activeTo={shouldRedirectToWorkflowEngineUI ? alertsLink : `${baseUrl}/alerts/`}
        analyticsItemName="issues_alerts"
      >
```

This ensures the active state matches the actual navigation behavior for both redirect and non-redirect scenarios.

⚡ **Committable suggestion**

Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

</details>

File: static/app/views/nav/secondary/sections/issues/issuesSecondaryNav.tsx
Line: 107