Expose useRouteId hook

[pierophp]

The useLoaderData hook provides access to the loader data for the current route. However, there’s currently no direct way to get the ID of the current route (useLoaderData uses this internally).

I want to get the immediate parent of the current route, so I want to retrieve the current match from useMatches() by ID (imagine a component that is used in multiple routes and the id changes),

Why not expose useRouteId?

I would like to do this in my code:

import { useMatches, useRouteId } from "react-router";

export function useParentMatch(level = 1) {
  const matches = useMatches();
  const routeId = useRouteId();

  const currentMatchIndex = matches.findIndex((match) => match.id === routeId);
  const parentMatch = matches[currentMatchIndex - level];

  return parentMatch;
}

const parentMatch = useParentMatch();