Full-Stack React Projects - Second Edition

The Search component

The first use case for applying the categories API and search API together to perform a search action is in the Search component. This component, once implemented and functional, will render as shown in the following screenshot:

This Search component provides the user with a simple form containing a search input text field and a dropdown of the category options received from a parent component that will retrieve the list using the distinct categories API. The code to render this search form view will be as follows:

mern-marketplace/client/product/Search.js:

<TextField id="select-category" select label="Select category" ...