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 {
return (
<div className="product-item">
<div id="more-details-img-box">
{
this.props.item.productImageUrl ?
<img
id="prod-img"
alt=""
src={ this.props.item.productImageUrl ? this.props.item.productImageUrl : "-no photo-" }
src={ this.props.item.productImageUrl }
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>
: ""
}
</div>
<p id="prod-name">{ this.props.item.productName }</p>
<div id="prod-price">
......
......@@ -14,8 +14,7 @@ export default class ProductMarket extends Component {
componentDidMount() {
this.props.getProducts();
this.props.getPromotions();
// this.props.getUserCart(this.props.user.emailAddress);
this.props.getUserCart("chef");
// this.props.getUserCart("chef");
}
render() {
......
import { RECEIVE_USER_CART } from '../actions/cart_actions';
const initialState = {}
const initialState = {
cart: []
}
const cartReducer = (state = initialState, action) => {
Object.freeze(state);
......
......@@ -58,6 +58,15 @@
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 {
width: 100%;
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