diff --git a/client/src/pages/NoteFormPage.tsx b/client/src/pages/NoteFormPage.tsx index f8d8e73..0ad7595 100644 --- a/client/src/pages/NoteFormPage.tsx +++ b/client/src/pages/NoteFormPage.tsx @@ -4,11 +4,15 @@ import { fetchBooks } from "../api/books"; import { saveNote } from "../api/notes"; import { logout } from "../api/auth"; +const NEW_BOOK_OPTION = "__new__"; + export function NoteFormPage({ onLoggedOut }: { onLoggedOut: () => void }) { const queryClient = useQueryClient(); const booksQuery = useQuery({ queryKey: ["books"], queryFn: fetchBooks }); const [book, setBook] = useState(""); + const [isAddingNewBook, setIsAddingNewBook] = useState(false); + const [newBookTitle, setNewBookTitle] = useState(""); const [page, setPage] = useState(""); const [text, setText] = useState(""); @@ -26,14 +30,25 @@ export function NoteFormPage({ onLoggedOut }: { onLoggedOut: () => void }) { onSuccess: onLoggedOut }); + function handleBookSelect(value: string) { + if (value === NEW_BOOK_OPTION) { + setIsAddingNewBook(true); + setBook(""); + } else { + setIsAddingNewBook(false); + setNewBookTitle(""); + setBook(value); + } + } + function handleSubmit(e: FormEvent) { e.preventDefault(); - const trimmedBook = book.trim(); + const trimmedBook = (isAddingNewBook ? newBookTitle : book).trim(); const trimmedText = text.trim(); - if (!trimmedText) return; + if (!trimmedBook || !trimmedText) return; saveNoteMutation.mutate({ - book: trimmedBook || undefined, + book: trimmedBook, page: page ? Number(page) : undefined, text: trimmedText }); @@ -61,16 +76,35 @@ export function NoteFormPage({ onLoggedOut }: { onLoggedOut: () => void }) {