|  |  | 
 |  |  |     Form, | 
 |  |  |     Toolbar, | 
 |  |  |     useRefresh, | 
 |  |  |     useTranslate | 
 |  |  | } from 'react-admin'; | 
 |  |  | import { Link } from 'react-router-dom'; | 
 |  |  | import DialogCloseButton from './DialogCloseButton'; | 
 |  |  | 
 |  |  |  | 
 |  |  | const ImportModal = ({ open, onClose, importTemp, useCodeImport, onceBatch = 10 }) => { | 
 |  |  |     const refresh = useRefresh(); | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |  | 
 |  |  |     const { processBatch } = useCodeImport(); | 
 |  |  |     const { importer, parseCsv, reset } = usePapaParse({ | 
 |  |  | 
 |  |  |     return ( | 
 |  |  |         <Dialog open={open} maxWidth="md" fullWidth> | 
 |  |  |             <DialogCloseButton onClose={handleClose} /> | 
 |  |  |             <DialogTitle>Import</DialogTitle> | 
 |  |  |             <DialogTitle>{translate('common.action.import.title')}</DialogTitle> | 
 |  |  |             <DialogContent> | 
 |  |  |                 <Form> | 
 |  |  |                     <Stack spacing={2}> | 
 |  |  | 
 |  |  |                                         }, | 
 |  |  |                                     }} | 
 |  |  |                                 > | 
 |  |  |                                     The import is running, please do not close | 
 |  |  |                                     this tab. | 
 |  |  |                                     {translate('common.action.import.tips')} | 
 |  |  |                                 </Alert> | 
 |  |  |                                 <Typography variant="body2"> | 
 |  |  |                                     Imported{' '} | 
 |  |  | 
 |  |  |                                                 onClick={handleReset} | 
 |  |  |                                                 color="error" | 
 |  |  |                                             > | 
 |  |  |                                                 Stop import | 
 |  |  |                                                 {translate('common.action.import.stop')} | 
 |  |  |                                             </MuiLink> | 
 |  |  |                                         </> | 
 |  |  |                                     )} | 
 |  |  | 
 |  |  |  | 
 |  |  |                         {importer.state === 'error' && ( | 
 |  |  |                             <Alert severity="error"> | 
 |  |  |                                 Failed to import this file, please make sure | 
 |  |  |                                 your provided a valid CSV file. | 
 |  |  |                                 {translate('common.action.import.err')} | 
 |  |  |                             </Alert> | 
 |  |  |                         )} | 
 |  |  |  | 
 |  |  |                         {importer.state === 'complete' && ( | 
 |  |  |                             <Alert severity="success"> | 
 |  |  |                                 Contacts import complete. Imported{' '} | 
 |  |  |                                 {importer.importCount} contacts, with{' '} | 
 |  |  |                                 {importer.errorCount} errors | 
 |  |  |                                 {translate('common.action.import.result', { | 
 |  |  |                                     success: importer.importCount, | 
 |  |  |                                     error: importer.errorCount | 
 |  |  |                                 })} | 
 |  |  |                             </Alert> | 
 |  |  |                         )} | 
 |  |  |  | 
 |  |  | 
 |  |  |                                     action={ | 
 |  |  |                                         <Button | 
 |  |  |                                             component={Link} | 
 |  |  |                                             label="Download CSV sample" | 
 |  |  |                                             label="common.action.import.download" | 
 |  |  |                                             color="info" | 
 |  |  |                                             to={importTemp} | 
 |  |  |                                             download={'crm_contacts_sample.csv'} | 
 |  |  |                                             download={'import_template.csv'} | 
 |  |  |                                         /> | 
 |  |  |                                     } | 
 |  |  |                                 > | 
 |  |  |                                     Here is a sample CSV file you can use as a | 
 |  |  |                                     template | 
 |  |  |                                     {translate('common.action.import.msg')} | 
 |  |  |                                 </Alert> | 
 |  |  |  | 
 |  |  |                                 <FileInput | 
 |  |  | 
 |  |  |                     {importer.state === 'idle' ? ( | 
 |  |  |                         <> | 
 |  |  |                             <Button | 
 |  |  |                                 label="Import" | 
 |  |  |                                 label="common.action.import.title" | 
 |  |  |                                 variant="contained" | 
 |  |  |                                 onClick={startImport} | 
 |  |  |                                 disabled={!file} | 
 |  |  | 
 |  |  |                         </> | 
 |  |  |                     ) : ( | 
 |  |  |                         <Button | 
 |  |  |                             label="Close" | 
 |  |  |                             label="ra.action.close" | 
 |  |  |                             onClick={handleClose} | 
 |  |  |                             disabled={importer.state === 'running'} | 
 |  |  |                         /> |