marmelab/react-admin · error · Error

DatagridConfigurable does not support the optimized prop

Error message

DatagridConfigurable does not support the optimized prop

What it means

<DatagridConfigurable> lets end users show/hide and reorder columns via preferences. It does not implement the row-expansion virtualization path that `optimized` enables on the plain <Datagrid>, so the component rejects the `optimized` prop up front instead of silently misbehaving.

Source

Thrown at packages/ra-ui-materialui/src/list/datagrid/DatagridConfigurable.tsx:40

 *
 * export const PostList = () => (
 *     <List>
 *         <DatagridConfigurable>
 *             <TextField source="id" />
 *             <TextField source="title" />
 *             <TextField source="author" />
 *             <TextField source="year" />
 *         </DatagridConfigurable>
 *     </List>
 * );
 */
export const DatagridConfigurable = ({
    preferenceKey,
    omit,
    ...props
}: DatagridConfigurableProps) => {
    if (props.optimized) {
        throw new Error(
            'DatagridConfigurable does not support the optimized prop'
        );
    }

    const translate = useTranslate();
    const resource = useResourceContext(props);
    const finalPreferenceKey = preferenceKey || `${resource}.datagrid`;

    const [availableColumns, setAvailableColumns] = useStore<
        ConfigurableDatagridColumn[]
    >(`preferences.${finalPreferenceKey}.availableColumns`, []);

    const [_, setOmit] = useStore<string[] | undefined>(
        `preferences.${finalPreferenceKey}.omit`,
        omit
    );

    React.useEffect(() => {

View on GitHub (pinned to 051f511bb0)

Solutions

1. Remove the `optimized` prop from <DatagridConfigurable>.
2. If row expansion/perf behavior is required, use the plain <Datagrid> instead of the configurable one.
3. Filter `optimized` out in any wrapper component before forwarding props.

Example fix

// before
<DatagridConfigurable optimized omit={omit}>...
// after
<DatagridConfigurable omit={omit}>...

if ('optimized' in props) {
  throw new Error('Use <Datagrid> (not DatagridConfigurable) for the optimized prop');
}

const isOptimizable = (p: { optimized?: boolean }): p is { optimized: true } => p.optimized === true;

When it happens

Trigger: Passing `optimized` to <DatagridConfigurable>, e.g. copying a `<Datagrid optimized>` usage and swapping the component name, or a shared column-config wrapper that forwards all props including optimized.

Common situations: Migrating a perf-tuned `<Datagrid optimized>` to the configurable variant; a generic table wrapper that spreads `{...props}` into DatagridConfigurable.

Related errors

• DatagridRow expects an id prop
• DatagridRow can only be used within a RecordContext or be pa
• DatagridRow can only be used within a ResourceContext or be
• useCanAccess must be used inside a <Resource> component or p
• useCreateController requires a non-empty resource prop or co

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