ArrayField breaking when value is null

[paulo9mv]

What you were expecting:
ArrayField to display an empty array when data is null.

What happened instead:
ArrayField breaking the application trying to access null.length

Steps to reproduce:
1- At simple example, change sample data field backlinks to backlinks: null
2- Access a PostShow and check the screen breaking
Screencast from 14-02-2023 16:50:38.webm

Branch with sample data altered and breaking: https://github.com/paulo9mv/react-admin/tree/arrayfield-null

Related code:

• Preferably, a CodeSandbox forked from
  • https://codesandbox.io/s/github/marmelab/react-admin/tree/master/examples/simple (v4)
  • https://codesandbox.io/s/github/marmelab/react-admin/tree/3.x/examples/simple (v3)
• A StackBlitz forked from
  • https://stackblitz.com/github/marmelab/react-admin/tree/master/examples/simple (v4)
• A link to a GitHub repo with the minimal codebase to reproduce the issue

insert short code snippets here

Other information:

Environment

• React-admin version:4.7.6
• Last version that did not exhibit the issue (if applicable): -
• React version: ^17.0.0
• Browser: Chrome
• Stack trace (in case of a JS error):

 Cannot read properties of null (reading 'length')


    at http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/field/ArrayField.tsx:24:5
    at span
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at Stack2 (http://localhost:8080/node_modules/.vite/deps/@mui_material.js?v=1319c427:10017:22)
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at Labeled (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/Labeled.tsx:22:3)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at Stack2 (http://localhost:8080/node_modules/.vite/deps/@mui_material.js?v=1319c427:10017:22)
    at Tab (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/detail/Tab.tsx:26:3)
    at Outlet (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:100:26)
    at div
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:160:5)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at OptionalRecordContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/controller/record/OptionalRecordContextProvider.tsx:19:3)
    at TabbedShowLayout (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/detail/TabbedShowLayout.tsx:29:5)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at Paper2 (http://localhost:8080/node_modules/.vite/deps/chunk-RRDXAN4P.js?v=1319c427:97:17)
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at Card2 (http://localhost:8080/node_modules/.vite/deps/chunk-KDOTRXKZ.js?v=1319c427:69:17)
    at div
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at ShowView (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/detail/ShowView.tsx:32:5)
    at RecordContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/controller/record/RecordContext.tsx:21:3)
    at ShowContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/controller/show/ShowContextProvider.tsx:20:3)
    at PostShow (http://localhost:8080/src/posts/PostShow.tsx?t=1676404801240:40:27)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:160:5)
    at ResourceContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/core/ResourceContextProvider.tsx:19:3)
    at Resource (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/core/Resource.tsx:22:13)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:160:5)
    at ErrorBoundary2 (http://localhost:8080/node_modules/.vite/deps/react-error-boundary.js?v=1319c427:37:35)
    at div
    at main
    at div
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at Layout (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/layout/Layout.tsx:31:13)
    at default
    at div
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:160:5)
    at CoreAdminRoutes (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/core/CoreAdminRoutes.tsx:25:30)
    at Routes (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:160:5)
    at CoreAdminUI (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/core/CoreAdminUI.tsx:31:5)
    at div
    at http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:6713:46
    at ScopedCssBaseline2 (http://localhost:8080/node_modules/.vite/deps/@mui_material.js?v=1319c427:8022:17)
    at AdminUI (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/AdminUI.tsx:23:3)
    at InnerThemeProvider (http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:8991:17)
    at ThemeProvider2 (http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:8826:5)
    at ThemeProvider3 (http://localhost:8080/node_modules/.vite/deps/chunk-EBQHIJ4Q.js?v=1319c427:9002:5)
    at ThemeProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/layout/Theme/ThemeProvider.tsx:21:3)
    at ResourceDefinitionContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/core/ResourceDefinitionContext.tsx:27:16)
    at NotificationContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/notification/NotificationContextProvider.tsx:21:3)
    at I18nContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/i18n/I18nContextProvider.tsx:22:3)
    at Router (http://localhost:8080/node_modules/.vite/deps/chunk-VM343LHG.js?v=1319c427:107:15)
    at HistoryRouter (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/routing/HistoryRouter.tsx:20:3)
    at InternalRouter (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/routing/AdminRouter.tsx:59:3)
    at BasenameContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/routing/BasenameContextProvider.tsx:19:3)
    at AdminRouter (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/routing/AdminRouter.tsx:24:3)
    at QueryClientProvider2 (http://localhost:8080/node_modules/.vite/deps/chunk-QBTUFXIX.js?v=1319c427:2846:25)
    at PreferencesEditorContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/preferences/PreferencesEditorContextProvider.tsx:20:3)
    at StoreContextProvider (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/store/StoreContextProvider.tsx:20:10)
    at CoreAdminContext (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-core/src/core/CoreAdminContext.tsx:30:5)
    at AdminContext (http://localhost:8080/@fs/home/Documents/react-admin/packages/ra-ui-materialui/src/AdminContext.tsx:22:5)
    at Admin (http://localhost:8080/@fs/home/Documents/react-admin/packages/react-admin/src/Admin.tsx:22:5)```

[slax57]

Reproduced, thanks!