Bug #2665
Enhancement on UI Changes , mobile ui changes, add the session guid filter, agreement page tabs changes, wallet report serach the user by name, email and phone, Sorting on whole Project
Description
Enhancement on UI Changes , mobile ui changes, add the session guid filter, agreement page tabs changes, wallet report serach the user by name, email and phone, Sorting on whole Project
Updated by Shreya Agarwal about 2 months ago
check dashboard permissions for Reseller role and users and ,
Also swapped the tab order in the Agreement Templates component, making "Generated Agreements" the first tab and "Agreement Templates" the second tab. updated the tab icons and labels accordingly.
And added search functionality to both the Active Sessions and Excluded tabs in the Session Management page. For Active Sessions, I integrated a search field after the "Filter by Chargers" dropdown with full API integration.
Also implemented a dropdown-based search bar in the Wallet Report component, mirroring the User Management design. Added search functionality for Name, Email, and Phone with field-specific API parameters, fixed the search bar width for better UI consistency.
Also added a new "User Name" column to the Support Management ticket table to display the ticket creator's name (createdByUserName). I updated the table headers, column widths, and table body to show this information between the Status and Reported At columns. I also modified the Issue interface in issueApi.ts to properly map the createdByUserName field from the API response.
Updated by Shreya Agarwal about 2 months ago
added an informational note to the Station Setup page to clarify that only stations with "Under Construction" or "Maintenance" status are displayed in the dropdown list.
The automatic default station selection for the Charging Error Report has been successfully implemented. The page now automatically selects the first station from the list on load, eliminating the "Station Name is required" validation error and loading data immediately without user intervention.
Updated by Yashaditya Singh about 2 months ago
Implemented the required UI changes for the PKPI formula configuration. Updated the formula display and validation behavior according to the requirements and performed testing to ensure the changes function correctly across the affected screens.
Updated by Shreya Agarwal about 2 months ago
fixed the "Station Name is required" validation error in the Charging Error Report. The issue was caused by the API calling before the default station selection completed. Added an initialization flag (isInitialLoadComplete) that prevents the API from firing until the first station is automatically selected. The page now loads with a loading spinner, auto-selects the first station, then fetches error data - eliminating the validation error completely
Also today I Implemented session statistics retrieval for dashboard cards in Session Management:
Created new API integration (/api/v1/reporting/session/stats) to fetch active sessions, available chargers, total sessions, and abandoned sessions counts in a single call
Added dynamic count badge on Abandoned tab matching the Active Sessions tab UI pattern
Integrated real-time stats binding to the three dashboard cards (Active Sessions, Available Chargers, Total Sessions)
Implemented vendor filter support for stats to reflect company/vendor-specific data
Added automatic stats refresh when vendor filter changes.
Also Implemented auto-selection of first charging station on page load. Added logic to automatically select the first station from the API response when the Station Pending Tasks page loads, eliminating the need for manual station selection. The station's pending tasks now load immediately without user interaction.
Also I reviewed user management module on the live environment and verified the role & permission for all user assigned to partner role . checked whether the required dashboard permissions were correctly assigned to each partner user . The review helped ensure that partner users have the appropriate dashboard visibility and permissions.
Updated by Piyush Vijay about 1 month ago
- Subject changed from mobile ui changes, add the session guid filter, agreement page tabs changes, wallet report serach the user by name, email and phone to Enhancement on UI Changes , mobile ui changes, add the session guid filter, agreement page tabs changes, wallet report serach the user by name, email and phone, Sorting on whole Project
- Description updated (diff)
Updated by Shreya Agarwal about 1 month ago
completed sorting implementations for dropdown menus across various modules in the EVCSMS platform. The work involved adding alphabetical sorting to dropdown options in approximately 15-20 different pages including Location List, station setup , monthly closing , station pending task, Session Management, Station Service, Payout Reports, Support Management, User Management, Agreement Templates, Activity Logs, Audit Reports, Charger Health Score, Station Charger Utilization, Estimate Price Calculation, Station Pending Tasks, Push Notifications, My Assigned Issues, and Scheduled Push Notifications.
Key dropdowns sorted include status filters, category filters, station selectors, role selectors, and various other filter dropdowns across the platform. All sorting was implemented using localeCompare with case-insensitive comparison, ensuring consistent alphabetical ordering without affecting any existing functionality. The changes improve user experience by making dropdown options easier to locate and select.
Updated by Shreya Agarwal about 1 month ago
worked on the sorting implementation for the dropdown menu and reviewed the related code to understand its functionality within the project. verified the implementation on the local environment, then tested it on the development server, and also on the live environment to ensure consistency across all stages. Additionally, exploring the React codebase to better understand the project structure and UI implementation.
also Today I try to understand that chat system conversation types:
DIRECT (1-on-1 chats between two people),
GROUP (team chats where you manually add/remove members), and
CHANNEL .
Every conversation has a unique thread Id that acts like a room key - we use this same ID for sending messages, uploading files, and everything else.
Updated by Shreya Agarwal about 1 month ago
implemented clickable station name functionality in the Advanced Analytics Widgets dashboard component. The work involved modifying the AdvancedAnalyticsWidgets.tsx component to make station names clickable in three key cards: Top Earning Stations, Top Stations by Usage, and Peak Hours — Stations.
added the StationDetailsPanel component and integrated the useStationDetailsPanel hook to enable the station details panel to open when users click on any station name. The changes were applied to both stacked (mobile) and non-stacked (desktop) versions of the list items, ensuring consistent behavior across all screen sizes. Each station name now appears as an underlined link in the brand's primary color with a hover effect, providing clear visual feedback that the element is interactive.
Additionally, I updated the Dashboard.tsx parent component to pass the availableStations data (the chargingStations state) as a prop to AdvancedAnalyticsWidgets, which is essential for the panel to display the correct station information. The API response confirmed that stationId values exist (42, 1, 7, 8), so the click handlers are properly wired.
Updated by Shreya Agarwal about 1 month ago
added Station Details Panel functionality to multiple pages across the application, making station names clickable with consistent UI styling.
Pages Updated:
StationServicePage.tsx
StationTechVisitPlanPage.tsx - Added clickable destination station names in the tech visit plan table
AgreementTemplates.tsx - Made station names clickable in the Generated Agreements tab
RepeatedCustomerReport.tsx - Added clickable station names in the main report table
OcpiVendorSyncReport.tsx - Made station names clickable with proper null handling
Implementation Details:
Added StationDetailsPanel component and useStationDetailsPanel hook to each page
Created handleStationClick callback to open the panel with station ID
Applied consistent UI styling (primary brand color, underline, hover effects)
Fixed TypeScript errors by adding null/undefined fallbacks
Updated by Shreya Agarwal about 1 month ago
worked on the multilingual translation setup for several new UI modules and messages across the application. Added and verified translation JSON entries for Setup History, Station Selection, QR Code Management, Faulted Session Filters, Reporting messages, and Partnership Agreement Management screens and etc . Ensured consistency across all supported languages and validated translation key structures.
Updated by Shreya Agarwal about 1 month ago
I worked on improving the dashboard user experience by adding an information button to the "Users Active (Period)" card. The button opens a popover that displays user activity definitions and relevant notes, making the metrics easier to understand.
I also increased the font size of the sub-metrics in the Active Sessions card, to improve readability. Additionally, I updated the info button styling to align with the brand theme by using the primary color and a lighter background, and adjusted its positioning to appear correctly in the top-right corner of the card.
The popover layout was refined to display only the required note section and reduce unnecessary blank space, resulting in a cleaner and more compact design.
also Added the same info button pattern to the "Total Active Users (All-Time)" card for consistency across both user metrics cards. Reduced the font size of the popover content and adjusted padding/margins to minimize empty space between the information text and the close button. Applied the branded primary color to both info buttons using the getBrandedColor('primary') function, ensuring they match the tenant's brand colors consistently across the dashboard.
Updated by Shreya Agarwal about 1 month ago
Successfully enhanced the dashboard user experience by adding sub-metrics to the Active Sessions card in both Dashboard and DashboardV2, displaying "Avg sessions (per hrs)" and "Avg started (per hrs)" values. Increased font sizes of sub-metric values and labels without changing card size, ensuring all cards remain consistent and properly aligned. Added the "Total Active Users (All-Time)" card with an info button and popover showing detailed user activity definitions, matching the V2 dashboard design. Implemented proper grid layout for sub-metrics to display left and right aligned using gridTemplateColumns: '1fr 1fr' for optimal spacing. Applied branded primary colors to info buttons and optimized popover spacing for a cleaner interface. All changes were implemented without breaking existing functionality, ensuring a seamless user experience across both dashboard versions.
Enhance dashboard metrics display and update analytics service
- Updated StatCard component to use a grid layout for sub-metrics.
- Adjusted typography styles for better readability.
- Added subMetrics prop to Dashboard component for average session metrics.
- Extended DashboardAnalyticsResponse interface to include average session data.