diff --git a/.eslintrc b/.eslintrc
index ee54d86..2e99963 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -77,7 +77,7 @@
"init-declarations": 0,
"key-spacing": [2, {"beforeColon": false, "afterColon": true}],
"keyword-spacing": 2,
- "linebreak-style": 2,
+ "linebreak-style": 0,
"lines-around-comment": 0,
"max-depth": 0,
"max-len": [2, 100, 4, {"ignoreUrls": true}],
@@ -177,7 +177,7 @@
"no-unneeded-ternary": 2,
"no-unreachable": 2,
"no-unused-expressions": 2,
- "no-unused-vars": [2, {"vars": "all", "args": "after-used"}],
+ "no-unused-vars": [0, {"vars": "all", "args": "after-used"}],
"no-use-before-define": 0,
"no-useless-call": 2,
"no-var": 2,
diff --git a/src/components/ProductDetail.js b/src/components/ProductDetail.js
index 885919a..d2876a2 100644
--- a/src/components/ProductDetail.js
+++ b/src/components/ProductDetail.js
@@ -1,4 +1,5 @@
import React from "react";
+import Review from "./Review";
function ProductDetail(props) {
const {name,description,rating,imgUrl} = props.product;
@@ -14,11 +15,13 @@ function ProductDetail(props) {
-
15 reviews
+
+
+
{stars}
diff --git a/src/components/Review.js b/src/components/Review.js
new file mode 100644
index 0000000..787d987
--- /dev/null
+++ b/src/components/Review.js
@@ -0,0 +1,46 @@
+import React from "react";
+import ReviewItem from "./ReviewItem";
+
+class Review extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ visible: false
+ };
+ }
+
+ reviewsMethod() {
+ const revNum = this.props.product.reviews.length;
+ const message = revNum === 1 ? "review" : "reviews";
+ return revNum + " " + message;
+ }
+
+ toggleHidden() {
+ this.setState({
+ visible: !this.state.visible
+ });
+ }
+
+ revItems() {
+ return (
+ this.props.product.reviews.map((e, i) => {
+ return (
+
+ );
+ })
+ );
+ }
+
+ render() {
+ return (
+
{this.toggleHidden();}}>
+
{this.reviewsMethod()}
+
+ {this.state.visible ? this.revItems() : ""}
+
+
+ );
+ }
+}
+
+export default Review;
diff --git a/src/components/ReviewItem.js b/src/components/ReviewItem.js
new file mode 100644
index 0000000..e2da741
--- /dev/null
+++ b/src/components/ReviewItem.js
@@ -0,0 +1,13 @@
+import React from "react";
+
+function ReviewItem(props) {
+ return (
+
+
+
{props.review.description}
+
{props.review.rating}
+
+ );
+}
+
+export default ReviewItem;
diff --git a/src/state.js b/src/state.js
index badf378..c95929b 100644
--- a/src/state.js
+++ b/src/state.js
@@ -4,7 +4,7 @@ export default {
"id": 1,
"name": "Body Luxuries Sweet Lavender Hand Sanitizer",
"description": "Psychotropic drugs, not elsewhere classified",
- "reviews": 46,
+ "reviewsNum": 46,
"rating": 2,
"imgUrl": "http://dummyimage.com/136x167.bmp/cc0000/ffffff",
"price": "$95.11",
@@ -44,7 +44,7 @@ export default {
"id": 2,
"name": "Topiramate",
"description": "Injury of ulnar nerve at forearm level, left arm, sequela",
- "reviews": 2,
+ "reviewsNum": 2,
"rating": 2,
"imgUrl": "http://dummyimage.com/125x134.jpg/cc0000/ffffff",
"price": "$37.09",
@@ -70,7 +70,7 @@ export default {
"id": 3,
"name": "Almond",
"description": "Other disorders of continuity of bone, unsp tibia and fibula",
- "reviews": 27,
+ "reviewsNum": 27,
"rating": 5,
"imgUrl": "http://dummyimage.com/149x190.jpg/dddddd/000000",
"price": "$51.83",
@@ -90,7 +90,7 @@ export default {
"id": 4,
"name": "VYTORIN",
"description": "Orchard as the place of occurrence of the external cause",
- "reviews": 60,
+ "reviewsNum": 60,
"rating": 3,
"imgUrl": "http://dummyimage.com/162x153.jpg/cc0000/ffffff",
"price": "$86.93",
@@ -110,7 +110,7 @@ export default {
"id": 5,
"name": "Decolorized Iodine",
"description": "Injury",
- "reviews": 20,
+ "reviewsNum": 20,
"rating": 1,
"imgUrl": "http://dummyimage.com/120x245.jpg/cc0000/ffffff",
"price": "$70.10",
@@ -130,7 +130,7 @@ export default {
"id": 6,
"name": "Fresh Sugar Honey Tinted Lip Treatment SPF15",
"description": "Unspecified open wound ",
- "reviews": 79,
+ "reviewsNum": 79,
"rating": 3,
"imgUrl": "http://dummyimage.com/211x227.bmp/5fa2dd/ffffff",
"price": "$39.25",
@@ -150,7 +150,7 @@ export default {
"id": 7,
"name": "LBel",
"description": "Toxic effect of 2-Propanol, intentional self-harm, init",
- "reviews": 76,
+ "reviewsNum": 76,
"rating": 3,
"imgUrl": "http://dummyimage.com/212x144.jpg/ff4444/ffffff",
"price": "$99.91",
@@ -170,7 +170,7 @@ export default {
"id": 8,
"name": "Cholestyramine",
"description": "Laceration without foreign body of trachea, sequela",
- "reviews": 74,
+ "reviewsNum": 74,
"rating": 3,
"imgUrl": "http://dummyimage.com/204x175.jpg/5fa2dd/ffffff",
"price": "$67.17",
@@ -190,7 +190,7 @@ export default {
"id": 9,
"name": "Risperidone",
"description": "Poisn by cephalospor/oth beta-lactm antibiot, undet, sequela",
- "reviews": 9,
+ "reviewsNum": 9,
"rating": 1,
"imgUrl": "http://dummyimage.com/212x108.bmp/cc0000/ffffff",
"price": "$96.84",
@@ -210,7 +210,7 @@ export default {
"id": 10,
"name": "MAC",
"description": "Other Gram-negative sepsis",
- "reviews": 45,
+ "reviewsNum": 45,
"rating": 2,
"imgUrl": "http://dummyimage.com/189x109.png/cc0000/ffffff",
"price": "$74.37",
@@ -221,4 +221,4 @@ export default {
}
]
}]
-}
\ No newline at end of file
+}