aniketdgiri / foodmart-app

This is the Food Mart for ordering the Food.

FoodMart-App

This is the Food Mart for ordering the Food.

foodmart-app's Issues

Implement /Products Page and rating functionality

Tasks:

1. Implement the /products page
2. It should show all the items
3. also Implement the featured items on the home page
4. Provide the rating functionality on the page, which will show the item rating.

Drop down logged In should hide on clicking outside of it

When we click on the user icon button, the dropdown should get popped, but once clicking outside of it it should get hidden automatically.

Implement product search functionality app

Implement loaders for the API calls made to the server

Currently, we are using Axios calls directly inside the react component only, which is accepted, but we can make use of the loader and make it more dynamic based on the time for the API call.
We need to make changes for /products and /products/:id

Current Implementation:

  const [productDetail, setProductDetail] = useState({});

  const productId = params.productId;
  console.log(productId);
  const getProductDetails = useCallback(async () => {
    const res = await axios({
      method: "get",
      url: `http://localhost:8000/products/${productId}`,
    });
    setProductDetail(res.data);
  }, [productId]);

  useEffect(() => {
    getProductDetails();
  }, [getProductDetails]);

Refactoring the axios calls

Since, with our current implementation, we are making Axios calls, at each render page, whenever required, but in case if we are required to make a change in the application, for our calls, we need to change it everywhere, and this can lead to a discrepancy.

So, what we want is to create a separate file, we want to provide a common change.

Implement dropdown option

Tasks:

1. On clicking the user icon the dropdown menu should appear
2. similarly, for the logged out user as well

Implement search functionality for the foodMart API

Currently, we are implementing the search operation using the JSON server, so there it provides us with the functionality of the searching out-of-the-box, but when we implement the API with the filtering mechanism, we need to take care of this as well.

• Implement search functionality in the API.

Implementing individual product component

Add/remove button does not contain its own state

After clicking on add button, and then routing to another page, and thus coming back to the /products route, the button again goes to add button.
It should persist its state, even after login it from another route

Checkout Form should contain user Details

Requirements:

1. The user should be able to see its details, after clicking on the checkout page.
2. should fetch user Details from the API.

Implement Pay Now Functionality

Requirements:

1. On clicking PAYNOW button, the user should be redirected to the orders summary page displaying whether order is successful or failed.
2. Insert the order details for the given user in the DB.
3. Make that route a protected route, and only authenticated users should be able to access that route.

Implementing dark mode for the appliaction

Implement scroll to top component

Creating a new home page

Dynamically change the title on browser tab

There should be a feature implemented that should dynamically change the title of the window tab based on the route change

Feat: Implement Cart functionality in the application

Below are the requirements that need to be addressed:

1. User should be able to add the items to the cart.
2. Should be able to remove items from the cart.
3. Only the user when it is logged in should be able to see the cart items.
4. Cart specific to the given user should be able to see its own data.
5. This above should be implemented using createSlice functionality.