Commit 98692be5 authored by Shaphen Pangburn's avatar Shaphen Pangburn

[AFP-48 Shaphen Pangburn]: Refactor to display 'No Photo Available' if product...

[AFP-48 Shaphen Pangburn]: Refactor to display 'No Photo Available' if product image url is not provided
parent e0b90111
...@@ -49,13 +49,27 @@ export default class ProductItem extends Component { ...@@ -49,13 +49,27 @@ export default class ProductItem extends Component {
return ( return (
<div className="product-item"> <div className="product-item">
<div id="more-details-img-box"> <div id="more-details-img-box">
{
this.props.item.productImageUrl ?
<img <img
id="prod-img" id="prod-img"
alt="" alt=""
src={ this.props.item.productImageUrl ? this.props.item.productImageUrl : "-no photo-" } src={ this.props.item.productImageUrl }
onClick={ this.toggleDetailsModal } onClick={ this.toggleDetailsModal }
/> />
:
<div
id="no-image-found"
onClick={ this.toggleDetailsModal }
>
<p id="no-image-display">- No Photo Available -</p>
</div>
}
{
this.props.item.productImageUrl ?
<p onClick={ this.toggleDetailsModal } id="more-details-text">More Details</p> <p onClick={ this.toggleDetailsModal } id="more-details-text">More Details</p>
: ""
}
</div> </div>
<p id="prod-name">{ this.props.item.productName }</p> <p id="prod-name">{ this.props.item.productName }</p>
<div id="prod-price"> <div id="prod-price">
......
...@@ -14,8 +14,7 @@ export default class ProductMarket extends Component { ...@@ -14,8 +14,7 @@ export default class ProductMarket extends Component {
componentDidMount() { componentDidMount() {
this.props.getProducts(); this.props.getProducts();
this.props.getPromotions(); this.props.getPromotions();
// this.props.getUserCart(this.props.user.emailAddress); // this.props.getUserCart("chef");
this.props.getUserCart("chef");
} }
render() { render() {
......
import { RECEIVE_USER_CART } from '../actions/cart_actions'; import { RECEIVE_USER_CART } from '../actions/cart_actions';
const initialState = {} const initialState = {
cart: []
}
const cartReducer = (state = initialState, action) => { const cartReducer = (state = initialState, action) => {
Object.freeze(state); Object.freeze(state);
......
...@@ -58,6 +58,15 @@ ...@@ -58,6 +58,15 @@
transition: all 0.3s; transition: all 0.3s;
} }
#no-image-found {
height: 200px;
width: 100%;
transition: all 0.3s;
display: flex;
justify-content: center;
align-items: center;
}
#more-details-img-box { #more-details-img-box {
width: 100%; width: 100%;
display: flex; display: flex;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment