From b87a96e35836273c10d5a68830f352931dbeafa8 Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Wed, 18 Sep 2024 09:20:55 +0300 Subject: [PATCH] add animations --- src/Components/Layout/SideBar/MenuItem.tsx | 4 +- src/Layout/Dashboard/LayoutModel.tsx | 37 +++++++++++--- src/Pages/Admin/question/AddPage.tsx | 2 +- src/Pages/Admin/question/EditPage.tsx | 50 +++++++++++++++--- .../question/Model/Field/ChoiceFields.tsx | 17 ++++--- .../Model/Malty/ChoiceField/ChoiceFields.tsx | 20 +++----- src/Pages/Admin/question/Model/Malty/Form.tsx | 1 - src/Pages/Admin/question/Page.tsx | 1 + src/Pages/Admin/question/formUtil.ts | 4 +- src/Pages/Auth/FormField.tsx | 15 ------ src/Pages/Auth/LoginForm.tsx | 6 +-- src/Pages/Home/Dummy.tsx | 6 +-- src/Styles/App/App.scss | 19 ++++++- src/Styles/DataTable/FillterNav.scss | 6 +++ src/Styles/Layout/DataTable.scss | 2 +- src/Styles/Pages/exercise.scss | 51 +++++++++++++++++-- src/zustand/ObjectToEditState.ts | 2 +- 17 files changed, 170 insertions(+), 73 deletions(-) diff --git a/src/Components/Layout/SideBar/MenuItem.tsx b/src/Components/Layout/SideBar/MenuItem.tsx index bdcd0a7..637c394 100644 --- a/src/Components/Layout/SideBar/MenuItem.tsx +++ b/src/Components/Layout/SideBar/MenuItem.tsx @@ -37,14 +37,14 @@ export const MenuItem = ({ item, location, index, isOpen }: any) => { className="DropDownIcon" onClick={() => handleDropdown(index)} > - + ) : (
handleDropdown(index)} > - +
)} diff --git a/src/Layout/Dashboard/LayoutModel.tsx b/src/Layout/Dashboard/LayoutModel.tsx index a6c0584..249ac3d 100644 --- a/src/Layout/Dashboard/LayoutModel.tsx +++ b/src/Layout/Dashboard/LayoutModel.tsx @@ -7,6 +7,7 @@ import { useTranslation } from "react-i18next"; import { QueryStatusEnum } from "../../enums/QueryStatus"; import SpinContainer from "../../Components/Layout/SpinContainer"; import { MdCancel } from "react-icons/md"; +import { Form, Formik } from "formik"; interface LayoutModalProps { isAddModal?: boolean; @@ -65,12 +66,29 @@ const LayoutModel = ({ open={isOpen === ModelEnum} onCancel={handleCancel} > - -
+ + + {(formik) => { + useEffect(() => { + if (isOpen === "" || isOpen === "isSuccess") { + formik.setErrors({}); + formik.resetForm(); + } + }, [isOpen]); + + console.log(formik.initialValues); + console.log(formik?.values); + + + return
+ +
{t(`practical.${isAddModal ? "add" : "edit"}`)}{" "} {t(`models.${modelTitle}`)}{" "} @@ -88,7 +106,7 @@ const LayoutModel = ({ - + + ; + }} + ); diff --git a/src/Pages/Admin/question/AddPage.tsx b/src/Pages/Admin/question/AddPage.tsx index ea94e47..af073d3 100644 --- a/src/Pages/Admin/question/AddPage.tsx +++ b/src/Pages/Admin/question/AddPage.tsx @@ -26,7 +26,7 @@ const AddPage: React.FC = () => { const { mutateAsync,isLoading:LoadingAsync } = useAddQuestionAsync(); const { mutate, isLoading, isSuccess } = useAddQuestion(); - const { isBseQuestion, setTagsSearch, setSuccess } = + const { isBseQuestion, setTagsSearch, setSuccess , ShowHint,setShowHint } = useObjectToEdit(); const [t] = useTranslation(); diff --git a/src/Pages/Admin/question/EditPage.tsx b/src/Pages/Admin/question/EditPage.tsx index 10ecad9..08cdb76 100644 --- a/src/Pages/Admin/question/EditPage.tsx +++ b/src/Pages/Admin/question/EditPage.tsx @@ -1,5 +1,5 @@ import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; +import { Checkbox, Modal, Popover, Spin } from "antd"; import { getInitialValues, getValidationSchema, @@ -26,10 +26,12 @@ import { toast } from "react-toastify"; import { deletePathSegments } from "../../../utils/deletePathSegments"; import { Form, Formik } from "formik"; import { MdOutlineArrowForwardIos } from "react-icons/md"; +import { SettingFilled } from "@ant-design/icons"; +import { CheckboxProps } from "antd/lib"; const EditPage: React.FC = () => { const { subject_id, lesson_id, question_id } = useParams(); - const { isBseQuestion, setIsBseQuestion, setTagsSearch, DeletedQuestions } = + const { isBseQuestion, setIsBseQuestion, setTagsSearch, DeletedQuestions , ShowHint,setShowHint } = useObjectToEdit(); const { mutate, isSuccess, isLoading } = useUpdateQuestion(); @@ -60,6 +62,7 @@ const EditPage: React.FC = () => { setTagsSearch(null); if (isBseQuestion) { + const UpdateBseQuestion = { id: DataToSend?.id, content: DataToSend?.content, @@ -74,7 +77,7 @@ const EditPage: React.FC = () => { console.log(DeletedQuestions, "DeletedQuestions"); console.log(UpdateBseQuestion); - mutate(UpdateBseQuestion); + // mutate(UpdateBseQuestion); DeletedQuestions?.map((item: any) => { DeleteQuestion({ id: item?.id }); @@ -97,8 +100,16 @@ const EditPage: React.FC = () => { const oldAnswers = [] as any; const newAnswers = [] as any; + if(updatedObject?.content_image === null){ + updatedObject["content_image"] = "" + } + updatedObject?.answers?.forEach((item: any) => { if (item?.id) { + if(item?.content_image === null){ + item["content_image"] = "" + + } oldAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0 }); } else { newAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0 }); @@ -108,11 +119,12 @@ const EditPage: React.FC = () => { old: oldAnswers, new: newAnswers, }; - console.log(answers); + const emptyTag = tags?.new?.length === 0 && tags?.old?.length === 0 + const tagToSend = emptyTag ? "" : tags mutate({ ...updatedObject, answers, - tags, + tags:tagToSend, }); } else { console.log(values?.id); @@ -247,6 +259,22 @@ const handleNavigateToPage = () => { } }, [isSuccess]); + const onChange: CheckboxProps['onChange'] = (e) => { + setShowHint(e.target.checked); + }; + + const contentSetting = ( +
+ + + { t("header.show_hint")} + + +
+ ); + + + const Loading = LoadingAsync || isLoading if (dataLoading || QuestionsDataLoading) { @@ -277,7 +305,13 @@ const handleNavigateToPage = () => {
{t("practical.edit")} {t("models.exercise")}{" "}
+
+ + + +
{t("header.exercise")}
+
@@ -321,7 +355,7 @@ const handleNavigateToPage = () => { handleSubmit(values); }} > - {({ values,handleSubmit }) => ( + {({ values,handleSubmit , dirty }) => (
{/*
*/} @@ -335,13 +369,13 @@ const handleNavigateToPage = () => {
{t("practical.back")}