aboutsummaryrefslogtreecommitdiffstats
path: root/apps/Notes/components/NoteEdit.js
blob: 42eee462b43b44551631987ab78a6c50dfeaf09b (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
55
56
57
58
59
60
61
62
63
import styles from '../Notes.module.scss'
import React, {useState, useContext} from 'react'
import Context from 'context';
import fetchJson from 'lib/fetchJson'
import useNotes from '../hooks/useNotes'
import {addNote, updateNote} from '../helpers/noteActions.js'

const NoteEdit = ({action, setAction, fetchedNote}) => {
  const [text, setText] = useState('')
  const {mutateNotes} = useNotes()
  const [errorMsg, setErrorMsg] = useState('')
  const {setPopup} = useContext(Context)

  const handleSubmit = e => {
    e.preventDefault()
    fetchedNote
      ? updateNote(e, fetchedNote, mutateNotes, setAction, setPopup)
      : addNote(e, mutateNotes, setAction, setPopup)
  }

  // if (!fetchedNote) return <p>Loading...</p>
  // if (fetchedNote.error) {
  //   setFetchedNote()
  //   setAction('')
  // }

  return (
    <div className={styles.noteEdit}>
      <h2>{fetchedNote ? 'Edit note:' : 'Add new note:'}</h2>
      <form onSubmit={handleSubmit}>
        <input
          name='title'
          type='text'
          placeholder='Title'
          defaultValue={fetchedNote ? fetchedNote.title : ''}
        />
        <textarea
          required
          placeholder='Note'
          name='content'
          defaultValue={fetchedNote ? fetchedNote.content : ''}
        />
        <div className='note__buttons'>
          <span
            className='window__button'
            onClick={() => {setAction(fetchedNote ? 'showNote' : '')}}
          >
            Cancel
          </span>
          <input
            className='window__button'
            type="submit"
            value={fetchedNote ? 'Save note' : 'Add note'}
          />
        </div>
      </form>
      <style jsx>{`
      `}</style>
    </div>
  )
}

export default NoteEdit