Favourokerri / Codebadger

0 stars 0 forks source link

Course search #1

Open Favourokerri opened 1 week ago

Favourokerri commented 1 week ago

Issue: Enable Course Search with Suggestions

Feature Request

Description:
We need to implement a search functionality for courses. When users begin typing in the search bar, they should see a dropdown of suggested courses that match the entered letters. This will improve the user experience by helping users quickly find the courses they're looking for.


Requirements:

  1. Search Bar: Add a search bar where users can type course names or keywords.
  2. Dynamic Suggestions: As the user types, show a dropdown of course suggestions that match the input. The list should be updated dynamically with each letter typed.
  3. Matching Logic:
    • Search results should include courses where the name contains the typed letters (partial matching).
    • Suggestions should be limited to a maximum of 5 to avoid overwhelming the user.
  4. User Experience:
    • The dropdown should disappear when the user clears the search input.
    • The user should be able to select a course from the dropdown using both the mouse and keyboard (arrow keys).
    • When a user selects a course, the page should redirect to the course's detail page.
  5. Error Handling:
    • If no courses match the entered letters, display a message like "No courses found."

Acceptance Criteria:

  1. Users can type in the search bar and see a list of suggested courses that match their input.
  2. Suggestions update in real time as the user types.
  3. Users can select a suggestion from the dropdown, and upon selection, they are taken to the course details page.
  4. If no matches are found, display an appropriate message (e.g., "No courses found").
  5. Ensure smooth UX transitions, such as hiding the dropdown when the search input is cleared.

Considerations:


Favourokerri commented 1 week ago

Will start working on it on Monday