sorting out mapping

.prettierrc

@@ -1,3 +1,4 @@
 {
-  "arrow-parens": "always"
+  "arrow-parens": "always",
+  "tabWidth": 4
 }

firebaseFunctions/firestore.js

@@ -3,24 +3,44 @@ const admin = require(`firebase-admin`);
 
 admin.initializeApp(functions.config().firebase);
 
-export async function getAllQuestions() {
-  return admin
-    .firestore()
-    .collection(`questions`)
-    .get();
+export async function addAnswer({ email, question, answer, version }) {
+    return admin
+        .firestore()
+        .collection(`results`)
+        .doc(email)
+        .collection(`results`)
+        .doc(version)
+        .set({
+            [question]: answer
+        });
 }
 
-export async function createQuestion(question) {
-  return admin
-    .firestore()
-    .collection(`questions`)
-    .add(question);
+export async function getAllQuestions(version) {
+    return admin
+        .firestore()
+        .collection(`questions`)
+        .doc(version)
+        .collection(`questions`)
+        .get();
 }
 
-export async function getQuestion(id) {}
+export async function addQuestion({ question, version }) {
+    await admin
+        .firestore()
+        .collection(`questions`)
+        .doc(version)
+        .set(
+            {
+                [question.id]: question
+            },
+            {
+                merge: true
+            }
+        );
+}
 
-export async function deleteAllQuestions() {
-  return getAllQuestions().then(({ docs }) =>
-    Promise.all(docs.map((doc) => doc.ref.delete()))
-  );
+export async function deleteAllQuestions(version) {
+    return getAllQuestions(version).then(({ docs }) =>
+        Promise.all(docs.map((doc) => doc.ref.delete()))
+    );
 }

firebaseFunctions/index.js

@@ -1,15 +1,29 @@
 const functions = require(`firebase-functions`);
 
-import { deleteAllQuestions, createQuestion } from './firestore';
+import {
+    deleteAllQuestions,
+    addQuestion,
+    addAnswer,
+} from "./firestore";
+
+exports.addAnswer = functions.https.onRequest(async (request, response) => {
+    const { email, question, answer, version } = request.body;
+
+    await addAnswer({ email, question, answer, version });
+
+    response.send(`Answer added!`);
+});
 
 exports.createQuestions = functions.https.onRequest(
-  async (request, response) => {
-    const questions = request.body;
+    async (request, response) => {
+        const { version, questions } = request.body;
 
-    await deleteAllQuestions(questions);
+        await deleteAllQuestions(version);
 
-    await Promise.all(questions.map((question) => createQuestion(question)));
+        await Promise.all(
+            questions.map((question) => addQuestion({ question, version }))
+        );
 
-    response.send(`Questions updated!`);
-  }
+        response.send(`Questions updated for version ${version}!`);
+    }
 );

public/index.html

@@ -6,7 +6,7 @@
     <meta name="theme-color" content="#000000">
 
     <script>
-      console.log('Hey buddy. Don\'t cheat. Just do your best.');
+      console.log('Hey, don\'t cheat. Just do your best.');
     </script>
 
     <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

questions.json

@@ -1,27 +1,99 @@
-[
-  {
-    "id": "basic-variable",
-    "question": "Select the answer below that would set a variable named `myVariable` to `3`",
-    "incorrectFeedback": "This a very basic question and if this answer wasn't on accident, the rest of the quiz is probably going to be very difficult. Start by reading up on the [fundamentals of Javascript](https://www.w3schools.com/js/)",
-    "codeFigure":"var name = \"Bill\";\n\nfunction caller(func){\n  var myObject = {\n  name: \"Joe\"\n};\n\n  return func(myObject);\n}\n\n  function callee(param) {\n  return param.name\n}\n\nvar c = caller(callee);",
-    "answers": [
-      {
-        "type": "code",
-        "text": "myVariable(3)"
-      },
-      {
-        "type": "code",
-        "text": "var myVariable = 3;"
-      },
-      {
-        "type": "code",
-        "text": "var myVariable[3]"
-      },
-      {
-        "type": "code",
-        "text": "var myVariable = {\n    3\n}"
-      }
-    ],
-    "correctAnswer": 1
-  }
-]
+{
+  "version": "1",
+  "questions": [
+    {
+      "id": "basic-variable",
+      "question": "Select the answer below that would set a variable named `myVariable` to `3`:",
+      "incorrectFeedback": "This a very basic question and if this answer wasn't on accident, the rest of the quiz is probably going to be very difficult. Start by reading up on the [fundamentals of Javascript](https://www.w3schools.com/js/)",
+      "answers": [
+        {
+          "type": "code",
+          "text": "myVariable(3)"
+        },
+        {
+          "type": "code",
+          "text": "var myVariable = 3;"
+        },
+        {
+          "type": "code",
+          "text": "var myVariable[3]"
+        },
+        {
+          "type": "code",
+          "text": "var myVariable = {\n    3\n}"
+        }
+      ],
+      "correctAnswer": 1
+    },
+    {
+      "id": "null-vs-undefined",
+      "question": "What is the difference between `null` and `undefined`?",
+      "incorrectFeedback": "There are a surprising number of developers who don't know this. Burn the difference into memory because it's extremely important to understand.",
+      "answers": [
+        {
+          "type": "markdown",
+          "text": "`null` is a blank value that has to be assigned where `undefined` is assigned to any variable/property which hasn't been given a value"
+        },
+        {
+          "type": "markdown",
+          "text": "`null` is equivalent to `0` where `undefined` is a falsey value of `0`"
+        },
+        {
+          "type": "markdown",
+          "text": "`null` is equivalent to `false` when comparing objects and `undefined` is equivalent to `false` when comparing numbers"
+        },
+        {
+          "type": "markdown",
+          "text": "There is no difference"
+        }
+      ],
+      "correctAnswer": 0
+    },
+    {
+      "id": "variable-pointers",
+      "question": "What does `y` equal and why?",
+      "incorrectFeedback": "This is another thing that trips up developers. The key to remember here is that variables are just *pointers*. When `x` gets set to `3`, `y` is still pointing at the *value* of `x` - not `x` itself.",
+      "codeFigure":"var x = 4;\nvar y = x;\nx = 3;",
+      "answers": [
+        {
+          "type": "markdown",
+          "text": "`3`: Because `y` is a reference to `x` and `x` is `3`"
+        },
+        {
+          "type": "markdown",
+          "text": "`undefined`: Because `y` was set to `x` but then `x` changed so now `y` is a dead reference"
+        },
+        {
+          "type": "markdown",
+          "text": "`4`: Because `y` was set to the value of `x`, not `x` itself"
+        }
+      ],
+      "correctAnswer": 2
+    },
+    {
+      "id": "invoke-function",
+      "question": "Invoke/call the function:",
+      "incorrectFeedback": "This is another basic question that you should be able to answer if you're going to be doing Javascript development.",
+      "codeFigure":"function myFunction(){\n\n}",
+      "answers": [
+        {
+          "type": "markdown",
+          "text": "`(myFunction)`"
+        },
+        {
+          "type": "markdown",
+          "text": "`myFunction||`"
+        },
+        {
+          "type": "markdown",
+          "text": "`myFunction()`"
+        },
+        {
+          "type": "markdown",
+          "text": "`|myFunction|`"
+        }
+      ],
+      "correctAnswer": 2
+    }
+  ]
+}

src/components/QuestionAnswer/QuestionAnswer.component.js

@@ -9,22 +9,22 @@ import PropTypes from "prop-types";
 import "./QuestionAnswer.css";
 
 export default class QuestionAnswer extends PureComponent {
-  static propTypes = {
-      text: PropTypes.string.isRequired,
-      type: PropTypes.oneOf([`code`, `markdown`]),
-  };
-
-  static defaultProps = {
-      type: `markdown`,
-  };
-
-  render() {
-      const { type, text } = this.props;
-
-      return type === `code` ? (
-          <Highlight className={`javascript`}>{text}</Highlight>
-      ) : (
-          <Markdown>{text}</Markdown>
-      );
-  }
+    static propTypes = {
+        text: PropTypes.string.isRequired,
+        type: PropTypes.oneOf([`code`, `markdown`]),
+    };
+
+    static defaultProps = {
+        type: `markdown`,
+    };
+
+    render() {
+        const { type, text } = this.props;
+
+        return type === `code` ? (
+            <Highlight className={`javascript`}>{text}</Highlight>
+        ) : (
+            <Markdown>{text}</Markdown>
+        );
+    }
 }

src/components/Quiz/Quiz.component.js

@@ -9,21 +9,21 @@ import PropTypes from "prop-types";
 import "./Quiz.css";
 
 export default class Quiz extends PureComponent {
-  static propTypes = {
-      questions: PropTypes.object,
-  };
+    static propTypes = {
+        questions: PropTypes.object,
+    };
 
-  render() {
-      const { questions } = this.props;
+    render() {
+        const { questions } = this.props;
 
-      return questions && !isEmptyObject(questions) ? (
-          <div className={`Quiz`}>
-              {Object.values(questions).map((question) => (
-                  <div key={question.id}>
-                      <QuizQuestion {...question} />
-                  </div>
-              ))}
-          </div>
-      ) : null;
-  }
+        return questions && !isEmptyObject(questions) ? (
+            <div className={`Quiz`}>
+                {Object.values(questions).map((question) => (
+                    <div key={question.id}>
+                        <QuizQuestion {...question} />
+                    </div>
+                ))}
+            </div>
+        ) : null;
+    }
 }

src/components/Quiz/Quiz.container.js

@@ -7,8 +7,9 @@ import { firestoreConnect } from "react-redux-firebase";
 import Quiz from "./Quiz.component";
 
 export default compose(
-    firestoreConnect([`questions`]),
+    firestoreConnect([`questions/1`]),
     connect((state) => ({
-        questions: state.firestore.data.questions,
+        questions:
+            state.firestore.data.questions && state.firestore.data.questions[1],
     }))
 )(Quiz);