Search and filter Custom Component

[Atikpui007]

Summary

This Pull request is the step to adding a Custom Search and Filtering logic component to the application which can be used for both Drivers and Students.

• API calls are made in the Parent component to easily pass filtered items to all components that rely on them like pagination, table and cards. These calls are made once and the searching and filtering are done on the client side so as to improve perfomance
• Search and Filter component is a custom component which handles fuzzy search and more intuitive filtering
• I added the stats box to improve the user experience so users can know how much data they are working with
• All logic for searching and filtering is done in the search and filter so as to be generic and work with other sections, all logic for handling the api calls to retrieve the data is done in the parent component.

Checklist

• Implement Custom Search and Filter Component
• Fuzzy search
• Filtering with nested options
• Add Stats Box
• Improve styling for stats box and search and filter component
• Merge with master and move pagination to the parent component of employees

Test Plan

Screen.Recording.2024-11-11.at.2.08.22.AM.mov

Notes

Breaking Changes

Working on design changes to allow the Search And Filter component to look more aesthetic

Mini visual bug in the students page which occurs when clicking on the filter dropdown might be a rendering issue not sure how to fix it suggestions welcome

[dti-github-bot]

[diff-counting] Significant lines: 1158. This diff might be too big! Developer leads are invited to review the code.

[namanhboi]

Hi Desmond, I pull the branch and the component works as intended. I'll use this to revamp the search and filter for students and employees in the future.

[raissaji]

lgtm