From ba857fa24181f38ae5c41c7ce7ef8be31c5148f9 Mon Sep 17 00:00:00 2001
From: bzhang102 <yuxiangbrandonzhang@gmail.com>
Date: Tue, 20 Feb 2024 12:30:53 -0800
Subject: [PATCH] Added TestCase[] prop

---
 src/components/mario-comps/MarioCode.tsx | 6 ++++++
 src/components/shared/FinishCode.tsx     | 9 +++++++++
 src/components/shared/TestCase.tsx       | 9 +++++++++
 3 files changed, 24 insertions(+)
 create mode 100644 src/components/shared/TestCase.tsx

diff --git a/src/components/mario-comps/MarioCode.tsx b/src/components/mario-comps/MarioCode.tsx
index 02e14e8..0d85449 100644
--- a/src/components/mario-comps/MarioCode.tsx
+++ b/src/components/mario-comps/MarioCode.tsx
@@ -10,6 +10,7 @@ import Blue from '../shared/Blue';
 import MarioDropdown from '../shared/Dropdown';
 import Gold from '../shared/Gold';
 import Tab from '../shared/Tab';
+import { TestCase } from '../shared/TestCase';
 
 function MarioCode(): JSX.Element {
   const [selectedanswer, setselectedanswer] = useState({
@@ -570,6 +571,11 @@ function MarioCode(): JSX.Element {
       given_function={() => recurSum(5)}
       answer_key={answerKey}
       name="mario"
+      testCases={[
+        new TestCase('1', '1'),
+        new TestCase('2', '2'),
+        new TestCase('3', '3'),
+      ]}
     >
       <div className="left-align">
         <Blue>def</Blue>
diff --git a/src/components/shared/FinishCode.tsx b/src/components/shared/FinishCode.tsx
index adad2f0..1ec96ed 100644
--- a/src/components/shared/FinishCode.tsx
+++ b/src/components/shared/FinishCode.tsx
@@ -3,6 +3,7 @@ import { useState } from 'react';
 import ConfettiExplosion from 'react-confetti-explosion';
 import { useLocalStorage } from '../useLocalStorage';
 import '../../styles/Checkmark.scss';
+import { TestCase } from './TestCase';
 
 interface FinishCodeCardProps {
   children?: JSX.Element;
@@ -13,6 +14,8 @@ interface FinishCodeCardProps {
   given_function: any;
   answer_key: Record<PropertyKey, string>;
   name: string;
+  //Test Case Functionality
+  testCases?: TestCase[];
 }
 
 interface ConfettiProps
@@ -46,6 +49,7 @@ function FinishCodeCard(props: FinishCodeCardProps): JSX.Element {
   const [showAnswer, setShowAnswer] = useState(false);
   const [givenAnswer, setGivenAnswer] = useState(props.given_function());
   const [chosenAnswer, setChosenAnswer] = useState(0);
+  const [testCases, setTestCases] = useState<TestCase[]>(props.testCases || []);
   let showAnswerResponse = '';
   const someArray = Object.entries(props.answer_key);
 
@@ -125,6 +129,11 @@ function FinishCodeCard(props: FinishCodeCardProps): JSX.Element {
       <div className="finish-content">
         <div>{props.children}</div>
         <div className="code-output">
+          {/* MARK: Test Cases Test*/}
+          <div>
+            <p>Input: {testCases[0].data}</p>
+            <p>Expected Output: {testCases[0].answer}</p>
+          </div>
           {expand &&
             !showAnswer &&
             tries != 0 &&
diff --git a/src/components/shared/TestCase.tsx b/src/components/shared/TestCase.tsx
new file mode 100644
index 0000000..77a00c8
--- /dev/null
+++ b/src/components/shared/TestCase.tsx
@@ -0,0 +1,9 @@
+export class TestCase {
+  data: string;
+  answer: string;
+
+  constructor(data: string, answer: string) {
+    this.data = data;
+    this.answer = answer;
+  }
+}