diff options
| author | Randy Ridge <randyridge@gmail.com> | 2018-09-14 20:01:25 -0400 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2018-09-14 20:01:25 -0400 |
| commit | 908180c77cd38011eeedcae949613da2a3391e5e (patch) | |
| tree | b59bf1aae819a04d453cde72f6e601f5561a740f /finished-application/frontend/components/CartItem.js | |
| parent | 1f6667d233a4a2e9df977204d83a8f749c050c75 (diff) | |
| parent | b3bebda57ba187b7fa10398054b54c05d3fd3555 (diff) | |
Merge branch 'master' into randyridge/our
Diffstat (limited to 'finished-application/frontend/components/CartItem.js')
| -rw-r--r-- | finished-application/frontend/components/CartItem.js | 16 |
1 files changed, 8 insertions, 8 deletions
diff --git a/finished-application/frontend/components/CartItem.js b/finished-application/frontend/components/CartItem.js index 6c6d575..b0ce62e 100644 --- a/finished-application/frontend/components/CartItem.js +++ b/finished-application/frontend/components/CartItem.js @@ -1,3 +1,4 @@ +import React from 'react'; import styled from 'styled-components'; import PropTypes from 'prop-types'; import formatMoney from '../lib/formatMoney'; @@ -12,30 +13,29 @@ const CartItemStyles = styled.li` img { margin-right: 10px; } - h3 { - margin: 0; - } + h3, p { margin: 0; } `; const CartItem = ({ cartItem }) => { + // first check if that item exists if (!cartItem.item) return ( - <CartItemStyles key={cartItem.id}> - <p>Ack! That Item is gone!</p> + <CartItemStyles> + <p>This Item has been removed</p> <RemoveFromCart id={cartItem.id} /> </CartItemStyles> ); return ( - <CartItemStyles key={cartItem.id}> + <CartItemStyles> <img width="100" src={cartItem.item.image} alt={cartItem.item.title} /> <div className="cart-item-details"> <h3>{cartItem.item.title}</h3> <p> - {formatMoney(cartItem.quantity * cartItem.item.price)} - {' — '} + {formatMoney(cartItem.item.price * cartItem.quantity)} + {' - '} <em> {cartItem.quantity} × {formatMoney(cartItem.item.price)} each </em> |
