var _NProgressBar;
import * as React from 'react';
import { debounce } from '@mui/material/utils';
import { useRouter } from 'next/router';
import NProgress from 'nprogress';
import NProgressBar from "./NProgressBar.js";
import { jsx as _jsx } from "react/jsx-runtime";
const nProgressStart = debounce(() => {
  NProgress.start();
}, 200);
function nProgressDone() {
  nProgressStart.clear();
  NProgress.done();
}
export function NextNProgressBar() {
  const router = useRouter();
  React.useEffect(() => {
    const handleRouteChangeStart = (_url, {
      shallow
    }) => {
      if (!shallow) {
        nProgressStart();
      }
    };
    const handleRouteChangeDone = (_url, {
      shallow
    }) => {
      if (!shallow) {
        nProgressDone();
      }
    };
    router.events.on('routeChangeStart', handleRouteChangeStart);
    router.events.on('routeChangeComplete', handleRouteChangeDone);
    router.events.on('routeChangeError', handleRouteChangeDone);
    return () => {
      router.events.off('routeChangeStart', handleRouteChangeStart);
      router.events.off('routeChangeComplete', handleRouteChangeDone);
      router.events.off('routeChangeError', handleRouteChangeDone);
    };
  }, [router]);
  return _NProgressBar || (_NProgressBar = /*#__PURE__*/_jsx(NProgressBar, {}));
}