import {
  useLocation
} from "react-router-dom-v5-compat";
import { useRouter } from "next/router";
import { useRef } from "react";

export const usePreviousRoute = () => {
  const isReactRouterDOMRouting = typeof useLocation === "function";
  const useBrowserRouter = isReactRouterDOMRouting ? useLocation : useRouter;
  const router = useBrowserRouter();

  const ref = useRef(null);

  useEffect(() => {
    () => {
       ref.current = router.key ?  router.pathname : router.asPath
     }
  }, [location.key])

  if ("on" in (router.events || {})) {
    router.events.on("routeChangeStart", () => {
      ref.current = router.asPath;
    });
  }

  return ref.current;
};

import {
  useHistory
} from "react-router-dom";
import {
  useNavigate
} from "react-router-dom-v5-compat";
import { useRouter } from "next/router";

const useHistoryRouter = () => {
    const isReactRouterDOMRouting = typeof useHistory === "function";
    const useBrowserRouter = isReactRouterDOMRouting ? useHistory : useRouter;
    const router = useBrowserRouter();
    const navigator = typeof useNavigate === "function" ? useNavigate() : null;
    
    return {
      navigateTo (urlPath) {
         if (navigator !== null) {
          return navigate(urlPath)
         } else {
           return router.push(urlPath);
        }
      },
      get pathname () {
         if (Boolean(router.location)) {
            return router.location.pathname;
         } else {
           return router.pathname;
         }
      },
      get state () {
         if (Boolean(router.location)) {
            return router.location.state;
         } else {
           return null;
         }
      },
      get search () {
        if (Boolean(router.location)) {
            const searchParams = new URLSearchParams(
              router.location.search
            );
            return Object.fromEntries(
              searchParams.entries()
            );
         } else {
           return router.query;
         }
      },
      navigateBack () {
         if (typeof router.back === "function") {
           router.back();
         } else {
           router.goBack();
         }
      },
      reload () {
         if (typeof router.reload === "function") {
           return router.reload();
         } else {
           return router.location.reload()
         }
      }
    };
};