Skip to content

Commit 2da2681

Browse files
taywilstaywils
authored
Merge pull request #10 from FoxComm/bugfix/pending-reviews
Bugfix/pending reviews
2 parents f44af9c + 311f9ad commit 2da2681

6 files changed

Lines changed: 81 additions & 44 deletions

File tree

‎fixtures/sample-product-reviews-pending.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{"result":[{"sku":"288022_760","id":5,"archivedAt":null,"scope":"1","updatedAt":"2017-05-26T20:26:04.306Z","title":null,"createdAt":"2017-05-26T20:26:04.306Z","attributes":{"status":{"t":"string","v":"pending"},"imageUrl":{"t":"string","v":"http:\/\/demandware.edgesuite.net\/sits_pod20-adidas\/dw\/image\/v2\/aaqx_prd\/on\/demandware.static\/-\/Sites-adidas-products\/en_US\/dwa2a8fa86\/zoom\/288022_01_standard.jpg"},"productName":{"t":"string","v":"adilette Slides"}},"rating":null,"userId":"7","userName":"tester"}],"pagination":{"total":1},"max_score":0}

‎fixtures/sample-product-reviews.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{"result":[{"sku":"BW0549_620","id":2,"archivedAt":null,"scope":"1","updatedAt":"2017-05-26T00:43:23.394Z","title":"Something about these shoes","createdAt":"2017-05-26T00:41:16.228Z","attributes":{"status":{"t":"string","v":"submitted"},"body":{"t":"string","v":"They didn't quite fit my feet so I'm thinking about asking for a refund."},"title":{"t":"string","v":"Something about these shoes"}},"rating":null,"userId":"9","userName":"test tester"},{"sku":"BW0549_620","id":1,"archivedAt":null,"scope":"1","updatedAt":"2017-05-25T23:37:13.616Z","title":"Testing writing a review through pure","createdAt":"2017-05-25T23:00:25.272Z","attributes":{"title":{"t":"string","v":"Testing writing a review through pure"},"status":{"t":"string","v":"submitted"},"body":{"t":"string","v":"My review of these shoes would help no one."},"imageUrl":{"t":"string","v":"http:\/\/demandware.edgesuite.net\/sits_pod20-adidas\/dw\/image\/v2\/aaqx_prd\/on\/demandware.static\/-\/Sites-adidas-products\/default\/dw3c2f754d\/zoom\/BW0549_01_standard.jpg"},"productName":{"t":"string","v":"Harden Vol. 1 \"No Brakes\" Shoes"}},"rating":null,"userId":"7","userName":"tester"}],"pagination":{"total":2},"max_score":0}

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@foxcomm/storefront-react",
3-
"version": "1.2.2",
3+
"version": "1.2.3",
44
"description": "FoxCommerce Storefront React UI Library",
55
"main": "lib/index.js",
66
"scripts": {

‎src/components/product-reviews-list/product-reviews-list.jsx‎

Lines changed: 43 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -86,56 +86,57 @@ class ProductReviewsList extends Component {
8686
page: 0,
8787
};
8888

89+
get isEmptyContent(): boolean {
90+
const { listItems } = this.props;
91+
92+
const activeReviews = _.filter(listItems, (review) => {
93+
return review.attributes.status.v == 'submitted';
94+
});
95+
96+
return _.isEmpty(activeReviews);
97+
}
98+
8999
get reviewsEmptyContentTitle(): ?Element<any> {
90100
const { listItems, emptyContentTitle } = this.props;
91101

92-
if (_.isEmpty(listItems)) {
93-
return (
94-
<div styleName="product-reviews-subtitle">
95-
{emptyContentTitle}
96-
</div>
97-
);
98-
}
99-
return null;
102+
return (
103+
<div styleName="product-reviews-subtitle">
104+
{emptyContentTitle}
105+
</div>
106+
);
100107
}
101108

102109
get displayReviews(): ?Element<any> {
103110
const { listItems, showLoadMore } = this.props;
104-
const activeReviews = _.filter(listItems, (review) => {
105-
return review.attributes.status.v == 'submitted';
106-
});
107-
if (!_.isEmpty(activeReviews)) {
108-
const reviews = _.map(listItems, (review) => {
109-
return (
110-
<ReviewBody
111-
key={review.id}
112-
title={review.attributes.title.v}
113-
userName={review.userName}
114-
updatedAt={review.updatedAt}
115-
sku={review.sku}
116-
body={review.attributes.body.v}
117-
/>
118-
);
119-
});
120-
121-
const loadMoreActionLink = (showLoadMore)
122-
? (
123-
<ActionLink
124-
action={this.handleLoadMoreReviews}
125-
title="LOAD MORE REVIEWS"
126-
styleName="product-review-load-more"
127-
/>
128-
)
129-
: null;
130-
111+
const reviews = _.map(listItems, (review) => {
131112
return (
132-
<div>
133-
{reviews}
134-
{loadMoreActionLink}
135-
</div>
113+
<ReviewBody
114+
key={review.id}
115+
title={review.attributes.title.v}
116+
userName={review.userName}
117+
updatedAt={review.updatedAt}
118+
sku={review.sku}
119+
body={review.attributes.body.v}
120+
/>
136121
);
137-
}
138-
return null;
122+
});
123+
124+
const loadMoreActionLink = (showLoadMore)
125+
? (
126+
<ActionLink
127+
action={this.handleLoadMoreReviews}
128+
title="LOAD MORE REVIEWS"
129+
styleName="product-review-load-more"
130+
/>
131+
)
132+
: null;
133+
134+
return (
135+
<div>
136+
{reviews}
137+
{loadMoreActionLink}
138+
</div>
139+
);
139140
}
140141

141142
handleLoadMoreReviews = () => {
@@ -159,8 +160,7 @@ class ProductReviewsList extends Component {
159160
<div styleName="product-reviews-title">
160161
{title}
161162
</div>
162-
{this.reviewsEmptyContentTitle}
163-
{this.displayReviews}
163+
{this.isEmptyContent ? this.reviewsEmptyContentTitle : this.displayReviews}
164164
</div>
165165
);
166166
}

‎src/components/product-reviews-list/product-reviews-list.md‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
#### Example
2+
3+
##### Sample reviews
4+
5+
```
6+
<div style={{maxWidth: '1080px'}}>
7+
<ProductReviewsList
8+
title="Reviews"
9+
emptyContentTitle="There are no reviews for this product"
10+
listItems={sampleProductReviews.result}
11+
isLoading={false}
12+
paginationSize={5}
13+
onLoadMoreReviews={()=>{alert('load more')}}
14+
showLoadMore={_.size(sampleProductReviews.result) < sampleProductReviews.pagination.total}
15+
/>
16+
</div>
17+
```
18+
##### No reviews or only pending reviews
19+
20+
```
21+
<div style={{maxWidth: '1080px'}}>
22+
<ProductReviewsList
23+
title="Reviews"
24+
emptyContentTitle="There are no reviews for this product"
25+
listItems={sampleProductReviewsPending.result}
26+
isLoading={false}
27+
paginationSize={5}
28+
onLoadMoreReviews={()=>{alert('load more')}}
29+
showLoadMore={_.size(sampleProductReviewsPending.result) < sampleProductReviewsPending.pagination.total}
30+
/>
31+
</div>
32+
```

‎styleguide.config.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ module.exports = {
2020
context: {
2121
sampleProduct: path.resolve(__dirname, 'fixtures/sample-product.json'),
2222
sampleRelatedProducts: path.resolve(__dirname, 'fixtures/sample-related-products.json'),
23+
sampleProductReviews: path.resolve(__dirname, 'fixtures/sample-product-reviews.json'),
24+
sampleProductReviewsPending: path.resolve(__dirname, 'fixtures/sample-product-reviews-pending.json'),
2325
},
2426
sections: [
2527
{
@@ -46,6 +48,7 @@ module.exports = {
4648
components: () => ([
4749
path.resolve(__dirname, 'src/components/pdp/pdp.jsx'),
4850
path.resolve(__dirname, 'src/components/related-products-list/related-products-list.jsx'),
51+
path.resolve(__dirname, 'src/components/product-reviews-list/product-reviews-list.jsx'),
4952
]),
5053
},
5154
],

0 commit comments

Comments
 (0)