The first major thing regarding this PR is that the MarketTable component has been improved to feature pagination. This is to make the pagination look closer to the one found in the Figma wireframes. I have applied the improvements to a few places in the app, but not everywhere. I have included a few component tests for the pagination.
Now, onto the purchase functionality itself. The following elements have been implemented for both the sellers and buyers:
General
Users can access pages that contain their sales and orders on /account/{username}/sales and /account/{username}/orders. The {username} itself does not matter, the pages will always load the logged-in user's orders and sales, so it only exists as flavor text.
Users can review their orders/sales by clicking the "Review order" button. This will open a modal.
The "Save" button is disabled in some circumstances. In general, it will always be disabled if the user has not selected an option, has selected the order's current status as an option, or the order is marked as rejected or completed.
The radio buttons are disabled if the order is marked as completed or rejected. In addition, there are circumstances in which the radio buttons are also disabled, unique only to the buyers.
If the save button performs an action successfully (in this case, update the order's status), the modal will close itself and the page will be updated with the new status.
The feedback features are currently non-functional, those will be added in a separate PR.
Seller
Sellers can mark an order as sent or rejected
Sales marked as "ordered" will have a red dot in their upper right corner on the sales page.
Even if the seller marks an order as sent, they can change their mind and mark it as rejected, which will lock the order. This is consistent with the current behavior on the backend.
Buyer
Buyers can mark an order as received or not received. Currently, marking the order as not received will mark the order as rejected on the backend; this is going to change in the future
The radio buttons are disabled for the buyer when the order is in an ordered state. They must wait for the order to be sent first.
There are component tests that aim to test the save and radio buttons' functionalities and disabled status.
This PR addresses #61. Review the UI and review the mobile UI
The first major thing regarding this PR is that the
MarketTable
component has been improved to feature pagination. This is to make the pagination look closer to the one found in the Figma wireframes. I have applied the improvements to a few places in the app, but not everywhere. I have included a few component tests for the pagination.Now, onto the purchase functionality itself. The following elements have been implemented for both the sellers and buyers: General
/account/{username}/sales
and/account/{username}/orders
. The{username}
itself does not matter, the pages will always load the logged-in user's orders and sales, so it only exists as flavor text.Seller
sent
orrejected
sent
, they can change their mind and mark it asrejected
, which will lock the order. This is consistent with the current behavior on the backend.Buyer
received
ornot received
. Currently, marking the order asnot received
will mark the order asrejected
on the backend; this is going to change in the futureordered
state. They must wait for the order to be sent first.There are component tests that aim to test the save and radio buttons' functionalities and disabled status.
Let me know if there are any issues