Error: Objects are not valid as a React child (found: object with keys {pathname, search, hash, state}). If you meant to render a collection of children, use an array instead.

panadería.js

 import React from "react"; import { Link } from "react-router-dom"; import "../Styles/Filter.css"; function Bakery(props){ return( \<div\> \<Link to='/details' className="btn"\> \<div className="row result-section ms-md-3 mb-3 p-4"\> \<div className="col-12 col-sm-12 col-md-6 col-lg-3"\> \<img className="thumb" src={require("../Assets/breakfast.jpg").default} alt="Restaurant Thumb" /\> \</div\> \<div className="col-12 col-sm-12 col-md-6 col-lg-9"\> <h3> {props.name}</h3> <h5> {props.place}</h5> <h6> {props.location}</h6> \</div\> <hr className="line-break mt-3" /> \<div className="row"\> \<div className="col-12 col-sm-12 col-lg-4"\> \<table className="table-transparent"\> \<thead\> \<tr\> \<th scope="row"\>CUISINES:\</th\> \<td\>{props.cuisine}\</td\> \</tr\> \</thead\> \<tbody\> \<tr\> \<th scope="row"\>COST FOR TWO:\</th\> \<td\>{props.cost}\</td\> \</tr\> \</tbody\> \</table\> \</div\> \</div\> \</div\> \</Link\> \</div\>); } export default Bakery;

Filtro.js

 <Bakery name="The Big Chill Cakery" place="FORT" location="Shop 1, Plot D, Samruddhi Complex, Chincholi …" cuisine="Bakery" cost={700}/>