Fix <ReferenceArrayInput> does not accept alwaysOn prop

Author: djhi

packages/ra-core/src/controller/input/ReferenceArrayInputBase.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { InputProps } from '../../form/types';
+import { InputProps } from '../../form/useInput';
 import {
     useReferenceArrayInputController,
     type UseReferenceArrayInputParams,

packages/ra-core/src/form/types.ts

@@ -22,7 +22,7 @@ import { DatagridInput } from './DatagridInput';
 import { TextField } from '../field';
 import { ReferenceArrayInput } from './ReferenceArrayInput';
 import { SelectArrayInput } from './SelectArrayInput';
-import { DifferentIdTypes } from './ReferenceArrayInput.stories';
+import { AsFilters, DifferentIdTypes } from './ReferenceArrayInput.stories';
 
 describe('<ReferenceArrayInput />', () => {
     const defaultProps = {
@@ -292,4 +292,15 @@ describe('<ReferenceArrayInput />', () => {
             })
         ).toBeNull();
     });
+
+    it('can be used as a list filter', async () => {
+        render(<AsFilters />);
+        await screen.findByText('band_2');
+        fireEvent.click(screen.getByText('Members'));
+        fireEvent.click(screen.getByText('artist_2'));
+        await waitFor(() => {
+            expect(screen.queryByText('band_2')).toBeNull();
+        });
+        await screen.findByText('band_1');
+    });
 });

packages/ra-ui-materialui/src/input/ReferenceArrayInput.spec.tsx

@@ -20,6 +20,7 @@ import { ReferenceArrayInput } from './ReferenceArrayInput';
 import { AutocompleteArrayInput } from './AutocompleteArrayInput';
 import { SelectArrayInput } from './SelectArrayInput';
 import { CheckboxGroupInput } from './CheckboxGroupInput';
+import { List, Datagrid } from '../list';
 
 export default { title: 'ra-ui-materialui/input/ReferenceArrayInput' };
 
@@ -77,6 +78,51 @@ export const Basic = () => (
     </TestMemoryRouter>
 );
 
+export const AsFilters = () => {
+    const fakeData = {
+        bands: [
+            { id: 1, name: 'band_1', members: [2] },
+            { id: 2, name: 'band_2', members: [3] },
+        ],
+        artists: [
+            { id: 1, name: 'artist_1' },
+            { id: 2, name: 'artist_2' },
+            { id: 3, name: 'artist_3' },
+        ],
+    };
+    return (
+        <TestMemoryRouter initialEntries={['/bands']}>
+            <AdminContext
+                dataProvider={fakeRestProvider(fakeData, false)}
+                i18nProvider={i18nProvider}
+            >
+                <AdminUI>
+                    <Resource name="tags" recordRepresentation={'name'} />
+                    <Resource
+                        name="bands"
+                        list={() => (
+                            <List
+                                filters={[
+                                    <ReferenceArrayInput
+                                        alwaysOn
+                                        key="test"
+                                        reference="artists"
+                                        source="members"
+                                    />,
+                                ]}
+                            >
+                                <Datagrid>
+                                    <TextField source="name" />
+                                </Datagrid>
+                            </List>
+                        )}
+                    />
+                </AdminUI>
+            </AdminContext>
+        </TestMemoryRouter>
+    );
+};
+
 export const WithAutocompleteInput = () => (
     <AdminContext
         dataProvider={dataProvider}