Problem with list products in cart adjusted

Author: gabriel-hahn

__tests__/reducers/cart.spec.js

@@ -31,4 +31,11 @@ describe('Cart Reducer', () => {
     const state = reducer(previousState, CartActions.changeItemQuantity(5, 12));
     expect(state.items[1].quantity).toEqual(12);
   });
+
+  it('Should increase product quantity when add the same product to cart', () => {
+    const newItem = { id: 4, title: 'T-shirt test' };
+    const state = reducer(previousState, CartActions.addItem(newItem));
+
+    expect(state.items[0].quantity).toEqual(2);
+  });
 });

src/components/ErrorMessage/styles.js

@@ -7,9 +7,7 @@ import { colors, metrics } from '~/styles';
 export const Container = styled.View`
   width: ${metrics.screenWidth - metrics.basePadding}px;
   position: absolute;
-  top: ${Platform.OS === 'android'
-    ? metrics.baseMargin
-    : metrics.baseMargin + 20}px;
+  top: ${Platform.OS === 'android' ? metrics.baseMargin : metrics.baseMargin + 85}px;
   left: ${metrics.baseMargin}px;
   padding: ${metrics.baseMargin}px ${metrics.basePadding}px;
   background-color: ${colors.danger};

src/pages/Cart/index.js

@@ -65,7 +65,7 @@ class Cart extends Component {
           <Fragment>
             <CartList
               data={items}
-              keyExtractor={product => String(product.id)}
+              keyExtractor={item => String(item.id)}
               showsVerticalScrollIndicator={false}
               renderItem={({ item: product }) => (
                 <CartItem key={product.id}>
@@ -108,7 +108,7 @@ class Cart extends Component {
 
 const mapStateToProps = state => ({
   items: state.cart.items,
-  amount: state.cart.items.reduce((n1, n2) => n1 + n2.quantity * n2.price, 0), // Calculate amount of price * quantity
+  amount: state.cart.items.reduce((total, item) => total + item.quantity * item.price, 0), // Calculate amount of price * quantity
 });
 
 const mapDispatchToProps = dispatch => bindActionCreators(CartActions, dispatch);

src/pages/Cart/styles.js

@@ -14,7 +14,6 @@ export const CartList = styled.FlatList`
 `;
 
 export const CartItem = styled.View`
-  flex: 1;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;

src/store/ducks/cart.js

@@ -15,7 +15,16 @@ const INITIAL_STATE = Immutable({
 });
 
 export const reducer = createReducer(INITIAL_STATE, {
-  [Types.ADD_ITEM]: (state, { item }) => ({ items: [...state.items, { ...item, quantity: 1 }] }),
+  [Types.ADD_ITEM]: (state, { item }) => {
+    const foundItem = state.items.find(product => product.id === item.id);
+    if (foundItem) {
+      return {
+        items: state.items.map(product => (product.id === item.id ? { ...product, quantity: product.quantity + 1 } : product)),
+      };
+    }
+
+    return { items: [...state.items, { ...item, quantity: 1 }] };
+  },
   [Types.REMOVE_ITEM]: (state, { itemId }) => ({
     items: [...state.items.filter(item => item.id !== itemId)],
   }),