Merge branch 'dev' of https://git.point-dev.net/Karimaldeen/Quiz_dashboard into dev

src/Components/LatextInput/AddLaTexModal.tsx

@@ -6,12 +6,13 @@ import { convertMathMLToLaTeX } from '../../utils/convertMathMLToLaTeX';
 import { useTranslation } from 'react-i18next';
 import { toast } from 'react-toastify';
 
-const AddLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen}:{
+const AddLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen,setCurrentValue}:{
     name:string,
     setLatex: (value:string)=> void,
     Latex:string,
     setIsModalOpen: (value:boolean)=> void ,
     isModalOpen:boolean,
+    setCurrentValue:(value:string)=> void
 
 }) => {
     const {values,setFieldValue} = useFormikContext<any>()
@@ -27,6 +28,7 @@ const AddLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen}:{
     
     if(newLatex){
       setFieldValue(name, oldValue + " $$ " +newLatex +" $$ ");
+      setCurrentValue(oldValue + " $$ " +newLatex +" $$ ")
       setLatex("")
       setIsModalOpen(false);
     }else{

src/Components/LatextInput/LaTeXInputMemo.tsx

@@ -1,6 +1,6 @@
 import TextArea from 'antd/es/input/TextArea';
 import { useFormikContext } from 'formik';
-import React, { Suspense, useState } from 'react';
+import React, { Suspense, useEffect, useState } from 'react';
 import { parseTextAndLatex } from '../../utils/parseTextAndLatex';
 import LatexPreview from '../CustomFields/MathComponent';
 import { Checkbox } from 'antd';
@@ -18,9 +18,9 @@ const EditLazyModal = React.lazy(() => import("./EditLaTexModal"));
 const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...props }) => {
   const { name  ,value} = field;
   
-  const { setFieldValue } = form;
+  const { setFieldValue ,touched ,errors } = form;
 
-  const { ShowLatexOption } = useObjectToEdit();
+  const { ShowLatexOption, Success } = useObjectToEdit();
   const [showPreview, setShowPreview] = useState(false);      
   const Preview = parseTextAndLatex(value ?? "");
 
@@ -39,9 +39,9 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
   };
 
   const handleEditModal = (item: any) => {
-    console.log(item);
-    setLatex(item);
-    setIsEditModalOpen(true);
+    // console.log(item);
+    // setLatex(item);
+    // setIsEditModalOpen(true);
   };
 
   const [curCentValue, setCurrentValue] = useState(value)
@@ -52,11 +52,18 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
     
     setFieldValue(name, curCentValue);
   }
+  useEffect(() => {
+    if(Success){
+      setCurrentValue(null)
+    }
+  }, [Success])
   
+  const isError = !!touched?.[name] && !!errors?.[name];
+  const errorMessage = isError ? errors?.[name] as string ?? "" : "" ;
   return (
     <div className='LaTeXInput'>
       <label htmlFor={name} className="text">
-        {t(label || name)}
+        <div>{t(label || name)}</div> <div className='error_message'>{t(errorMessage)}</div>
       </label>
 
       <div className='LaTeXInputArea'>
@@ -97,9 +104,9 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
         )}
       </div>
 
-      <Suspense fallback={<SpinContainer />}>
-        <AddLazyModal name={name} Latex={Latex} isModalOpen={isModalOpen} setIsModalOpen={setIsModalOpen} setLatex={setLatex} />
+        <AddLazyModal name={name} Latex={Latex} isModalOpen={isModalOpen} setIsModalOpen={setIsModalOpen} setLatex={setLatex} setCurrentValue={setCurrentValue} />
         <EditLazyModal name={name} Latex={Latex} isModalOpen={isEditModalOpen} setIsModalOpen={setIsEditModalOpen} setLatex={setLatex} />
+      <Suspense fallback={<SpinContainer />}>
       </Suspense>
     </div>
   );

src/Components/ValidationField/utils/ValidationField.scss

@@ -16,6 +16,7 @@
     margin-bottom: 7px !important;
     font-weight: bold;
     font-size: 19px;
+
     > span {
       color: transparent;
     }

src/Pages/Admin/question/AddPage.tsx

@@ -291,7 +291,7 @@ const AddPage: React.FC = () => {
           <div onClick={handleCancel}>{t("practical.back")}</div>
           <div
             className="relative"
-            onClick={()=>{ Loading ? ()=>{} : handleValidateSingleQuestion(values,isValid,handleSubmit)  }}
+            onClick={()=>{ handleSubmit()  }}
           >
             {t("practical.add")}
 

src/Pages/Admin/question/Model/Malty/ChoiceField/Choices.tsx

@@ -40,9 +40,6 @@ const Choices = React.memo( ({setFieldValue ,values,parent_index }:any) => {
 
     setFieldValue(`Questions.${parent_index}.answers`, updatedItems);
   };
-  console.log(123);
-  console.log(setFieldValue);
-    console.log(values?.Questions?.[parent_index]);
     
   return (
     <>

src/Pages/Admin/question/Model/ModelForm.tsx

@@ -10,7 +10,6 @@ import SelectTag from "../../../../Components/CustomFields/SelectTag";
 import useKeyCombination from "../../../../Hooks/useKeyCombination";
 import { CombinationKeyEnum } from "../../../../enums/CombinationKeyEnum";
 import { toast } from "react-toastify";
-import LaTeXInput from "../../../../Components/LatextInput/LaTeXInput";
 import LaTeXInputMemo from "../../../../Components/LatextInput/LaTeXInputMemo";
 import ImageBoxFieldMemo from "../../../../Components/CustomFields/ImageBoxField/ImageBoxFieldMemo";
 
@@ -48,6 +47,8 @@ const Form = () => {
     }
   }, [Success]);
 
+  console.log(formik.errors);
+  
 
   return (
     <Row className="w-100 exercise_form_container">

src/Pages/Admin/question/formUtil.ts

@@ -24,7 +24,15 @@ export const getValidationSchema = () => {
   // validate input
   return Yup.object().shape({
     content_image: Yup.string().nullable(),
-    content: Yup.string().nullable(),
+    content: Yup.string().test(
+      "content",
+      "validation.one_of_image_and_content_should_be_enter_in_question",
+      (value: any,options:any) => {
+       const {content,content_image} = options?.parent
+       const haveImageOrContent = !(content)  && !(content_image)          
+        return !haveImageOrContent ;
+      },
+    ),
     answers: Yup.array().of(
       Yup.object().shape({
         content: Yup.string().nullable(),

src/Pages/Home/Dummy.tsx

@@ -7,23 +7,7 @@ const Dummy = () => {
   return (
     <div className="DummyHomePage">
       
-      <Formik initialValues={{}} onSubmit={()=>{}}>
-        <Form>
-          {Array.from({length:1000}).map((item:any,index)=>{
-            return (
-              <div key={index}>
    
-      <Field 
-      name={`content${index}`} 
-      component={LaTeXInputMemo} 
-      label={t("input.answer_content")} 
-    />
- 
-              </div>
-            )
-          })}
-        </Form>
-      </Formik>
 
     </div>
   );

src/Styles/Pages/exercise.scss

@@ -360,3 +360,17 @@
   @include Scrollbar();
 
 }
+
+
+.LaTeXInput{
+  .text{
+    display: flex !important;
+    align-items: center;
+   gap: 10px;
+   .error_message{
+    color: red;
+    font-weight: bold;
+     font-size: 12px;
+   }
+  }
+}