docs/contexts/RouterContext.tsx

"use client";

import { usePathname } from "next/navigation";
import {
    Dispatch,
    PropsWithChildren,
    SetStateAction,
    createContext,
    useContext,
    useEffect,
    useState,
} from "react";

type RouterContextData = {
    isChanging: boolean;
    setIsChanging: Dispatch<SetStateAction<boolean>>;
};

const RouterContext = createContext<RouterContextData>({} as RouterContextData);

export function useRouterContext() {
    return useContext(RouterContext);
}

export function RouterContextProvider({ children }: PropsWithChildren) {
    const [isChanging, setIsChanging] = useState(false);
    const pathname = usePathname();

    useEffect(() => setIsChanging(false), [pathname]);

    return (
        <RouterContext.Provider value={{ isChanging, setIsChanging }}>
            {children}
        </RouterContext.Provider>
    );
}
1	rakinar2	575	"use client";
2
3			import { usePathname } from "next/navigation";
4			import {
5			Dispatch,
6			PropsWithChildren,
7			SetStateAction,
8			createContext,
9			useContext,
10			useEffect,
11			useState,
12			} from "react";
13
14			type RouterContextData = {
15			isChanging: boolean;
16			setIsChanging: Dispatch<SetStateAction<boolean>>;
17			};
18
19			const RouterContext = createContext<RouterContextData>({} as RouterContextData);
20
21			export function useRouterContext() {
22			return useContext(RouterContext);
23			}
24
25			export function RouterContextProvider({ children }: PropsWithChildren) {
26			const [isChanging, setIsChanging] = useState(false);
27			const pathname = usePathname();
28
29			useEffect(() => setIsChanging(false), [pathname]);
30
31			return (
32			<RouterContext.Provider value={{ isChanging, setIsChanging }}>
33			{children}
34			</RouterContext.Provider>
35			);
36			}