completed assignment by adding submissions tab

client/src/Components/AllProblems/AllProblems.jsx

@@ -32,7 +32,7 @@ const AllProblemsPage = () => {
           </tr>
 
           {problems.map((prob,index) => (
-            <tr>
+            <tr key={prob.problemId}>
               <Link to={`/problems/:${prob.problemId}`}>
                 <td>{prob.title}</td>
               </Link>

client/src/Components/Login/Login.jsx

@@ -27,6 +27,9 @@ const Login = () => {
         <button type="submit" id="test" onClick={async (e) => {
           const response = await fetch(`${backendUrl}/login`, {
             method: "POST",
+            headers:{
+              "Content-Type":"application/json"
+            },
             body: JSON.stringify({
               email: email,
               password: password

client/src/Components/ProblemsPage/ProblemsPage.css

@@ -40,4 +40,24 @@ button {
 }
 #submit {
     background-color: rgb(68, 207, 68);
+}
+
+#sub-content{
+    padding: 1vh;
+   border : 1px solid black;
+    border-radius: 0.3vw;
+    height: 39vh;
+    width: 100%;
+    overflow-y: scroll;
+}
+#internal{
+    margin : 1%;
+}
+.AC {
+    color: green;
+    font-weight: 900;
+}
+.WA {
+    color: red;
+    font-weight: 900;
 }

client/src/Components/ProblemsPage/ProblemsPage.jsx

@@ -11,18 +11,35 @@ const ProblemsPage = () => {
   const cleanId = pid.substring(1) ;
   const [problem, setProblem] = useState(null);
   const [submission, setSubmission] = useState("");
+  const [submissions,setSubmissions]= useState([]);
 
+  const handlesubmissions = async ()=>{
+    const response = await fetch(`${backendUrl}/submissions/`+cleanId,{
+      method:"GET",
+      headers: {
+        "authorization": localStorage.getItem("token"),
+      },
+    })
+    const json = await response.json();
+    // let ans = [];
+    const ans = json.submissions.filter((x)=> {
+      console.log(x.status)
+    })
+    setSubmissions(json.submissions);
+  }
     const init = async () => {
       const response = await fetch(`${backendUrl}/problem/` + cleanId, {
         method: "GET",
       });
 
       const json = await response.json();
       setProblem(json.problem);
+
     }
 
   useEffect(() => {
     init();
+    handlesubmissions();
   }, [])
   // console.log(cleanId) ;
 
@@ -39,8 +56,8 @@ const ProblemsPage = () => {
   }
 
   return (
+      <>
     <div>
-
       {
         problem? (
           <div id="problempage" className='flex-row'>
@@ -50,6 +67,21 @@ const ProblemsPage = () => {
               <p>{problem.description}</p>
               <code>Input : {problem.exampleIn}</code>
               <code>Output : {problem.exampleOut}</code>
+              <div id="submissions">
+                <h3>Submissions</h3>
+                <div id="sub-content">
+                  {
+                    submissions.map((x,index)=>{
+                      return(
+                          <div id="internal" key ={index} >
+                          <div >Submission: {index}</div>
+
+                          <div className={x.status} >Status: {x.status}</div></div>
+                    )
+                    })
+                  }
+                </div>
+              </div>
             </div>
             <div className="code">
               <h1>Code Here</h1>
@@ -59,7 +91,8 @@ const ProblemsPage = () => {
                   const response = await fetch(`${backendUrl}/submission`, {
                     method: "POST",
                     headers: {
-                      "authorization": localStorage.getItem("token")
+                      "authorization": localStorage.getItem("token"),
+                        "Content-Type":"application/json"
                     },
                     body: JSON.stringify({
                       problemId: cleanId,
@@ -69,7 +102,7 @@ const ProblemsPage = () => {
 
                   const json = await response.json();
                   console.log(json);
-
+                  handlesubmissions();
                 }}>SubmitCode</button>
               </div>
             </div>
@@ -79,7 +112,7 @@ const ProblemsPage = () => {
       }
 
     </div>
-
+      </>
   )
 }
 

client/src/Components/Signup/Signup.jsx

@@ -38,6 +38,9 @@ const Signup = () => {
           onClick={async (e) => {
             const response = await fetch(`${backendUrl}/signup`, {
               method: "POST",
+                headers:{
+                    'Content-Type':'application/json'
+                },
               body: JSON.stringify({
                 email: email,
                 password: password,

server/index.js

@@ -10,7 +10,9 @@ const bodyParser = require("body-parser");
 var jsonParser = bodyParser.json();
 var urlencodedParser = bodyParser.urlencoded({ extended: false });
 const cors = require("cors");
-app.use(cors());
+app.use(cors(
+    {origin: "*"}
+));
 app.use(jsonParser);
 
 const PROBLEMS = [