marmelab/react-admin · error

useShowContext must be used inside a ShowContextProvider

Error message

useShowContext must be used inside a ShowContextProvider

What it means

useShowContext returns the ShowControllerResult (record, loaded state, etc.) from the ShowContext, which is provided by <ShowContextProvider> (used internally by <Show> and <ShowBase>). The error is thrown when the hook runs with no ShowContext above it, meaning the component is not inside a show view.

Source

Thrown at packages/ra-core/src/controller/show/useShowContext.tsx:23

import { ShowControllerResult } from './useShowController';

/**
 * Hook to read the show controller props from the ShowContext.
 *
 * Used within a <ShowContextProvider> (e.g. as a descendent of <Show>).
 *
 * @returns {ShowControllerResult} create controller props
 *
 * @see useShowController for how it is filled
 */
export const useShowContext = <
    RecordType extends RaRecord = any,
    ErrorType = Error,
>(): ShowControllerResult<RecordType, ErrorType> => {
    const context = useContext(ShowContext);
    // Props take precedence over the context
    if (!context) {
        throw new Error(
            'useShowContext must be used inside a ShowContextProvider'
        );
    }
    return context as ShowControllerResult<RecordType, ErrorType>;
};

View on GitHub (pinned to 051f511bb0)

Solutions

1. Render the component inside <Show> or <ShowBase> so ShowContextProvider is present
2. If no show view exists, use useRecord() or useGetOne() instead
3. In tests, wrap: <ShowContextProvider value={mockControllerResult}>...</ShowContextProvider>

Example fix

// before
export const Title = () => { const c = useShowContext(); ... } // rendered outside Show
// after
<Show resource="posts"><PostTitle /></Show> // hook now inside ShowContextProvider

const useMaybeShowContext = () => useContext(ShowContext); // returns undefined outside provider; check before narrowing

When it happens

Trigger: Calling useShowContext() in a component rendered outside a Show/ShowBase tree: standalone pages, list views, custom routes, or tests without a ShowContextProvider wrapper. Note ShowBase itself consumes the controller internally — hooks like this only work in children of a provider.

Common situations: Moving a record-detail child component out of <Show> to be reused elsewhere; rendering the component in a portal-based modal rooted in another context-free tree; unit tests with renderHook lacking the provider; using useShowContext where useRecord or useGetOne was intended.

Related errors

• useCreateSuggestionContext must be used inside a CreateSugge
• useArrayInput must be used inside an ArrayInputContextProvid
• useSimpleFormIterator must be used inside a SimpleFormIterat
• useSimpleFormIteratorItem must be used inside a SimpleFormIt
• useEditContext must be used inside an EditContextProvider

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