blob: 1c900089b88dbfaf5df84a4a9727d219fc35f237 (
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
|
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 onClick={() => {setAction('')}}>{t('back')}</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
|