I implement car auction, and I have a car items list inside the catalog component. I have buttons that specify the type of car (suv, bike, passenger..)
[![enter image description here](https://i.stack.imgur.com/hHZOp.png)](https://i.stack.imgur.com/hHZOp.png)

when I click on any of the buttons, I want to redirect to catalog with a filtered list of cars with according typeCar.
So data with objects is in App.js
I have a Catalog component inside App.js
The catalog component has a list of CarItems (CarItem is a child in Catalog that receives props and shows info about every car (I used the map to show the whole list).
The problem that the catalog is not filtered.
I declared Route in App.js.

```
 <Route
        exact
        path="/catalog/typeCar"
        render={({ match }) => (
          <Catalog item={data.find((item) => String(item.typeCar) === String(match.params.typeCar))} />
        )}

```

buttons are in another component, and I created links for each:

```
      <Link  to={`/catalog/passanger`}><img src={img_4} className='white-fill mr-2' width='70px'/></Link> 

      <Link  to={`/catalog/bike`}> <img src={img_1} width='70px' className='white-fill mr-2' /></Link>

      <Link  to={`/catalog/suv`}> <img src={img_2} width='70px' className='white-fill' /></Link>

      <Link  to={`/catalog/bus`}> <img src={img_3} width='70px' className='white-fill ml-2' /></Link>

 </Col>

```

So I click on a button and see URL is changed: `http://localhost:3000/catalog/passanger`
, but there is no info on the page. it's not redirecting to the Catalog page (component) with a list of CarItems