Added sidebar search functionality

src/components/AppSidebar.tsx

@@ -10,16 +10,18 @@ import ListItem from "./ListItem"
 import { useNote } from "../contexts/ActiveNoteContext"
 import { useNotesStore } from "../contexts/NotesStore"
 import { useTheme } from "../contexts/ThemeContext"
-import { ReactNode } from "react"
+import { ChangeEvent, ReactNode, useState } from "react"
 
 function AppSidebar() {
   const { notes, createNote } = useNotesStore()
   const { setCurrentNoteId } = useNote()
   const { theme, toggleTheme } = useTheme()
+  const [ filter, setFilter ] = useState("")
 
   const buildNoteListItems = () => {
     const out: ReactNode[] = []
     notes.forEach((note, key, _) => {
+      if (filter && !note.title.toLowerCase().includes(filter.toLowerCase())) return;
       out.push(
         <ListItem
           key={key}
@@ -42,7 +44,11 @@ function AppSidebar() {
             {theme === "dark" ? <Sun /> : <Moon />}
           </Button>
         </div>
-        <Input placeholder="Search Notes" className="shadow-none bg-background" />
+        <Input
+          placeholder="Search Notes"
+          className="shadow-none bg-background"
+          onChange={(e) => setFilter(e.target.value)}
+        />
       </SidebarHeader>
 
       <SidebarContent>