zhaohai666 opened a new pull request, #474:
URL: https://github.com/apache/rocketmq-dashboard/pull/474
## Summary
Add a new Ops management page accessible via route `/studio/ops`. This page
supports NameServer address management, VIP channel toggle and TLS switch
configurations.
## File Changes
| File | Change Type | Description |
|------|-------------|-------------|
| web/src/pages/studio/Ops.tsx | New | Ops page component, including
NameServer address selector/add form, VIPChannel Switch and TLS Switch controls
|
| web/src/api/ops.ts | New | 5 NameServer operation APIs: queryOpsHomePage,
updateNameSvrAddr, addNameSvrAddr, updateIsVIPChannel, updateUseTLS; plus
`OpsHomeData` TypeScript interface |
| web/src/api/ops.test.ts | New | 14 unit test cases covering NameServer
operations (5), Alert Rules (4), System Alerts & Audit logs (5) |
| web/src/App.tsx | Modified | Import OpsPage and register `/studio/ops`
route |
| web/src/i18n/translations.ts | Modified | Add 6 i18n translation keys:
`ops.nameServerAddressList`, `ops.isUseVIPChannel`, `ops.useTLS`,
`ops.selectNamesrv`, `ops.inputNamesrvAddr`, `ops.fetchFailed` |
| web/src/layouts/MainLayout.tsx | Modified | Replace global `useTheme` with
local `useState` + ConfigProvider for theme switching |
| web/src/main.tsx | Modified | Adjust application entry logic |
| web/src/theme/ThemeContext.tsx | Deleted | Remove standalone ThemeContext;
theme logic moved inline to MainLayout |
| web/src/theme/__tests__/ThemeContext.test.tsx | Deleted | Remove test file
alongside ThemeContext |
## Feature Details
### 1. NameServer Address Management
- Dropdown Select component to switch active NameServer address by clicking
Update button
- Text input + Add button to insert new NameServer addresses
- Permission restriction: all write operations disabled if
`sessionStorage.userrole` is not equal to `1`
### 2. VIP Channel Toggle
- Ant Design Switch to enable/disable VIP channel
- Optimistic UI update: refresh UI first, revert changes if backend request
fails
### 3. TLS Toggle
- Ant Design Switch to turn TLS on/off
- Implements the same optimistic update strategy as VIP channel switch
## API Specifications
| Function Name | HTTP Method | Endpoint | Request Params | Return Value |
|---------------|-------------|----------|----------------|--------------|
| queryOpsHomePage | GET | /ops/homePage | None | OpsHomeData |
| updateNameSvrAddr | POST | /ops/updateNameSvrAddr | `{ namesrvAddr }` |
void |
| addNameSvrAddr | POST | /ops/addNameSvrAddr | `{ namesrvAddr }` | void |
| updateIsVIPChannel | POST | /ops/updateIsVIPChannel | `{ useVIPChannel }`
| void |
| updateUseTLS | POST | /ops/updateUseTLS | `{ useTLS }` | void |
## Test Coverage (14 test cases total)
1. NameServer Operations (5 cases)
- Query homepage data
- Update active NameServer address
- Add new NameServer address
- Modify VIPChannel status
- Modify TLS status
2. Alert Rules (4 cases)
- Fetch alert rule list
- Create new alert rule
- Toggle alert rule status switch
- Delete alert rule
3. System Alerts & Audit Logs (5 cases)
- Query system alert list
- Acknowledge alert records
- Clear acknowledged alerts
- Query audit records
- Clean up audit logs
## Benefits
- Centralized Ops panel for core cluster connection configurations
- Optimistic UI updates deliver smoother user interaction
- Built-in permission control prevents unauthorized modifications
- Comprehensive unit tests ensure stability of all backend interaction APIs
- Simplify global theme logic by removing standalone ThemeContext
--
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]
