icon focus, notes update timestamp, loading note

1 files changed, 9 insertions, 38 deletions

diff --git a/apps/Notes/components/Export.js b/apps/Notes/components/Export.js
index f281d1a..7232632 100644
--- a/apps/Notes/components/Export.js
+++ b/apps/Notes/components/Export.js
@@ -1,45 +1,11 @@
 import styles from '../Notes.module.scss'
 import React, {useState} from 'react'
 import useNotes from '../hooks/useNotes'
-import fetchJson from 'lib/fetchJson'
-import JSZip from 'jszip'
-import saveFile from 'helpers/saveFile'
-import filename from '../helpers/fileName'
-// import {state, color, handleImport, handleChange} from '../helpers/import'
+import {handleSelect, handleSelectAll, handleExport} from '../helpers/export'
 
 const Export = ({setAction}) => {
   const {notes} = useNotes()
   const [ids, setIds] = useState(notes.map(n => n.noteId))
-  // const [files, setFiles] = useState()
-  // const [done, setDone] = useState([])
-
-  const handleSelect = id => {
-    ids.includes(id)
-      ? setIds(ids.filter(i => i !== id))
-      : setIds([...ids, id])
-  }
-
-  const handleSelectAll = e => {
-    if (e.target.checked) {
-      setIds(notes.map(n => n.noteId))
-    } else {
-      setIds([])
-    }
-  }
-
-  const handleExport = e => {
-    e.preventDefault()
-    const zip = new JSZip()
-
-    Promise.all(ids.map(async id => {
-      const title = notes.find(n => n.noteId === id).title
-      const {content} = await fetchJson(`/api/note/${id}`)
-      zip.folder('notes').file(filename(title), content, {binary: true})
-    })).then(() => {
-      zip.generateAsync({type:"blob"})
-        .then(c => saveFile(c, 'notes.zip', 'application/zip'))
-    })
-  }
 
   if (!notes) return null
 
@@ -54,11 +20,16 @@ const Export = ({setAction}) => {
           className="window__button"
           type="submit"
           value="Export"
-          onClick={handleExport}
+          onClick={e => handleExport(e, ids, notes)}
         />
         <p>Notes to export:</p>
         <div className={`${styles.export__select}`}>
-          <input type="checkbox" name='selectAll' onChange={handleSelectAll} checked={notes.length === ids.length} />
+          <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 => (
@@ -68,7 +39,7 @@ const Export = ({setAction}) => {
               name={note.noteId}
               value={note.noteId}
               checked={ids.includes(note.noteId)}
-              onChange={() => handleSelect(note.noteId)}
+              onChange={() => handleSelect(note.noteId, ids, setIds)}
             />
             <label htlmfor={note.noteId}>
               {note.title}