Admin-view Dashboard: Add 'Search' Bar at top and 'previous', 'next', and page number components

[koenaguptaa05]

Motivation:
As we finish up the admin-view dashboard page, we need to need to add a few more components for navigation and user search. Admin should be able to easily search for a specific user by searching them up by their name/email in the search bar above the table. There should also be a fixed number of users on one page (similar to only 100 items listed on a clothes website per page). We will only allow up to 25 users per page. This means that if there are 52 users, there will be 3 pages (25, 25, 2). Users should also be able to navigate between different pages.

Acceptance Criteria:

• Add a search bar component above the table.
  • When a name/email is typed, it should display the user
  • if no user is found, it will display nothing
• Add a component for the page number on the bottom of the chart
  • Add logic to only allow up to 25 users on one page.
  • If there are over 25 total users, there should be more than one page.
• Add buttons for previous/next on the left and right of the page numbers
• If user is on the first page, the 'previous' button should be lighter to indicate that it cannot be pressed
• Similarly, if on the last page, the 'next' button should be lighter to indicate that it cannot be pressed
• If there is only one page, both should be lighter to indicate that it cannot be pressed

Chakra Components:
Button for page numbers and Previous+Next Components: https://chakra-ui.com/docs/components/button

Designs:
Search Component:

Page Numbers + Previous/Next Components:

Dashboard:

Buttons Designs/Colors:

Please refer to the Figma for color & font details:
https://www.figma.com/design/hy0oFz7LIcK32a4y10S6KR/BHCHP?node-id=268-4&p=f&t=H66S6nwSwotyPBCv-0