From f18b7d18c2ca984a43d516319b7e38fcd663aa5f Mon Sep 17 00:00:00 2001
From: Gildas Garcia <1122076+djhi@users.noreply.github.com>
Date: Mon, 24 Jun 2024 15:36:55 +0200
Subject: [PATCH] Backport #9677

---
 .../src/input/ArrayInput/ArrayInput.spec.tsx  | 54 +++++++++++++++++++
 .../src/input/ArrayInput/ArrayInput.tsx       |  7 ++-
 2 files changed, 60 insertions(+), 1 deletion(-)

diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx
index d4467c1e0c0..17db8f2c750 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx
@@ -248,6 +248,60 @@ describe('<ArrayInput />', () => {
         });
     });
 
+    it('should not clear errors of children when unmounted', async () => {
+        let setArrayInputVisible;
+
+        const MyArrayInput = () => {
+            const [visible, setVisible] = React.useState(true);
+
+            setArrayInputVisible = setVisible;
+
+            return visible ? (
+                <ArrayInput resource="bar" source="arr">
+                    <SimpleFormIterator>
+                        <TextInput source="id" />
+                        <TextInput source="foo" />
+                    </SimpleFormIterator>
+                </ArrayInput>
+            ) : null;
+        };
+
+        render(
+            <AdminContext dataProvider={testDataProvider()}>
+                <SimpleForm
+                    onSubmit={jest.fn}
+                    defaultValues={{
+                        arr: [
+                            { id: 1, foo: 'bar' },
+                            { id: 2, foo: 'baz' },
+                        ],
+                    }}
+                    validate={() => ({ arr: [{ foo: 'Must be "baz"' }, {}] })}
+                >
+                    <MyArrayInput />
+                </SimpleForm>
+            </AdminContext>
+        );
+
+        // change one input to enable the SaveButton (which is disabled when the form is pristine)
+        fireEvent.change(
+            screen.getAllByLabelText('resources.bar.fields.arr.id')[0],
+            {
+                target: { value: '42' },
+            }
+        );
+        fireEvent.click(await screen.findByLabelText('ra.action.save'));
+
+        await screen.findByText('Must be "baz"');
+
+        setArrayInputVisible(false);
+        expect(screen.queryByText('Must be "baz"')).toBeNull();
+
+        // ensure errors are still there after re-mount
+        setArrayInputVisible(true);
+        await screen.findByText('Must be "baz"');
+    });
+
     it('should allow to have a helperText', () => {
         render(
             <AdminContext dataProvider={testDataProvider()}>
diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.tsx
index ce0a78f8dec..d7576bd5a7f 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.tsx
@@ -129,7 +129,12 @@ export const ArrayInput = (props: ArrayInputProps) => {
             formGroups.registerField(finalSource, formGroupName);
 
         return () => {
-            unregister(finalSource, { keepValue: true });
+            unregister(finalSource, {
+                keepValue: true,
+                keepError: true,
+                keepDirty: true,
+                keepTouched: true,
+            });
             formGroups &&
                 formGroupName != null &&
                 formGroups.unregisterField(finalSource, formGroupName);