Unable to get results using map in Nextjs wordpress headless cms - wordpress

Question

I am developing headless WordPress with NExtjs.
menuItems is props that contain an object. when I console.log(menuItems ) it shows output in the console similar to "const menu" but when I map "menu" it maps perfectly but when I map menuItems, the site gives me the error that it is not defined.
code under className "navi-2" is not working
<pre>
import Link from "next/link";
function NavBar({ menuItems }) {
console.log(menuItems )
const menu = {
"menuItemse": {
"edges": [
{
"node": {
"uri": "/",
"title": "home link",
"target": null,
"label": "Home"
}
},
{
"node": {
"uri": "/about-us/",
"title": null,
"target": null,
"label": "About Us"
}
},
{
"node": {
"uri": "/portfolio/",
"title": null,
"target": null,
"label": "Portfolio"
}
},
{
"node": {
"uri": "/services/",
"title": null,
"target": null,
"label": "Services"
}
},
{
"node": {
"uri": "/contact-us/",
"title": null,
"target": null,
"label": "Contact Us"
}
}
]
}
}
return(
<>
<nav className="navi">
{menu.menuItemse.edges.map(it => (
<Link href={it.node.uri}><a>{it.node.label}</a></Link>
) )}
</nav>
<nav className="navi-2">
{menuItems.menuItems.edges.map(item => (
<Link href={item.node.uri}><a>{item.node.label}</a></Link>
) )}
</nav>
</>
)
}
export default NavBar
</pre>