Add Match-the-Columns Question Type

backend/Generator/match_columns.py

@@ -0,0 +1,76 @@
+import spacy
+import random
+from nltk.tokenize import sent_tokenize
+
+nlp = spacy.load("en_core_web_sm")
+
+def extract_pairs_from_text(text, max_pairs=6):
+    doc = nlp(text)
+    pairs = []
+    seen_terms = set()
+    seen_definitions = set()
+
+    for sent in doc.sents:
+        sent_doc = nlp(sent.text)
+
+        for ent in sent_doc.ents:
+            term = ent.text.strip()
+            definition = sent.text.strip()
+            if (
+                term and
+                len(term.split()) <= 4 and
+                term.lower() not in seen_terms and
+                definition not in seen_definitions and
+                len(definition) > len(term) + 10
+            ):
+                pairs.append({"term": term, "definition": definition})
+                seen_terms.add(term.lower())
+                seen_definitions.add(definition)
+                break
+
+        if len(pairs) >= max_pairs:
+            break
+
+    if len(pairs) < 3:
+        for sent in doc.sents:
+            sent_doc = nlp(sent.text)
+            for chunk in sent_doc.noun_chunks:
+                term = chunk.text.strip()
+                definition = sent.text.strip()
+                if (
+                    term and
+                    len(term.split()) <= 4 and
+                    term.lower() not in seen_terms and
+                    definition not in seen_definitions and
+                    len(definition) > len(term) + 10
+                ):
+                    pairs.append({"term": term, "definition": definition})
+                    seen_terms.add(term.lower())
+                    seen_definitions.add(definition)
+                    break
+            if len(pairs) >= max_pairs:
+                break
+
+    return pairs[:max_pairs]
+
+
+def generate_match_columns(payload):
+    text = payload.get("input_text", "")
+    max_pairs = payload.get("max_questions", 6)
+
+    pairs = extract_pairs_from_text(text, max_pairs)
+
+    if not pairs:
+        return {"pairs": [], "left_column": [], "right_column": []}
+
+    left_column = [p["term"] for p in pairs]
+    right_column = [p["definition"] for p in pairs]
+
+    shuffled_right = right_column.copy()
+    random.shuffle(shuffled_right)
+
+    return {
+        "pairs": pairs,
+        "left_column": left_column,
+        "right_column": shuffled_right
+    }

backend/server.py

@@ -25,6 +25,7 @@
 from httplib2 import Http
 from oauth2client import client, file, tools
 from mediawikiapi import MediaWikiAPI
+from Generator.match_columns import generate_match_columns
 
 app = Flask(__name__)
 CORS(app)
@@ -490,6 +491,23 @@ def get_transcript():
 
     return jsonify({"transcript": transcript_text})
 
+
+@app.route("/get_match_columns", methods=["POST"])
+def get_match_columns():
+    data = request.get_json()
+    input_text = data.get("input_text", "")
+    use_mediawiki = data.get("use_mediawiki", 0)
+    max_questions = data.get("max_questions", 6)
+    input_text = process_input_text(input_text, use_mediawiki)
+
+    result = generate_match_columns({
+        "input_text": input_text,
+        "max_questions": max_questions
+    })
+
+    return jsonify(result)
+
+
 if __name__ == "__main__":
     os.makedirs("subtitles", exist_ok=True)
     app.run()

eduaid_web/src/pages/Output.jsx

