Quiero pasar un estado entre páginas en Next.js. Mi App.js está envuelto en un proveedor de contexto así

 import { useRouter } from 'next/router' import { ClickProvider } from '../context/clickContext' function MyApp({ Component, pageProps }) { const router = useRouter() return ( <ClickProvider> <Component {...pageProps} key={router.asPath} /> </ClickProvider> ) } export default MyApp

Aquí está mi proveedor de contexto

 import { createContext, useState } from 'react'; const MenuContext = createContext() export const ClickProvider = ({ children }) => { const [menuEnterPage, setMenuEnterPage] = useState(''); return ( <MenuContext.Provider value={[menuEnterPage]}> {children} </MenuContext.Provider> ); }; export default MenuContext;

Dentro de mi componente de encabezado, quiero configurar menuEnterPage para que sea la ruta de la página en la que el usuario tocó el botón y que los datos persistan entre las páginas.

 import Link from 'next/link' import React, { useContext, useState, useEffect, useRef } from "react"; import { useRouter } from "next/router" import MenuContext from '../context/clickContext'; export default function Header({mobileHidden, router = useRouter()}) { const [isActive, setActive] = useState(mobileHidden); const [menuEnterPage, setMenuEnterPage] = useContext(MenuContext); const handleToggle = () => { setActive(!isActive); if (isActive) { } else { setMenuEnterPage(router.asPath) console.log(menuEnterPage) } }; return ( <header> <button className="md:hidden" onClick={handleToggle}>{isActive ? "Menu" : "Exit" }</button> </header> ); }

Actualmente, cuando ejecuto el proyecto y hago clic en el botón, falla con un error

TypeError: setMenuEnterPage no es una función