Reeco

Order System

This project implements an order management system with the following functionalities:

• Display order details on the main page.
• Allow the user to update the status of each product.
• Implement a Missing – Urgent Popup for marking products as "Missing" or "Missing – Urgent."
• Optional: Edit Popup for updating product details.

Main Page

The main page displays order information. When the shipping date arrives, the user can update the status of each product by interacting with the CTAs on the right.

Updating Product Status

• Clicking will mark the product as approved.

• Clicking will open the Missing – Urgent Popup for marking the product as "Missing" or "Missing – Urgent."

• 

• Clicking "Edit" will open an Edit Popup for updating product details.

Missing Status Options

• "Missing"
• "Missing – Urgent"

Edit Popup

The Edit Popup allows the user to update product details:

• Product price (price >= 0)
• Product quantity (quantity >= 0)
• Selection of a reason

Technologies Used

• Redux: State management library for managing the application state.
• Chakra UI: Used for styling the HTML elements and providing a consistent design.
• React: JavaScript library for building user interfaces.
• React Icons: Icons used in the project are sourced from the React Icons library.