zhaohai666 opened a new pull request, #476:
URL: https://github.com/apache/rocketmq-dashboard/pull/476
## Summary
Add an alert rule management page accessible via route `/studio/alert`. The
page supports parsing and rendering Prometheus AlertManager YAML rules, with
search & filter, enable/disable toggle, create/edit/delete operations and YAML
export capabilities.
## File Changes
| File | Change Type | Description |
|------|-------------|-------------|
| web/src/pages/studio/AlertManagement.tsx | New | Alert rule management
component (674 lines), including YAML parser, rule table, filters, CRUD modals
and statistics dashboard |
| web/src/api/alertManagement.ts | New | One API function `queryAlertRules`
plus `AlertRuleData` TypeScript interface |
| web/src/api/alertManagement.test.ts | New | 2 unit test cases covering
normal rule query and empty rule list scenarios |
| web/src/App.tsx | Modified | Import AlertManagementPage and register
`/studio/alert` route |
| web/src/i18n/translations.ts | Modified | Add 28 i18n keys prefixed with
`alertMgmt.*` |
## Feature Details
### YAML Parser (parseYamlRules)
- Parse Prometheus AlertManager standard YAML and extract group & rule
structures
- Support splitting individual rules by `# Rule N:` comment separators
- Extract key fields: alert name, group, expr, for duration, severity, team,
summary, description
### Statistics Dashboard
Statistic cards display total rules, enabled rules, disabled rules and
critical severity rule count.
### Search & Filter
- Text search: fuzzy match by alert name and expression content
- Dropdown filters: rule group (7 preset groups), severity
(critical/warning/info), rule status (enabled/disabled)
### Rule Table
Table columns: Sequence No., Alert Name, Rule Group, Severity (colored Tag),
Team (colored Tag), Expression, Duration, Enable Toggle
- Switch component to toggle enable/disable status, with status persisted to
localStorage
### CRUD Operations
1. Create Rule: Modal form with fields for alert name, rule group, expr,
duration, severity, team, summary and description
2. Edit Rule: Reuse the same form with pre-filled existing rule data
3. Delete Rule: Popconfirm confirmation before removal
4. Export YAML: Download all current rules as a YAML file
## API Specifications
| Function Name | HTTP Method | Endpoint | Return Value |
|---------------|-------------|----------|--------------|
| queryAlertRules | GET | /alert/rules | AlertRuleData `{ rules: string }` |
## Test Coverage (2 test cases total)
1. Query alert rule data and validate parsed YAML content
2. Handle empty alert rule list response
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
