blob: 2e2e5c7d7acc1dc79f9627305ccb51fcca033e62 (
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
|
import styles from '../Notes.module.scss'
import React, {useState} from 'react'
import fetchJson from 'lib/fetchJson'
import useNotes from '../hooks/useNotes'
import {state, color, handleImport, handleChange} from '../helpers/import'
const Import = ({action, setAction}) => {
const [files, setFiles] = useState()
const [done, setDone] = useState([])
const {mutateNotes} = useNotes()
return (
<section className={styles.import}>
<div className='window__submenu'>
<div onClick={() => {setAction('')}}>Back</div>
</div>
<div className='window__scroll'>
<form onSubmit={e => handleImport(e, files, mutateNotes, setDone)}>
Import new notes:
<div>
<label className="window__button">
Choose files
<input
name="import"
type="file"
multiple="multiple"
accept="text/plain"
onChange={e => handleChange(e, setFiles, setDone)}
/>
</label>
</div>
{files && (
<>
<p>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="Import" className="window__button" />
: <p>Import finished.<br/><br/>Go back to notes list or choose other notes to import.</p>
}
</>
)}
</form>
</div>
</section>
)
}
export default Import
|
