|  |  |  | 
|---|
|  |  |  | import * as React from 'react'; | 
|---|
|  |  |  | import { useCallback } from 'react'; | 
|---|
|  |  |  | import DownloadIcon from '@mui/icons-material/GetApp'; | 
|---|
|  |  |  | import * as React from "react"; | 
|---|
|  |  |  | import { useCallback } from "react"; | 
|---|
|  |  |  | import DownloadIcon from "@mui/icons-material/GetApp"; | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | Button, useDataProvider, useNotify, useListContext | 
|---|
|  |  |  | } from 'react-admin'; | 
|---|
|  |  |  | Button, | 
|---|
|  |  |  | useDataProvider, | 
|---|
|  |  |  | useNotify, | 
|---|
|  |  |  | useListContext, | 
|---|
|  |  |  | } from "react-admin"; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const MyExportButton = (props) => { | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | maxResults = 1000, | 
|---|
|  |  |  | onClick, | 
|---|
|  |  |  | label = 'ra.action.export', | 
|---|
|  |  |  | icon = defaultIcon, | 
|---|
|  |  |  | exporter: customExporter, | 
|---|
|  |  |  | meta, | 
|---|
|  |  |  | ...rest | 
|---|
|  |  |  | } = props; | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | maxResults = 1000, | 
|---|
|  |  |  | onClick, | 
|---|
|  |  |  | label = "ra.action.export", | 
|---|
|  |  |  | icon = defaultIcon, | 
|---|
|  |  |  | exporter: customExporter, | 
|---|
|  |  |  | meta, | 
|---|
|  |  |  | ...rest | 
|---|
|  |  |  | } = props; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | filter, | 
|---|
|  |  |  | filterValues, | 
|---|
|  |  |  | resource, | 
|---|
|  |  |  | sort, | 
|---|
|  |  |  | total, | 
|---|
|  |  |  | } = useListContext(); | 
|---|
|  |  |  | const { filter, filterValues, resource, sort, total } = useListContext(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const dataProvider = useDataProvider(); | 
|---|
|  |  |  | const notify = useNotify(); | 
|---|
|  |  |  | const dataProvider = useDataProvider(); | 
|---|
|  |  |  | const notify = useNotify(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleClick = useCallback( | 
|---|
|  |  |  | event => { | 
|---|
|  |  |  | dataProvider.export(resource, { | 
|---|
|  |  |  | sort, | 
|---|
|  |  |  | filter: filter | 
|---|
|  |  |  | ? { ...filterValues, ...filter } | 
|---|
|  |  |  | : filterValues, | 
|---|
|  |  |  | pagination: { page: 1, perPage: maxResults }, | 
|---|
|  |  |  | meta, | 
|---|
|  |  |  | }).then((res) => { | 
|---|
|  |  |  | const url = window.URL.createObjectURL(new Blob([res.data], { type: res.headers['content-type'] })); | 
|---|
|  |  |  | const link = document.createElement('a'); | 
|---|
|  |  |  | link.href = url; | 
|---|
|  |  |  | link.setAttribute('download', `${resource}.xlsx`); | 
|---|
|  |  |  | document.body.appendChild(link); | 
|---|
|  |  |  | link.click(); | 
|---|
|  |  |  | link.remove(); | 
|---|
|  |  |  | }).catch(error => { | 
|---|
|  |  |  | console.error(error); | 
|---|
|  |  |  | notify('ra.notification.http_error', { type: 'error' }); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | if (typeof onClick === 'function') { | 
|---|
|  |  |  | onClick(event); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | [ | 
|---|
|  |  |  | dataProvider, | 
|---|
|  |  |  | filter, | 
|---|
|  |  |  | filterValues, | 
|---|
|  |  |  | maxResults, | 
|---|
|  |  |  | notify, | 
|---|
|  |  |  | onClick, | 
|---|
|  |  |  | resource, | 
|---|
|  |  |  | sort, | 
|---|
|  |  |  | meta, | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | const handleClick = useCallback( | 
|---|
|  |  |  | (event) => { | 
|---|
|  |  |  | dataProvider | 
|---|
|  |  |  | .export(resource, { | 
|---|
|  |  |  | sort, | 
|---|
|  |  |  | filter: filter ? { ...filterValues, ...filter } : filterValues, | 
|---|
|  |  |  | pagination: { page: 1, perPage: maxResults }, | 
|---|
|  |  |  | meta, | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .then((res) => { | 
|---|
|  |  |  | const url = window.URL.createObjectURL( | 
|---|
|  |  |  | new Blob([res.data], { type: res.headers["content-type"] }), | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | const link = document.createElement("a"); | 
|---|
|  |  |  | link.href = url; | 
|---|
|  |  |  | link.setAttribute("download", `${resource}.xlsx`); | 
|---|
|  |  |  | document.body.appendChild(link); | 
|---|
|  |  |  | link.click(); | 
|---|
|  |  |  | link.remove(); | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch((error) => { | 
|---|
|  |  |  | console.error(error); | 
|---|
|  |  |  | notify("ra.notification.http_error", { type: "error" }); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | if (typeof onClick === "function") { | 
|---|
|  |  |  | onClick(event); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | [ | 
|---|
|  |  |  | dataProvider, | 
|---|
|  |  |  | filter, | 
|---|
|  |  |  | filterValues, | 
|---|
|  |  |  | maxResults, | 
|---|
|  |  |  | notify, | 
|---|
|  |  |  | onClick, | 
|---|
|  |  |  | resource, | 
|---|
|  |  |  | sort, | 
|---|
|  |  |  | meta, | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | ); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | return ( | 
|---|
|  |  |  | <Button | 
|---|
|  |  |  | onClick={handleClick} | 
|---|
|  |  |  | label={label} | 
|---|
|  |  |  | disabled={total === 0} | 
|---|
|  |  |  | {...sanitizeRestProps(rest)} | 
|---|
|  |  |  | > | 
|---|
|  |  |  | {icon} | 
|---|
|  |  |  | </Button> | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | return ( | 
|---|
|  |  |  | <Button | 
|---|
|  |  |  | onClick={handleClick} | 
|---|
|  |  |  | label={label} | 
|---|
|  |  |  | disabled={total === 0} | 
|---|
|  |  |  | {...sanitizeRestProps(rest)} | 
|---|
|  |  |  | > | 
|---|
|  |  |  | {icon} | 
|---|
|  |  |  | </Button> | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const defaultIcon = <DownloadIcon />; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const sanitizeRestProps = ({ | 
|---|
|  |  |  | resource, | 
|---|
|  |  |  | ...rest | 
|---|
|  |  |  | }) => rest; | 
|---|
|  |  |  | const sanitizeRestProps = ({ resource, ...rest }) => rest; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export default MyExportButton; | 
|---|