l-min-components 1.7.1557 → 1.7.1558

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "l-min-components",
-  "version": "1.7.1557",
+  "version": "1.7.1558",
   "type": "module",
   "files": [
     "src/assets",

package/src/components/reportsComponents/fullAnalysis/components/Comprehension.jsx

@@ -0,0 +1,47 @@
+import React from "react";
+import {
+  ComprehensionContainer,
+  ComprehensionContainerResponse,
+  ComprehensionFeekback,
+} from "../style";
+
+const FeekbackResponsive = ({ title, content, color = "#00C2C2" }) => {
+  return (
+    <ComprehensionFeekback>
+      <h3 style={{ color }}>{title}</h3>
+      <p>{content}</p>
+    </ComprehensionFeekback>
+  );
+};
+
+const Comprehension = ({ Aidata }) => {
+  const model = Aidata?.data;
+
+  return (
+    <ComprehensionContainer>
+      <li>
+        <ComprehensionContainerResponse>
+          <p>Student response</p>
+          <div>
+            <p>{model?.studentTextAnswers?.[0] || Aidata?.responseText}</p>
+          </div>
+        </ComprehensionContainerResponse>
+      </li>
+      <li>
+        <FeekbackResponsive
+          title="Correct answer"
+          content={model?.model_data?.generate?.answers?.[0]?.answer}
+        />
+      </li>
+      <li>
+        <FeekbackResponsive
+          title="Feekback"
+          color="#30D468"
+          content={model?.model_data?.evaluate?.results?.[0]?.feedback}
+        />
+      </li>
+    </ComprehensionContainer>
+  );
+};
+
+export default Comprehension;