Merge pull request #58 from fac-13/buttonHandler

add button and handleClick

src/components/options/options.js

@@ -1,15 +1,19 @@
 import React from 'react';
 
-const Button = ({ answer, goto }) => {
-  return <button data-goto={goto}>{answer}</button>;
+const Button = ({ answer, goto, clickHandler }) => {
+  return (
+    <button onClick={clickHandler} data-goto={goto}>
+      {answer}
+    </button>
+  );
 };
 
-function Options({ options }) {
+function Options({ options, clickHandler }) {
   const optionList = () => {
     let i = 0;
 
     return options.map(option => {
-      return <Button {...option} key={i++} />;
+      return <Button clickHandler={clickHandler} {...option} key={i++} />;
     });
   };
 

src/components/qacontainer/qacontainer.js

@@ -12,7 +12,7 @@ function QAContainer(props) {
       ) : (
         <React.Fragment>
           <Question question={question} />
-          <Options options={options} />
+          <Options options={options} clickHandler={props.clickHandler} />
         </React.Fragment>
       )}
     </li>

src/components/wayfinder/wayfinder.js

@@ -12,11 +12,27 @@ export default class Wayfinder extends React.Component {
     };
   }
 
+  // TODO need to clear out and restart usersPath if user changes one of their answers
+  clickHandler = event => {
+    const goto = event.target.dataset.goto;
+    this.setState(prevState => {
+      return {
+        usersPath: prevState.usersPath.concat(goto)
+      };
+    });
+  };
+
   questionList = () => {
     const { content, usersPath } = this.state;
 
     return usersPath.map(item => {
-      return <QAContainer qablock={content[item]} key={item} />;
+      return (
+        <QAContainer
+          qablock={content[item]}
+          clickHandler={this.clickHandler}
+          key={item}
+        />
+      );
     });
   };