add validation

src/Components/LatextInput/LaTeXInputMemo.tsx

@@ -18,7 +18,7 @@ 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, Success } = useObjectToEdit();
   const [showPreview, setShowPreview] = useState(false);      
@@ -58,11 +58,12 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
     }
   }, [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'>

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/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/Styles/Pages/exercise.scss

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