Merge pull request #29 from Team-Pulsar/questions-interactions

refactor styling, get requests for q/a, begin testing
Team-Pulsar · Jul 9, 2020 · 834c22b · 834c22b
2 parents 8d5a7cb + 8cde3e1
commit 834c22b
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 10 deletions.
diff --git a/src/components/questions/AnswerModal.js b/src/components/questions/AnswerModal.js
@@ -29,7 +29,7 @@ class AnswerModal extends React.Component {
           photos: photos,
       })
       .then((res) => {
-        console.log(res);
+        // console.log(res);
         alert("Thank you for submitting your answer");
       })
       .catch((err) => {

diff --git a/src/components/questions/AnswersList.js b/src/components/questions/AnswersList.js
@@ -30,7 +30,11 @@ class AnswersList extends React.Component {
   getAnswers() {
     const { question_id } = this.props;
     axios
-      .get(`http://18.224.200.47/qa/${question_id}/answers`)
+      .get(`http://18.224.200.47/qa/${question_id}/answers`, {
+        params: {
+          count: 10
+        }
+      })
       .then(({ data }) => {
         this.setState({
           answers: data.results,

diff --git a/src/components/questions/Questions.js b/src/components/questions/Questions.js
@@ -22,6 +22,7 @@ class Questions extends React.Component {
     this.handleChange = this.handleChange.bind(this);
     this.moreQuestions = this.moreQuestions.bind(this);
     this.sliceQuestions = this.sliceQuestions.bind(this);
+    this.handleClick = this.handleClick.bind(this);
   }
 
   componentDidMount() {
@@ -31,7 +32,11 @@ class Questions extends React.Component {
 
   getQuestions() {
     axios
-      .get(`http://18.224.200.47/qa/${this.state.product_id}`)
+      .get(`http://18.224.200.47/qa/${this.state.product_id}`, {
+        params: {
+          count: 10
+        }
+      })
       .then(({ data }) => {
         console.log(data.results);
         let resultsSlice = this.sliceQuestions(data.results);
@@ -104,6 +109,10 @@ class Questions extends React.Component {
     }
   }
 
+  handleClick(target) {
+    console.log(target);
+  }
+
   render() {
     return (
       <div className="questions-answers-container container">

diff --git a/src/components/questions/questionsHelpers.test.js b/src/components/questions/questionsHelpers.test.js
@@ -2,4 +2,13 @@ const helpers = require('./questionsHelpers');
 
 test('takes in an ISO-format date and returns a human readable date', () => {
   expect(helpers.getDate("2018-10-18T00:00:00.000Z").toEqual("August 18, 2018"))
+});
+
+test('', () => {
+  expect(helpers.compareAnswers('').toEqual(''))
+});
+
+test('verifies the input email is formatted correctly', () => {
+  expect(helpers.validateEmail('[email protected]').toBe(true));
+  expect(helpers.validateEmail('example.com').toBe(false));
 });
diff --git a/src/components/questions/questionsStyles.css b/src/components/questions/questionsStyles.css
@@ -7,15 +7,17 @@
   height: 50px;
 }
 
-.search-bar-img {
-  /* margin-right: 25%; */
-  /* position: relative; */
-}
+/* .search-bar-img {
+  margin-right: 25%;
+  position: relative;
+} */
 
 .questions-container {
   display: flex;
   flex-flow: column nowrap;
   padding-top: 15px;
+  max-height: 44vmax;
+  overflow: scroll;
 }
 
 .questions-answers-container {
@@ -51,6 +53,8 @@
   font-size: medium;
   display: grid;
   grid-template-columns: 2% 40%;
+  max-height: 25vmax;
+  overflow: scroll;
 }
 
 .helpful-span {
@@ -60,10 +64,10 @@
 
 #answer-body {
   font-size: smaller;
-  margin: 1.5% 0% 2% 2%;
+  margin: 1% 0% 2% 2%;
   /* margin-bottom: 2%;
   margin-top: 1%; */
-  color: rgba(41, 47, 53, 0.986)
+  color: rgba(41, 47, 53, 0.986);
 }
 
 .answer {
@@ -73,7 +77,7 @@
 .answerer-info {
   margin-top: 1.5%;
   font-size: smaller;
-  color:  rgba(86, 92, 99, 0.966)
+  color: rgba(86, 92, 99, 0.966);
 }
 
 .more-answers {