Search Bar

[eduskx]

Value proposition

As a DIY enthusiast I want to search for projects In order to find projects I'm interested in

Description

Acceptance criteria

• Search projects by title
• Show all projects when search bar is empty
• Show message when no projects match the search criteria
• Search results must be shown in real-time

  Tasks

• [x] Create feature/searchbar branch
• [x] Create SearchBar component
• [x] Create useState const [searchInput, setSearchInput] = useState("")
• [x] Convert searchInput into lower case: function inputHandler (event) { const lowerCasedInput = event.target.value.toLowerCase(); setSearchInput(lowerCasedInput) };
• [x] Map in ProjectsList.js through searchInput
  • [x] Return all projects if searchInput is empty

[e-Steffen]

Great work. LGTM! Only one note: The wireframe suggests that in addition to the search (input field), filtering by category (by clicking) is also possible, but this does not seem to be part of this ticket, so adjust the wireframe if necessary.