marmelab/react-admin · error · Error

Cannot use <ListGuesser> outside of a ResourceContext

Error message

Cannot use <ListGuesser> outside of a ResourceContext

What it means

<ListGuesser> infers the list fields from the record data of the current resource. It reads the resource name from ResourceContext; the inference code checks `resource` and throws when it is undefined, because it cannot fetch sample records or build the child element without a resource.

Source

Thrown at packages/ra-ui-materialui/src/list/ListGuesser.tsx:118

    useEffect(() => {
        setChild(null);
    }, [resource]);

    useEffect(() => {
        if (data && data.length > 0 && !child) {
            const inferredElements = getElementsFromRecords(
                data,
                listFieldTypes
            );
            const inferredChild = new InferredElement(
                listFieldTypes.table,
                null,
                inferredElements
            );
            const inferredChildElement = inferredChild.getElement();
            const representation = inferredChild.getRepresentation();
            if (!resource) {
                throw new Error(
                    'Cannot use <ListGuesser> outside of a ResourceContext'
                );
            }
            if (!inferredChildElement || !representation) {
                return;
            }

            setChild(inferredChildElement);

            const components = ['List']
                .concat(
                    Array.from(
                        new Set(
                            Array.from(representation.matchAll(/<([^/\s>]+)/g))
                                .map(match => match[1])
                                .filter(component => component !== 'span')
                        )
                    )

View on GitHub (pinned to 051f511bb0)

Solutions

  1. Render <ListGuesser> only inside a <Resource name="..." list={ListGuesser}> route within <Admin>.
  2. If used standalone, wrap it: `<ResourceContextProvider value="posts"><ListGuesser/></ResourceContextProvider>`.
  3. Check the resource name is registered in <Admin> so its routes (and context) exist.

Example fix

// before
export const MyList = () => <ListGuesser />;
// after
import { ResourceContextProvider } from 'react-admin';
export const MyList = () => (
  <ResourceContextProvider value="posts">
    <ListGuesser />
  </ResourceContextProvider>
);
Defensive patterns

Strategy: validation

Validate before calling

const resource = useResourceContext();
if (!resource) return <div>ListGuesser must be inside a Resource</div>;
return <ListGuesser />;

Type guard

const inResourceContext = (v: string | undefined): v is string => typeof v === 'string' && v.length > 0;

Prevention

When it happens

Trigger: Rendering <ListGuesser> outside a <Resource> definition or outside the react-admin <Admin> context, e.g. in a standalone storybook route or a custom page that never sets ResourceContext.

Common situations: Using ListGuesser in a demo page outside <Admin>; forgetting to declare the resource in <Admin> so no ResourceContext provider wraps the route; rendering ListGuesser inside a custom layout before the resource context is set.

Related errors


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