1import { createContext, useState, useRef } from "react"
2import Note from "../types/Note"
3import placeHolderNotes from "../data/placeholderNotes"
4
5interface NoteContextInterface {
6  notes: Note[]
7  currentNote: Note
8  editCurrentNote: (property: "title" | "body", newValue: string) => void
9  saveCurrentNote: () => void
10  addNote: () => void
11  selectNote: (clickedNoteCreatedAt: Date) => void
12  deleteNote: (clickedNoteCreatedAt: Date) => void
13  noteSearchInput: string
14  editSearchInput: (newValue: string) => void
15  editorRef: React.MutableRefObject<HTMLTextAreaElement | null>
16}
17
18export const NoteContext = createContext<NoteContextInterface>(
19  {} as NoteContextInterface
20)
21
22function blankNote() {
23  return {
24    title: "New Note",
25    body: "",
26    createdAt: new Date(),
27  }
28}
29export default function NoteContextProvider({
30  children,
31}: {
32  children: JSX.Element
33}) {
34  const [notes, setNotes] = useState<Note[]>(placeHolderNotes)
35  const [currentNote, setCurrentNote] = useState(blankNote())
36  const [noteSearchInput, setNoteSearchInput] = useState("")
37
38  const editorRef = useRef<HTMLTextAreaElement | null>(null)
39
40  function addNote() {
41    const newNote = blankNote()
42    setNotes(notes => [newNote, ...notes])
43    setCurrentNote(newNote)
44    editorRef.current?.focus()
45  }
46
47  function selectNote(clickedNoteCreatedAt: Date) {
48    const selectedNote = notes.find(
49      ({ createdAt }) => createdAt === clickedNoteCreatedAt
50    )
51    selectedNote && setCurrentNote(selectedNote)
52    editorRef.current?.focus()
53  }
54
55  function editCurrentNote(property: "title" | "body", newValue: string) {
56    setCurrentNote(currentNote => ({ ...currentNote, [property]: newValue }))
57  }
58
59  function deleteNote(clickedNoteCreatedAt: Date) {
60    setNotes(notes =>
61      notes.filter(({ createdAt }) => createdAt !== clickedNoteCreatedAt)
62    )
63  }
64
65  function saveCurrentNote() {
66    console.log("clicked")
67    const existingNoteIndex = getCurrentNoteIndex()
68
69    if (existingNoteIndex >= 0) {
70      setNotes(notes => [
71        currentNote,
72        ...notes.slice(0, existingNoteIndex),
73        ...notes.slice(existingNoteIndex + 1),
74      ])
75    } else {
76      setNotes(notes => [currentNote, ...notes])
77    }
78  }
79
80  function getCurrentNoteIndex() {
81    return notes.findIndex(
82      ({ createdAt }) => createdAt === currentNote.createdAt
83    )
84  }
85
86  function editSearchInput(newValue: string) {
87    setNoteSearchInput(newValue)
88  }
89
90  return (
91    <NoteContext.Provider
92      value={{
93        notes,
94        currentNote,
95        editCurrentNote,
96        saveCurrentNote,
97        addNote,
98        selectNote,
99        deleteNote,
100        noteSearchInput,
101        editSearchInput,
102        editorRef,
103      }}
104    >
105      {children}
106    </NoteContext.Provider>
107  )
108}
109