added a selector to render amount of items selected on the cart icon

Author: AdityaKumawat97

src/components/cart-icon/Cart-icon.jsx

@@ -6,11 +6,11 @@ import { toggleCartHidden } from '../../redux/cart/cart.actions'
 import './cart-icon.styles.scss'
 import { ReactComponent as ShoppingIcon } from '../../assets/shopping-bag.svg'
 
-function CartIcon({ toggleCartHidden }) {
+function CartIcon({ toggleCartHidden, itemCount }) {
     return (
         <div className="cart-icon" onClick={toggleCartHidden}>
             <ShoppingIcon className="shopping-icon" />
-            <span className="item-count">0</span>
+            <span className="item-count">{itemCount}</span>
         </div>
     )
 }
@@ -19,4 +19,9 @@ const mapDispatchToProps = dispatch => ({
     toggleCartHidden: () => dispatch(toggleCartHidden())
 })
 
-export default connect(null, mapDispatchToProps)(CartIcon)
+
+const mapStateToProps = ({ cart: { cartItems } }) => ({
+    itemCount: cartItems.reduce((accumulatedQuantity, cartItem) => accumulatedQuantity + cartItem.quantity, 0)
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(CartIcon)