Next.js custom router hook

custom-router-hook.ts

import { useRouter } from "next/router";
import { useEffect, useState } from "react";

const PATH = "discovery";

const useDiscoveryRouter = () => {
  const [organisation, setOrganisation] = useState<string>("");
  const [workspace, setWorkspace] = useState<string>("");
  const router = useRouter();

  useEffect(() => {
    setOrganisation(router.query.organisation as string);
    setWorkspace(router.query.workspace as string);
  }, [router.query]);

  const pathPrefix = `/${organisation}/${workspace}/${PATH}`;

  return {
    landingPage() {
      return pathPrefix;
    },
    createDiscovery() {
      return pathPrefix + "/create";
    },
    editDiscovery(discovery: string) {
      return pathPrefix + `/${discovery}`;
    },
  };
};

export default useDiscoveryRouter;