Bug #3063
Top Performing Widget – Add View All Option
Description
Enhance the Top Performing Stations widget on the Dashboard by adding a “View All” option.
Currently, the widget displays only the top-performing stations returned by the existing dashboard API. The requirement is to provide users with an option to view all stations along with their performance details.
Backend / API Changes
Create a new API endpoint or extend the existing Top Performing Stations API to support fetching all stations.
The API should return the same performance data currently shown in the dashboard widget, including:
Station ID
Station Name
Revenue
Session Count
Energy Delivered (kWh)
The existing Top Performing Stations dashboard API behavior should remain unchanged and continue returning only the configured top-performing stations.
The new View All API should return all applicable stations for the selected dashboard time range and existing filters.
Maintain the same tenant/company/station-level access restrictions already used by the dashboard APIs.
Apply appropriate sorting so users can easily identify the highest-performing stations.
Frontend / UI Changes
Update the Top Performing Stations widget on the Dashboard.
Current:
Top Performing Stations
Add:
View All
The View All option should be positioned in the widget header, preferably on the right side.
When the user clicks View All:
Open a dedicated page/modal/detailed view containing all stations.
Display the same performance information available in the dashboard widget.
Support scrolling/pagination if the number of stations is large.
Maintain the existing dashboard design, typography, spacing, icons, and theme.
Clearly indicate the station ranking/order.
The existing dashboard widget should continue showing only the top-performing stations.
Expected API Response
Example:
{
"success": true,
"data": {
"stations": [
{
"stationId": 42,
"stationName": "Amarpali Circle",
"revenue": 7946.9900,
"sessionCount": 120,
"energyDeliveredKwh": 276.424000
},
{
"stationId": 41,
"stationName": "Station1",
"revenue": 7500.5000,
"sessionCount": 170,
"energyDeliveredKwh": 276.697000
}
],
"totalCount": 25
}
}
Acceptance Criteria
View All is visible in the Top Performing Stations dashboard widget.
Clicking View All loads the complete station performance list.
All stations are retrieved from the backend API rather than being limited to the dashboard's top-N result.
Station performance fields match the existing Top Performing Stations widget.
Existing Top Performing Stations widget behavior is not affected.
Existing dashboard time-range/filter parameters are respected.
Pagination/scrolling is implemented for large station lists.
Tenant/company/user access restrictions are respected.
UI follows the existing Dashboard theme and styling.
Loading, empty-data, and API-error states are handled properly.
API response is optimized so the dashboard widget itself does not unnecessarily load all stations.
Updated by Yashaditya Singh about 2 hours ago
I completed the Top Performing Stations – View All feature across both the backend and frontend. On the backend, I implemented and updated the API to return data for all stations, added station and energy-based filtering, increased the top-limit handling, and updated sorting to rank stations by Energy Delivered instead of revenue. I also ensured the API uses the same calculation logic as the dashboard for consistent data. On the frontend, I added the View All drawer, implemented station, minimum energy, and maximum energy filters with Apply and Reset actions, added pagination, improved the table styling and header design, and set the drawer width to 70% of the screen. I also added charger-name click functionality and ensured the feature is hidden for Partner users.