diff --git a/packages/ra-core/src/form/FormDataConsumer.spec.tsx b/packages/ra-core/src/form/FormDataConsumer.spec.tsx index 6498b370990..2fb18f2220b 100644 --- a/packages/ra-core/src/form/FormDataConsumer.spec.tsx +++ b/packages/ra-core/src/form/FormDataConsumer.spec.tsx @@ -140,4 +140,37 @@ describe('FormDataConsumerView', () => { }); }); }); + + it('calls its children with the index when inside an ArrayInput', async () => { + let globalIndex; + + render( + + + + + + + {({ index }) => { + globalIndex = index; + return null; + }} + + + + + + + ); + + expect(globalIndex).toEqual(undefined); + + fireEvent.click(screen.getByLabelText('ra.action.add')); + + expect(globalIndex).toEqual(0); + + fireEvent.click(screen.getByLabelText('ra.action.add')); + + expect(globalIndex).toEqual(1); + }); }); diff --git a/packages/ra-core/src/form/FormDataConsumer.tsx b/packages/ra-core/src/form/FormDataConsumer.tsx index f0f4176ec1e..b280210367b 100644 --- a/packages/ra-core/src/form/FormDataConsumer.tsx +++ b/packages/ra-core/src/form/FormDataConsumer.tsx @@ -77,7 +77,8 @@ export const FormDataConsumerView = < // If we have an index, we are in an iterator like component (such as the SimpleFormIterator) if (arraySource) { const scopedFormData = get(formData, arraySource); - result = children({ formData, scopedFormData }); + const index = Number(arraySource.match(/\d+$/)?.[0]); + result = children({ formData, scopedFormData, index }); } else { result = children({ formData }); } @@ -98,6 +99,7 @@ export interface FormDataConsumerRenderParams< > { formData: TFieldValues; scopedFormData?: TScopedFieldValues; + index?: number; } export type FormDataConsumerRender<