Skip to content

Week3 project#25

Open
vikawal wants to merge 8 commits into
ObadaMoustafa:masterfrom
vikawal:week3Project
Open

Week3 project#25
vikawal wants to merge 8 commits into
ObadaMoustafa:masterfrom
vikawal:week3Project

Conversation

@vikawal
Copy link
Copy Markdown

@vikawal vikawal commented Mar 23, 2023

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/

@ObadaMoustafa ObadaMoustafa added the need work Something isn't working label Mar 26, 2023
@ObadaMoustafa
Copy link
Copy Markdown
Owner

@vikawal
Hey, Victoria unfortunately your project is crashing when I refresh it and I get two errors in the console. please fix it and let me know to be able to review it 🙂

@vikawal
Copy link
Copy Markdown
Author

vikawal commented Mar 27, 2023

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((((

@vikawal
Copy link
Copy Markdown
Author

vikawal commented Mar 28, 2023

Copy link
Copy Markdown
Owner

@ObadaMoustafa ObadaMoustafa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Comment on lines +14 to +17
const {categories, loading: categoriesLoading, error:categoriesError} =
useCategories();
const {products, loading: productsLoading, error: productsError} =
useProducts();
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What would you propose/advise to add there? Maybe I don't get the idea of custom hook completely(((

Comment on lines +13 to +45
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]);
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you forgot to use useFetch here will solve all of that in one line code.

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

true. I am a little bit lost between all those components (((

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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") {
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see you gave it a selectedCategory parameter but never used it.

Copy link
Copy Markdown
Owner

@ObadaMoustafa ObadaMoustafa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Comment on lines +10 to +12
const {data: product, loading, error } = useFetch(
`https://dummyjson.com/products/${id}`
);
Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

wonderful

added 10 products litim to fetch
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

need work Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants