Description:
Currently, the dashboard and analytics pages display important information, but users cannot easily determine when the data was last refreshed or updated.
Adding a "Last Updated" timestamp will improve transparency and help users understand the freshness of the information being displayed. This is especially useful when monitoring compliance status, analytics, and other dynamic data.
Proposed Changes:
•Display a "Last Updated" label on relevant pages.
•Show the timestamp of the most recent successful data fetch.
•Update the timestamp whenever the page data is refreshed or reloaded.
•Format the timestamp in a user-friendly manner.
•Ensure the design remains consistent with the existing UI.
Example:
Last Updated: 11 Jun 2026, 10:30 AM
Files Likely to be Modified:
Frontend
•frontend/src/pages/Dashboard.tsx
Add state to track the last refresh time.
Display the timestamp in the dashboard UI.
•frontend/src/pages/Analytics.tsx
Show the timestamp when analytics data is loaded or refreshed.
Optional Utility File
•frontend/src/utils/date.ts
Add a reusable helper function for formatting timestamps.
Expected Code Changes:
-
Store the current time after a successful API call or page refresh.
-
Create a small UI element to display the timestamp.
-
Format the date and time for readability.
-
Reuse the logic across multiple pages if needed.
Benefits:
•Improves user awareness of data freshness.
•Enhances trust in displayed information.
•Provides a better user experience with minimal changes.
•Beginner-friendly contribution suitable for new contributors.
Description:
Currently, the dashboard and analytics pages display important information, but users cannot easily determine when the data was last refreshed or updated.
Adding a "Last Updated" timestamp will improve transparency and help users understand the freshness of the information being displayed. This is especially useful when monitoring compliance status, analytics, and other dynamic data.
Proposed Changes:
•Display a "Last Updated" label on relevant pages.
•Show the timestamp of the most recent successful data fetch.
•Update the timestamp whenever the page data is refreshed or reloaded.
•Format the timestamp in a user-friendly manner.
•Ensure the design remains consistent with the existing UI.
Example:
Last Updated: 11 Jun 2026, 10:30 AM
Files Likely to be Modified:
Frontend
•frontend/src/pages/Dashboard.tsx
Add state to track the last refresh time.
Display the timestamp in the dashboard UI.
•frontend/src/pages/Analytics.tsx
Show the timestamp when analytics data is loaded or refreshed.
Optional Utility File
•frontend/src/utils/date.ts
Add a reusable helper function for formatting timestamps.
Expected Code Changes:
Store the current time after a successful API call or page refresh.
Create a small UI element to display the timestamp.
Format the date and time for readability.
Reuse the logic across multiple pages if needed.
Benefits:
•Improves user awareness of data freshness.
•Enhances trust in displayed information.
•Provides a better user experience with minimal changes.
•Beginner-friendly contribution suitable for new contributors.