Week3 project#25
Conversation
…erywhere integrated, css not refreshed from old API
|
@vikawal |
|
It was working without mistakes 50% if time. I didn't understand why reallly((( Sometimes it was showing products as undefined and sometimes - no problems.... I've changed it like this now - Didn't notice any mistakes in console at all... But maybe you will)))) Didn't have time to change anything about css... maybe later(((( |
ObadaMoustafa
left a comment
There was a problem hiding this comment.
The app works great, the fav list is great and the code is organized well.
you need to solve something about filtration as I sent you on the discord and these comments below just a discussion need to think about but not mandatory to modify anything
| const {categories, loading: categoriesLoading, error:categoriesError} = | ||
| useCategories(); | ||
| const {products, loading: productsLoading, error: productsError} = | ||
| useProducts(); |
There was a problem hiding this comment.
perfect custom hooks but from inside you are using only useFetch and returning the data which comes from the url so its the same as you are using useFetch directly
There was a problem hiding this comment.
What would you propose/advise to add there? Maybe I don't get the idea of custom hook completely(((
| useEffect(() => { | ||
| fetch (`https://dummyjson.com/products/${id}`) | ||
| .then((response) => response.json()) | ||
| .then((data) => { | ||
| setProduct(data); | ||
| setLoading(false); | ||
| }) | ||
| .catch((error) => { | ||
| console.log(error); | ||
| setLoading(false); | ||
| let errorCode = ""; | ||
| if (error.response && error.response.status) { | ||
| errorCode = error.response.status; | ||
| } else if (error.request) { | ||
| errorCode = "NETWORK_ERROR"; | ||
| } else { | ||
| errorCode = "UNKNOWN_ERROR"; | ||
| } | ||
| switch (errorCode) { | ||
| case 404: | ||
| setError("Product data not found."); | ||
| break; | ||
| case "NETWORK_ERROR": | ||
| setError("Network error. Please check your internet connection and try again."); | ||
| break; | ||
| case "UNKNOWN_ERROR": | ||
| setError("Unknown error occurred. Please try again later."); | ||
| break; | ||
| default: | ||
| setError("Failed to load product data. Please, try again later"); | ||
| } | ||
| }); | ||
| }, [id]); |
There was a problem hiding this comment.
I think you forgot to use useFetch here will solve all of that in one line code.
There was a problem hiding this comment.
true. I am a little bit lost between all those components (((
There was a problem hiding this comment.
I've changed it now. I'll push tonight to the branch
| // import { useState, useEffect } from "react"; | ||
| import useFetch from "./useFetchHook"; | ||
|
|
||
| function useProducts (selectedCategory, url = "https://dummyjson.com/products") { |
There was a problem hiding this comment.
I see you gave it a selectedCategory parameter but never used it.
ObadaMoustafa
left a comment
There was a problem hiding this comment.
I think you still working on showing products .. because here I see only you changed the file below with some css.
or you forgot to push. the products still don't show in different categories
| const {data: product, loading, error } = useFetch( | ||
| `https://dummyjson.com/products/${id}` | ||
| ); |
added 10 products litim to fetch
It works, but hectic, no new css for new API and no new folders and organizing ((( I didn't have time on other exersises and did only project. It needs extra work to make it more organized and tidy, to use useFetch hook everywhere, nit just in 2 components. But it works)) deploy: https://cozy-pithivier-6341d4.netlify.app/