From 997e01cbe2bbd4ca2ea69053574c64805758dc66 Mon Sep 17 00:00:00 2001 From: Kot Anton <707myemail@gmail.com> Date: Sun, 3 Nov 2024 21:17:41 -0500 Subject: [PATCH] updated error handle and restructured isLoading --- .../manualBookForm/ManualBookForm.js | 19 ++++++---- .../searchBookForm/SearchBookForm.js | 8 ++-- src/redux/slices/searchBookSlice.js | 37 +++++++++---------- src/services/searchBookService.js | 8 +++- 4 files changed, 39 insertions(+), 33 deletions(-) diff --git a/src/components/manualBookForm/ManualBookForm.js b/src/components/manualBookForm/ManualBookForm.js index a77672e..8a5354e 100644 --- a/src/components/manualBookForm/ManualBookForm.js +++ b/src/components/manualBookForm/ManualBookForm.js @@ -7,22 +7,25 @@ import { setError } from '../../redux/slices/errorSlice' const BookForm = () => { const dispatch = useDispatch() - const [title, setTitle] = useState('') const [authors, setAuthors] = useState('') - const books = useSelector(selectBook) + const filterExistingBooks = () => { + return books.find( + (existedBook) => + existedBook.title.toLowerCase() === title.toLowerCase() && + existedBook.authors.toLowerCase() === authors.toLowerCase() + ) + } + const handleSubmit = (e) => { e.preventDefault() if (title.trim() && authors.trim()) { - const filteredBooks = books.find( - (existedBook) => - existedBook.title.toLowerCase() === title.toLowerCase() && - existedBook.authors.toLowerCase() === authors.toLowerCase() - ) - if (!filteredBooks) { + if (!filterExistingBooks()) { dispatch(addBook(createBook({ title, authors }))) + } else { + dispatch(setError('The book is already in the List!')) } } else { dispatch(setError('Enter both Title and Author!')) diff --git a/src/components/searchBookForm/SearchBookForm.js b/src/components/searchBookForm/SearchBookForm.js index e4a9a5a..2ddf7b4 100644 --- a/src/components/searchBookForm/SearchBookForm.js +++ b/src/components/searchBookForm/SearchBookForm.js @@ -15,9 +15,7 @@ const BookFormAPI = () => { const dispatch = useDispatch() const [bookToSearch, setBookToSearch] = useState('') const [isModalOpen, setIsModalOpen] = useState(false) - const isLoading = useSelector(selectIsLoading) - const searchResults = useSelector(selectSearchResults) const handleBookSearchSubmit = (e) => { @@ -53,7 +51,11 @@ const BookFormAPI = () => { value={bookToSearch} > - diff --git a/src/redux/slices/searchBookSlice.js b/src/redux/slices/searchBookSlice.js index 953127d..c4a862f 100644 --- a/src/redux/slices/searchBookSlice.js +++ b/src/redux/slices/searchBookSlice.js @@ -3,30 +3,30 @@ import { searchBookService } from '../../services/searchBookService' import { selectBook } from './booksSlice' import { setError } from './errorSlice' +// Helper function to filter books that are already in the store +const filterExistingBooks = (state, data) => { + const existingBooks = selectBook(state) + return data.filter( + (foundBook) => + !existingBooks.some( + (existingBook) => + existingBook.title.toLowerCase() === foundBook.title.toLowerCase() && + existingBook.authors.toLowerCase() === foundBook.authors.toLowerCase() + ) + ) +} + export const searchBooks = createAsyncThunk( 'booksSearch/search', async (query, thunkAPI) => { try { const data = await searchBookService(query) - const state = thunkAPI.getState() - const existingBooks = selectBook(state) - const filteredBooks = data.filter( - (foundBook) => - !existingBooks.some( - (existingBook) => - existingBook.title.toLowerCase() === - foundBook.title.toLowerCase() && - existingBook.authors.toLowerCase() === - foundBook.authors.toLowerCase() - ) - ) - - return filteredBooks + return filterExistingBooks(state, data) } catch (error) { - thunkAPI.dispatch(setError(error.message)) - return thunkAPI.rejectWithValue(error.message) + thunkAPI.dispatch(setError(error)) + return thunkAPI.rejectWithValue(error) } } ) @@ -48,7 +48,6 @@ const searchBooksSlice = createSlice({ builder .addCase(searchBooks.pending, (state) => { state.isLoading = true - // state.error = null }) .addCase(searchBooks.fulfilled, (state, action) => { state.isLoading = false @@ -64,8 +63,6 @@ const searchBooksSlice = createSlice({ export const { clearSearchResults } = searchBooksSlice.actions export const selectSearchResults = (state) => state.booksSearch.searchResults - -export const selectIsLoading = (state) => state.booksSearch?.isLoading || false -// export const selectError = (state) => state.booksSearch?.error || null +export const selectIsLoading = (state) => state.booksSearch.isLoading export default searchBooksSlice.reducer diff --git a/src/services/searchBookService.js b/src/services/searchBookService.js index 9778fb5..488d3e3 100644 --- a/src/services/searchBookService.js +++ b/src/services/searchBookService.js @@ -6,6 +6,10 @@ export async function searchBookService(query) { try { const response = await fetch(url) + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`) + } + const data = await response.json() if (data.items && data.items.length > 0) { @@ -24,7 +28,7 @@ export async function searchBookService(query) { return [] } } catch (error) { - console.error('Error searching for books:', error) - throw error + console.error('Error searching for books:', error.message) + throw error.message } }