Allow to configure export button props from list component and global admin
See original GitHub issueIs your feature request related to a problem? Please describe.
We currently need to change the default export max result from 1000
(defined here) to 5000
globally on the app.
To do so, we have first to create custom List
and ListActions
components:
const ListActions: FC<ListActionsProps> = ({ filters, ...props }) => {
const {
sort,
filterValues,
exporter,
total,
} = useListContext(props);
const resource = useResourceContext(props);
const { hasCreate } = useResourceDefinition(props);
return useMemo(
() => (
<TopToolbar>
<FilterButton
filters={Array.isArray(filters) ? filters : [filters]}
/>
{hasCreate && <CreateButton />}
{exporter !== false && (
<ExportButton
disabled={total === 0}
resource={resource}
sort={sort}
filterValues={filterValues}
// The only thing we want to override is that part.
maxResults={5000}
/>
)}
</TopToolbar>
),
[
exporter,
filterValues,
filters,
hasCreate,
resource,
sort,
total,
],
);
};
export const List: FC<ListProps> = ({ children, filters, ...props }) => (
<ListBase {...props}>
<ListToolbar
filters={filters}
actions={<ListActions />}
/>
<Card>
{children}
<Pagination />
</Card>
</ListBase>
);
Then, we have to replace the vendor List
usage by our local one on each list resource we define on our project (nearly 15 for our case).
I see two main drawbacks with that:
- This is cumbersome. We have now 50 lines of custom component just to change one number prop.
- By using a custom one, we lose the benefit of simply use the provided vendor list and its furthers update because of the override.
Describe the solution you’d like
The ability to define the exporter option directly to the List
:
<List
export={{
maxResults: 5000,
}}
>
Or globally using the Admin
component:
<Admin
export={{
maxResults: 5000,
}}
>
Describe alternatives you’ve considered The alternative is already described by the problem section.
Additional context N/A
Issue Analytics
- State:
- Created a year ago
- Comments:8 (8 by maintainers)
Top Results From Across the Web
The List Component - React-admin - Marmelab
The <List> component fetches the list of records from the data provider, and renders the default list layout (title, buttons, filters, pagination).
Read more >Configure Columns in React Admin to Export | Endertech
This article will examine how you can extend React Admin by adding a column export configuration form for data grids. Let's first understand ......
Read more >React admin custom export button - server side - Stack Overflow
I have a react admin List that is working nicely. When I enable the exporter , it also works as expected. What I...
Read more >Export Button · Issue #94 · marmelab/react-admin - GitHub
In the <List> view, an <Export> component should let the user download the related data: with the current filters enabled; unpaginated (i.e. ...
Read more >Tutorial: Create a React single-page app that uses auth code ...
Add the sign-in button · Create another file in the components folder named PageLayout.jsx and add the following code to create a navbar ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Maybe is not a crazy idea to add
maxResults
as an optional prop toListActions
component and pass it to theExporButton
. So one has to pass<ListActions maxResults={5000}>
to aList
componentThe react-admin code is more complex because we have to maintain backward compatibility with previous versions. You only have one version to manage.
Anyway, let’s agree to disagree. You want to write less code, we want to avoid complexity, and these two objectives can’t meet in this feature request. Considering that your problem already has a solution, I suggest we leave it here.