@@ -27,7 +27,7 @@ const Output = () => {
 
     document.addEventListener('mousedown', handleClickOutside);
     return () => document.removeEventListener('mousedown', handleClickOutside);
-}, []);
+  }, []);
 
   function shuffleArray(array) {
     const shuffledArray = [...array];
@@ -96,9 +96,9 @@ const Output = () => {
     if (qaPairsFromStorage) {
       const combinedQaPairs = [];
 
-      if (qaPairsFromStorage["output_boolq"]) {
+      if (questionType === "get_problems" && qaPairsFromStorage["output_boolq"]) {
         qaPairsFromStorage["output_boolq"]["Boolean_Questions"].forEach(
-          (question, index) => {
+          (question) => {
             combinedQaPairs.push({
               question,
               question_type: "Boolean",
@@ -108,7 +108,7 @@ const Output = () => {
         );
       }
 
-      if (qaPairsFromStorage["output_mcq"]) {
+      if (questionType === "get_problems" && qaPairsFromStorage["output_mcq"]) {
         qaPairsFromStorage["output_mcq"]["questions"].forEach((qaPair) => {
           combinedQaPairs.push({
             question: qaPair.question_statement,
@@ -120,7 +120,7 @@ const Output = () => {
         });
       }
 
-      if (qaPairsFromStorage["output_mcq"] || questionType === "get_mcq") {
+      if (questionType === "get_mcq" && qaPairsFromStorage["output"]) {
         qaPairsFromStorage["output"].forEach((qaPair) => {
           combinedQaPairs.push({
             question: qaPair.question_statement,
@@ -130,9 +130,19 @@ const Output = () => {
             context: qaPair.context,
           });
         });
-      }
+      } else if (questionType === "get_match_columns") {
+        const pairs = qaPairsFromStorage["pairs"] || [];
+        const shuffledRight = qaPairsFromStorage["right_column"] || [];
 
-      if (questionType == "get_boolq") {
+        if (pairs.length > 0) {
+          combinedQaPairs.push({
+            question_type: "MatchColumns",
+            pairs: pairs,
+            left_column: pairs.map((p) => p.term),
+            right_column: shuffledRight,
+          });
+        }
+      } else if (questionType === "get_boolq" && qaPairsFromStorage["output"]) {
         qaPairsFromStorage["output"].forEach((qaPair) => {
           combinedQaPairs.push({
             question: qaPair,
@@ -154,7 +164,7 @@ const Output = () => {
 
       setQaPairs(combinedQaPairs);
     }
-  }, []);
+  }, [questionType]);
 
   const generateGoogleForm = async () => {
     try {
@@ -180,7 +190,7 @@ const Output = () => {
     }
   };
 
-    const generatePDF = async (mode) => {
+  const generatePDF = async (mode) => {
     const logoBytes = await loadLogoAsBytes();
     const worker = new Worker(new URL("../workers/pdfWorker.js", import.meta.url), { type: "module" });
 
@@ -209,7 +219,6 @@ const Output = () => {
     <div className="popup w-full h-full bg-[#02000F] flex justify-center items-center">
       <div className="w-full h-full bg-cust bg-opacity-50 bg-custom-gradient">
         <div className="flex flex-col h-full">
-          {/* Header - Responsive logo and title */}
           <Link to="/">
             <div className="flex items-end gap-[2px] px-4 sm:px-6">
               <img 
@@ -228,7 +237,6 @@ const Output = () => {
             </div>
           </Link>
 
-          {/* Title and Shuffle Button */}
           <div className="flex justify-between items-center mt-3 mx-4 sm:mx-6">
             <div className="font-bold text-lg sm:text-xl text-white">
               Generated Questions
@@ -247,7 +255,6 @@ const Output = () => {
             </button>
           </div>
 
-          {/* Questions Container - Responsive padding and margins */}
           <div className="flex-1 overflow-y-auto scrollbar-hide px-2 sm:px-4">
             {qaPairs &&
               qaPairs.map((qaPair, index) => {
@@ -261,62 +268,109 @@ const Output = () => {
                   >
                     <div className="flex justify-between items-center mb-2">
                       <div className="text-[#E4E4E4] text-xs sm:text-sm">
-                        Question {index + 1}
+                        {qaPair.question_type === "MatchColumns"
+                          ? "Match the Columns"
+                          : `Question ${index + 1}`}
                       </div>
-                      {!isEditing ? (
-                        <button
-                          className="bg-[#518E8E] hover:bg-[#3a6b6b] text-white px-3 sm:px-4 py-1.5 sm:py-2 rounded-lg text-xs sm:text-sm font-semibold transition-colors shadow-sm flex items-center gap-2"
-                          onClick={() => handleEditQuestion(index)}
-                        >
-                          <FiEdit2 className="text-sm sm:text-base" />
-                          Edit
-                        </button>
-                      ) : (
-                        <div className="flex gap-2">
-                          <button
-                            className="bg-green-700 hover:bg-green-800 text-white px-3 sm:px-4 py-1.5 sm:py-2 rounded-lg text-xs sm:text-sm font-semibold transition-colors shadow-sm flex items-center gap-2"
-                            onClick={() => handleSaveQuestion(index)}
-                          >
-                            <FiCheck className="text-sm sm:text-base" />
-                            Save
-                          </button>
-                          <button
-                            className="bg-gray-600 hover:bg-gray-700 text-white px-3 sm:px-4 py-1.5 sm:py-2 rounded-lg text-xs sm:text-sm font-semibold transition-colors shadow-sm flex items-center gap-2"
-                            onClick={handleCancelEdit}
-                          >
-                            <FiX className="text-sm sm:text-base" />
-                            Cancel
-                          </button>
-                        </div>
+
+                      {qaPair.question_type !== "MatchColumns" && (
+                        <>
+                          {!isEditing ? (
+                            <button
+                              className="bg-[#518E8E] hover:bg-[#3a6b6b] text-white px-3 sm:px-4 py-1.5 sm:py-2 rounded-lg text-xs sm:text-sm font-semibold transition-colors shadow-sm flex items-center gap-2"
+                              onClick={() => handleEditQuestion(index)}
+                            >
+                              <FiEdit2 className="text-sm sm:text-base" />
+                              Edit
+                            </button>
+                          ) : (
+                            <div className="flex gap-2">
+                              <button
+                                className="bg-green-700 hover:bg-green-800 text-white px-3 sm:px-4 py-1.5 sm:py-2 rounded-lg text-xs sm:text-sm font-semibold transition-colors shadow-sm flex items-center gap-2"
+                                onClick={() => handleSaveQuestion(index)}
+                              >
+                                <FiCheck className="text-sm sm:text-base" />
+                                Save
+                              </button>
+                              <button
+                                className="bg-gray-600 hover:bg-gray-700 text-white px-3 sm:px-4 py-1.5 sm:py-2 rounded-lg text-xs sm:text-sm font-semibold transition-colors shadow-sm flex items-center gap-2"
+                                onClick={handleCancelEdit}
+                              >
+                                <FiX className="text-sm sm:text-base" />
+                                Cancel
+                              </button>
+                            </div>
+                          )}
+                        </>
                       )}
                     </div>
 
                     {!isEditing ? (
                       <>
-                        <div className="text-[#FFF4F4] text-sm sm:text-base my-1 sm:my-2 leading-relaxed">
-                          {qaPair.question}
-                        </div>
-                        {qaPair.question_type !== "Boolean" && (
-                          <>
-                            <div className="text-[#E4E4E4] text-xs sm:text-sm mt-3 sm:mt-4">
-                              Answer
+                        {qaPair.question_type === "MatchColumns" ? (
+                          <div className="w-full mt-2">
+                            <div className="flex justify-between text-[#E4E4E4] text-xs sm:text-sm font-bold mb-3 px-2">
+                              <span className="flex-1 text-center">Column A (Terms)</span>
+                              <span className="flex-1 text-center">Column B (Definitions)</span>
                             </div>
-                            <div className="text-[#FFF4F4] text-sm sm:text-base leading-relaxed">
-                              {qaPair.answer}
+                            {qaPair.left_column.map((term, i) => (
+                              <div key={i} className="flex justify-between gap-4 mb-2 px-2">
+                                <div className="text-[#FFF4F4] text-sm flex-1 bg-[#1a1a2e] p-2 rounded border border-gray-700">
+                                  {i + 1}. {term}
+                                </div>
+                                <div className="text-[#FFF4F4] text-sm flex-1 bg-[#1a1a2e] p-2 rounded border border-gray-700">
+                                  {String.fromCharCode(65 + i)}. {qaPair.right_column[i] ?? "—"}
+                                </div>
+                              </div>
+                            ))}
+
+                            {(() => {
+                              const answerMap = qaPair.pairs.map((pair) => {
+                                const idx = qaPair.right_column.indexOf(pair.definition);
+                                return idx >= 0 ? String.fromCharCode(65 + idx) : "?";
+                              });
+                              return (
+                                <div className="mt-4 px-2 border-t border-gray-700 pt-3">
+                                  <div className="text-[#E4E4E4] text-xs sm:text-sm font-bold mb-2">
+                                    Answer Key
+                                  </div>
+                                  {qaPair.pairs.map((pair, i) => (
+                                    <div key={i} className="text-[#FFF4F4] text-xs sm:text-sm mb-1">
+                                      {i + 1} → {answerMap[i]}
+                                    </div>
+                                  ))}
+                                </div>
+                              );
+                            })()}
+                          </div>
+                        ) : (
+                          <>
+                            <div className="text-[#FFF4F4] text-sm sm:text-base my-1 sm:my-2 leading-relaxed">
+                              {qaPair.question}
                             </div>
-                            {qaPair.options && qaPair.options.length > 0 && (
-                              <div className="text-[#FFF4F4] text-sm sm:text-base mt-2 sm:mt-3">
-                                {shuffledOptions.map((option, idx) => (
-                                  <div key={idx} className="mb-1 sm:mb-2">
-                                    <span className="text-[#E4E4E4] text-xs sm:text-sm">
-                                      Option {idx + 1}:
-                                    </span>{" "}
-                                    <span className="text-[#FFF4F4] text-sm sm:text-base">
-                                      {option}
-                                    </span>
+                            {qaPair.question_type !== "Boolean" && (
+                              <>
+                                <div className="text-[#E4E4E4] text-xs sm:text-sm mt-3 sm:mt-4">
+                                  Answer
+                                </div>
+                                <div className="text-[#FFF4F4] text-sm sm:text-base leading-relaxed">
+                                  {qaPair.answer}
+                                </div>
+                                {qaPair.options && qaPair.options.length > 0 && (
+                                  <div className="text-[#FFF4F4] text-sm sm:text-base mt-2 sm:mt-3">
+                                    {shuffledOptions.map((option, idx) => (
+                                      <div key={idx} className="mb-1 sm:mb-2">
+                                        <span className="text-[#E4E4E4] text-xs sm:text-sm">
+                                          Option {idx + 1}:
+                                        </span>{" "}
+                                        <span className="text-[#FFF4F4] text-sm sm:text-base">
+                                          {option}
+                                        </span>
+                                      </div>
+                                    ))}
                                   </div>
-                                ))}
-                              </div>
+                                )}
+                              </>
                             )}
                           </>
                         )}
@@ -374,7 +428,6 @@ const Output = () => {
               })}
           </div>
 
-          {/* Action Buttons - Responsive layout */}
           <div className="flex flex-col sm:flex-row items-center justify-center gap-4 sm:gap-6 mx-4 sm:mx-auto pb-4 sm:pb-6">
             <button
               className="bg-[#518E8E] items-center flex gap-1 w-full sm:w-auto font-semibold text-white px-4 sm:px-6 py-3 sm:py-2 rounded-xl text-sm sm:text-base hover:bg-[#3a6b6b] transition-colors justify-center"
@@ -422,5 +475,4 @@ const Output = () => {
   );
 };
 
-
-export default Output;
+export default Output;

eduaid_web/src/pages/Question_Type.jsx

@@ -52,6 +52,7 @@ const Question_Type = () => {
             { id: "get_shortq", label: "Short-Answer Type Questions" },
             { id: "get_mcq", label: "Multiple Choice Questions" },
             { id: "get_boolq", label: "True/False Questions" },
+            { id: "get_match_columns", label: "Match the Columns" },
             { id: "get_problems", label: "All Questions" },
           ].map((option) => (
             <div