marmelab / marmelab/react-admin
Inconsistent rendering of errors in List components
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 26.9k
- Forks
- 5.5k
- Avg merge
- 2d 3h
- Merged PRs (30d)
- 19
Description
What you were expecting:
When the dataProvider.getList() call fails, components rendering a list should render something meaningful and consistent.
What happened instead:
- For fetcher components
<List>renders the error messages twice (once in the notification, once in the<Error>component), and if the content component renders it, too, that's three times<ReferenceManyField>renders the notification (no error component)
- For content components
<Datagrid>and<SimpleList>render<ListNoResults>, which is misleading<SingleFieldList>fails.
Besides, in the <List> component, it is not possible to override / hide the <Error> render (cf https://github.com/marmelab/react-admin/issues/8528#issuecomment-1369117499).
Steps to reproduce:
Check the Storybook for List / Error in Fetch : https://react-admin-storybook.vercel.app/?path=/story/ra-ui-materialui-list-list--error-in-fetch
Other information:
Which component should handle the error case? In my opinion, just like for the loading case, it's the content components' responsibility (<Datagrid>, <SimpleList>, etc), not the fetcher component (<List>, etc). But I'm open to discussion on this one.
Environment
- React-admin version: 4.x
- Last version that did not exhibit the issue (if applicable): n/a
- React version: 17
- Browser: Chrome
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Open the Storybook “List / Error in Fetch” story and reproduce the failures across List, ReferenceManyField, Datagrid, SimpleList, and SingleFieldList. Review the issue’s proposed responsibility split, then define and validate a consistent, non-duplicated error state with an overridable List error render; the issue needs a decided behavior before implementation can be considered done.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100