Improve Client Stats UX with filterable dropdown, sortable table, and offline client support#221
Open
tvancott42 wants to merge 64 commits intomainfrom
Open
Improve Client Stats UX with filterable dropdown, sortable table, and offline client support#221tvancott42 wants to merge 64 commits intomainfrom
tvancott42 wants to merge 64 commits intomainfrom
Conversation
… pagination - Add SortByIp overload for WirelessClientSnapshot in WiFiAnalysisHelpers - Replace empty state with pageable client device table (default view) - Add filterable text input for client dropdown (filters by name, MAC, IP) - Add sortable column headers with visual indicators (Name, IP, MAC, AP, Band, Signal) - Default sort by IP ascending - Add pagination controls (15 rows per page) - Click table row to select client and load their timeline
- Add IsOnline and LastSeen properties to WirelessClientSnapshot - Fetch historical clients from GetClientHistoryAsync to show offline devices - Add Status column with online/offline dot indicator - Add All/Online/Offline filter toggle (matches band selector UX) - Show "last seen X ago" tooltip for offline clients - Dim offline client rows slightly for visual distinction
…ect styling - Status filter now uses same styling as time range selector for consistency - Filterable select: add explicit bg color, text color, border, and padding - Widen filterable select to 360px to show full MAC addresses - Remove unused status-filter CSS
…selector alias - Move RF Environment's scoped time-range-selector styles to global CSS - Remove scoped styles from SpectrumAnalysis.razor - Add pill-selector/pill-btn as generic aliases for non-time toggle buttons - Status filter uses pill-selector instead of time-range-selector - Filterable select now shows selected client name instead of clearing
- Time range controls how far back to show offline clients - Disabled when Online filter selected (no time concept for online) - Still controls graph range when viewing a specific client - Resets to page 1 when time range changes in list view
- Display mode shows status dot, name, and MAC (matching dropdown style) - Click to switch to edit mode for searching - Fix nested card selector: .card .card for bg-secondary
- Fixed height of 34px for both input and display states - Reduced font sizes in display mode for compactness - Added overlay behind dropdown for click-outside-to-close behavior
- Remove padding/flex from wifi component containers (they share wifi-sections) - Remove channel-analysis-container, load-balance-container, power-coverage-container, band-steering-container, airtime-container, env-correlation-container, roaming-analytics-container, connectivity-flow-container, client-timeline-container - Add issue-count-sm class for compact header badges - Use issue-count-sm in WiFiOptimizer health card
- WiFi tab bar now scrolls horizontally on mobile instead of overflowing - RF Environment header now matches Client Stats pattern (not in a card)
- Fix horizontal bar radii (right-only) for radio-util, gen, retry, wifi-gen, metric bars - Change bg to secondary: power-bar-container, stage-bar, ap-success-bar-container - Add radius to power-bar-gain - Remove signal-bar-wrapper background - Remove tod-icon from Environmental Correlation
Add .issue-content to display:contents rule matching .issue-body behavior
Most clients without IPs have connectivity issues, not DHCP server problems
This reverts commit e6a4595.
- Add display:contents for .issue-content in mobile (matches .issue-body) - Add .issue-meta grid positioning for mobile - health-score-main: horizontal grid layout with score circle left, label/timestamp stacked right - Reduce score font size on mobile - Reduce font size when score is 100 (score-perfect class)
- Airtime: #10b981 (green) - Interference: #f59e0b (amber) - TX Retries: #ef5858 (balanced red) - Signal: #3b82f6 (blue) Updated in CSS labels, Metrics.razor, and ClientTimeline.razor
- Airtime: #2ba89a (muted teal) - neutral for utilization - Interference: #e8818f (muted coral) - distinct from 2.4 GHz amber
- Interference color: #a78bfa (violet) - Add band filter (2.4/5/6 GHz) with standard band colors - Change "AP" to "Access Point" - Float metrics filter to the right
- Band filter now uses filter-tabs band-tabs style (multi-select toggle buttons) - Remove "(Site)" suffix from All APs dropdown option
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 UX improvements to the WiFi Optimizer Client Stats tab:
Metrics tab improvements:
Additional improvements:
Test plan