Skip to content

ref(alerts): Remove deprecatedRouteProps from metricAlertRuleDetails route#106348

Merged
ryan953 merged 6 commits intomasterfrom
ref/remove-deprecated-route-props-metric-alert-details
Jan 20, 2026
Merged

ref(alerts): Remove deprecatedRouteProps from metricAlertRuleDetails route#106348
ryan953 merged 6 commits intomasterfrom
ref/remove-deprecated-route-props-metric-alert-details

Conversation

@ryan953
Copy link
Member

@ryan953 ryan953 commented Jan 15, 2026

Summary

Removes deprecatedRouteProps: true from the metricAlertRuleDetails route by refactoring the component to use React Router v6 hooks.

Changes

  • Route file (static/app/router/routes.tsx):

    • Removed deprecatedRouteProps: true from line 1472
  • Component (static/app/views/alerts/rules/metric/details/index.tsx):

    • Added functional wrapper MetricAlertDetailsWrapper that uses useLocation(), useOrganization(), and useParams() hooks
    • Removed RouteComponentProps from Props interface
    • Class component remains unchanged and receives props from the wrapper
  • Tests (static/app/views/alerts/rules/metric/details/index.spec.tsx):

    • Updated all 7 tests to use initialRouterConfig with proper routing setup
    • Removed manual prop passing in favor of context-based routing
    • All tests passing ✅

Test Plan

  • ✅ All existing tests pass
  • ✅ Manual verification: navigated to alert rule details page
  • ✅ Verified routing works correctly with params extraction

Related Work

Part of the effort to remove all deprecatedRouteProps from the codebase and migrate to React Router v6 patterns. This is route 1 of 11 leaf routes that need updating.

…route

Refactor the MetricAlertDetails component to use React Router v6 hooks
instead of receiving route props directly. This removes the need for
deprecatedRouteProps on the route definition.

Changes:
- Add functional wrapper that uses useLocation, useOrganization, and useParams hooks
- Remove RouteComponentProps from Props interface
- Remove deprecatedRouteProps from route definition (line 1472)
- Update all tests to use modern testing patterns with initialRouterConfig

The class component is preserved as-is and wrapped with a functional
component that provides the necessary props from hooks.
@ryan953 ryan953 requested a review from a team as a code owner January 15, 2026 05:49
@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Jan 15, 2026
@ryan953 ryan953 marked this pull request as draft January 15, 2026 05:51
@ryan953 ryan953 marked this pull request as ready for review January 15, 2026 23:00
@ryan953 ryan953 requested a review from a team January 15, 2026 23:00
@ryan953 ryan953 enabled auto-merge (squash) January 20, 2026 23:41
@ryan953 ryan953 merged commit de89e68 into master Jan 20, 2026
53 checks passed
@ryan953 ryan953 deleted the ref/remove-deprecated-route-props-metric-alert-details branch January 20, 2026 23:46
trevor-e pushed a commit that referenced this pull request Jan 20, 2026
…route (#106348)

## Summary

Removes `deprecatedRouteProps: true` from the `metricAlertRuleDetails`
route by refactoring the component to use React Router v6 hooks.

## Changes

- **Route file** (`static/app/router/routes.tsx`):  
  - Removed `deprecatedRouteProps: true` from line 1472

- **Component**
(`static/app/views/alerts/rules/metric/details/index.tsx`):
- Added functional wrapper `MetricAlertDetailsWrapper` that uses
`useLocation()`, `useOrganization()`, and `useParams()` hooks
  - Removed `RouteComponentProps` from Props interface
- Class component remains unchanged and receives props from the wrapper

- **Tests**
(`static/app/views/alerts/rules/metric/details/index.spec.tsx`):
- Updated all 7 tests to use `initialRouterConfig` with proper routing
setup
  - Removed manual prop passing in favor of context-based routing
  - All tests passing ✅

## Test Plan

- ✅ All existing tests pass
- ✅ Manual verification: navigated to alert rule details page
- ✅ Verified routing works correctly with params extraction

## Related Work

Part of the effort to remove all `deprecatedRouteProps` from the
codebase and migrate to React Router v6 patterns. This is route 1 of 11
leaf routes that need updating.
@github-actions github-actions bot locked and limited conversation to collaborators Feb 5, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

Scope: Frontend Automatically applied to PRs that change frontend components

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants