Sidebar открывается посредством UseState по нажатию на бургер, однако не закрывается

navigation.jsx

import { useState } from "react"
import Burger from "../UI/busrger.jsx"
import MenuByBurger from "../UI/menuByBurger"
import store from "../../core/redux/store"
import { useSelector } from "react-redux"
const Navifation: React.FC = () => {
    let namePlayer = useSelector(state => state.auth.name)
    const [menuActive, setMenuActive] = useState(false)
    return <div className="NAVBAR">
    <div className="burgerOnclick"  >
    <Burger menu={menuActive} setActive={setMenuActive} />
    {/* <div className="burger" onClick={() => setMenuActive(!menuActive)} >
        <img src="/assets/img/menu_24px.png"></img>
    </div> */}
    </div>
    
   <div className="LogoBaske"> <img src="/assets/img/logo.png" className="LogoBaske-1"></img></div>
   <div className='NameACC'>
       
       <div className="c">
           {/* John Smith */}
           {namePlayer}
           </div>
       <div className="accLogo"><img src="/assets/img/profile.png"></img></div>
   </div>
   <MenuByBurger active={menuActive} /> 
    </div>
    

}
export default Navifation

Компонент где создается useState и куда вставляется компоненты Burder и menuByBurger. busrger.jsx

import { useState } from "react"
import React from 'react'
const Burger:React.FC = ({menu, setActive}) =>  {
    
    return <div className="burger" onClick={() => setActive(!menu)} >
        <img src="/assets/img/menu_24px.png"></img>
    </div>
}

export default Burger

Компонент где создан сам "бургер" и где по клику установлено переключение состояния.

menuByBurger.jsx

import SideBar from "../components/sideBar.jsx"
import { useLocation } from "react-router-dom"
import { Link } from "react-router-dom"
import { useState } from "react"
import Burger from "./busrger.jsx"
function MenuByBurger ({active}) {
   
    let location = useLocation()
    return <div className={active ? "Menu active" :  "Menu"}>
        <div className="MenuName">
            <Burger/>
       <div className="MenuName_logo"><img src="assets/img/profile.png"></img></div> 
       <div className="sideBarForMenu">
        <SideBar/>
        </div>
        </div>
      
    </div>
}

export default MenuByBurger

Компонент где меняется класс в зависимости от состояния state, созданного в "navigation.jsx".

По итогу sideBar открывается при нажатии на бургер, однако при нажатии на бургер при открытом sideBar он не закрывается, и в консоль выводит ошибку:

busrger.jsx:5 Uncaught TypeError: setActive is not a function

Подскажите пожалуйста в чем ошибка? Почему изменение state работает только в одну сторону, а обратно уже не изменяет.