format

src/Components/Cards/AddressCard.tsx

@@ -1,11 +1,11 @@
-import { Divider } from 'antd'
+import { Divider } from "antd";
-import { useTranslation } from 'react-i18next'
+import { useTranslation } from "react-i18next";
 import { RxHome } from "react-icons/rx";
 
 const AddressCard = ({ data }: { data: any }) => {
   const { t } = useTranslation();
   return (
-    <div className='address_card'>
+    <div className="address_card">
       <h5>{t("practical.address")}</h5>
       <Divider />
       <div className="address_card_body">
@@ -20,9 +20,7 @@ const AddressCard = ({ data }: { data: any }) => {
         ))}
       </div>
     </div>
-  )
+  );
-}
+};
-
-export default AddressCard
-
 
+export default AddressCard;

src/Components/Cards/AttachmentsCard.tsx

@@ -1,15 +1,15 @@
-import { Divider } from 'antd';
+import { Divider } from "antd";
-import { useTranslation } from 'react-i18next'
+import { useTranslation } from "react-i18next";
-import ImageBoxField from '../CustomFields/ImageBoxField/ImageBoxField';
+import ImageBoxField from "../CustomFields/ImageBoxField/ImageBoxField";
 
 const AttachmentsCard = ({ data }: { data?: any }) => {
   const { t } = useTranslation();
 
   return (
-    <div className='attachments_card'>
+    <div className="attachments_card">
       <h5>{t("practical.address")}</h5>
       <Divider />
-        <div className='attachments_body'>
+      <div className="attachments_body">
         <h5>{t("practical.id_photo")}</h5>
         {/* {data?.map((address:any)=>( */}
         <span>
@@ -18,7 +18,7 @@ const AttachmentsCard = ({data}:{data?:any}) => {
         {/* ))} */}
       </div>
     </div>
-  )
+  );
-}
+};
 
-export default AttachmentsCard
+export default AttachmentsCard;

src/Components/Cards/InfoCard.tsx

@@ -1,12 +1,24 @@
-import { Button, Divider } from 'antd'
+import { Button, Divider } from "antd";
-import { useTranslation } from 'react-i18next'
+import { useTranslation } from "react-i18next";
-import { canAddReSeller } from '../../utils/hasAbilityFn';
+import { canAddReSeller } from "../../utils/hasAbilityFn";
 
-const InfoCard = ({ data, name, status,withButton = false,handleClick}:{ data:any, name:any, status:any,withButton?:boolean,handleClick?:() => void}) => {
+const InfoCard = ({
+  data,
+  name,
+  status,
+  withButton = false,
+  handleClick,
+}: {
+  data: any;
+  name: any;
+  status: any;
+  withButton?: boolean;
+  handleClick?: () => void;
+}) => {
   const { t } = useTranslation();
 
   return (
-        <div className='info_card'>
+    <div className="info_card">
       <div className="info_card_header">
         <img src="/Image/faker_user.png " alt="" />
         <div className="student_name_and_sub">
@@ -22,18 +34,16 @@ const InfoCard = ({ data, name, status,withButton = false,handleClick}:{ data:an
             <p>{student?.value}</p>
           </span>
         ))}
-                {withButton ? 
+        {withButton
-                canAddReSeller &&
+          ? canAddReSeller && (
-                <Button onClick={handleClick} className='info_card_button'>
+              <Button onClick={handleClick} className="info_card_button">
                 {t("practical.collecting_an_amount")}
               </Button>
+            )
           : ""}
       </div>
-            
     </div>
-    )
+  );
-}
+};
-
-export default InfoCard
-
 
+export default InfoCard;

src/Components/Cards/ParamInfo.ts

@@ -4,8 +4,8 @@ export const StudentParamInfo = [
   { key: "sex", value: "male" },
   { key: "sex", value: "male" },
   { key: "sex", value: "male" },
-    {key:"sex" , value:"male"}
+  { key: "sex", value: "male" },
-]
+];
 
 export const ReSellerParamInfo = [
   { key: "رقم الهوية", value: "12i9128921019" },
@@ -15,13 +15,16 @@ export const ReSellerParamInfo = [
   { key: "تاريخ الإضافة", value: "1/10/2010" },
   { key: "تاريخ الإضافة", value: "1/10/2010" },
   { key: "تاريخ الإضافة", value: "1/10/2010" },
-]
+];
 
 export const StudentAddressInfo = [
   { key: "address", value: "moa moamasom aoms omaosm oasm oasm oasm asm aom" },
-]
+];
 
 export const ReSellerAddressInfo = [
-    {key:"governorate" , value:"moa moamasom aoms omaosm oasm oasm oasm asm aom"},
+  {
+    key: "governorate",
+    value: "moa moamasom aoms omaosm oasm oasm oasm asm aom",
+  },
   { key: "address", value: "moa moamasom aoms omaosm oasm oasm oasm asm aom" },
-]
+];

src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx

