add button for ux

src/Components/exercise/Header.tsx

@@ -4,14 +4,16 @@ import { useTranslation } from "react-i18next";
 import { GoArrowSwitch } from "react-icons/go";
 import { useObjectToEdit } from "../../zustand/ObjectToEditState";
 import { QUESTION_OBJECT_KEY } from "../../config/AppKey";
-import { Popover } from "antd";
+import { Popconfirm, Popover } from "antd";
 import { CombinationKeyEnum } from "../../enums/CombinationKeyEnum";
+import { PopconfirmProps } from "antd/lib";
 
 const Header = () => {
   const [t] = useTranslation();
   const { values, setFieldValue, setValues } = useFormikContext<any>();
   const { isBseQuestion, setIsBseQuestion } = useObjectToEdit();
   const { setSavedQuestionData } = useObjectToEdit();
+
   const handleChange = () => {
     setSavedQuestionData(null);
     localStorage.removeItem(QUESTION_OBJECT_KEY);
@@ -26,6 +28,14 @@ const Header = () => {
     }
   };
 
+  const confirm: PopconfirmProps['onConfirm'] = (e) => {
+    console.log(e);
+    setTimeout(() => {
+      handleChange()
+    }, 500);
+    
+  };
+
   const content = (
     <div>
       <p>
@@ -52,7 +62,18 @@ const Header = () => {
         </div>
       </article>
       <div>
-        <GoArrowSwitch onClick={handleChange} className="m-2" />
+      <Popconfirm
+    title={t("header.this_will_un_do_all_your_changes")}
+    okText={t("practical.yes")}
+    cancelText={t("practical.no")}
+    onConfirm={()=>{confirm()}}
+    defaultOpen={false}
+
+  >
+  
+        <GoArrowSwitch className="m-2" />
+
+  </Popconfirm>
         {isBseQuestion || values?.isBase === 1
           ? t("header.malty_exercise")
           : t("header.exercise")}

src/Pages/Admin/question/AddPage.tsx

@@ -10,7 +10,7 @@ import {
 } from "./Model/formUtil";
 import { useAddQuestion, useAddQuestionAsync } from "../../../api/Question";
 import { useTranslation } from "react-i18next";
-import { useNavigate, useParams } from "react-router-dom";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
 import { ParamsEnum } from "../../../enums/params";
 import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
 
@@ -20,9 +20,12 @@ import BaseForm from "./Model/Malty/Form";
 import ModelForm from "./Model/ModelForm";
 import { toast } from "react-toastify";
 import { Form, Formik } from "formik";
+import { MdOutlineArrowForwardIos } from "react-icons/md";
 const AcceptModal = lazy(() => import("./Model/AcceptModal"));
 
 const AddPage: React.FC = () => {
+  const location = useLocation();
+
   const { mutateAsync,isLoading:LoadingAsync } = useAddQuestionAsync();
   const { mutate, isLoading, isSuccess } = useAddQuestion();
   const { isBseQuestion, setTagsSearch, objectToEdit, setSuccess } =
@@ -157,6 +160,10 @@ const AddPage: React.FC = () => {
   
   const navigate = useNavigate();
 
+  const handleNavigateToPage = () => {
+    const cleanedUrl = location.pathname?.replace("/Question/add", "");
+    navigate(cleanedUrl);
+  };
   const handleCancel = () => {
     navigate(-1);
   };
@@ -169,8 +176,12 @@ const AddPage: React.FC = () => {
 
   if (isBseQuestion) {
     return (
-
       
+      <div className="QuestionPractical">
+      <header>
+      <MdOutlineArrowForwardIos onClick={handleNavigateToPage} />  {t("header.add_new_question")}
+      </header>
+
       <div className="exercise_add">
         <Formik
         onSubmit={handleSubmit}
@@ -208,10 +219,18 @@ const AddPage: React.FC = () => {
           <AcceptModal />
         </Suspense>
       </div>
+      </div>
+
     );
   }
+
   return (
-    <div className="exercise_add">
+
+  <div className="QuestionPractical">
+        <header>
+        <MdOutlineArrowForwardIos onClick={handleNavigateToPage} />  {t("header.add_new_question")}
+        </header>
+<div className="exercise_add">
      <Formik
   enableReinitialize={true}
   initialValues={getInitialValues({} as any)}
@@ -253,6 +272,7 @@ const AddPage: React.FC = () => {
         <AcceptModal />
       </Suspense>
     </div>
+    </div>
   );
 };
 

src/Pages/Admin/question/EditPage.tsx

@@ -26,6 +26,7 @@ import { Question } from "../../../types/Item";
 import { toast } from "react-toastify";
 import { deletePathSegments } from "../../../utils/deletePathSegments";
 import { Form, Formik } from "formik";
+import { MdOutlineArrowForwardIos } from "react-icons/md";
 
 const EditPage: React.FC = () => {
   const { subject_id, lesson_id, question_id } = useParams<ParamsEnum>();
@@ -236,6 +237,11 @@ const handleValidateBaseQuestion = (values: any) => {
 };
 
 
+const handleNavigateToPage = () => {
+  const cleanedUrl = location.pathname.replace(/\/Question\/\d+$/, "");
+  navigate(cleanedUrl);
+};
+
   useEffect(() => {
     if (isSuccess) {
       toast.success(t("validation.the_possess_done_successful"));
@@ -250,6 +256,13 @@ const handleValidateBaseQuestion = (values: any) => {
   }
   if (objectToEdit?.isBase) {
     return (
+
+      
+    <div className="QuestionPractical">
+    <header>
+    <MdOutlineArrowForwardIos onClick={handleNavigateToPage} />  {t("header.edit_question")}
+    </header>
+
       <div className="exercise_add">
              <Formik
         onSubmit={handleSubmit}
@@ -289,10 +302,17 @@ const handleValidateBaseQuestion = (values: any) => {
         </Formik>
 
       </div>
+      </div>
     );
   }
 
+
   return (
+
+    <div className="QuestionPractical">
+      <header>
+      <MdOutlineArrowForwardIos onClick={handleNavigateToPage} />  {t("header.edit_question")}
+      </header>
     <div className="exercise_add">
 
 <Formik
@@ -338,6 +358,8 @@ const handleValidateBaseQuestion = (values: any) => {
 </Formik>
  
     </div>
+    </div>
+
   );
 };
 

src/Pages/Home/Dummy.tsx

@@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next";
 import { ABILITIES_ENUM } from "../../enums/abilities";
 import useSetPageTitle from "../../Hooks/useSetPageTitle";
 import useFilter from "../../Components/FilterField/components/useFilter";
+import { Button, Popconfirm } from "antd";
 
 const Dummy = () => {
   const [t] = useTranslation();
@@ -12,6 +13,7 @@ const Dummy = () => {
     <div className="DummyHomePage">
       {/* <FilterButton />
       <FilterBody>karim</FilterBody> */}
+ 
     </div>
   );
 };

src/Styles/Antd/Mix.scss

@@ -10,12 +10,7 @@
     }
   }
 }
-
-.Popover {
-  .ant-popover-inner {
-    padding: 0 !important;
-  }
-}
+x
 
 .Color_type_checkbox.false {
   .ant-checkbox-checked .ant-checkbox-inner {

src/Styles/Pages/exercise.scss

@@ -41,7 +41,7 @@
   // padding: 2vw;
   .exercise_add_main {
     background: var(--bg);
-    padding: 2vw;
+    padding: 10px 2vw;
   }
   .exercise_add_buttons {
     display: flex;
@@ -212,3 +212,37 @@
   transform: translateY(55px);
   z-index: -1;
 }
+
+
+
+.ant-popconfirm .ant-popconfirm-buttons{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    >{
+      flex: 1;
+      min-height: auto;
+      min-width: 30px;
+
+    }
+    .ant-btn{
+      min-height: 30px !important;
+      max-height: 30px !important;
+      min-width: 50px;
+      padding: 5px !important;
+      display: flex;
+      align-items: center;
+      justify-content: center ;
+    
+
+    }
+}
+
+.QuestionPractical{
+  display: flex;
+  flex-direction: column;
+  background: var(--bg);
+  >header{
+    padding: 30px 2vw 10px 2vw;
+  }
+}

src/translate/ar.json

@@ -125,7 +125,9 @@
     "personal_information": "المعلومات الشخصية",
     "address": "العنوان",
     "attachment": "المرفق",
-    "subject_of_class": "مواد الصف"
+    "subject_of_class": "مواد الصف",
+    "this_will_un_do_all_your_changes":"سوف يؤدي هذا إلى إلغاء جميع تغييراتك",
+    "edit_question":"تعديل سؤال"
   },
   "columns": {
     "id": "الرقم التعريفي",