blob: 7232632d6dfcd28cbf222eb44a1d9a24c5605bf2 (
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 '../Notes.module.scss'
import React, {useState} from 'react'
import useNotes from '../hooks/useNotes'
import {handleSelect, handleSelectAll, handleExport} from '../helpers/export'
const Export = ({setAction}) => {
const {notes} = useNotes()
const [ids, setIds] = useState(notes.map(n => n.noteId))
if (!notes) return null
return (
<section>
<div className='window__submenu'>
<div onClick={() => {setAction('')}}>Back</div>
</div>
<div className={`window__scroll ${styles.export}`}>
<h3>Click to export your notes:</h3>
<input
className="window__button"
type="submit"
value="Export"
onClick={e => handleExport(e, ids, notes)}
/>
<p>Notes to export:</p>
<div className={`${styles.export__select}`}>
<input
type="checkbox"
name='selectAll'
onChange={e => handleSelectAll(e, notes, setIds)}
checked={notes.length === ids.length}
/>
<label htmlFor='selectAll'>Select all</label>
</div>
{notes.map(note => (
<div key={note.noteId}>
<input
type="checkbox"
name={note.noteId}
value={note.noteId}
checked={ids.includes(note.noteId)}
onChange={() => handleSelect(note.noteId, ids, setIds)}
/>
<label htlmfor={note.noteId}>
{note.title}
</label><br/>
</div>
))}
</div>
</section>
)
}
export default Export
|
