blob: fa1fa4859176d439a7b81feef7f4215072d64f17 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
|
import styles from '../styles/Notes.module.scss'
import React, { useState } from 'react'
import useSettings from 'hooks/useSettings'
import useNotes from '../hooks/useNotes'
import { state, color, handleImport, handleChange } from '../helpers/import'
const Import = ({ setAction }) => {
const { t } = useSettings()
const [files, setFiles] = useState()
const [done, setDone] = useState([])
const { mutateNotes } = useNotes()
return (
<section className={styles.import}>
<div className='window__submenu'>
<div>
<div onClick={() => { setAction('') }}>{t('back')}</div>
</div>
</div>
<div className='window__scroll'>
<form onSubmit={e => handleImport(e, files, mutateNotes, setDone)}>
{t('notes_import')}
<div>
<label className='window__button'>
{t('choose_files')}
<input
name='import'
type='file'
multiple='multiple'
accept='text/plain'
onChange={e => handleChange(e, setFiles, setDone)}
/>
</label>
</div>
{files && (
<>
<p>{t('notes_to_import')}</p>
<ul>
{[...files].map((f, i) => <li style={color(done[i])} key={f.name}>{f.name} {state(done[i])}</li>)}
</ul>
{
done.length === 0
? <input type='submit' value={t('import')} className='window__button' />
: <p>{t('import_finished')}<br /><br />{t('notes_import_go_back')}</p>
}
</>
)}
</form>
</div>
</section>
)
}
export default Import
|