feat(ui): Redesign frontend with Material Design 3#3
Closed
okamitimo233 wants to merge 1 commit intoiBUHub:mainfrom
Closed
feat(ui): Redesign frontend with Material Design 3#3okamitimo233 wants to merge 1 commit intoiBUHub:mainfrom
okamitimo233 wants to merge 1 commit intoiBUHub:mainfrom
Conversation
Major frontend overhaul with modern UI components and improved architecture: - Redesigned Dashboard with Material Design 3 aesthetic - Added Sessions page for browser session management - Added Settings page for runtime configuration - Extracted reusable composables (useStatusPolling, useSessions, etc.) - New components: MetricCard, SideNavBar, TopAppBar - Backend API: session-error-threshold endpoint for Settings page - Enhanced styling with CSS variables and dark mode support - Internationalization updates (en/zh locales) Breaking changes: None (backward compatible)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Major frontend overhaul with modern UI components and improved architecture:
useStatusPolling,useSessions,useSettings, etc.)MetricCard,SideNavBar,TopAppBar/api/settings/session-error-thresholdendpoint for Settings pageChanges
New Files
ui/app/components/MetricCard.vue- Reusable metric display cardui/app/components/SideNavBar.vue- Fixed left sidebar navigationui/app/components/TopAppBar.vue- Top application barui/app/composables/useStatusPolling.js- Status polling logicui/app/composables/useSessions.js- Session management logicui/app/composables/useSettings.js- Settings management logicui/app/composables/useI18nHelper.js- i18n helper utilitiesui/app/composables/useLogs.js- Log fetching utilitiesui/app/composables/useVersionInfo.js- Version info utilitiesModified Files
ui/app/pages/StatusPage.vue- Completely redesigned with composablesui/app/router/index.js- Added new routesui/app/styles/variables.less- Extended CSS variable systemui/app/styles/global.less- Updated global stylesui/locales/en.json- New translation keysui/locales/zh.json- New translation keyssrc/routes/StatusRoutes.js- Added settings API endpointScreenshots
The new UI features a clean, modern design with:
Breaking Changes
None - fully backward compatible.
Test Plan