added code to get status of quiz guesses

Shelrothman · Aug 24, 2020 · b594eb4 · b594eb4
1 parent a37b3ad
commit b594eb4
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 6 deletions.
diff --git a/client/src/pages/Results/ResultCard.js b/client/src/pages/Results/ResultCard.js
@@ -2,14 +2,15 @@ import React from "react";
 import ResultsFacts from "./ResultsFacts";
 
 function ResultCard(props) {
+  console.log(props);
 
   return (
     <div className="col-sm-2 title-container p-3 m-3">
       <div className="card">
         <div className="card-body">
           <h5 className="card-title">{props.country}</h5>
           <span className="badge badge-pill badge-success">Correct</span>
-          <ResultsFacts country={props.country}/>
+          <ResultsFacts country={props.country} />
         </div>
       </div>
     </div>

diff --git a/client/src/pages/Results/Results.js b/client/src/pages/Results/Results.js
@@ -7,11 +7,9 @@ import ResultCard from "./ResultCard";
 
 function Results(props) {
   const continent = useParams().continent;
-  console.log(continent);
 
   const countries = props.location.resultProps.countryList;
   const guessedCountries = props.location.resultProps.resultList;
-  console.log(guessedCountries);
 
   let correct = 0;
   let incorrect = 0;
@@ -21,12 +19,25 @@ function Results(props) {
     } else {
       incorrect++;
     }
-    console.log(`Correct: ${correct} Incorrect: ${incorrect}`);
   }
 
   const score = `${(correct / 5) * 100}%`;
-  console.log(`Your score is: ${score}`);
 
+  function getStatus(country) {
+    let status = "Incorrect";
+    for (let i = 1; i < guessedCountries.length; i++) {
+      let countryStatus = guessedCountries[i];
+      console.log("guessedList", guessedCountries);
+      console.log(country, countryStatus[country]);
+      if (countryStatus[country] === "Correct") {
+        status = "Correct";
+        return "Correct";
+      }
+    }
+    if (status === "Incorrect") {
+      return "Incorrect";
+    }
+  }
   useEffect(() => {
     let results = {};
     results[continent] = score;
@@ -42,7 +53,13 @@ function Results(props) {
       </div>
       <div className="row text-center">
         {countries.map((country) => {
-          return <ResultCard key={Math.random()} country={country} />;
+          return (
+            <ResultCard
+              key={Math.random()}
+              country={country}
+              status={getStatus(country)}
+            />
+          );
         })}
       </div>
       <div className="row">