[FEATURE] Develop and Implement Search and Filter Functionalities on Careers Page

[SilverBeing]

Develop the necessary components and implement functionalities for searching and filtering job listings on the careers page. The search functionality should include suggested keywords as the user types and allow searching by location with suggested keywords displayed in a dropdown. Integrate these functionalities with the appropriate API endpoints to ensure real-time and accurate search results.

Purpose Users should be able to search and filter job listings on the careers page by categories and locations. This functionality will help users find relevant job listings more efficiently by using suggested keywords and integrated search capabilities.

Acceptable Criteria

Requirements

• Search Bar with Suggested Keywords:
  • Develop a search bar that suggests keywords for job titles and categories as the user types.
  • Integrate the search bar with the appropriate API endpoint to fetch and display suggested keywords.
• Location Search Bar with Suggested Keywords:
  • Develop a location search bar that suggests keywords for locations as the user types.
  • Integrate the location search bar with the appropriate API endpoint to fetch and display suggested locations.
• Implement search functionality to find job listings by title, category, and location with the appropriate API endpoints.
• Implement filter functionality to refine job listings by categories with the appropriate API endpoints.
• Ensure the search and filter functionalities update the displayed job listings in real-time.
• Ensure the search bar, location search bar, and filter components are responsive and adapt well to different screen sizes
• Ensure the components and functionalities match the provided design specifications.

Tasks

• [ ] Develop a search bar for job titles and categories with suggested keywords displayed in a dropdown.
• [ ] Develop a location search bar with suggested keywords displayed in a dropdown
• [ ] Implement search functionality to find job listings by title and location.
• [ ] Implement filter functionality to refine job listings by categories.
• [ ] Integrate the search bar and location search bar with the appropriate API endpoint to fetch suggested keywords.
• [ ] Ensure the search bar, location search bar, and filter components are responsive
• [ ] Ensure consistency across browsers and devices.

Deadline: Friday 10pm

Note

• Ensure code quality through proper code structure and comments.
• Provide clear documentation on component usage and integration.
• Ensure smooth integration with existing components on the careers page.

Images and Figma Links https://www.figma.com/design/VEItfX6St5NSAqqNHImcxD/HNG-Boilerplate-Designs?node-id=417-23283&m=dev

[Temiloluwagboyega]

Pls excuse me, the figma design is not related to the task above

[SilverBeing]

https://www.figma.com/design/VEItfX6St5NSAqqNHImcxD/HNG-Boilerplate-Designs?node-id=1666-52812&m=dev @Temiloluwagboyega The designers are moving things around

[Temiloluwagboyega]

Good evening the design can't bee accessed by dev mode

On Fri, Jul 19, 2024 at 12:39 PM Silver Idahosa @.***> wrote:

https://www.figma.com/design/VEItfX6St5NSAqqNHImcxD/HNG-Boilerplate-Designs?node-id=1666-52812&m=dev @Temiloluwagboyega https://github.com/Temiloluwagboyega The designers are moving things around

— Reply to this email directly, view it on GitHub https://github.com/hngprojects/hng_boilerplate_remix/issues/60#issuecomment-2238958370, or unsubscribe https://github.com/notifications/unsubscribe-auth/BFYFGJGDNKHS564ZRMIUJDDZND3H3AVCNFSM6AAAAABLCPCIL6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDEMZYHE2TQMZXGA . You are receiving this because you were mentioned.Message ID: @.***>

[Temiloluwagboyega]

Thanks, it can't be viewed on dev mode

[shuaibu-shehu]

@Temiloluwagboyega hi there, are you done with your task, i need to ionclude it in the career page

[Temiloluwagboyega]

almost thru am sorry electricity here is not good