[TypeScript] Make types more strict in ra-ui-materialui, part III

docs/SimpleFormIterator.md

@@ -13,12 +13,11 @@ This component provides a UI for editing arrays of objects, one row per object.
   Your browser does not support the video tag.
 </video>
 
-
 `<SimpleFormIterator>` lets users edit, add, remove and reorder sub-records. It is designed to be used as a child of [`<ArrayInput>`](./ArrayInput.md) or [`<ReferenceManyInput>`](./ReferenceManyInput.md). You can also use it within an `ArrayInputContext` containing a *field array*, i.e. the value returned by [react-hook-form's `useFieldArray` hook](https://react-hook-form.com/docs/usefieldarray).
 
 ## Usage
 
-`<SimpleFormIterator>` requires no prop by default. It expects an array of inputs as children. It renders these inputs once per row and takes care of setting a different source for each row. 
+`<SimpleFormIterator>` requires no prop by default. It expects an array of inputs as children. It renders these inputs once per row and takes care of setting a different source for each row.
 
 ```jsx
 import { 

packages/ra-core/src/controller/field/useReferenceArrayFieldController.ts

@@ -1,5 +1,4 @@
 import get from 'lodash/get';
-import { useMemo } from 'react';
 import { RaRecord, SortPayload } from '../../types';
 import { useGetManyAggregate } from '../../dataProvider';
 import { ListControllerResult, useList } from '../list';
@@ -72,12 +71,7 @@ export const useReferenceArrayFieldController = <
     const notify = useNotify();
     const value = get(record, source);
     const { meta, ...otherQueryOptions } = queryOptions;
-
-    const ids = useMemo(() => {
-        if (Array.isArray(value)) return value;
-        console.warn(`Value of field '${source}' is not an array.`, value);
-        return emptyArray;
-    }, [value, source]);
+    const ids = Array.isArray(value) ? value : emptyArray;
 
     const {
         data,

packages/ra-core/src/controller/input/useReferenceArrayInputController.ts

@@ -170,7 +170,7 @@ export const useReferenceArrayInputController = <
             : undefined,
         hasPreviousPage: pageInfo ? pageInfo.hasPreviousPage : params.page > 1,
         isFromReference: true,
-    };
+    } as ChoicesContextValue<RecordType>;
 };
 
 const EmptyArray = [];

packages/ra-core/src/controller/input/useReferenceInputController.ts

@@ -195,7 +195,7 @@ export const useReferenceInputController = <RecordType extends RaRecord = any>(
             : undefined,
         hasPreviousPage: pageInfo ? pageInfo.hasPreviousPage : params.page > 1,
         isFromReference: true,
-    };
+    } as ChoicesContextValue<RecordType>;
 };
 
 export interface UseReferenceInputControllerParams<

packages/ra-core/src/controller/list/useList.spec.tsx

@@ -62,7 +62,7 @@ describe('<useList />', () => {
                         { id: 2, title: 'world' },
                         { id: 1, title: 'hello' },
                     ],
-                    error: undefined,
+                    error: null,
                     total: 2,
                 })
             );
@@ -79,7 +79,7 @@ describe('<useList />', () => {
                         { id: 1, title: 'hello' },
                         { id: 2, title: 'world' },
                     ],
-                    error: undefined,
+                    error: null,
                     total: 2,
                 })
             );
@@ -120,7 +120,7 @@ describe('<useList />', () => {
                     ],
                     page: 2,
                     perPage: 5,
-                    error: undefined,
+                    error: null,
                     total: 7,
                 })
             );
@@ -159,7 +159,7 @@ describe('<useList />', () => {
                 isFetching: true,
                 isLoading: false,
                 data: [{ id: 2, title: 'world' }],
-                error: undefined,
+                error: null,
                 total: 1,
             })
         );
@@ -188,7 +188,7 @@ describe('<useList />', () => {
                     isFetching: false,
                     isLoading: false,
                     data: [{ id: 2, title: 'world' }],
-                    error: undefined,
+                    error: null,
                     total: 1,
                 })
             );
@@ -223,7 +223,7 @@ describe('<useList />', () => {
                             { id: 3, items: 'four' },
                             { id: 4, items: ['five'] },
                         ],
-                        error: undefined,
+                        error: null,
                         total: 3,
                     })
                 );
@@ -258,7 +258,7 @@ describe('<useList />', () => {
                             { id: 3, items: 'four' },
                             { id: 4, items: ['five'] },
                         ],
-                        error: undefined,
+                        error: null,
                         total: 2,
                     })
                 );
@@ -287,7 +287,7 @@ describe('<useList />', () => {
                     isFetching: false,
                     isLoading: false,
                     data: [{ id: 2, title: { name: 'world' } }],
-                    error: undefined,
+                    error: null,
                     total: 1,
                 })
             );

packages/ra-core/src/controller/list/useList.ts

@@ -262,9 +262,9 @@ export const useList = <RecordType extends RaRecord = any>(
 
     return {
         sort,
-        data: finalItems?.data,
+        data: pendingState ? undefined : finalItems?.data ?? [],
         defaultTitle: '',
-        error,
+        error: error ?? null,
         displayedFilters,
         filterValues,
         hasNextPage:

packages/ra-core/src/controller/list/useListController.ts

@@ -485,7 +485,7 @@ export interface ListControllerLoadingResult<RecordType extends RaRecord = any>
     error: null;
     isPending: true;
 }
-export interface ListControllerLoadingErrorResult<
+export interface ListControllerErrorResult<
     RecordType extends RaRecord = any,
     TError = Error
 > extends ListControllerBaseResult<RecordType> {
@@ -513,6 +513,6 @@ export interface ListControllerSuccessResult<RecordType extends RaRecord = any>
 
 export type ListControllerResult<RecordType extends RaRecord = any> =
     | ListControllerLoadingResult<RecordType>
-    | ListControllerLoadingErrorResult<RecordType>
+    | ListControllerErrorResult<RecordType>
     | ListControllerRefetchErrorResult<RecordType>
     | ListControllerSuccessResult<RecordType>;

packages/ra-core/src/form/FormDataConsumer.spec.tsx

@@ -12,6 +12,7 @@ import {
     ArrayInput,
 } from 'ra-ui-materialui';
 import expect from 'expect';
+import { ResourceContextProvider } from '..';
 
 describe('FormDataConsumerView', () => {
     it('does not call its children function with scopedFormData if it did not receive a source containing an index', () => {
@@ -88,22 +89,24 @@ describe('FormDataConsumerView', () => {
         let globalScopedFormData;
         render(
             <AdminContext dataProvider={testDataProvider()}>
-                <SimpleForm>
-                    <ArrayInput source="authors">
-                        <SimpleFormIterator>
-                            <TextInput source="name" />
-                            <FormDataConsumer>
-                                {({ scopedFormData }) => {
-                                    globalScopedFormData = scopedFormData;
-                                    return scopedFormData &&
-                                        scopedFormData.name ? (
-                                        <TextInput source="role" />
-                                    ) : null;
-                                }}
-                            </FormDataConsumer>
-                        </SimpleFormIterator>
-                    </ArrayInput>
-                </SimpleForm>
+                <ResourceContextProvider value="posts">
+                    <SimpleForm>
+                        <ArrayInput source="authors">
+                            <SimpleFormIterator>
+                                <TextInput source="name" />
+                                <FormDataConsumer>
+                                    {({ scopedFormData }) => {
+                                        globalScopedFormData = scopedFormData;
+                                        return scopedFormData &&
+                                            scopedFormData.name ? (
+                                            <TextInput source="role" />
+                                        ) : null;
+                                    }}
+                                </FormDataConsumer>
+                            </SimpleFormIterator>
+                        </ArrayInput>
+                    </SimpleForm>
+                </ResourceContextProvider>
             </AdminContext>
         );
 
@@ -114,7 +117,7 @@ describe('FormDataConsumerView', () => {
         expect(globalScopedFormData).toEqual({ name: null });
 
         fireEvent.change(
-            screen.getByLabelText('resources.undefined.fields.authors.name'),
+            screen.getByLabelText('resources.posts.fields.authors.name'),
             {
                 target: { value: 'a' },
             }

packages/ra-core/src/form/choices/ChoicesContext.ts

@@ -11,24 +11,19 @@ export const ChoicesContext = createContext<ChoicesContextValue | undefined>(
     undefined
 );
 
-export type ChoicesContextValue<RecordType extends RaRecord = any> = {
-    allChoices?: RecordType[];
-    availableChoices?: RecordType[];
+export type ChoicesContextBaseValue<RecordType extends RaRecord = any> = {
     displayedFilters: any;
-    error?: any;
     filter?: FilterPayload;
     filterValues: any;
     hasNextPage?: boolean;
     hasPreviousPage?: boolean;
     hideFilter: (filterName: string) => void;
     isFetching: boolean;
     isLoading: boolean;
-    isPending: boolean;
     page: number;
     perPage: number;
     refetch: (() => void) | UseGetListHookValue<RecordType>['refetch'];
     resource: string;
-    selectedChoices?: RecordType[];
     setFilters: (
         filters: any,
         displayedFilters?: any,
@@ -39,7 +34,53 @@ export type ChoicesContextValue<RecordType extends RaRecord = any> = {
     setSort: (sort: SortPayload) => void;
     showFilter: (filterName: string, defaultValue: any) => void;
     sort: SortPayload;
-    source?: string;
-    total?: number;
+    source: string;
     isFromReference: boolean;
 };
+
+export interface ChoicesContextLoadingResult<RecordType extends RaRecord = any>
+    extends ChoicesContextBaseValue<RecordType> {
+    allChoices: undefined;
+    availableChoices: undefined;
+    selectedChoices: undefined;
+    total: undefined;
+    error: null;
+    isPending: true;
+}
+export interface ChoicesContextErrorResult<
+    RecordType extends RaRecord = any,
+    TError = Error
+> extends ChoicesContextBaseValue<RecordType> {
+    allChoices: undefined;
+    availableChoices: undefined;
+    selectedChoices: undefined;
+    total: undefined;
+    error: TError;
+    isPending: false;
+}
+export interface ChoicesContextRefetchErrorResult<
+    RecordType extends RaRecord = any,
+    TError = Error
+> extends ChoicesContextBaseValue<RecordType> {
+    allChoices: RecordType[];
+    availableChoices: RecordType[];
+    selectedChoices: RecordType[];
+    total: number;
+    error: TError;
+    isPending: false;
+}
+export interface ChoicesContextSuccessResult<RecordType extends RaRecord = any>
+    extends ChoicesContextBaseValue<RecordType> {
+    allChoices: RecordType[];
+    availableChoices: RecordType[];
+    selectedChoices: RecordType[];
+    total: number;
+    error: null;
+    isPending: false;
+}
+
+export type ChoicesContextValue<RecordType extends RaRecord = any> =
+    | ChoicesContextLoadingResult<RecordType>
+    | ChoicesContextErrorResult<RecordType>
+    | ChoicesContextRefetchErrorResult<RecordType>
+    | ChoicesContextSuccessResult<RecordType>;

packages/ra-core/src/form/choices/useChoicesContext.ts

@@ -9,11 +9,13 @@ export const useChoicesContext = <ChoicesType extends RaRecord = RaRecord>(
     const context = useContext(ChoicesContext) as ChoicesContextValue<
         ChoicesType
     >;
+    // @ts-ignore cannot satisfy the type of useList because of ability to pass partial options
     const { data, ...list } = useList<ChoicesType>({
         data: options.choices,
         isLoading: options.isLoading ?? false,
         isPending: options.isPending ?? false,
         isFetching: options.isFetching ?? false,
+        error: options.error,
         // When not in a ChoicesContext, paginating does not make sense (e.g. AutocompleteInput).
         perPage: Infinity,
     });
@@ -54,5 +56,5 @@ export const useChoicesContext = <ChoicesType extends RaRecord = RaRecord>(
         return context;
     }, [context, data, list, options]);
 
-    return result;
+    return result as ChoicesContextValue<ChoicesType>;
 };

packages/ra-core/src/form/useFormGroup.spec.tsx

@@ -11,6 +11,7 @@ import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import expect from 'expect';
 import { FormGroupContextProvider } from './FormGroupContextProvider';
 import { testDataProvider } from '../dataProvider';
+import { ResourceContextProvider } from '..';
 
 describe('useFormGroup', () => {
     test.each([
@@ -150,20 +151,22 @@ describe('useFormGroup', () => {
         ];
         render(
             <AdminContext dataProvider={testDataProvider()}>
-                <SimpleForm>
-                    <FormGroupContextProvider name="backlinks">
-                        <IsDirty />
-                        <ArrayInput
-                            defaultValue={backlinksDefaultValue}
-                            source="backlinks"
-                        >
-                            <SimpleFormIterator>
-                                <TextInput source="url" />
-                                <TextInput source="date" />
-                            </SimpleFormIterator>
-                        </ArrayInput>
-                    </FormGroupContextProvider>
-                </SimpleForm>
+                <ResourceContextProvider value="posts">
+                    <SimpleForm>
+                        <FormGroupContextProvider name="backlinks">
+                            <IsDirty />
+                            <ArrayInput
+                                defaultValue={backlinksDefaultValue}
+                                source="backlinks"
+                            >
+                                <SimpleFormIterator>
+                                    <TextInput source="url" />
+                                    <TextInput source="date" />
+                                </SimpleFormIterator>
+                            </ArrayInput>
+                        </FormGroupContextProvider>
+                    </SimpleForm>
+                </ResourceContextProvider>
             </AdminContext>
         );
 

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

@@ -87,7 +87,7 @@ const escapeRegExp = value =>
 export interface UseSuggestionsOptions extends UseChoicesOptions {
     allowCreate?: boolean;
     allowDuplicates?: boolean;
-    choices: any[];
+    choices?: any[];
     createText?: string;
     createValue?: any;
     limitChoicesToValue?: boolean;

packages/ra-core/src/routing/useRestoreScrollPosition.ts

@@ -1,7 +1,8 @@
 import { useEffect } from 'react';
-import { useStore } from '../store';
-import { debounce } from 'lodash';
 import { useLocation } from 'react-router';
+import debounce from 'lodash/debounce';
+
+import { useStore } from '../store';
 
 /**
  * A hook that tracks the scroll position and restores it when the component mounts.

packages/ra-data-fakerest/src/index.spec.ts

@@ -50,6 +50,7 @@ describe('ra-data-fakerest', () => {
             expect(data).toEqual([]);
         });
         it('should return an error when requesting a nonexisting id', async () => {
+            jest.spyOn(console, 'error').mockImplementationOnce(() => {});
             const dataProvider = fakerestDataProvider({
                 posts: [
                     { id: 0, title: 'Hello, world!' },