Next.js Path Extractor: Custom Hook for URL Paths & Query Parameters

"use client";

import { usePathname, useSearchParams } from "next/navigation";
import { useMemo } from "react";

export const usePathExtractor = () => {
  const pathname = usePathname();
  const searchParams = useSearchParams();

  const queryParams = useMemo(() => {
    const params: Record<string, string | string[]> = {};
    searchParams.forEach((value, key) => {
      if (params[key]) {
        params[key] = Array.isArray(params[key])
          ? [...params[key], value]
          : [params[key], value];
      } else {
        params[key] = value;
      }
    });
    return params;
  }, [searchParams]);

  const fullUrl = useMemo(() => {
    if (typeof window !== "undefined") {
      return window.location.href;
    }
    return "";
  }, []);

  const basePath = useMemo(() => {
    return pathname.split("/").slice(0, 2).join("/");
  }, [pathname]);

  const isActiveRoute = (route: string) => {
    return pathname.startsWith(route);
  };

  return {
    pathname,
    fullUrl,
    basePath,
    queryParams,
    isActiveRoute,
  };
};