@@ -14,7 +14,7 @@ const ImageBoxField = ({ name }: any) => {
   const value = getNestedValue(formik?.values, name);
   const [imagePreview, setImagePreview] = useState<string | null>(null);
   const fileInputRef = useRef<HTMLInputElement | null>(null);
-  const [t] = useTranslation()
+  const [t] = useTranslation();
   useEffect(() => {
     if (value instanceof File) {
       generateImagePreview(value, setImagePreview);
@@ -32,8 +32,8 @@ const ImageBoxField = ({ name }: any) => {
       const maxSize = 2 * 1024 * 1024;
 
       if (file.size > maxSize) {
-        alert(t('validation.File_size_exceeds_2_MB_limit.'));
+        alert(t("validation.File_size_exceeds_2_MB_limit."));
-        event.target.value = ''; 
+        event.target.value = "";
         return;
       }
 

src/Components/CustomFields/ImageBoxField/ImageBoxFieldMemo.tsx

@@ -9,8 +9,9 @@ import { areFieldPropsEqual } from "../../../utils/areFieldPropsEqual";
 
 // Helper function to generate image preview from a File
 
-  const ImageBoxFieldMemo = memo(({ form,field }: any) => {
+const ImageBoxFieldMemo = memo(
-    const {values,setFieldValue} = form
+  ({ form, field }: any) => {
+    const { values, setFieldValue } = form;
     const { name } = field;
     const value = getNestedValue(values, name);
     const [imagePreview, setImagePreview] = useState<string | null>(null);
@@ -33,8 +34,8 @@ import { areFieldPropsEqual } from "../../../utils/areFieldPropsEqual";
         const maxSize = 2 * 1024 * 1024;
 
         if (file.size > maxSize) {
-          alert(t('validation.File_size_exceeds_2_MB_limit.'));
+          alert(t("validation.File_size_exceeds_2_MB_limit."));
-          event.target.value = ''; 
+          event.target.value = "";
           return;
         }
 
@@ -98,8 +99,10 @@ import { areFieldPropsEqual } from "../../../utils/areFieldPropsEqual";
         />
       </div>
     );
-  }, (prevProps, nextProps) => {
+  },
-    return areFieldPropsEqual(prevProps, nextProps)
+  (prevProps, nextProps) => {
-    });
+    return areFieldPropsEqual(prevProps, nextProps);
+  },
+);
 
 export default ImageBoxFieldMemo;

src/Components/CustomFields/MathComponent.tsx

@@ -1,7 +1,6 @@
-import React from 'react';
+import React from "react";
-import { BlockMath } from 'react-katex';
+import { BlockMath } from "react-katex";
-import 'katex/dist/katex.min.css';
+import "katex/dist/katex.min.css";
-
 
 const LatexPreview = ({ latex }: { latex: string }) => {
   // console.log(latex);
@@ -10,13 +9,7 @@ const LatexPreview = ({ latex }: { latex: string }) => {
 
   return (
     <div>
-
+      <BlockMath>{latex}</BlockMath>
-
-        <BlockMath>
-      {latex} 
-        </BlockMath>  
-     
-      
     </div>
   );
 };

src/Components/CustomFields/SelectTag.tsx

@@ -9,19 +9,19 @@ const SelectTag: React.FC = () => {
   const [searchValue, setSearchValue] = useState<string>("");
 
   const [fieldValue, setFieldValue] = useState<string>("");
-  const [NewAdditionalData, setNewAdditionalData] = useState({})
+  const [NewAdditionalData, setNewAdditionalData] = useState({});
   const formik = useFormikContext<any>();
   const handleChange = (value: any, option: any) => {
     console.log(option);
     console.log(value);
-    const newSelectedOption = option?.pop()
+    const newSelectedOption = option?.pop();
     console.log(newSelectedOption);
 
     const newObject = {
       id: newSelectedOption?.id,
-      name:newSelectedOption?.name
+      name: newSelectedOption?.name,
-    }
+    };
-    setNewAdditionalData(newObject)
+    setNewAdditionalData(newObject);
     formik.setFieldValue("tags", value);
     setSearchValue("");
     setFieldValue("");
@@ -34,7 +34,6 @@ const SelectTag: React.FC = () => {
   });
 
   const handleFieldChange = (value: string) => {
-
     setFieldValue(value);
   };
 
@@ -48,12 +47,10 @@ const SelectTag: React.FC = () => {
   });
 
   const [t] = useTranslation();
-  const initialData = formik?.values?.tags?.filter((item:any)=>{
+  const initialData =
-   return  item?.id
+    formik?.values?.tags?.filter((item: any) => {
- 
+      return item?.id;
-  }) ?? []
+    }) ?? [];
-
-  
 
   const options = data?.data ?? [];
   const additionalData =
@@ -64,17 +61,20 @@ const SelectTag: React.FC = () => {
   const value =
     formik?.values?.tags?.map((item: any) => item?.id ?? item) ?? [];
 
-  const AllOptions = [...options, ...additionalData,NewAdditionalData, ...(initialData)];
+  const AllOptions = [
+    ...options,
+    ...additionalData,
+    NewAdditionalData,
+    ...initialData,
+  ];
 
   const uniqueOptions = Array.from(
     new Map(
-      AllOptions
+      AllOptions.filter((item) => Object.keys(item).length > 0) // Filter out empty objects
-        .filter(item => Object.keys(item).length > 0)  // Filter out empty objects
+        .map((item) => [item.id, item]), // Create [id, item] pairs to ensure uniqueness
-        .map(item => [item.id, item])  // Create [id, item] pairs to ensure uniqueness
+    ).values(),
-    ).values()
   );
 
-    
   return (
     <div className="SelectTag">
       <label htmlFor="">{t("models.tag")}</label>

src/Components/CustomFields/SelectTagV2.tsx

@@ -14,12 +14,13 @@ const SelectTagV2: React.FC = () => {
   const { data, isLoading } = useGetAllTag({ name: searchValue });
   const { t } = useTranslation();
 
-  
   // Get selected tags from Formik
   const CurrentTags = formik.values.tags ?? []; // Assuming tags are stored as array of objects
   console.log(CurrentTags, "CurrentTags");
 
-  const NewShapeTags = CurrentTags?.map((item:any)=> {return item?.name ?? item })
+  const NewShapeTags = CurrentTags?.map((item: any) => {
+    return item?.name ?? item;
+  });
 
   const handleChange = (_value: any[], option: any) => {
     // console.log(option,"option");
@@ -51,7 +52,6 @@ const SelectTagV2: React.FC = () => {
 
   console.log(additionalData);
 
-
   return (
     <div className="SelectTag">
       <label>{t("models.tag")}</label>
@@ -77,7 +77,6 @@ const SelectTagV2: React.FC = () => {
           }
         }}
         value={NewShapeTags}
-        
       />
     </div>
   );

src/Components/DataTable/SearchField.tsx

@@ -23,7 +23,6 @@ const SearchField: React.FC<Props> = ({ placeholder, searchBy }) => {
 
   const handleInputChangeWithDebounce = useDebounce((value: string) => {
     if (Number(page) > 1) {
-        
     }
     setFilter({
       [searchBy]: value,

src/Components/DataTable/SearchFieldWithSelect.tsx

@@ -58,7 +58,7 @@ const SearchFieldWithSelect: React.FC<Props> = ({
   const filteredOptions = options.filter((option) =>
     option.label.toLowerCase().includes(searchTerm.toLowerCase()),
   );
-  const Type = localStorage.getItem('type');
+  const Type = localStorage.getItem("type");
   return (
     <div ref={node} className={`search-field ${isOpen ? "open" : ""}`}>
       <div className="search-header" onClick={toggleDropdown}>
@@ -87,7 +87,7 @@ const SearchFieldWithSelect: React.FC<Props> = ({
                   <div>{option.label}</div>
                   {/* {withIcon &&  <IoSearch className="search__icon" />} */}
                 </div>
-              )
+              );
             })}
           </div>
         </div>

src/Components/Filter/PaginationColumn.tsx

@@ -10,13 +10,12 @@ const PaginationColumn = () => {
   const navigate = useNavigate();
   const { Filter, setFilter } = useFilterStateState();
 
-
   const handleChange = (value: string) => {
     navigate(`?per_page=${value}`);
 
     setFilter({
-      per_page:value
+      per_page: value,
-    })
+    });
   };
 
   return (

src/Components/FilterField/components/useFilter.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useState } from "react";
-import '../styles/index.scss';
+import "../styles/index.scss";
 import CustomInput from "../design-system/CustomInput";
 import { Button } from "antd";
 import { useTranslation } from "react-i18next";
@@ -24,22 +24,23 @@ const useFilter = () => {
   };
 
   const FilterBody = ({ children }: IFilterBody) => {
-    const [values, setValues] = useState({ name1: '', name2: '' });
+    const [values, setValues] = useState({ name1: "", name2: "" });
-    const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    const handleChange = useCallback(
+      (e: React.ChangeEvent<HTMLInputElement>) => {
         const { name, value } = e.target;
         setValues((prev) => ({ ...prev, [name]: value }));
-    }, []); 
+      },
+      [],
+    );
 
     const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
       event.preventDefault();
       console.log(values, "values");
-      
     };
 
-
+    const [t] = useTranslation();
-    const [t] = useTranslation()
     return (
-      <div className={`filter_body ${isBodyVisible ? 'visible' : 'hidden'}`}>
+      <div className={`filter_body ${isBodyVisible ? "visible" : "hidden"}`}>
         <form onSubmit={handleSubmit}>
           {children}
           <CustomInput
@@ -52,8 +53,10 @@ const useFilter = () => {
             value={values.name2}
             onChange={handleChange}
           />
-      <Button block htmlType="submit" type="primary" > {t("practical.submit")} </Button>
+          <Button block htmlType="submit" type="primary">
-
+            {" "}
+            {t("practical.submit")}{" "}
+          </Button>
         </form>
       </div>
     );

src/Components/FilterField/design-system/CustomInput.tsx

@@ -1,5 +1,5 @@
-import { Input } from 'antd';
+import { Input } from "antd";
-import React from 'react';
+import React from "react";
 
 interface CustomInputProps {
   name: string;
@@ -7,16 +7,11 @@ interface CustomInputProps {
   onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }
 
-const CustomInput: React.FC<CustomInputProps> = React.memo(({ name, value, onChange }) => {
+const CustomInput: React.FC<CustomInputProps> = React.memo(
+  ({ name, value, onChange }) => {
     console.log(`Rendering ${name}`); // For debugging purposes
-  return (
+    return <Input type="text" name={name} value={value} onChange={onChange} />;
-    <Input
+  },
-      type="text"
-      name={name}
-      value={value}
-      onChange={onChange}
-    />
 );
-});
 
 export default CustomInput;

src/Components/FilterField/styles/index.scss

@@ -1,13 +1,15 @@
 .filter_body {
   max-height: 0;
   overflow: hidden;
-    transition: max-height 0.3s ease-out, opacity 0.3s ease-out, transform 0.3s ease-out;
+  transition:
+    max-height 0.3s ease-out,
+    opacity 0.3s ease-out,
+    transform 0.3s ease-out;
   opacity: 0;
   transform: translateY(-20px);
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
-    
 }
 
 .filter_body.visible {
@@ -30,4 +32,3 @@
   width: 70%;
   padding: 50px;
 }
-  

src/Components/LatextInput/AddLaTexModal.tsx

@@ -1,23 +1,29 @@
-import { Modal } from 'antd'
+import { Modal } from "antd";
-import TextArea from 'antd/es/input/TextArea'
+import TextArea from "antd/es/input/TextArea";
-import { useFormikContext } from 'formik';
+import { useFormikContext } from "formik";
-import React, { useState } from 'react'
+import React, { useState } from "react";
-import { convertMathMLToLaTeX } from '../../utils/convertMathMLToLaTeX';
+import { convertMathMLToLaTeX } from "../../utils/convertMathMLToLaTeX";
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
-import { toast } from 'react-toastify';
+import { toast } from "react-toastify";
-
-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 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,getFieldProps} = useFormikContext<any>()
+  const { values, setFieldValue, getFieldProps } = useFormikContext<any>();
 
-  const currentValue = getFieldProps(name).value
+  const currentValue = getFieldProps(name).value;
   const handleOk = () => {
     const oldValue = currentValue ?? "";
     const newLatex = convertMathMLToLaTeX(Latex);
@@ -25,35 +31,39 @@ const AddLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen,setCurren
 
     if (newLatex) {
       setFieldValue(name, oldValue + " $$ " + newLatex + " $$ ");
-      setCurrentValue(oldValue + " $$ " +newLatex +" $$ ")
+      setCurrentValue(oldValue + " $$ " + newLatex + " $$ ");
-      setLatex("")
+      setLatex("");
       setIsModalOpen(false);
     } else {
       setFieldValue(name, oldValue + " $$ " + Latex + " $$ ");
-      setCurrentValue(oldValue + " $$ " +Latex +" $$ ")
+      setCurrentValue(oldValue + " $$ " + Latex + " $$ ");
-      setLatex("")
+      setLatex("");
       setIsModalOpen(false);
     }
   };
 
   const handleCancel = () => {
     setIsModalOpen(false);
-      setLatex("")
+    setLatex("");
   };
 
   const handleChangeInputLatex = (
     e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
   ) => {
     const newValue = e.target.value;
-        setLatex(newValue)
+    setLatex(newValue);
   };
 
-      const [t] = useTranslation()
+  const [t] = useTranslation();
   return (
-   
+    <Modal
-<Modal  footer={false} open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
+      footer={false}
-    <div className='latexModal'>
+      open={isModalOpen}
-        <label className='mb-3'>  {t("header.past_your_MMl_text")} </label>
+      onOk={handleOk}
+      onCancel={handleCancel}
+    >
+      <div className="latexModal">
+        <label className="mb-3"> {t("header.past_your_MMl_text")} </label>
         <TextArea
           size="large"
           showCount
@@ -67,17 +77,13 @@ const AddLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen,setCurren
           <div className="back_button pointer" onClick={handleCancel}>
             {t("practical.cancel")}
           </div>
-              <div
+          <div className="add_button" onClick={handleOk}>
-                className="add_button"
-                onClick={handleOk}
-              >
             {t(`practical.${"add"}`)}
           </div>
         </div>
       </div>
     </Modal>
+  );
+};
 
-  )
+export default AddLaTexModal;
-}
-
-export default AddLaTexModal

src/Components/LatextInput/EditLaTexModal.tsx

@@ -1,22 +1,27 @@
-import { Modal } from 'antd'
+import { Modal } from "antd";
-import TextArea from 'antd/es/input/TextArea'
+import TextArea from "antd/es/input/TextArea";
-import { useFormikContext } from 'formik';
+import { useFormikContext } from "formik";
-import React, { useState } from 'react'
+import React, { useState } from "react";
-import { convertMathMLToLaTeX } from '../../utils/convertMathMLToLaTeX';
+import { convertMathMLToLaTeX } from "../../utils/convertMathMLToLaTeX";
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
-import { toast } from 'react-toastify';
+import { toast } from "react-toastify";
-import { parseTextAndLatex } from '../../utils/parseTextAndLatex';
+import { parseTextAndLatex } from "../../utils/parseTextAndLatex";
-
-const EditLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen}:{
-    name:string,
-    setLatex: (value:string)=> void,
-    Latex:any,
-    setIsModalOpen: (value:boolean)=> void ,
-    isModalOpen:boolean,
 
+const EditLaTexModal = ({
+  name,
+  setLatex,
+  Latex,
+  setIsModalOpen,
+  isModalOpen,
+}: {
+  name: string;
+  setLatex: (value: string) => void;
+  Latex: any;
+  setIsModalOpen: (value: boolean) => void;
+  isModalOpen: boolean;
 }) => {
-    const {values} = useFormikContext<any>()
+  const { values } = useFormikContext<any>();
-  const [Value, setValue] = useState(Latex?.text ?? Latex)
+  const [Value, setValue] = useState(Latex?.text ?? Latex);
 
   const handleOk = () => {
     console.log(1);
@@ -31,18 +36,16 @@ const EditLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen}:{
 
     if (newLatex) {
       const newArray = Preview?.map((item: any, index: number) => {
-        if(item?.key)
+        if (item?.key) return item;
-        return item
+      });
-      })
-      
     } else {
-        toast.error(t("validation.that_is_not_a_valid_mml"))
+      toast.error(t("validation.that_is_not_a_valid_mml"));
     }
   };
 
   const handleCancel = () => {
     setIsModalOpen(false);
-      setLatex("")
+    setLatex("");
   };
 
   const handleChangeInputLatex = (
@@ -50,15 +53,19 @@ const EditLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen}:{
   ) => {
     const newValue = e.target.value;
     console.log(newValue, "newValue");
-        setValue(newValue)
+    setValue(newValue);
   };
 
-      const [t] = useTranslation()
+  const [t] = useTranslation();
   return (
-   
+    <Modal
-<Modal  footer={false} open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
+      footer={false}
-    <div className='latexModal'>
+      open={isModalOpen}
-        <label className='mb-3'>  {t("header.past_your_MMl_text")} </label>
+      onOk={handleOk}
+      onCancel={handleCancel}
+    >
+      <div className="latexModal">
+        <label className="mb-3"> {t("header.past_your_MMl_text")} </label>
         <TextArea
           size="large"
           showCount
@@ -66,24 +73,19 @@ const EditLaTexModal = ({name,setLatex,Latex,setIsModalOpen,isModalOpen}:{
           autoSize={{ minRows: 4, maxRows: 10 }}
           style={{ height: "400px" }}
           onChange={handleChangeInputLatex}
-    value={Value
+          value={Value}
-    }
         />
         <div className="buttons">
           <div className="back_button pointer" onClick={handleCancel}>
             {t("practical.cancel")}
           </div>
-              <div
+          <div className="add_button" onClick={handleOk}>
-                className="add_button"
-                onClick={handleOk}
-              >
             {t(`practical.${"edit"}`)}
           </div>
         </div>
       </div>
     </Modal>
+  );
+};
 
-  )
+export default EditLaTexModal;
-}
-
-export default EditLaTexModal

src/Components/LatextInput/LaTeXInputMemo.tsx

@@ -1,20 +1,20 @@
-import TextArea from 'antd/es/input/TextArea';
+import TextArea from "antd/es/input/TextArea";
-import React, { Suspense, useEffect, useState } from 'react';
+import React, { Suspense, useEffect, useState } from "react";
-import { parseTextAndLatex } from '../../utils/parseTextAndLatex';
+import { parseTextAndLatex } from "../../utils/parseTextAndLatex";
-import LatexPreview from '../CustomFields/MathComponent';
+import LatexPreview from "../CustomFields/MathComponent";
-import { Checkbox } from 'antd';
+import { Checkbox } from "antd";
-import { CheckboxProps } from 'antd/lib';
+import { CheckboxProps } from "antd/lib";
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
-import { FaPlus } from 'react-icons/fa';
+import { FaPlus } from "react-icons/fa";
-import { useObjectToEdit } from '../../zustand/ObjectToEditState';
+import { useObjectToEdit } from "../../zustand/ObjectToEditState";
-import SpinContainer from '../Layout/SpinContainer';
+import SpinContainer from "../Layout/SpinContainer";
-import { areFieldPropsEqual } from './areFieldPropsEqual';
+import { areFieldPropsEqual } from "./areFieldPropsEqual";
 
 const AddLazyModal = React.lazy(() => import("./AddLaTexModal"));
 const EditLazyModal = React.lazy(() => import("./EditLaTexModal"));
 
-
+const LaTeXInputMemo: React.FC<any> = React.memo(
-const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...props }) => {
+  ({ field, form, label, ...props }) => {
     const { name, value } = field;
 
     const { setFieldValue, touched, errors, getFieldProps, values } = form;
@@ -23,8 +23,7 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
     const [showPreview, setShowPreview] = useState(false);
     const Preview = parseTextAndLatex(value ?? "");
 
-
+    const onPreviewChange: CheckboxProps["onChange"] = (e) => {
-  const onPreviewChange: CheckboxProps['onChange'] = (e) => {
       setShowPreview(e.target.checked);
     };
 
@@ -44,62 +43,65 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
       // setIsEditModalOpen(true);
     };
 
-  const [curCentValue, setCurrentValue] = useState(value)
+    const [curCentValue, setCurrentValue] = useState(value);
-  const handleChangeInput = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
+    const handleChangeInput = (
-    setCurrentValue(e.target.value)
+      e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
+    ) => {
+      setCurrentValue(e.target.value);
     };
     const onBlur = () => {
       if (curCentValue !== value) {
         setFieldValue(name, curCentValue);
       }
-  }
+    };
 
     useEffect(() => {
       if (Success) {
-      setCurrentValue(null)
+        setCurrentValue(null);
       }
-  }, [Success])
+    }, [Success]);
 
     useEffect(() => {
       if (value) {
-      setCurrentValue(value)
+        setCurrentValue(value);
       }
-  }, [value])
+    }, [value]);
-
 
     const isError = !!touched?.[name] && !!errors?.[name];
-  const errorMessage = isError ? errors?.[name] as string ?? "" : "" ;
+    const errorMessage = isError ? ((errors?.[name] as string) ?? "") : "";
-
-  
 
     console.log(values);
 
-  let metaName = name.substring(0, name.lastIndexOf('.'));
+    let metaName = name.substring(0, name.lastIndexOf("."));
-  if (metaName.includes('.') || metaName.includes('[')) {  metaName += ".meta";} else {metaName += "meta"}
+    if (metaName.includes(".") || metaName.includes("[")) {
+      metaName += ".meta";
+    } else {
+      metaName += "meta";
+    }
     const meta = getFieldProps(metaName).value;
     console.log(metaName, meta);
-  const direction = meta?.direction === "ltr" ? "ltr" : "rtl" 
+    const direction = meta?.direction === "ltr" ? "ltr" : "rtl";
 
-  const [Dir, setDir] = useState<"ltr" | "rtl">(direction)
+    const [Dir, setDir] = useState<"ltr" | "rtl">(direction);
 
     const handleChangeDirection = () => {
       if (Dir === "ltr") {
-      setDir("rtl")
+        setDir("rtl");
-      setFieldValue(metaName,{...(meta ?? {}), direction:"rtl"})
+        setFieldValue(metaName, { ...(meta ?? {}), direction: "rtl" });
       } else {
-      setDir("ltr")
+        setDir("ltr");
-      setFieldValue(metaName,{...(meta ?? {}), direction:"ltr"})
+        setFieldValue(metaName, { ...(meta ?? {}), direction: "ltr" });
-
-    }
       }
+    };
 
     return (
-    <div className='LaTeXInput'>
+      <div className="LaTeXInput">
         <label htmlFor={name} className="text">
-        <div>{t(label || name)}</div> <div className='error_message'>{t(errorMessage)}</div>
+          <div>{t(label || name)}</div>{" "}
+          <div className="error_message">{t(errorMessage)}</div>
         </label>
 
-      <div className='LaTeXInputArea'>
+        <div className="LaTeXInputArea">
           <TextArea
             size="large"
             showCount
@@ -112,30 +114,39 @@ const LaTeXInputMemo: React.FC<any> =  React.memo(({ field ,form, label, ...prop
             dir={Dir}
             {...props}
           />
-                    <div className='LaTeXInputOptions'>
+          <div className="LaTeXInputOptions">
-                    <Checkbox onChange={handleChangeDirection} checked={direction === "ltr"} >{t("header.change_direction")}</Checkbox>
+            <Checkbox
-          
+              onChange={handleChangeDirection}
+              checked={direction === "ltr"}
+            >
+              {t("header.change_direction")}
+            </Checkbox>
 
             {ShowLatexOption && (
               <>
-                      <Checkbox onChange={onPreviewChange}>{t("header.show_preview")}</Checkbox>
+                <Checkbox onChange={onPreviewChange}>
-            <button type='button' className='addMML' onClick={showModal}> 
+                  {t("header.show_preview")}
+                </Checkbox>
+                <button type="button" className="addMML" onClick={showModal}>
                   <FaPlus /> {t("MML")}
                 </button>
-
               </>
             )}
-        
           </div>
 
           {showPreview && (
-          <div className='showPreviewInput'>
+            <div className="showPreviewInput">
               {Preview?.map((item: any, index: number) => {
                 if (item?.isLatex) {
                   console.log(item?.text);
 
                   return (
-                  <span dir='ltr' key={index} onClick={() => handleEditModal(item)} className='LatexPreview'> 
+                    <span
+                      dir="ltr"
+                      key={index}
+                      onClick={() => handleEditModal(item)}
+                      className="LatexPreview"
+                    >
                       <LatexPreview latex={item?.text} />
                     </span>
                   );
@@ -147,14 +158,28 @@ 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} setCurrentValue={setCurrentValue} />
+          <AddLazyModal
-      <EditLazyModal name={name} Latex={Latex} isModalOpen={isEditModalOpen} setIsModalOpen={setIsEditModalOpen} setLatex={setLatex} />
+            name={name}
-    
+            Latex={Latex}
+            isModalOpen={isModalOpen}
+            setIsModalOpen={setIsModalOpen}
+            setLatex={setLatex}
+            setCurrentValue={setCurrentValue}
+          />
+          <EditLazyModal
+            name={name}
+            Latex={Latex}
+            isModalOpen={isEditModalOpen}
+            setIsModalOpen={setIsEditModalOpen}
+            setLatex={setLatex}
+          />
         </Suspense>
       </div>
     );
-}, (prevProps, nextProps) => {
+  },
-  return areFieldPropsEqual(prevProps, nextProps)
+  (prevProps, nextProps) => {
-  });
+    return areFieldPropsEqual(prevProps, nextProps);
+  },
+);
 
 export default LaTeXInputMemo;

src/Components/LatextInput/areFieldPropsEqual.ts

@@ -1,10 +1,7 @@
 // utilityFunctions.ts
-import { FieldProps } from 'formik';
+import { FieldProps } from "formik";
 
-export const areFieldPropsEqual = (
+export const areFieldPropsEqual = (prevProps: any, nextProps: any): boolean => {
-  prevProps: any,
-  nextProps: any
-): boolean => {
   const prevError = prevProps.form.errors[prevProps.field.name];
   const nextError = nextProps.form.errors[nextProps.field.name];
 
@@ -14,7 +11,5 @@ export const areFieldPropsEqual = (
   const prevValue = prevProps.field.value;
   const nextValue = nextProps.field.value;
 
-  return (
+  return false;
-   false
-  );
 };

src/Components/Layout/Navbar/NavBarRightSide.tsx

@@ -38,7 +38,7 @@ const NavBarRightSide = () => {
           icon={<CiCirclePlus size={25} />}
         />
         <TooltipComp
-          onClick={()=>(Navigate('/notifications'))}
+          onClick={() => Navigate("/notifications")}
           className="NotificationsIcon"
           note="notification"
           color="#E0E0E0"
@@ -57,7 +57,9 @@ const NavBarRightSide = () => {
         </span> */}
         <Image
           // onClick={()=>(Navigate('/profile'))}
-        src="/Image/faker_user.png" alt="Profile" />
+          src="/Image/faker_user.png"
+          alt="Profile"
+        />
       </div>
     </article>
   );

src/Components/Layout/Navbar/Tooltip.tsx

@@ -16,7 +16,7 @@ const TooltipComp = ({
   color: string;
   icon: any;
   className?: string;
-  onClick?:() => void
+  onClick?: () => void;
 }) => {
   const [t] = useTranslation();
   const { handel_open_model } = useModalHandler();

src/Components/Layout/SideBar/MenuItem.tsx

@@ -16,9 +16,9 @@ export const MenuItem = ({ item, location, index, isOpen }: any) => {
   const navigate = useNavigate();
   const { setFilter } = useFilterStateState();
   const handleNavigate = () => {
-    setFilter({})
+    setFilter({});
-    navigate(item.path || "/")
+    navigate(item.path || "/");
-  }
+  };
 
   return (
     <>
@@ -26,11 +26,7 @@ export const MenuItem = ({ item, location, index, isOpen }: any) => {
         className={`link ${isActive ? "active" : ""} ${item?.children && "DropDownLink"}`}
         onClick={() => handleNavigate()}
       >
-          <Tooltip
+        <Tooltip placement="topLeft" title={t(item?.text)} color={"#E0E0E0"}>
-            placement="topLeft"
-            title={t(item?.text)}
-            color={'#E0E0E0'}
-          >
           <i>{item.icon}</i>
         </Tooltip>
         {/* Conditionally render the text based on sidebar width */}

src/Components/Switch/Switch.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
+import React from "react";
-import { Switch } from 'antd';
+import { Switch } from "antd";
 export interface SwitchProps {
   onChange?: (checked: any, event: any) => any;
   checked?: boolean;
@@ -11,14 +11,14 @@ const onSwitchChange = (checked: boolean) => {
 const SwitchButton = ({ onChange, checked }: SwitchProps) => {
   return (
     <Switch
-          className='switch_button'
+      className="switch_button"
       defaultChecked
       onChange={(checked: any, event: any) =>
         onChange ? onChange(checked, event) : onSwitchChange(checked)
       }
       // checked={checked}
     />
-    )
+  );
-}
+};
 
 export default SwitchButton;

src/Components/Table/ActionButtons.tsx

@@ -7,7 +7,6 @@ import { BsEyeFill } from "react-icons/bs";
 import { GoTrash } from "react-icons/go";
 import { BsQrCode } from "react-icons/bs";
 
-
 interface ActionButtonsProps {
   canEdit?: boolean;
   canDelete?: boolean;
@@ -19,7 +18,7 @@ interface ActionButtonsProps {
   onShow?: () => void;
   index?: number;
   className?: string;
-  canShowQr?:boolean
+  canShowQr?: boolean;
   onShoqQr?: () => void;
 }
 

src/Components/Table/QRCodeGenerator.tsx

@@ -1,13 +1,12 @@
-import React from 'react';
+import React from "react";
-import QRCode from 'react-qr-code';
+import QRCode from "react-qr-code";
-
 
 const QRCodeGenerator = ({ url, serial }: any) => {
-const qrValue = `${url}/${serial}`
+  const qrValue = `${url}/${serial}`;
-console.log(qrValue)
+  console.log(qrValue);
   return (
-    <div style={{display:'flex',justifyContent:'center'}} >
+    <div style={{ display: "flex", justifyContent: "center" }}>
-      <QRCode value={qrValue} size={230} type='link' />
+      <QRCode value={qrValue} size={230} type="link" />
     </div>
   );
 };

src/Components/Ui/Buttons/EditSettingButton.tsx

@@ -1,18 +1,24 @@
-import { Button } from 'antd'
+import { Button } from "antd";
-import { useTranslation } from 'react-i18next'
+import { useTranslation } from "react-i18next";
 import { CiEdit } from "react-icons/ci";
 
-const EditSettingButton = ({buttonName,onClick}:{buttonName?:string,onClick?:() => void}) => {
+const EditSettingButton = ({
+  buttonName,
+  onClick,
+}: {
+  buttonName?: string;
+  onClick?: () => void;
+}) => {
   const { t } = useTranslation();
 
   return (
     <div>
-        <Button className=' setting_edit_button' onClick={onClick}>
+      <Button className=" setting_edit_button" onClick={onClick}>
         <CiEdit />
-          {t(`header.edit`) ?? (`header.${buttonName}`)}
+        {t(`header.edit`) ?? `header.${buttonName}`}
       </Button>
     </div>
-  )
+  );
-}
+};
 
-export default EditSettingButton
+export default EditSettingButton;

src/Components/Ui/Buttons/SecuritySettingButton.tsx

@@ -1,13 +1,23 @@
-import { Button } from 'antd'
+import { Button } from "antd";
-import { useTranslation } from 'react-i18next'
+import { useTranslation } from "react-i18next";
 
-const SecuritySettingButton = ({name,danger = false}:{name:string,danger?:boolean}) => {
+const SecuritySettingButton = ({
+  name,
+  danger = false,
+}: {
+  name: string;
+  danger?: boolean;
+}) => {
   const { t } = useTranslation();
   return (
     <div>
-        <Button className={`security_setting_button ${danger ? "security_setting_button_danger" :""}`}>{t(name)}</Button>
+      <Button
+        className={`security_setting_button ${danger ? "security_setting_button_danger" : ""}`}
+      >
+        {t(name)}
+      </Button>
     </div>
-  )
+  );
-}
+};
 
-export default SecuritySettingButton
+export default SecuritySettingButton;

src/Components/Ui/ReportTableIcon.tsx

@@ -1,7 +1,7 @@
-import { Tooltip } from 'antd'
+import { Tooltip } from "antd";
-import React from 'react'
+import React from "react";
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
-import { FaPaperclip } from 'react-icons/fa'
+import { FaPaperclip } from "react-icons/fa";
 
 interface ReportButtonsProps {
   editTooltipTitle?: any;
@@ -16,7 +16,7 @@ const ReportTableIcon = ({editTooltipTitle,onClick}:ReportButtonsProps) => {
         <FaPaperclip size={22} style={{ color: "#A098AE" }} />
       </span>
     </Tooltip>
-  )
+  );
-}
+};
 
-export default ReportTableIcon
+export default ReportTableIcon;

src/Components/Ui/TrashButton.tsx

@@ -1,15 +1,23 @@
-import { Button } from 'antd';
+import { Button } from "antd";
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 import { HiOutlineTrash } from "react-icons/hi2";
 
-const TrashButton = ({name,onClick,icon = true}:{name:string,onClick?:() =>void,icon?:boolean}) => {
+const TrashButton = ({
+  name,
+  onClick,
+  icon = true,
+}: {
+  name: string;
+  onClick?: () => void;
+  icon?: boolean;
+}) => {
   const { t } = useTranslation();
   return (
-    <Button className='trash_button' onClick={onClick}>
+    <Button className="trash_button" onClick={onClick}>
       {icon ? <HiOutlineTrash /> : ""}
       {t(`header.${name}`)}
     </Button>
-  )
+  );
-}
+};
 
-export default TrashButton
+export default TrashButton;

src/Components/Utils/Filter/useFilter.tsx

@@ -34,7 +34,6 @@ interface FormikFormProps extends Omit<FormikConfig<any>, OmitFormikProps> {
   setIsOpen: any;
 }
 
-
 const useFilter = () => {
   const { setIsOpen, isOpen } = useModalState((state) => state);
   const { filterState, setFilterState, clearFilterState } = useFilterState();

src/Components/ValidationField/View/File.tsx

@@ -53,13 +53,12 @@ const File = ({
     const maxSize = 2 * 1024 * 1024; // 2 MB in bytes
 
     if (file.size > maxSize) {
-      alert(t('validation.File_size_exceeds_2_MB_limit.'));
+      alert(t("validation.File_size_exceeds_2_MB_limit."));
       return Upload.LIST_IGNORE; // Prevent the file from being uploaded
     }
     return true; // Allow the file to be uploaded
   };
 
-
   return (
     <div className={`ValidationField upload_image_button ${className ?? ""} `}>
       <label htmlFor={name} className="text">
@@ -76,7 +75,6 @@ const File = ({
         customRequest={customRequest}
         className={` w-100`}
         id={name}
-        
       >
         <Button
           className={isError ? "isError w-100 " : " w-100"}

src/Components/ValidationField/View/SearchField.tsx

@@ -52,7 +52,6 @@ const SearchField = ({
     if (isMulti) {
       formik?.setFieldValue(name, option ?? []);
     } else {
-      
       formik?.setFieldValue(name, option ?? {});
     }
 
@@ -96,7 +95,8 @@ const SearchField = ({
   const handleScroll = (event: any) => {
     const target = event.target;
     const isAtBottom =
-      target.scrollHeight - 10 <= Math.floor(target.scrollTop + target.clientHeight);
+      target.scrollHeight - 10 <=
+      Math.floor(target.scrollTop + target.clientHeight);
 
     if (isAtBottom && canChangePage && PageName && page) {
       console.log("Scrolled to the last option!");
@@ -109,9 +109,11 @@ const SearchField = ({
 
   console.log(AllPagesOption);
   console.log(option, "option");
-  const value = isMulti ? formik.values[name]?.map((item:any)=>{
+  const value = isMulti
-    return item?.name ?? item
+    ? formik.values[name]?.map((item: any) => {
-  }) :  formik.values[name]?.["name"] ?? ""
+        return item?.name ?? item;
+      })
+    : (formik.values[name]?.["name"] ?? "");
   console.log(value);
 
   return (

src/Components/ValidationField/View/TextField.tsx

@@ -47,7 +47,6 @@ const TextField = ({
           showCount
           maxLength={1000}
           autoSize={{ minRows: 4, maxRows: 10 }}
-          
           onChange={onChange || TextFilehandleChange}
           id={name}
           {...props}

src/Components/ValidationField/View/TextFieldMML.tsx

@@ -49,10 +49,7 @@ const TextFieldMML = ({
           onChange={onChange || TextFilehandleChange}
           id={name}
           {...props}
-            
         />
-          
-
       </ValidationFieldContainer>
     </div>
   );

src/Components/ValidationField/View/index.tsx

@@ -23,5 +23,5 @@ export {
   SearchField,
   TextField,
   DropFile,
-  TextAreaMML
+  TextAreaMML,
 };

src/Components/ValidationField/utils/ValidationField.scss

@@ -68,8 +68,6 @@
   height: 120px;
 }
 
-
-
 //// malty select
 ///
 .ant-select-multiple {

src/Components/ValidationField/utils/translatedOptions.ts

@@ -1,5 +1,4 @@
 export const translateOptions = (options: any, t: any) => {
-
   return options?.map((opt: any) => ({
     ...opt,
     label: t(`${opt?.label}`),

src/Components/ValidationField/utils/types.ts

@@ -40,9 +40,14 @@ export type SearchFieldProps = BaseFieldProps &
 
 type DateFieldProps = BaseFieldProps & {
   type: "DataRange" | "Date" | "Time";
-  Format?: "YYYY/MM/DD" | "MM/DD" | "YYYY/MM" | "YYYY-MM-DD HH:mm:ss.SSS" | "YYYY-MM-DD HH:mm:ss";
+  Format?:
+    | "YYYY/MM/DD"
+    | "MM/DD"
+    | "YYYY/MM"
+    | "YYYY-MM-DD HH:mm:ss.SSS"
+    | "YYYY-MM-DD HH:mm:ss";
   picker?: "data" | "week" | "month" | "quarter" | "year";
-  showTime?:boolean
+  showTime?: boolean;
 };
 
 type FileFieldProps = BaseFieldProps & {

src/Components/exercise/Header.tsx

@@ -12,22 +12,28 @@ import { LocalStorageEnum } from "../../enums/LocalStorageEnum";
 const Header = () => {
   const [t] = useTranslation();
   const { values, setValues } = useFormikContext<any>();
-  const { isBseQuestion, setIsBseQuestion,ShowHint,setShowHint,ShowLatexOption,setShowLatexOption } = useObjectToEdit();
+  const {
+    isBseQuestion,
+    setIsBseQuestion,
+    ShowHint,
+    setShowHint,
+    ShowLatexOption,
+    setShowLatexOption,
+  } = useObjectToEdit();
   // const [Setting, setSetting] = useState(false)
   const isEdited = () => {
-
     if (isBseQuestion || values?.isBase === 1) {
-
       const content = !values?.content;
       const content_image = !values?.content_image;
 
-      const Questions = values?.Questions?.length <= 1 && values?.Questions?.[0]?.answers?.length === 0 ;
+      const Questions =
-      const defaultQuestionHint = Object.keys(values?.Questions?.[0] ?? {})?.length <= 1
+        values?.Questions?.length <= 1 &&
-      
+        values?.Questions?.[0]?.answers?.length === 0;
-      
+      const defaultQuestionHint =
+        Object.keys(values?.Questions?.[0] ?? {})?.length <= 1;
 
       if (content && content_image && Questions && defaultQuestionHint) {
-        return false
+        return false;
       }
     } else {
       const content = !values?.content;
@@ -36,11 +42,11 @@ const Header = () => {
       const answers = !(values?.answers?.length > 0);
       const tags = !(values?.tags?.length > 0);
       if (content && content_image && hint && answers && tags) {
-        return false
+        return false;
       }
     }
-    return true
+    return true;
-  }
+  };
 
   const handleChange = () => {
     if (isBseQuestion) {
@@ -52,11 +58,10 @@ const Header = () => {
     }
   };
 
-  const confirm: PopconfirmProps['onConfirm'] = (e) => {
+  const confirm: PopconfirmProps["onConfirm"] = (e) => {
     setTimeout(() => {
       handleChange();
     }, 500);
-    
   };
 
   const content = (
@@ -73,21 +78,24 @@ const Header = () => {
     </div>
   );
 
-
+  const onChangeHint: CheckboxProps["onChange"] = (e) => {
-  const onChangeHint: CheckboxProps['onChange'] = (e) => {
     setShowHint(e.target.checked);
-    localStorage?.setItem(LocalStorageEnum.HINT_INPUT,e.target.checked ? "true" : "false" )
+    localStorage?.setItem(
+      LocalStorageEnum.HINT_INPUT,
+      e.target.checked ? "true" : "false",
+    );
   };
 
-  const onChangeLatexOption: CheckboxProps['onChange'] = (e) => {
+  const onChangeLatexOption: CheckboxProps["onChange"] = (e) => {
     setShowLatexOption(e.target.checked);
-    localStorage?.setItem(LocalStorageEnum.LATEX_OPTION_INPUT,e.target.checked ? "true" : "false" )
+    localStorage?.setItem(
+      LocalStorageEnum.LATEX_OPTION_INPUT,
+      e.target.checked ? "true" : "false",
+    );
   };
 
-  
   const contentSetting = (
     <div>
-    
       <Checkbox checked={ShowHint} onChange={onChangeHint}>
         {t("header.show_hint")}
       </Checkbox>
@@ -95,11 +103,9 @@ const Header = () => {
       <Checkbox checked={ShowLatexOption} onChange={onChangeLatexOption}>
         {t("header.show_MMl")}
       </Checkbox>
-
     </div>
   );
 
-  
   return (
     <header className="exercise_add_header mb-4">
       <article>
@@ -112,48 +118,35 @@ const Header = () => {
         </div>
       </article>
       <div>
-
         <div className="question_header_setting">
           <Popover trigger="click" content={contentSetting}>
             <SettingFilled />
-          
           </Popover>
         </div>
 
-        {
+        {isEdited() ? (
-          isEdited() ? 
           <Popconfirm
             title={t("header.this_will_un_do_all_your_changes")}
             okText={t("practical.yes")}
             cancelText={t("practical.no")}
-    onConfirm={()=>{confirm()}}
+            onConfirm={() => {
+              confirm();
+            }}
             defaultOpen={false}
-
           >
-  
             <GoArrowSwitch className="m-2" />
             {isBseQuestion || values?.isBase === 1
               ? t("header.malty_exercise")
               : t("header.exercise")}
-
           </Popconfirm>
-        
+        ) : (
-
-          : 
-
           <>
-          
-          
             <GoArrowSwitch onClick={() => confirm()} className="m-2" />
             {isBseQuestion || values?.isBase === 1
               ? t("header.malty_exercise")
               : t("header.exercise")}
           </>
-
+        )}
-  
-
-        }
-      
       </div>
     </header>
   );

src/Hooks/useFormField.tsx

@@ -28,7 +28,7 @@ const useFormField = (name: string, props?: any) => {
   const errorMsg =
     !!isError && meta.error
       ? t(meta.error.toString())
-      : Validation[name as any] ?? "";
+      : (Validation[name as any] ?? "");
 
   return { Field, field, meta, formik, isError, errorMsg, t };
 };

src/Hooks/useUnsavedChangesWarning.tsx

@@ -1,5 +1,5 @@
-import { useEffect } from 'react';
+import { useEffect } from "react";
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 
 const useUnsavedChangesWarning = (unsavedChanges: boolean) => {
   const [t] = useTranslation();
@@ -10,7 +10,7 @@ const useUnsavedChangesWarning = (unsavedChanges: boolean) => {
         // Prevent default action and stop the event
         event.preventDefault();
         // Optionally set returnValue to an empty string
-        event.returnValue = '';
+        event.returnValue = "";
       }
     };
 
@@ -21,19 +21,19 @@ const useUnsavedChangesWarning = (unsavedChanges: boolean) => {
       }
     };
 
-    window.addEventListener('beforeunload', handleBeforeUnload);
+    window.addEventListener("beforeunload", handleBeforeUnload);
 
     // Intercept link clicks (example for <a> elements)
-    document.querySelectorAll('a').forEach(link => {
+    document.querySelectorAll("a").forEach((link) => {
-      link.addEventListener('click', handleNavigation);
+      link.addEventListener("click", handleNavigation);
     });
 
     return () => {
-      window.removeEventListener('beforeunload', handleBeforeUnload);
+      window.removeEventListener("beforeunload", handleBeforeUnload);
 
       // Clean up event listeners
-      document.querySelectorAll('a').forEach(link => {
+      document.querySelectorAll("a").forEach((link) => {
-        link.removeEventListener('click', handleNavigation);
+        link.removeEventListener("click", handleNavigation);
       });
     };
   }, [unsavedChanges, t]);

src/Hooks/useWindowResize.tsx

@@ -1,13 +1,13 @@
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState } from "react";
 
 export const useWindowResize = () => {
   const [windowWidth, setWindowWidth] = useState(window.innerWidth);
 
   useEffect(() => {
-        window.addEventListener('resize', handleResize);
+    window.addEventListener("resize", handleResize);
     // Cleanup function to remove the event listener
     return () => {
-          window.removeEventListener('resize', handleResize);
+      window.removeEventListener("resize", handleResize);
     };
   }, [windowWidth]);
 
@@ -16,5 +16,4 @@ export const useWindowResize = () => {
   };
 
   return { windowWidth, handleResize };
-}
+};
-

src/Layout/Dashboard/FilterLayout.tsx

@@ -18,7 +18,7 @@ const FilterLayout = ({
   width = "500px",
   haveFilter = true,
   haveOrder = true,
-  haveSearch = true
+  haveSearch = true,
 }: {
   filterTitle: string;
   sub_children?: any;
@@ -26,7 +26,7 @@ const FilterLayout = ({
   width?: string;
   haveFilter?: boolean;
   haveOrder?: boolean;
-  haveSearch?:boolean
+  haveSearch?: boolean;
 }) => {
   const { t } = useTranslation();
   const translateArray = translateOptions(search_array, t);
@@ -49,8 +49,7 @@ const FilterLayout = ({
               <div className="model_sub_children">{sub_children}</div>
               <FilterSubmit />
             </FilterBody>
-            {haveFilter && 
+            {haveFilter && (
-            
               <div className="filter_button" onClick={() => setIsOpen(true)}>
                 <span>
                   <BiFilterAlt className="addition_select_icon" />
@@ -58,12 +57,10 @@ const FilterLayout = ({
                 </span>
                 <MdKeyboardArrowDown />
               </div>
-            }
+            )}
           </span>
 
-          <span>
+          <span>{haveOrder && <OrderBySelect />}</span>
-            {haveOrder && <OrderBySelect />}
-          </span>
         </div>
       </div>
 
@@ -77,7 +74,12 @@ const FilterLayout = ({
         </span>
 
         <div className="header_search">
-          {haveSearch && <SearchField searchBy={search_by} placeholder={t("practical.search_here")} />}
+          {haveSearch && (
+            <SearchField
+              searchBy={search_by}
+              placeholder={t("practical.search_here")}
+            />
+          )}
         </div>
       </div>
     </div>

src/Layout/Dashboard/FormikFormModel.tsx

@@ -29,7 +29,6 @@ const FormikFormModel: React.FC<FormikFormProps> = ({
       initialValues={initialValues}
       validationSchema={validationSchema}
       onSubmit={handleSubmit}
-      
     >
       {(formik) => {
         useEffect(() => {

src/Layout/Dashboard/LayoutModel.tsx

@@ -22,7 +22,7 @@ interface LayoutModalProps {
   width?: string;
   isLoading?: boolean;
   buttonTitle?: string;
-  initialButtonName?:boolean
+  initialButtonName?: boolean;
 }
 
 const LayoutModel = ({
@@ -70,7 +70,6 @@ const LayoutModel = ({
         open={isOpen === ModelEnum}
         onCancel={handleCancel}
       >
-
         <Formik
           enableReinitialize={true}
           initialValues={getInitialValues}
@@ -85,8 +84,8 @@ const LayoutModel = ({
               }
             }, [isOpen]);
 
-        return <Form className="w-100">
+            return (
-
+              <Form className="w-100">
                 <header>
                   <span>
                     {t(`practical.${isAddModal ? "add" : "edit"}`)}{" "}
@@ -100,18 +99,22 @@ const LayoutModel = ({
                   <Divider />
 
                   <div className="buttons">
-              <Button className="back_button pointer" onClick={handleCancel}>
+                    <Button
+                      className="back_button pointer"
+                      onClick={handleCancel}
+                    >
                       {t("practical.cancel")}
                     </Button>
                     <Button
                       className="add_button"
-                disabled={status === QueryStatusEnum.LOADING || !formik.dirty}
+                      disabled={
+                        status === QueryStatusEnum.LOADING || !formik.dirty
+                      }
                       htmlType="submit"
                     >
-                {
+                      {initialButtonName
-                  initialButtonName ?  t(`practical.${isAddModal ? "add" : "edit"}`)
+                        ? t(`practical.${isAddModal ? "add" : "edit"}`)
-                                    :  t(`practical.${buttonTitle}`)
+                        : t(`practical.${buttonTitle}`)}
-                }
                       {status === QueryStatusEnum.LOADING && (
                         <span className="Spinier_Div">
                           <Spin />
@@ -120,8 +123,8 @@ const LayoutModel = ({
                     </Button>
                   </div>
                 </main>
-
+              </Form>
-        </Form>;
+            );
           }}
         </Formik>
       </Modal>

src/Layout/Dashboard/PageHeader.tsx

@@ -1,4 +1,3 @@
-
 import { BsPlusCircleFill } from "react-icons/bs";
 import { useNavigate } from "react-router-dom";
 import { useTranslation } from "react-i18next";
@@ -23,7 +22,7 @@ const PageHeader = ({
   openModel?: boolean;
   locationToNavigate?: string | any;
   addModal?: boolean;
-  modelButtonTitle?:string
+  modelButtonTitle?: string;
 }) => {
   const navigate = useNavigate();
   const { handel_open_model } = useModalHandler();
@@ -33,9 +32,8 @@ const PageHeader = ({
   const { setFilter } = useFilterStateState();
 
   const handleNavigateToPage = (location: string) => {
-    setFilter({})
+    setFilter({});
     navigate(location);
-
   };
 
   console.log();
@@ -48,7 +46,8 @@ const PageHeader = ({
             <PageTitleComponent />
           </span>
         </span>
-        { addModal ? canAdd && (
+        {addModal
+          ? canAdd && (
               <div className="Selects">
                 <button
                   onClick={() =>
@@ -62,7 +61,8 @@ const PageHeader = ({
                   {t(`practical.${modelButtonTitle}`)}
                 </button>
               </div>
-        ) :""}
+            )
+          : ""}
       </header>
     </div>
   );

src/Layout/Dashboard/PageTitle.tsx

@@ -1,36 +1,38 @@
-import React from 'react'
+import React from "react";
-import { useLocation, useNavigate } from 'react-router-dom'
+import { useLocation, useNavigate } from "react-router-dom";
-import { usePageTitleState } from '../../zustand/PageTitleState'
+import { usePageTitleState } from "../../zustand/PageTitleState";
-import { useFilterStateState } from '../../zustand/Filter'
+import { useFilterStateState } from "../../zustand/Filter";
 
 const PageTitleComponent = () => {
-
+  const { PageTitle } = usePageTitleState();
-    const {PageTitle} = usePageTitleState()
+  const navigate = useNavigate();
-    const navigate = useNavigate()
+  const location = useLocation();
-    const location = useLocation()
   const { setFilter } = useFilterStateState();
 
-
   const handleNavigate = (path: string) => {
     const currentPath = location.pathname;
     const newPath = currentPath?.split(path)?.[0] + path;
     if (newPath !== currentPath) {
-                setFilter({})
+      setFilter({});
-                navigate(newPath)
+      navigate(newPath);
-            }
     }
+  };
   return (
-    <div className='PageTitle'>
+    <div className="PageTitle">
       {(Array.isArray(PageTitle) ? PageTitle : [])?.map((item, index) => {
-            const lastItem = PageTitle?.length - 1 === index
+        const lastItem = PageTitle?.length - 1 === index;
         return (
-                <div key={index} className={`PageTitleItems ${lastItem ? "PageTitleLastItem" : ""} `} onClick={()=>handleNavigate(item?.path)}>
+          <div
+            key={index}
+            className={`PageTitleItems ${lastItem ? "PageTitleLastItem" : ""} `}
+            onClick={() => handleNavigate(item?.path)}
+          >
             {item?.name} {lastItem ? "" : "/"}
           </div>
-            )
+        );
       })}
     </div>
-  )
+  );
-}
+};
 
-export default PageTitleComponent
+export default PageTitleComponent;

src/Layout/Dashboard/QrCodeModels.tsx

@@ -21,7 +21,6 @@ const QrCodeModels: React.FC<ModalFormProps> = ({
 
   const { objectToEdit, setObjectToEdit } = useObjectToEdit();
 
-
   const handleCancel = () => {
     setIsOpen("");
     setObjectToEdit({});
@@ -42,7 +41,10 @@ const QrCodeModels: React.FC<ModalFormProps> = ({
 
       <main className="main_modal">
         <div className="ValidationField w-100 mb-5 ">
-          <QRCodeGenerator url = {`https://nerd-back.point-dev.net/api/students/question`} serial={objectToEdit?.serial}/>
+          <QRCodeGenerator
+            url={`https://nerd-back.point-dev.net/api/students/question`}
+            serial={objectToEdit?.serial}
+          />
         </div>
       </main>
     </Modal>

src/Layout/Dashboard/Table/DataTable.tsx

@@ -25,10 +25,10 @@ const DataTable: React.FC<DataTableProps> = ({
   const isRefetching = response?.isRefetching;
   const isLoading = response?.isLoading;
   const dataLength = data?.length;
-  const {setDataTableLength} = useDataTableState()
+  const { setDataTableLength } = useDataTableState();
   useEffect(() => {
-    setDataTableLength(dataLength)
+    setDataTableLength(dataLength);
-  }, [dataLength])
+  }, [dataLength]);
 
   return (
     <Table
@@ -63,10 +63,8 @@ const DataTable: React.FC<DataTableProps> = ({
         nextIcon: <>{t("practical.next")}</>,
         prevIcon: <> {t("practical.prev")} </>,
         className: "pagination_antd",
-        showSizeChanger:false
+        showSizeChanger: false,
-        
       }}
-      
       {...props}
     />
   );

src/Layout/Dashboard/usePagination.ts

@@ -13,7 +13,6 @@ const usePagination = (data: Data) => {
     current: data?.meta?.current_page || 1,
     pageSize: data?.meta?.per_page || 2,
     total: data?.meta?.total || 0,
-    
   });
 
   useEffect(() => {
@@ -21,15 +20,14 @@ const usePagination = (data: Data) => {
       current: data?.meta?.current_page || 1,
       pageSize: data?.meta?.per_page || 2,
       total: data?.meta?.total || 0,
-      
     });
   }, [data]);
 
   const handlePageChange = (page: number) => {
     setFilter({
       ...Filter,
-      page:page
+      page: page,
-    })
+    });
   };
 
   return { pagination, handlePageChange };

src/Layout/Ui/Layout.tsx

@@ -11,7 +11,6 @@ const Layout = ({
   children: React.ReactNode;
   className?: string;
 }) => {
-
   const { openSideBar, setOpenSideBar } = useSideBarState();
 
   return (

src/Layout/Ui/NotFoundPage.tsx

@@ -10,17 +10,22 @@ function NotFoundPage() {
 
   return (
     <ProtectedRouteProvider className="not_found_page">
-
       <div className="not_found_container">
         <img src="/App/Error.png" alt="Error 404" width={500} />
         <h3>{t("practical.sorry_something_went_wrong")}</h3>
-        <p>{t("practical.error_404_Page_not_found._Sorry,_the_page_you_are_looking_for_does_not_exist")}</p>
+        <p>
-        <Button className="not_found_button" onClick={() => navigate("/", { replace: true })}>
+          {t(
+            "practical.error_404_Page_not_found._Sorry,_the_page_you_are_looking_for_does_not_exist",
+          )}
+        </p>
+        <Button
+          className="not_found_button"
+          onClick={() => navigate("/", { replace: true })}
+        >
           <FaArrowRight />
           {t("practical.return_to_the_dashboard")}
         </Button>
       </div>
-
     </ProtectedRouteProvider>
   );
 }

src/Pages/Admin/Area/Model/AddModel.tsx

@@ -10,11 +10,11 @@ import { ParamsEnum } from "../../../../enums/params";
 
 const AddModel: React.FC = () => {
   const { mutate, status } = useAddArea();
-  const {city_id} = useParams<ParamsEnum>()
+  const { city_id } = useParams<ParamsEnum>();
   const handleSubmit = (values: any) => {
     mutate({
       ...values,
-      city_id
+      city_id,
     });
   };
   return (

src/Pages/Admin/Area/Model/EditModel.tsx

@@ -12,7 +12,7 @@ import { ParamsEnum } from "../../../../enums/params";
 const EditModel: React.FC = () => {
   const { mutate, status } = useUpdateArea();
   const { objectToEdit } = useObjectToEdit((state) => state);
-  const {city_id} = useParams<ParamsEnum>()
+  const { city_id } = useParams<ParamsEnum>();
   const handleSubmit = (values: any) => {
     const Data_to_send = { ...values, city_id };
     mutate(Data_to_send);

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

@@ -7,7 +7,6 @@ const Form = () => {
       <Col>
         <ValidationField name="name" placeholder="name" label="name" />
       </Col>
-
     </Row>
   );
 };

src/Pages/Admin/Area/Page.tsx

@@ -21,7 +21,7 @@ const DeleteModalForm = lazy(
 const TableHeader = () => {
   const [t] = useTranslation();
   const deleteMutation = useDeleteArea();
-  const {city_id} = useParams<ParamsEnum>()
+  const { city_id } = useParams<ParamsEnum>();
   useSetPageTitle([
     { name: `${t(`page_header.home`)}`, path: "/" },
     { name: `${t(`page_header.Area`)}`, path: `city/${city_id}` },
@@ -35,7 +35,11 @@ const TableHeader = () => {
           ModelAbility={ModalEnum?.AREA_ADD}
           canAdd={canAddArea}
         />
-        <FilterLayout sub_children={<FilterForm />} filterTitle="table.Area" haveFilter={false} />
+        <FilterLayout
+          sub_children={<FilterForm />}
+          filterTitle="table.Area"
+          haveFilter={false}
+        />
         <Table />
         <AddModalForm />
         <EditModalForm />

src/Pages/Admin/Area/Table.tsx

@@ -10,7 +10,7 @@ import { ParamsEnum } from "../../../enums/params";
 const App: React.FC = () => {
   const { filterState } = useFilterState();
   const { Filter } = useFilterStateState();
-  const {city_id} = useParams<ParamsEnum>()
+  const { city_id } = useParams<ParamsEnum>();
   const name = Filter?.name;
   const sort_by = Filter?.sort_by;
   const response = useGetAllArea({
@@ -18,7 +18,7 @@ const App: React.FC = () => {
     ...filterState,
     city_id,
     name,
-    sort_by
+    sort_by,
   });
 
   return <DataTable response={response} useColumns={useColumns} />;

src/Pages/Admin/Area/useTableColumns.tsx

@@ -21,10 +21,8 @@ export const useColumns = () => {
   const navigate = useNavigate();
   const { setFilter } = useFilterStateState();
 
-
-  
   const handelShow = (record: Area) => {
-    setFilter({})
+    setFilter({});
     navigate(`${record?.id}`);
   };
 
@@ -53,7 +51,7 @@ export const useColumns = () => {
       key: "name",
       align: "center",
       render: (_text, record) => record?.name,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: t("columns.procedure"),

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

@@ -7,7 +7,6 @@ const Form = () => {
       <Col>
         <ValidationField name="name" placeholder="name" label="name" />
       </Col>
-
     </Row>
   );
 };

src/Pages/Admin/City/Page.tsx

@@ -22,7 +22,7 @@ const TableHeader = () => {
 
   useSetPageTitle([
     { name: `${t(`page_header.home`)}`, path: "/" },
-    {name:`${t(`page_header.City`)}`, path:"City"}
+    { name: `${t(`page_header.City`)}`, path: "City" },
   ]);
 
   return (
@@ -33,7 +33,11 @@ const TableHeader = () => {
           ModelAbility={ModalEnum?.CITY_ADD}
           canAdd={canAddCity}
         />
-        <FilterLayout sub_children={<FilterForm />} haveFilter={false} filterTitle="table.City" />
+        <FilterLayout
+          sub_children={<FilterForm />}
+          haveFilter={false}
+          filterTitle="table.City"
+        />
         <Table />
         <AddModalForm />
         <EditModalForm />

src/Pages/Admin/City/Table.tsx

@@ -14,7 +14,7 @@ const App: React.FC = () => {
     pagination: true,
     ...filterState,
     name,
-    sort_by
+    sort_by,
   });
 
   return <DataTable response={response} useColumns={useColumns} />;

src/Pages/Admin/City/useTableColumns.tsx

@@ -21,10 +21,8 @@ export const useColumns = () => {
   const navigate = useNavigate();
   const { setFilter } = useFilterStateState();
 
-
-  
   const handelShow = (record: City) => {
-    setFilter({})
+    setFilter({});
     navigate(`${record?.id}`);
   };
 
@@ -53,10 +51,9 @@ export const useColumns = () => {
       key: "name",
       align: "center",
       render: (_text, record) => record?.name,
-      ellipsis:true
+      ellipsis: true,
     },
     {
-
       title: t("columns.procedure"),
       key: "actions",
       align: "center",

src/Pages/Admin/Coupon/Model/AddModel.tsx

@@ -13,14 +13,12 @@ const AddModel: React.FC = () => {
 
   const handleSubmit = (values: any) => {
     console.log(values?.due_to, "values?.due_to");
-    const due_to = values?.due_to.format("YYYY-MM-DD HH:mm:ss")
+    const due_to = values?.due_to.format("YYYY-MM-DD HH:mm:ss");
     console.log(due_to);
     mutate({
       ...values,
       due_to,
-      grade_id:values?.grade_id?.id
+      grade_id: values?.grade_id?.id,
-
-
     });
   };
   return (

src/Pages/Admin/Coupon/Model/EditModel.tsx

@@ -12,8 +12,15 @@ const EditModel: React.FC = () => {
   const { objectToEdit } = useObjectToEdit((state) => state);
 
   const handleSubmit = (values: any) => {
-    const due_to = typeof values?.due_to === "string" ? values?.due_to : values?.due_to.format("YYYY-MM-DD HH:mm:ss")
+    const due_to =
-    const Data_to_send = { ...values , due_to,  grade_id:values?.grade_id?.id ?? "" };
+      typeof values?.due_to === "string"
+        ? values?.due_to
+        : values?.due_to.format("YYYY-MM-DD HH:mm:ss");
+    const Data_to_send = {
+      ...values,
+      due_to,
+      grade_id: values?.grade_id?.id ?? "",
+    };
     mutate(Data_to_send);
   };
 

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

@@ -6,40 +6,40 @@ import { useGetAllGrade } from "../../../../api/grade";
 const Form = ({ Hide = false }: { Hide?: boolean }) => {
   const { ValidationParamState } = useValidationValidationParamState();
 
-  const {
+  const { GradeName, GradeCurrentPage } = ValidationParamState;
-    GradeName, GradeCurrentPage,
-  } = ValidationParamState;
-
-
 
   const { data: Grade, isLoading: isLoadingGrade } = useGetAllGrade({
     name: GradeName,
-    page: GradeCurrentPage
+    page: GradeCurrentPage,
   });
-  const GradeOption = Grade?.data ?? []
+  const GradeOption = Grade?.data ?? [];
   const canChangeGradePage = !!Grade?.links?.next;
   const GradePage = Grade?.meta?.current_page;
   return (
     <Row className="w-100">
       <Col>
         <ValidationField name="name" placeholder="name" label="name" />
-        <ValidationField name="amount" type="number" placeholder="amount" label="amount" />
+        <ValidationField
-      
+          name="amount"
+          type="number"
+          placeholder="amount"
+          label="amount"
+        />
       </Col>
       <Col>
         <ValidationField
-         name="due_to" type="Date" 
+          name="due_to"
+          type="Date"
           Format="YYYY-MM-DD HH:mm:ss"
-         placeholder="due_to" label="due_to" 
+          placeholder="due_to"
+          label="due_to"
           showTime
-      
         />
         <ValidationField name="code" placeholder="code" label="code" />
         {/* 
               grade_id
         */}
-        {!Hide && 
+        {!Hide && (
-        
           <ValidationField
             searchBy="GradeName"
             name="grade_id"
@@ -51,9 +51,8 @@ const Form = ({Hide = false}:{Hide?:boolean }) => {
             canChangePage={canChangeGradePage}
             PageName={"GradeCurrentPage"}
             page={GradePage}
-
           />
-        }
+        )}
       </Col>
     </Row>
   );

src/Pages/Admin/Coupon/Model/formUtil.ts

@@ -10,7 +10,9 @@ export const getInitialValues = (
     name: objectToEdit?.name ?? "",
     amount: objectToEdit?.amount ?? "",
     code: objectToEdit?.code ?? "",
-    due_to: objectToEdit?.due_to ? dayjs(objectToEdit?.due_to,"YYYY-MM-DD HH:mm:ss") :  "",
+    due_to: objectToEdit?.due_to
+      ? dayjs(objectToEdit?.due_to, "YYYY-MM-DD HH:mm:ss")
+      : "",
     grade_id: objectToEdit?.grade ?? "",
   };
 };
@@ -20,8 +22,12 @@ export const getValidationSchema = () => {
   return Yup.object().shape({
     name: Yup.string().required("validation.required"),
     due_to: Yup.string().required("validation.required"),
-    code: Yup.string().required("validation.required").min(6,"validation.must_be_at_least_6_characters_long").max(6,"validation.must_be_at_least_6_characters_long"),
+    code: Yup.string()
-    amount: Yup.number().required("validation.required").typeError("validation.Must_be_a_number"),
+      .required("validation.required")
-
+      .min(6, "validation.must_be_at_least_6_characters_long")
+      .max(6, "validation.must_be_at_least_6_characters_long"),
+    amount: Yup.number()
+      .required("validation.required")
+      .typeError("validation.Must_be_a_number"),
   });
 };

src/Pages/Admin/Coupon/Page.tsx

@@ -22,7 +22,7 @@ const TableHeader = () => {
 
   useSetPageTitle([
     { name: `${t(`page_header.home`)}`, path: "/" },
-    {name:`${t(`page_header.Coupon`)}`, path:"Coupon"}
+    { name: `${t(`page_header.Coupon`)}`, path: "Coupon" },
   ]);
 
   return (
@@ -33,7 +33,11 @@ const TableHeader = () => {
           ModelAbility={ModalEnum?.COUPON_ADD}
           canAdd={canAddCoupon}
         />
-        <FilterLayout sub_children={<FilterForm />} haveFilter={false} filterTitle="table.Coupon" />
+        <FilterLayout
+          sub_children={<FilterForm />}
+          haveFilter={false}
+          filterTitle="table.Coupon"
+        />
         <Table />
         <AddModalForm />
         <EditModalForm />

src/Pages/Admin/Coupon/Table.tsx

@@ -14,7 +14,7 @@ const App: React.FC = () => {
     pagination: true,
     ...filterState,
     name,
-    sort_by
+    sort_by,
   });
 
   return <DataTable response={response} useColumns={useColumns} />;

src/Pages/Admin/Coupon/useTableColumns.tsx

@@ -21,10 +21,8 @@ export const useColumns = () => {
   const navigate = useNavigate();
   const { setFilter } = useFilterStateState();
 
-
-  
   const handelShow = (record: Coupon) => {
-    setFilter({})
+    setFilter({});
     navigate(`${record?.id}`);
   };
 
@@ -53,7 +51,7 @@ export const useColumns = () => {
       key: "name",
       align: "center",
       render: (_text, record) => record?.name,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: `${t("columns.amount")}`,
@@ -61,7 +59,7 @@ export const useColumns = () => {
       key: "amount",
       align: "center",
       render: (_text, record) => record?.amount,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: `${t("columns.code")}`,
@@ -69,7 +67,7 @@ export const useColumns = () => {
       key: "code",
       align: "center",
       render: (_text, record) => record?.code,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: `${t("columns.due_to")}`,
@@ -85,10 +83,9 @@ export const useColumns = () => {
       key: "status",
       align: "center",
       render: (_text, record) => record?.status,
-      ellipsis:true
+      ellipsis: true,
     },
     {
-
       title: t("columns.procedure"),
       key: "actions",
       align: "center",

src/Pages/Admin/FinancialCollection/Model/AddModel.tsx

@@ -17,7 +17,7 @@ const AddModel: React.FC = () => {
 
     mutate({
       ...values,
-      date: dayjs(values?.date).format('YYYY-MM-DD'),
+      date: dayjs(values?.date).format("YYYY-MM-DD"),
     });
   };
   return (

src/Pages/Admin/FinancialCollection/Model/EditModel.tsx

@@ -1,5 +1,9 @@
 import React from "react";
-import { getInitialValues, getValidationSchema, getValidationSchemaEdit } from "./formUtil";
+import {
+  getInitialValues,
+  getValidationSchema,
+  getValidationSchemaEdit,
+} from "./formUtil";
 import { ModalEnum } from "../../../../enums/Model";
 import LayoutModel from "../../../../Layout/Dashboard/LayoutModel";
 import ModelForm from "./ModelForm";
@@ -17,7 +21,7 @@ const EditModel: React.FC = () => {
   const handleSubmit = (values: any) => {
     mutate({
       ...values,
-      date: dayjs(values?.date).format('YYYY-MM-DD'),
+      date: dayjs(values?.date).format("YYYY-MM-DD"),
     });
   };
   return (

src/Pages/Admin/FinancialCollection/Model/FilterForm.tsx

@@ -4,13 +4,17 @@ import { Col, Row } from "reactstrap";
 import { useGetAllReseller } from "../../../../api/reseller";
 
 const FilterForm = () => {
-  const {data} = useGetAllReseller()
+  const { data } = useGetAllReseller();
 
   return (
     <div>
       <Row>
         <Col>
-          <ValidationField placeholder="description" label="description" name="description" />
+          <ValidationField
+            placeholder="description"
+            label="description"
+            name="description"
+          />
           <ValidationField placeholder="amount" label="amount" name="amount" />
           <ValidationField
             placeholder="reseller"
@@ -19,11 +23,11 @@ const FilterForm = () => {
             type="Select"
             option={data?.data?.map((e: any) => ({
               ...e,
-              fullName: `${e.first_name} ${e.last_name}`
+              fullName: `${e.first_name} ${e.last_name}`,
             }))}
             fieldNames={{
               label: "fullName",
-              value: "id"
+              value: "id",
             }}
           />
         </Col>

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

@@ -3,17 +3,28 @@ import ValidationField from "../../../../Components/ValidationField/ValidationFi
 import { useGetAllReseller } from "../../../../api/reseller";
 
 const Form = ({ isEdit = false }: { isEdit?: boolean }) => {
-  const {data} = useGetAllReseller()
+  const { data } = useGetAllReseller();
 
   return (
     <Row className="w-100">
       <Col>
-        <ValidationField placeholder="description" label="description" name="description" />
+        <ValidationField
+          placeholder="description"
+          label="description"
+          name="description"
+        />
         <ValidationField placeholder="amount" label="amount" name="amount" />
       </Col>
       <Col>
-      <ValidationField placeholder="date" label="date" name="date" type="Date"/>
+        <ValidationField
-      {isEdit ? " " :
+          placeholder="date"
+          label="date"
+          name="date"
+          type="Date"
+        />
+        {isEdit ? (
+          " "
+        ) : (
           <ValidationField
             placeholder="reseller"
             label="reseller"
@@ -21,15 +32,14 @@ const Form = ({isEdit= false}:{isEdit?:boolean}) => {
             type="Select"
             option={data?.data?.map((e: any) => ({
               ...e,
-          fullName: `${e.first_name} ${e.last_name}`
+              fullName: `${e.first_name} ${e.last_name}`,
             }))}
             fieldNames={{
               label: "fullName",
-          value: "id"
+              value: "id",
             }}
           />
-      }
+        )}
-
       </Col>
     </Row>
   );

src/Pages/Admin/FinancialCollection/Page.tsx

@@ -4,7 +4,10 @@ import { ModalEnum } from "../../../enums/Model";
 import { useTranslation } from "react-i18next";
 import { lazy, Suspense } from "react";
 import { Spin } from "antd";
-import { canAddFinancial_Collection, canAddTags } from "../../../utils/hasAbilityFn";
+import {
+  canAddFinancial_Collection,
+  canAddTags,
+} from "../../../utils/hasAbilityFn";
 import useSetPageTitle from "../../../Hooks/useSetPageTitle";
 import { useDeleteTag } from "../../../api/tags";
 import PageHeader from "../../../Layout/Dashboard/PageHeader";
@@ -23,7 +26,10 @@ const TableHeader = () => {
 
   useSetPageTitle([
     { name: `${t(`page_header.home`)}`, path: "/" },
-    {name:`${t(`page_header.financial_collection`)}`, path:"financial_collection"}
+    {
+      name: `${t(`page_header.financial_collection`)}`,
+      path: "financial_collection",
+    },
   ]);
 
   const deleteMutation = useDeleteFinancialCollection();

src/Pages/Admin/FinancialCollection/Table.tsx

@@ -5,7 +5,6 @@ import { useFilterState } from "../../../Components/Utils/Filter/FilterState";
 import { useFilterStateState } from "../../../zustand/Filter";
 import { useGetAllFinancialCollection } from "../../../api/financial_collection";
 const App: React.FC = () => {
-
   const { filterState } = useFilterState();
   const { Filter } = useFilterStateState();
   const name = Filter?.name;

src/Pages/Admin/FinancialCollection/useTableColumns.tsx

@@ -4,7 +4,12 @@ import { ModalEnum } from "../../../enums/Model";
 import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
 import { useModalState } from "../../../zustand/Modal";
 import { useTranslation } from "react-i18next";
-import { canDeleteFinancial_Collection, canDeleteTags, canEditFinancial_Collection, canEditTags } from "../../../utils/hasAbilityFn";
+import {
+  canDeleteFinancial_Collection,
+  canDeleteTags,
+  canEditFinancial_Collection,
+  canEditTags,
+} from "../../../utils/hasAbilityFn";
 import ActionButtons from "../../../Components/Table/ActionButtons";
 
 export const useColumns = () => {
@@ -34,21 +39,21 @@ export const useColumns = () => {
       dataIndex: "amount",
       key: "amount",
       align: "center",
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: t("columns.date"),
       dataIndex: "date",
       key: "date",
       align: "center",
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: t("columns.description"),
       dataIndex: "description",
       key: "description",
       align: "center",
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: t("columns.procedure"),

src/Pages/Admin/Grade/Page.tsx

@@ -22,7 +22,7 @@ const TableHeader = () => {
 
   useSetPageTitle([
     { name: `${t(`page_header.home`)}`, path: "/" },
-    {name:`${t(`page_header.grade`)}`, path:"grade"}
+    { name: `${t(`page_header.grade`)}`, path: "grade" },
   ]);
 
   return (

src/Pages/Admin/Grade/Table.tsx

@@ -15,7 +15,7 @@ const App: React.FC = () => {
     pagination: true,
     ...filterState,
     name: filterState.name || name,
-    sort_by
+    sort_by,
   });
 
   return <DataTable response={response} useColumns={useColumns} />;

src/Pages/Admin/Grade/useTableColumns.tsx

@@ -21,10 +21,8 @@ export const useColumns = () => {
   const navigate = useNavigate();
   const { setFilter } = useFilterStateState();
 
-
-  
   const handelShow = (record: Grade) => {
-    setFilter({})
+    setFilter({});
     navigate(`${record?.id}`);
   };
 
@@ -53,7 +51,7 @@ export const useColumns = () => {
       key: "name",
       align: "center",
       render: (_text, record) => record?.name,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: t("columns.image"),
@@ -67,7 +65,6 @@ export const useColumns = () => {
       },
     },
     {
-
       title: t("columns.procedure"),
       key: "actions",
       align: "center",

src/Pages/Admin/Manager/Add/Page.tsx

@@ -29,7 +29,7 @@ const TableHeader = () => {
     if (status === QueryStatusEnum.SUCCESS) {
       handleCancel();
     }
-  }, [status])
+  }, [status]);
 
   return (
     <div className="TableWithHeader">
@@ -50,7 +50,9 @@ const TableHeader = () => {
               <TitleDetailsForm />
               <AttachmentForm />
               <div className="resellerButton">
-                <button type="button" onClick={handleCancel}>{t("practical.cancel")}</button>
+                <button type="button" onClick={handleCancel}>
+                  {t("practical.cancel")}
+                </button>
                 <button type="submit">
                   {t("practical.add")} {t("models.reseller")}
                   {status === QueryStatusEnum.LOADING && (

src/Pages/Admin/Manager/Edit/Page.tsx

@@ -30,7 +30,7 @@ const TableHeader = () => {
     if (status === QueryStatusEnum.SUCCESS) {
       handleCancel();
     }
-  }, [status])
+  }, [status]);
   return (
     <div className="TableWithHeader">
       <Suspense fallback={<Spin />}>
@@ -51,7 +51,9 @@ const TableHeader = () => {
               <PasswordDetailsForm />
               <AttachmentForm />
               <div className="resellerButton">
-                <button type="button" onClick={handleCancel}>{t("practical.cancel")}</button>
+                <button type="button" onClick={handleCancel}>
+                  {t("practical.cancel")}
+                </button>
                 <button type="submit">
                   {t("practical.add")} {t("models.reseller")}
                   {status === QueryStatusEnum.LOADING && (

src/Pages/Admin/Manager/Form/PasswordDetailsForm.tsx

@@ -12,9 +12,16 @@ const PasswordDetailsForm = () => {
         <h4>{t("header.password")}</h4>
       </header>
       <main className="main_form_body">
-        <ValidationField name={"password"} placeholder={"_"} label={"new_password"} />
+        <ValidationField
-        <ValidationField name={"password"} placeholder={"_"} label={"submit_password"} />
+          name={"password"}
-
+          placeholder={"_"}
+          label={"new_password"}
+        />
+        <ValidationField
+          name={"password"}
+          placeholder={"_"}
+          label={"submit_password"}
+        />
       </main>
     </div>
   );

src/Pages/Admin/Manager/Form/PersonalDetailsForm.tsx

@@ -10,7 +10,7 @@ import { useGetRole } from "../../../../api/role";
 const PersonalDetailsForm = ({ isEdit = false }: { isEdit?: boolean }) => {
   const [t] = useTranslation();
   const { data } = useGetRole();
-  const RoleData = data?.data
+  const RoleData = data?.data;
 
   const sex = [
     { name: "male", id: "male" },
@@ -28,11 +28,7 @@ const PersonalDetailsForm = ({isEdit= false}:{isEdit?:boolean}) => {
           placeholder={"_"}
           label={"username"}
         />
-        <ValidationField
+        <ValidationField name={"name"} placeholder={"_"} label={"name"} />
-          name={"name"}
-          placeholder={"_"}
-          label={"name"}
-          />
         <ValidationField
           name={"contact_number"}
           placeholder={"_"}

src/Pages/Admin/Manager/Form/TitleDetailsForm.tsx

@@ -9,11 +9,11 @@ import { useGetAllCity } from "../../../../api/City";
 const TitleDetailsForm = () => {
   const [t] = useTranslation();
   const { data: city } = useGetAllCity();
-  const [CityId, setCityId] = useState()
+  const [CityId, setCityId] = useState();
   console.log(city);
 
   const { data } = useGetAllArea({
-    city_id:CityId
+    city_id: CityId,
   });
 
   return (
@@ -38,7 +38,6 @@ const TitleDetailsForm = () => {
           type="Select"
           disabled={!CityId}
           option={data?.data}
-          
         />
         {/* <ValidationField name={"address"} placeholder={"_"} label={"address"} /> */}
       </main>

src/Pages/Admin/Manager/Form/formUtils.ts

@@ -10,7 +10,6 @@ export const getInitialValues = (objectToEdit: Partial<any>) => {
     contact_number: objectToEdit?.contact_number ?? null,
     role_id: objectToEdit?.role_id ?? null,
     password: objectToEdit?.password ?? null,
-
   };
 };
 

src/Pages/Admin/Manager/Model/AddModel.tsx

@@ -12,7 +12,7 @@ const AddModel: React.FC = () => {
   const handleSubmit = (values: any) => {
     mutate({
       ...values,
-      grade_id:values?.grade_id?.id
+      grade_id: values?.grade_id?.id,
     });
   };
   return (

src/Pages/Admin/Manager/Table.tsx

@@ -13,7 +13,6 @@ const App: React.FC = () => {
   const name = Filter?.name;
   const sort_by = Filter?.sort_by;
 
-
   const response = useGetAllManager({
     name,
     sort_by,
@@ -21,7 +20,6 @@ const App: React.FC = () => {
     ...filterState,
   });
 
-
   return <DataTable response={response} useColumns={useColumns} />;
 };
 

src/Pages/Admin/Manager/useTableColumns.tsx

@@ -34,8 +34,7 @@ export const useColumns = () => {
 
   const handleEdit = (record: Manager) => {
     setObjectToEdit(record);
-    navigate(`/${ABILITIES_ENUM?.MANAGERS}/${record?.id}/edit`)
+    navigate(`/${ABILITIES_ENUM?.MANAGERS}/${record?.id}/edit`);
-
   };
   const [t] = useTranslation();
 

src/Pages/Admin/Notifications/AddNotification/Add/Page.tsx

@@ -31,9 +31,9 @@ const TableHeader = () => {
   useEffect(() => {
     if (isSuccess === true) {
       console.log(1);
-      Navigate('/add_Notifications')
+      Navigate("/add_Notifications");
     }
-  }, [isSuccess])
+  }, [isSuccess]);
 
   return (
     <div className="TableWithHeader">
@@ -54,7 +54,12 @@ const TableHeader = () => {
                 <TitleDetailsForm />
                 <PersonalDetailsForm />
                 <div className="resellerButton">
-                  <button type="button" onClick={() => Navigate('/add_Notifications')}>{t("practical.cancel")}</button>
+                  <button
+                    type="button"
+                    onClick={() => Navigate("/add_Notifications")}
+                  >
+                    {t("practical.cancel")}
+                  </button>
                   <button type="submit" disabled={!dirty}>
                     {t("practical.send")} {t("models.notifications")}
                     {status === QueryStatusEnum.LOADING && (

src/Pages/Admin/Notifications/AddNotification/Form/PersonalDetailsForm.tsx

@@ -43,13 +43,15 @@ const PersonalDetailsForm = ({isEdit}:{isEdit?:boolean}) => {
           label={"username"}
           type="text"
         />
-        {isEdit? "" :
+        {isEdit ? (
+          ""
+        ) : (
           <ValidationField
             name={"password"}
             placeholder={"_"}
             label={"password"}
           />
-        }
+        )}
         <ValidationField
           name={"card_number"}
           placeholder={"_"}

src/Pages/Admin/Notifications/AddNotification/Form/TitleDetailsForm.tsx

@@ -9,10 +9,10 @@ import { IoIosNotifications } from "react-icons/io";
 const TitleDetailsForm = () => {
   const [t] = useTranslation();
   const { data: city } = useGetAllCity();
-  const [CityId, setCityId] = useState()
+  const [CityId, setCityId] = useState();
 
   const { data } = useGetAllArea({
-    city_id:CityId
+    city_id: CityId,
   });
 
   return (
@@ -35,7 +35,6 @@ const TitleDetailsForm = () => {
           label={"body"}
           type="TextArea"
         />
-
       </main>
     </div>
   );

src/Pages/Admin/Notifications/AddNotification/Form/formUtils.ts

@@ -8,10 +8,9 @@ interface Location {
 interface User {
   username: string;
   phone_number?: number;
-  type?:string
+  type?: string;
 }
 
-
 interface PersonalDetailsForm {
   id: number;
   first_name: string | null;
@@ -23,8 +22,8 @@ interface PersonalDetailsForm {
   username: string | null;
   password: string | null;
   area_id: number | null;
-    lat:number,
+  lat: number;
-    lng:number
+  lng: number;
 }
 
 interface PersonalDetailsEditForm {
@@ -37,12 +36,17 @@ interface PersonalDetailsEditForm {
   card_number: string | null;
   user: User;
   area_id: any | null;
-  lat:number,
+  lat: number;
-  lng:number
+  lng: number;
 }
 
-export const getInitialValues = (objectToEdit: Partial<PersonalDetailsForm>) => {
+export const getInitialValues = (
-  const location = objectToEdit?.location?.[0] || { lat: 33.5138, lng: 36.2765 }; 
+  objectToEdit: Partial<PersonalDetailsForm>,
+) => {
+  const location = objectToEdit?.location?.[0] || {
+    lat: 33.5138,
+    lng: 36.2765,
+  };
 
   return {
     id: objectToEdit?.id ?? 0,
@@ -65,19 +69,20 @@ export const getValidationSchema = () => {
   // validate input
   return Yup.object().shape({
     id: Yup.number().required(),
-    first_name: Yup.string().required('first_name is required'),
+    first_name: Yup.string().required("first_name is required"),
-    last_name: Yup.string().required('last_name is required'),
+    last_name: Yup.string().required("last_name is required"),
-    location_lat: Yup.string().required('lat is required'),
+    location_lat: Yup.string().required("lat is required"),
-    location_lng: Yup.string().required('lng is required'),
+    location_lng: Yup.string().required("lng is required"),
-    contact_number1: Yup.string().required('contact_number1 is required'),
+    contact_number1: Yup.string().required("contact_number1 is required"),
-    contact_number2: Yup.string().required('contact_number2 is required'),
+    contact_number2: Yup.string().required("contact_number2 is required"),
-    username: Yup.string().required('username is required'),
+    username: Yup.string().required("username is required"),
-    area_id: Yup.mixed().required('area_id is required'),
+    area_id: Yup.mixed().required("area_id is required"),
   });
 };
 
-
+export const getInitialValuesEdit = (
-export const getInitialValuesEdit = (objectToEdit: Partial<PersonalDetailsEditForm>) => {
+  objectToEdit: Partial<PersonalDetailsEditForm>,
+) => {
   const location = objectToEdit?.location || { lat: 0, lng: 0 };
 
   return {

src/Pages/Admin/Notifications/AddNotification/Model/ModelForm.tsx

@@ -7,11 +7,14 @@ const Form = () => {
       <Col>
         <ValidationField name="title" placeholder="title" label="title" />
         <ValidationField name="body" placeholder="body" label="body" />
-
       </Col>
       <Col>
         <ValidationField name="seen" placeholder="seen" label="seen" />
-        <ValidationField name="notifiable_type" placeholder="notifiable_type" label="notifiable_type" />
+        <ValidationField
+          name="notifiable_type"
+          placeholder="notifiable_type"
+          label="notifiable_type"
+        />
       </Col>
     </Row>
   );

src/Pages/Admin/Notifications/AddNotification/Model/formUtil.ts

@@ -2,17 +2,13 @@ import * as Yup from "yup";
 import { Grade, GradeInitialValues } from "../../../../../types/Grade";
 import { Notification } from "../../../../../types/Notification";
 
-export const getInitialValues = (
+export const getInitialValues = (objectToEdit: Partial<Notification>): any => {
-  objectToEdit: Partial<Notification>,
-): any => {
   return {
     id: objectToEdit?.id,
     title: objectToEdit?.title ?? "",
     seen: objectToEdit?.seen ?? "",
     body: objectToEdit?.body ?? "",
     notifiable_type: objectToEdit?.notifiable_type ?? "",
-
-
   };
 };
 
@@ -23,6 +19,5 @@ export const getValidationSchema = () => {
     seen: Yup.string().required("validation.required"),
     body: Yup.string().required("validation.required"),
     notifiable_type: Yup.string().required("validation.required"),
-
   });
 };

src/Pages/Admin/Notifications/AddNotification/Page.tsx

@@ -23,7 +23,7 @@ const TableHeader = () => {
 
   useSetPageTitle([
     { name: `${t(`page_header.home`)}`, path: "/" },
-    {name:`${t(`page_header.notification`)}`, path:"notification"}
+    { name: `${t(`page_header.notification`)}`, path: "notification" },
   ]);
 
   return (
@@ -38,7 +38,10 @@ const TableHeader = () => {
           openModel={false}
         />
 
-        <FilterLayout sub_children={<FilterForm />} filterTitle="table.notification" />
+        <FilterLayout
+          sub_children={<FilterForm />}
+          filterTitle="table.notification"
+        />
         <Table />
         {/* <AddModalForm /> */}
         <EditModalForm />

src/Pages/Admin/Notifications/AddNotification/Table.tsx

@@ -15,7 +15,7 @@ const App: React.FC = () => {
     pagination: true,
     ...filterState,
     name: filterState.name || name,
-    sort_by
+    sort_by,
   });
 
   return <DataTable response={response} useColumns={useColumns} />;

src/Pages/Admin/Notifications/AddNotification/useTableColumns.tsx

@@ -20,10 +20,8 @@ export const useColumns = () => {
   const navigate = useNavigate();
   const { setFilter } = useFilterStateState();
 
-
-  
   const handelShow = (record: Notification) => {
-    setFilter({})
+    setFilter({});
     navigate(`${record?.id}`);
   };
 
@@ -52,7 +50,7 @@ export const useColumns = () => {
       key: "seen",
       align: "center",
       render: (_text, record) => record?.seen,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: `${t("columns.title")}`,
@@ -60,7 +58,7 @@ export const useColumns = () => {
       key: "title",
       align: "center",
       render: (_text, record) => record?.title,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: `${t("columns.notifiable_type")}`,
@@ -68,7 +66,7 @@ export const useColumns = () => {
       key: "notifiable_type",
       align: "center",
       render: (_text, record) => record?.notifiable_type,
-      ellipsis:true
+      ellipsis: true,
     },
     {
       title: `${t("columns.body")}`,

src/Pages/Admin/Notifications/Card.tsx

@@ -1,8 +1,6 @@
-import { notifications } from "../../../types/Notifications"
+import { notifications } from "../../../types/Notifications";
-
 
 const Card = ({ name, date, image, id }: notifications) => {
-    
   return (
     <div className="notification_card" key={id}>
       <div>
@@ -13,7 +11,7 @@ const Card = ({name,date,image,id}:notifications) => {
         </div>
       </div>
     </div>
-    )
+  );
-}
+};
 
-export default Card
+export default Card;

src/Pages/Admin/Notifications/NotificationArray.ts

@@ -1,7 +1,12 @@
 import { notifications } from "../../../types/Notifications";
 
 export const NotificationArray: notifications[] = [
-    {id:1,name:"تم إضافة تحصيل جديد بواسطة شاون",date:"1/10/2010",image:"/Image/faker_user.png"}, 
+  {
+    id: 1,
+    name: "تم إضافة تحصيل جديد بواسطة شاون",
+    date: "1/10/2010",
+    image: "/Image/faker_user.png",
+  },
   { id: 2, name: "moa", date: "منذ ساعة", image: "/Image/faker_user.png" },
   { id: 3, name: "moaz", date: "1/10/2010", image: "/Image/faker_user.png" },
   { id: 4, name: "hello", date: "1/10/2010", image: "/Image/faker_user.png" },
@@ -12,5 +17,4 @@ export const NotificationArray:notifications[] = [
   // {id:2,name:"moaz",date:"1/10/2010",image:"/Image/faker_user.png"},
   // {id:2,name:"moaz",date:"1/10/2010",image:"/Image/faker_user.png"},
   // {id:2,name:"moaz",date:"1/10/2010",image:"/Image/faker_user.png"},
-
+];
-]