Bug #2773
Dashboard Cards changes
Description
Dashboard Cards changes
Updated by Shreya Agarwal 2 days ago
worked on modifying the "Top Charging Stations" widget in the AdvancedAnalyticsWidgets component to display energy consumption (kWh) instead of revenue (money). The implementation encountered TypeScript error . While the UI changes were successfully applied to show energy values and "vs Last Month" comparison text, the data mapping needs to be switched from topEarningStations to topStationsByUsage to resolve the type errors This work is currently in progress and will be completed tomorrow with proper data source mapping and thorough testing.
Updated by Shreya Agarwal about 19 hours ago
1. Changed Energy Display from Money to Energy - updated all dashboard cards to show energy consumption (kWh) instead of revenue (₹) including Highest Earning Station → Highest Performing Station (Energy), Highest Earning Day → Highest Performing Day (Energy), Top Earning Days → Top Performing Days (Energy), and Peak Hours sections (Energy).
2. Rebranded All "Earning" Labels to "Performing" - Updated all card titles and section headers across the dashboard for better terminology alignment.
Moved "Top Earning Stations" Card - Repositioned the Top Performing Stations card from the top grid to the bottom of the dashboard as an expandable accordion (dropdown), similar to the Charging Stations Map.
3. Adjusted Grid Layout - Modified the grid from 4 columns to 3 columns to accommodate the removal of the Top Performing Stations card from the top section.
4. Fixed UI Issues - Resolved text truncation issues in StatCard titles (fixed the "Performing" text being cut off) and updated the layout of Top Performing Stations to display energy value alongside station name.
5. Updated the Top Performing Stations accordion to display energy value (kWh) in front of the station name on the same line, making the layout more consistent and visually aligned with other dashboard sections. The sessions count now appears as a secondary line below, providing a cleaner and more organized presentation.
Accordion Implementation - Added expandable/collapsible functionality for Top Performing Stations with proper state management.
----Additional Modifications After New Requirements:
6. Reversed Top Performing Stations to Card Format - After the accordion implementation, the Top Performing Stations section was converted back to a regular card format (like Top Performing Days, Top Stations by Usage, and Peak Hours — Stations) to maintain visual consistency across all dashboard cards.
7. Grid Reconfiguration - Restored the grid layout from 3 columns back to 4 columns to accommodate the Top Performing Stations card alongside the other three performance cards in a single row.
8. Added Revenue Version as Commented Code - Implemented commented-out revenue (money) versions for all three cards (Top Performing Stations, Top Performing Days, and Peak Hours — Stations) to allow easy switching between energy and revenue displays in the future without rewriting the code.
9. Resolved StatCard Title Text Cutting Issue - Fixed the persistent issue where "Highest Performing Station (All-Time)" text was being cut off or displayed adjusting overflow properties to ensure the full title is visible at all times.
10. Final UI Polish - Ensured consistent spacing and alignment across all cards, with proper gap management between titles and values for a clean, professional dashboard appearance.