add discounted price

Author: oesukam

src/actions/currentUserActions.js

@@ -152,15 +152,14 @@ export const submitUpdateUser = user => dispatch => {
     }) => {
       dispatch(updateCurrentUser(data));
       dispatch(setUpdatingCurrentUser(false));
+      return data;
     })
-    .catch(({
-      response
-    }) => {
-      const {
-        error
-      } = response.data;
+    .catch((err) => {
+      const error =
+        err.response && err.response.data ? err.response.data.error : err;
       dispatch(setUserError(error));
       dispatch(setUpdatingCurrentUser(false));
+      return error;
     });
 };
 
@@ -172,11 +171,13 @@ export const submitUpdateUserAddress = address => dispatch => {
       data
     }) => {
       dispatch(setUpdatingCurrentUserAddress(false));
+      return data;
     })
     .catch(err => {
       const error =
         err.response && err.response.data ? err.response.data.error : err;
       dispatch(setUserError(error));
       dispatch(setUpdatingCurrentUserAddress(false));
+      return error
     });
 };

src/components/Header/Header.jsx

@@ -119,13 +119,13 @@ export class Header extends Component {
             </div>
 
             <div className="is-flex items-center is-hidden-mobile">
-              <Link to="/items" className="navbar-item">
+              <Link to="#" className="navbar-item">
                 Daily Deals
               </Link>
-              <Link to="/items" className="navbar-item">
+              <Link to="#" className="navbar-item">
                 Sell
               </Link>
-              <Link to="/items" className="navbar-item">
+              <Link to="#" className="navbar-item">
                 Help & Contact
               </Link>
             </div>

src/components/ItemCard/ItemCard.jsx

@@ -12,12 +12,22 @@ const ItemCard = ({ item, addToCart }) => (
     />
     <div className="item-card__name">{item.name}</div>
     <div className="item-card__bottom">
+      
+      <p className="item-card__bottom__prices">
+        <span className={`item-card__bottom__price ${item.discounted_price > 0 && 'has-discount'}`}>${item.price}</span>
+        { item.discounted_price > 0 ?
+            <span className="item-card__bottom__discount">
+              ${item.discounted_price}
+            </span>
+          : null
+        }
+      </p>
       <button
         data-test="buy-btn"
         className={`item-card__bottom__buy-btn ${item.adding ? 'loading' : ''}`}
         onClick={() => addToCart(item.product_id, item)}
       >
-        Add to cart
+        Buy now
       </button>
     </div>
     <div className="item-card__hover">

src/components/ItemCard/ItemCard.scss

@@ -49,9 +49,22 @@
     text-overflow: ellipsis;
   }
   &__bottom {
-    height: 60px;
+    height: 100px;
     display: flex;
     align-items: center;
+    flex-direction: column;
+    &__prices {
+      font-size: 1.8rem;
+      color: $color-red;
+      margin-bottom: 10px;
+    }
+    &__price {
+      &.has-discount {
+        text-decoration: line-through;
+        font-size: 1.5rem;
+        margin-right: 10px;
+      }
+    }
     &__buy-btn {
       @include item-button;
     }
@@ -63,7 +76,7 @@
     top: 0;
     left: 0;
     right: 0;
-    bottom: 80px;
+    bottom: 110px;
     display: flex;
     justify-content: center;
     align-items: center;

src/components/MyCartModal/MyCartModal.jsx

@@ -85,17 +85,12 @@ export class MyCartModal extends Component {
             </tr>
           ))}
         </tbody>
-        {
-          cartProducts.length > 0 ?
-          (<tfoot>
-            <tr>
-              <td colSpan="3"><h4 className="title is-4">Total</h4></td>
-              <td colSpan="2"><h4 className="title is-4 color-red has-text-right">${cartTotalAmount}</h4></td>
-            </tr>
-          </tfoot>)
-          : null
-        }
-        
+        <tfoot>
+          <tr>
+            <td colSpan="3"><h4 className="title is-4">Total</h4></td>
+            <td colSpan="2"><h4 className="title is-4 color-red has-text-right">${cartProducts.length === 0 ? 0 : cartTotalAmount}</h4></td>
+          </tr>
+        </tfoot>
       </table>
     );
   };

src/components/OrderModal/OrderSummary.jsx

@@ -18,7 +18,7 @@ export class OrderDelivery extends Component {
   };
 
   render = () => {
-    const { cartProducts, user } = this.props;
+    const { cartProducts, user, cartTotalAmount } = this.props;
     return (
       <div className="columns">
         <div className="column is-8">
@@ -44,6 +44,14 @@ export class OrderDelivery extends Component {
                 </tr>
               ))}
             </tbody>
+            <tfoot>
+              <tr>
+                <td><h5 className="title is-5">Total</h5></td>
+                <td colSpan="2">
+                  <h5 className="title is-5 has-text-right color-red">${cartTotalAmount}</h5>
+                </td>
+              </tr>
+            </tfoot>
           </table>
         </div>
         <div className="column is-4">
@@ -74,7 +82,7 @@ export const mapStateToProps = ({
     submittingOrder,
   },
   shipping: { regions, region },
-  cart: { cartProducts },
+  cart: { cartProducts, cartTotalAmount  },
 }) => ({
   orders,
   cartId,
@@ -86,6 +94,7 @@ export const mapStateToProps = ({
   regions,
   region,
   cartProducts,
+  cartTotalAmount
 });
 
 export const mapDispatchToProps = dispatch => ({

src/pages/Settings/Settings.jsx

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import propTypes from 'prop-types';
 import { connect } from 'react-redux';
+import Notification from 'react-bulma-notification';
 import './Settings.scss';
 import Layout from '../../containers/Layout/Layout';
-
 import {
   setCurrentUserField,
   submitUpdateUser,
@@ -37,7 +37,11 @@ export class Settings extends Component {
       eve_phone: user.eve_phone,
       mob_phone: user.mob_phone,
       password: user.password || undefined,
-    });
+    }).then((res) => {
+      if (res && res.email) {
+        Notification.success('Information updated', { duration: 3 })
+      }
+    })
   };
 
   _submitAddress = e => {
@@ -60,7 +64,11 @@ export class Settings extends Component {
       postal_code: user.postal_code,
       country: user.country,
       shipping_region_id: user.shipping_region_id,
-    });
+    }).then((res) => {
+      if (res && res.email) {
+        Notification.success('Address updated', { duration: 3 })
+      }
+    })
   };
 
   _renderProfile = () => {

src/pages/SingleItem/SingleItem.jsx

@@ -170,7 +170,14 @@ export class SingleItem extends Component {
     return (
       <div className="product">
         <h3 className="product__name">{item.name}</h3>
-        <h3 className="product__price">$ {item.price}</h3>
+        <h3 className={`product__price ${item.discounted_price > 0 && 'has-discount'}`}>$ {item.price}</h3>
+        {
+          item.discounted_price > 0 ?
+            <h3 className="product__price">
+              $ {item.discounted_price}
+            </h3>
+          : null
+        }
 
         {this._renderColors()}
 

src/pages/SingleItem/SingleItem.scss

@@ -47,6 +47,10 @@
   &__price {
     color: $color-red;
     font-size: 2rem;
+    &.has-discount {
+      text-decoration: line-through;
+      font-size: 1.5rem;
+    }
   }
   &__info {
     font-size: 1.3rem;