components/Navigation/Progress.tsx

"use client";
import { useRouterContext } from "@/contexts/RouterContext";
import { LinearProgress } from "@mui/material";

export default function Progress() {
    const { isChanging } = useRouterContext();

    if (!isChanging) {
        return <></>;
    }

    return (
        <div className="fixed top-0 left-0 w-[100vw] z-[100000]">
            <LinearProgress />
        </div>
    );
}
1	"use client";
2	import { useRouterContext } from "@/contexts/RouterContext";
3	import { LinearProgress } from "@mui/material";
4
5	export default function Progress() {
6	const { isChanging } = useRouterContext();
7
8	if (!isChanging) {
9	return <></>;
10	}
11
12	return (
13	<div className="fixed top-0 left-0 w-[100vw] z-[100000]">
14	<LinearProgress />
15	</div>
16	);
17	}