marmelab/react-admin · error · Error

useShowController requires an id prop or a route with an /:i

Error message

useShowController requires an id prop or a route with an /:id? parameter.

What it means

useShowController is react-admin's internal hook powering the Show view. It needs to know which record to display: either an explicit `id` prop or an `:id` route parameter. If neither is present it throws because a show view is meaningless without a record id.

Source

Thrown at packages/ra-core/src/controller/show/useShowController.ts:84

    }

    const { isPending: isPendingAuthenticated } = useAuthenticated({
        enabled: !disableAuthentication,
    });

    const { isPending: isPendingCanAccess } = useRequireAccess<RecordType>({
        action: 'show',
        resource,
        enabled: !disableAuthentication && !isPendingAuthenticated,
    });

    const getRecordRepresentation = useGetRecordRepresentation(resource);
    const translate = useTranslate();
    const notify = useNotify();
    const redirect = useRedirect();
    const { id: routeId } = useParams<{ id?: string }>();
    if (!routeId && !propsId) {
        throw new Error(
            'useShowController requires an id prop or a route with an /:id? parameter.'
        );
    }
    const id = propsId != null ? propsId : routeId;
    const { meta, ...otherQueryOptions } = queryOptions;

    const {
        data: record,
        error,
        isLoading,
        isFetching,
        isPaused,
        isPending,
        isPlaceholderData,
        refetch,
    } = useGetOne<RecordType, ErrorType>(
        resource,
        { id, meta },

View on GitHub (pinned to 051f511bb0)

Solutions

1. Pass an explicit id: <Show id={123}> or useShowController({ resource: 'posts', id: 123 })
2. Fix the route so it includes /:id, e.g. <Route path="posts/:id/show" ...> or Resource's default show route
3. If the component is not tied to one record, use useListController or a custom query instead of the show controller

Example fix

// before
<Route path="/posts/show" element={<PostShow />} /> // no :id
// after
<Route path="/posts/:id/show" element={<PostShow />} />

const { id: routeId } = useParams<{ id?: string }>();
if (!routeId && !propsId) throw new Error('Show view requires an id');

const hasId = (p: { id?: Identifier }) => p.id != null;

null

When it happens

Trigger: Calling useShowController() (or <Show>) without an id prop while the current route has no /:id? parameter (e.g. rendering a Show view at a path like /posts/show without :id, or calling the hook directly in a component not routed with an id param).

Common situations: Custom Show pages placed on a route that forgot the :id segment; copying <Show> into a dashboard/widget outside the resource routes; calling useShowController directly in a test without id; upgrading from a version that defaulted id differently.

Related errors

• useEditController requires an id prop or a route with an /:i
• useReferenceFieldController: missing reference prop. You mus
• useNextPrevController was called outside of a ResourceContex
• useGetRecordId could not find the current record id. You nee
• To create a new option, you must pass an onCreate function o

AI-assisted analysis of marmelab/react-admin@051f511bb0 (2026-08-30). Data as JSON: /api/errors/6be35ce3a4346f44. Report an issue: GitHub.