Feat hng41 userdashboard

[Martins100-Tmd]

Description

Closes #issue_number_here

Changes proposed

What were you told to do?

1. Develop the User Dashboard Page based on the provided design and requirements.
2. Implement a responsive layout that adapts to different screen sizes.
3. Create the header with navigation menu, search functionality, and user profile display.
4. Implement the date range selector with download functionality.
5. Design and populate the key metrics section with dynamic data.
6. Create the revenue overview graph with proper scaling and labeling.
7. Implement the Recent Sales list with customer avatars and transaction amounts.
8. Develop the sidebar navigation with active state indication.
9. Ensure all data is properly fetched and displayed from the backend.
10. Implement any necessary animations or transitions for a smooth user experience.
11. Add appropriate alt text and aria labels for accessibility.
12. Optimize the page for performance, considering lazy loading for non-critical elements.

What did you do?

• Develop the User Dashboard Page based on the provided design and requirements.
• Implement a responsive layout that adapts to different screen sizes.
• Create the header with navigation menu, search functionality, and user profile display.
• Implement the date range selector with download functionality.
• Design and populate the key metrics section with dynamic data.
• Create the revenue overview graph with proper scaling and labeling.
• Implement the Recent Sales list with customer avatars and transaction amounts.
• Develop the sidebar navigation with active state indication.
• Ensure all data is properly fetched and displayed from the backend.
• Implement any necessary animations or transitions for a smooth user experience.
• Add appropriate alt text and aria labels for accessibility.
• Optimize the page for performance, considering lazy loading for non-critical elements.

Check List (Check all the applicable boxes)

🚨Please review the contribution guideline for this repository.

• [ ] My code follows the code style of this project.
• [ ] This PR does not contain plagiarized content.
• [ ] The title and description of the PR is clear and explains the approach.
• [ ] I am making a pull request against the dev branch (left side).
• [ ] My commit messages styles matches our requested structure.
• [ ] My code additions will fail neither code linting checks nor unit test.
• [ ] I am only making changes to files I was requested to.

Screenshots/Videos