From 9ddd10bb77f583d1bdea193dc77be503ceda606a Mon Sep 17 00:00:00 2001
From: Dimas Atmodjo <dimasputra162003@gmail.com>
Date: Tue, 5 Nov 2024 02:24:16 +0700
Subject: [PATCH] update exercise student views

---
 .../exercise/views/components/MatchingPairsQuestion.jsx  | 9 +++++++--
 .../exercise/views/components/MultipleChoiceQuestion.jsx | 8 +++++++-
 .../user/exercise/views/components/TrueFalseQuestion.jsx | 8 +++++++-
 3 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/roles/user/exercise/views/components/MatchingPairsQuestion.jsx b/src/roles/user/exercise/views/components/MatchingPairsQuestion.jsx
index b112dd6..4a45f63 100644
--- a/src/roles/user/exercise/views/components/MatchingPairsQuestion.jsx
+++ b/src/roles/user/exercise/views/components/MatchingPairsQuestion.jsx
@@ -122,8 +122,13 @@ const MatchingPairsQuestion = ({ question, onAnswer, studentAnswer, index }) =>
 
       {mediaUrls.length > 0 && <MediaViewer mediaUrls={mediaUrls} />}
 
-
-      <p>{question.QUESTION}</p>
+      <p>{question.QUESTION.split('\n').map((line, index) => (
+          <React.Fragment key={index}>
+              {line}
+              <br />
+          </React.Fragment>
+      ))}</p>
+      
       <div className="w-100 options-mp d-flex justify-content-between">
         {/* Bagian kiri */}
         <div>
diff --git a/src/roles/user/exercise/views/components/MultipleChoiceQuestion.jsx b/src/roles/user/exercise/views/components/MultipleChoiceQuestion.jsx
index 5305bbc..ca3802d 100644
--- a/src/roles/user/exercise/views/components/MultipleChoiceQuestion.jsx
+++ b/src/roles/user/exercise/views/components/MultipleChoiceQuestion.jsx
@@ -26,7 +26,13 @@ const MultipleChoiceQuestion = ({ question, onAnswer, studentAnswer, index }) =>
     <div>
       {mediaUrls.length > 0 && <MediaViewer mediaUrls={mediaUrls} />}
 
-      <p>{question.QUESTION}</p>
+      <p>{question.QUESTION.split('\n').map((line, index) => (
+          <React.Fragment key={index}>
+              {line}
+              <br />
+          </React.Fragment>
+      ))}</p>
+      
       <div className="options">
         {['OPTION_A', 'OPTION_B', 'OPTION_C', 'OPTION_D', 'OPTION_E'].map(
           (optionKey) => {
diff --git a/src/roles/user/exercise/views/components/TrueFalseQuestion.jsx b/src/roles/user/exercise/views/components/TrueFalseQuestion.jsx
index f39d959..0d22319 100644
--- a/src/roles/user/exercise/views/components/TrueFalseQuestion.jsx
+++ b/src/roles/user/exercise/views/components/TrueFalseQuestion.jsx
@@ -19,7 +19,13 @@ const TrueFalseQuestion = ({ question, onAnswer, studentAnswer, index }) => {
     <div>
       {mediaUrls.length > 0 && <MediaViewer mediaUrls={mediaUrls} />}
 
-      <p>{question.QUESTION}</p>
+      <p>{question.QUESTION.split('\n').map((line, index) => (
+          <React.Fragment key={index}>
+              {line}
+              <br />
+          </React.Fragment>
+      ))}</p>
+      
       <div className="options-tf">
 
         <div