Monica/cart

[ehacinom]

Summary

• remade cart and product
• cleanup/refactoring

In detail, so @gehrj knows what changes were made re: Product.jsx.

Most of these changes were driven by my Cart needing to change quantities of the items inside of it.

Let's call the +/- buttons and new quantity form the ProductQuantityChanger. I moved the buttons into a dumb component ProductQuantityChanger. This is because this is used in both Cart and Product, so it's good to abstract it away.

Both Product and Item (inside Cart) will include this functionality ProductQuantityChanger. HOWEVER, it's a dumb component that needs a class/local state, and the class functions that were attached there.

• Minus - handleMinusQuantity
• Plus - handleAddQuantity
• form - handleChange

There's also the button at the bottom, which required another function

• addItemToCart -> which was directly aliased onto getItem() from our Cart reducer

I changed all four of these functions. I wrote a lot of checks for addItemToCart because of a few reasons

• we were setting too large-items (with all the reviews) onto the session/cookie, and this made the browser sad
• I considered the problem of someone clicking the button to add the rock to the cart twice or even thrice! I decided that when we add items from a button click, the quantity inside the box will drop to zero.
• I also broke out of the function in case the quantity was ever 0

I composed handleMinusQuantity and handleAddQuantity into --> changeQuantity, adding a few checks so the quantity couldn't get too small or too large.

and finally I kept functionality of handleChange but streamlined the logic.

That's the start of the changes. The rest of the changes were driven by the need to completely restructure everything around the fact that ProductQuantityChanger was abstracted and used by multiple components.

Before, the react component flow was

Product

and

Cart -> Item

Now, the flow is

ProductContainer -> ProductOrItemContainer -> Product -> ProductQuantityChanger

and

Cart -> ProductOrItemContainer -> Item -> ProductQuantityChanger

I was very very very careful to keep all your new css changes, despite the merge meaning the Product component ended being across several files.

Minor changes include updating cart functionality and rewriting a bit of the backend routes.

Hope that's clear!

[tryandbry]

@ehacinom can you write a summary of all the changes you made?

[ehacinom]

summary in the header!