Karimaldeen/Quiz_dashboard
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

remove un used code

Browse Source
This commit is contained in:
karimaldeen 2024-09-14 16:00:20 +03:00
parent e981ce7481
commit 693c1cdb06
16 changed files with 17 additions and 551 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx
View File

@ -63,7 +63,7 @@ const ImageBoxField = ({ name }: any) => {
<div className="VisibleHidden">hidden</div>
)}
</div>
<div className="ImageBox">
<div className="ImageBox" onClick={handleButtonClick}>
{imagePreview ? (
<img src={imagePreview} onClick={handleButtonClick} alt="Preview" className="imagePreview" />
) : (

4
src/Components/exercise/Header.tsx
View File

@ -72,11 +72,11 @@ const Header = () => {
>
<GoArrowSwitch className="m-2" />
</Popconfirm>
{isBseQuestion || values?.isBase === 1
? t("header.malty_exercise")
: t("header.exercise")}
</Popconfirm>
</div>
</header>
);

14
src/Pages/Admin/question/AddPage.tsx
View File

@ -1,13 +1,12 @@
import React, { Suspense, lazy, useEffect } from "react";
import { Spin } from "antd";
import FormikForm from "../../../Layout/Dashboard/FormikFormModel";
import {
getInitialValues,
getValidationSchema,
getInitialValuesBase,
getValidationSchemaBase,
processTags,
} from "./Model/formUtil";
} from "./formUtil";
import { useAddQuestion, useAddQuestionAsync } from "../../../api/Question";
import { useTranslation } from "react-i18next";
import { useLocation, useNavigate, useParams } from "react-router-dom";
@ -21,7 +20,6 @@ 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();
@ -163,7 +161,8 @@ const AddPage: React.FC = () => {
const handleCancel = () => {
navigate(-1);
};
const Loading = LoadingAsync || isLoading
const Loading = LoadingAsync || isLoading;
useEffect(() => {
if (isSuccess) {
setSuccess(true);
@ -211,9 +210,7 @@ const AddPage: React.FC = () => {
</Form>
)}
</Formik>
<Suspense fallback={<Spin />}>
<AcceptModal />
</Suspense>
</div>
</div>
@ -264,9 +261,6 @@ const AddPage: React.FC = () => {
)}
</Formik>
<Suspense fallback={<Spin />}>
<AcceptModal />
</Suspense>
</div>
</div>
);

3
src/Pages/Admin/question/EditPage.tsx
View File

@ -1,13 +1,12 @@
import React, { useEffect } from "react";
import { Modal, Spin } from "antd";
import FormikForm from "../../../Layout/Dashboard/FormikFormModel";
import {
getInitialValues,
getValidationSchema,
getInitialValuesBase,
getValidationSchemaBase,
processTags,
} from "./Model/formUtil";
} from "./formUtil";
import {
useAddQuestion,
useDeleteQuestion,

57
src/Pages/Admin/question/Model/AcceptModal.tsx
View File

@ -1,57 +0,0 @@
import React from "react";
import { Modal } from "antd";
import { useModalState } from "../../../../zustand/Modal";
import { ModalEnum } from "../../../../enums/Model";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
import { QUESTION_OBJECT_KEY } from "../../../../config/AppKey";
const AcceptModal: React.FC = () => {
const { isOpen, setIsOpen } = useModalState((state) => state);
const navigate = useNavigate();
const handleSubmit = () => {
localStorage.removeItem(QUESTION_OBJECT_KEY);
console.log("Handle submit clicked");
setIsOpen("");
navigate(-1);
};
const handleCancel = () => {
setIsOpen("");
};
const [t] = useTranslation();
return (
<>
<Modal
className="ModalForm"
centered
width={"40vw"}
footer={null}
open={isOpen === ModalEnum?.QUESTION_ACCEPT}
onCancel={handleCancel}
>
<header> {t("practical.accept_back")}</header>
<main className="main_modal">
<div className="ValidationField w-100 mb-5">
<label className="text h1 ">
{t(
"practical.Are you sure you want to go back and not save any changes?",
)}{" "}
</label>
</div>
<div className="buttons">
<div onClick={handleCancel}>{t("practical.cancel")}</div>
<div onClick={handleSubmit}>{t("practical.accept")}</div>
</div>
</main>
</Modal>
</>
);
};
export default AcceptModal;

5
src/Pages/Admin/question/Model/Malty/ChoiceField/CheckboxField.tsx
View File

@ -1,7 +1,6 @@
import React from "react";
import useFormField from "../../../../../../Hooks/useFormField";
import { Checkbox, Form } from "antd";
import { useFormik, useFormikContext } from "formik";
import { Checkbox } from "antd";
import { useFormikContext } from "formik";
import { useTranslation } from "react-i18next";
const CheckboxField = ({
name,

3
src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx
View File

@ -6,10 +6,7 @@ import { useTranslation } from "react-i18next";
import { getCharFromNumber } from "../../../../../../utils/getCharFromNumber";
import CheckboxField from "./CheckboxField";
import TextField from "./TextField";
import File from "./File";
import { FaTrash } from "react-icons/fa";
import { toast } from "react-toastify";
import HintField from "./HintField";
import ImageBoxField from "../../../../../../Components/CustomFields/ImageBoxField/ImageBoxField";
import { GoTrash } from "react-icons/go";

88
src/Pages/Admin/question/Model/Malty/ChoiceField/File.tsx
View File

@ -1,88 +0,0 @@
import { Button, Upload, UploadFile } from "antd";
import useFormField from "../../../../../../Hooks/useFormField";
import { UploadOutlined } from "@ant-design/icons";
import { useMemo } from "react";
const File = ({
name,
label,
onChange,
isDisabled,
placholder,
className,
parent_index,
props,
}: any) => {
const newName = `Questions[${parent_index}].answers[${name}].answer_image`;
const { formik, t, isError, errorMsg } = useFormField(newName, props);
let imageUrl =
formik?.values?.Questions?.[parent_index]?.answers[name]?.answer_image ??
null;
// console.log(imageUrl);
const fileList: UploadFile[] = useMemo(() => {
if (!imageUrl) return [];
return [
typeof imageUrl === "string"
? {
uid: "-1",
name: "uploaded-image",
status: "done",
url: imageUrl,
thumbUrl: imageUrl,
}
: {
uid: imageUrl.uid || "-1",
name: imageUrl.name || "uploaded-image",
status: "done",
originFileObj: imageUrl,
},
];
}, [imageUrl]);
// console.log(1);
const FilehandleChange = (value: any) => {
// console.log(value,"filevalue");
if (value.fileList.length === 0) {
formik.setFieldValue(newName, null);
} else {
formik.setFieldValue(
`Questions[${parent_index}].answers[${name}].answer_image`,
value?.file?.originFileObj,
);
}
};
const customRequest = async ({ onSuccess, no_label, label_icon }: any) => {
onSuccess();
};
return (
<div className={`ValidationField upload_image_button ${className ?? ""} `}>
<label htmlFor={name} className="text">
{t(`input.${label || name}`)}
</label>
<Upload
disabled={isDisabled}
listType="picture"
maxCount={1}
fileList={[...fileList]}
onChange={onChange || FilehandleChange}
customRequest={customRequest}
className={` w-100`}
>
<Button
className={isError ? "isError w-100 " : " w-100"}
icon={<UploadOutlined />}
>
{placholder ?? t("input.Click_to_upload_the_image")}
</Button>
<div className="Error_color"> {isError ? "required" : ""}</div>
{errorMsg}
</Upload>
</div>
);
};
export default File;

54
src/Pages/Admin/question/Model/Malty/ChoiceField/HintField.tsx
View File

@ -1,54 +0,0 @@
import { Form, Input } from "antd";
import React from "react";
import useFormField from "../../../../../../Hooks/useFormField";
import { MdOutlineEdit } from "react-icons/md";
import { Field } from "formik";
const HintField = ({
name,
label,
label2,
placeholder,
isDisabled,
onChange,
props,
parent_index,
id,
className,
}: any) => {
const newName = `Questions[${parent_index}].answers[${name}].hint`;
const { formik, isError, errorMsg, t } = useFormField(newName, props);
const TextFilehandleChange = (
e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
) => {
// console.log('Change:', e.target.value);
formik.setFieldValue(newName, e.target.value);
};
return (
<div className={`ValidationField w-100 ${className ?? ""} `}>
<label htmlFor={name} className="text">
{label2 ? label2 : t(`input.${label ? label : name}`)}
</label>
<Form.Item
hasFeedback
validateStatus={isError ? "error" : ""}
help={isError ? errorMsg : ""}
>
<Field
as={Input}
placeholder={t(`input.${placeholder ? placeholder : name}`)}
name={newName}
disabled={isDisabled}
size="large"
onChange={onChange || TextFilehandleChange}
style={{ width: 200 }}
id={id}
/>
</Form.Item>
</div>
);
};
export default React.memo(HintField);

6
src/Pages/Admin/question/Model/Malty/Form.tsx
View File

@ -87,6 +87,12 @@ const Form = () => {
);
useEffect(() => {
if (Success) {
formik.resetForm()
setSuccess(false);
}
}, [Success]);
return (
<Row className="w-100 exercise_form_container">

85
src/Pages/Admin/question/Model/Malty/QuestionFIeld/File.tsx
View File

@ -1,85 +0,0 @@
import { Button, Upload, UploadFile } from "antd";
import useFormField from "../../../../../../Hooks/useFormField";
import { UploadOutlined } from "@ant-design/icons";
import { useMemo } from "react";
const File = ({
name,
label,
onChange,
isDisabled,
placholder,
className,
props,
}: any) => {
const newName = `Questions[${name}].image`;
const { formik, t, isError, errorMsg } = useFormField(newName, props);
let imageUrl = formik?.values?.Questions?.[name]?.image ?? null;
// console.log(imageUrl);
const fileList: UploadFile[] = useMemo(() => {
if (!imageUrl) return [];
return [
typeof imageUrl === "string"
? {
uid: "-1",
name: "uploaded-image",
status: "done",
url: imageUrl,
thumbUrl: imageUrl,
}
: {
uid: imageUrl.uid || "-1",
name: imageUrl.name || "uploaded-image",
status: "done",
originFileObj: imageUrl,
},
];
}, [imageUrl]);
// console.log(1);
const FilehandleChange = (value: any) => {
// console.log(value,"filevalue");
if (value.fileList.length === 0) {
formik.setFieldValue(newName, null);
} else {
formik.setFieldValue(
`Questions[${name}].image`,
value?.file?.originFileObj,
);
}
};
const customRequest = async ({ onSuccess, no_label, label_icon }: any) => {
onSuccess();
};
return (
<div className={`ValidationField upload_image_button ${className ?? ""} `}>
<label htmlFor={name} className="text">
{t(`input.${label || name}`)}
</label>
<Upload
disabled={isDisabled}
listType="picture"
maxCount={1}
fileList={[...fileList]}
onChange={onChange || FilehandleChange}
customRequest={customRequest}
className={` w-100`}
>
<Button
className={isError ? "isError w-100 " : " w-100"}
icon={<UploadOutlined />}
>
{placholder ?? t("input.Click_to_upload_the_image")}
</Button>
<div className="Error_color"> {isError ? "required" : ""}</div>
{errorMsg}
</Upload>
</div>
);
};
export default File;

52
src/Pages/Admin/question/Model/Malty/QuestionFIeld/HintField.tsx
View File

@ -1,52 +0,0 @@
import { Form, Input } from "antd";
import React from "react";
import useFormField from "../../../../../../Hooks/useFormField";
import { MdOutlineEdit } from "react-icons/md";
import { Field } from "formik";
const HintField = ({
name,
label,
label2,
placeholder,
isDisabled,
onChange,
props,
id,
className,
}: any) => {
const newName = `Questions[${name}].hint`;
const { formik, isError, errorMsg, t } = useFormField(newName, props);
const TextFilehandleChange = (
e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
) => {
// console.log('Change:', e.target.value);
formik.setFieldValue(newName, e.target.value);
};
return (
<div className={`ValidationField w-100 ${className ?? ""} `}>
<label htmlFor={name} className="text">
{label2 ? label2 : t(`input.${label ? label : name}`)}
</label>
<Form.Item
hasFeedback
validateStatus={isError ? "error" : ""}
help={isError ? errorMsg : ""}
>
<Field
as={Input}
placeholder={t(`input.${placeholder ? placeholder : name}`)}
name={newName}
disabled={isDisabled}
size="large"
onChange={onChange || TextFilehandleChange}
style={{ width: 200 }}
id={id}
/>
</Form.Item>
</div>
);
};
export default React.memo(HintField);

6
src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx
View File

@ -1,16 +1,10 @@
import React, { useEffect } from "react";
import { Choice } from "../../../../../../types/Item";
import ValidationField from "../../../../../../Components/ValidationField/ValidationField";
import { useFormikContext } from "formik";
import { useTranslation } from "react-i18next";
import { getCharFromNumber } from "../../../../../../utils/getCharFromNumber";
import TextField from "./TextField";
import File from "./File";
import { FaTrash } from "react-icons/fa";
import { useObjectToEdit } from "../../../../../../zustand/ObjectToEditState";
import { toast } from "react-toastify";
import CheckboxField from "./CheckboxField";
import HintField from "./HintField";
import ImageBoxField from "../../../../../../Components/CustomFields/ImageBoxField/ImageBoxField";
import { GoTrash } from "react-icons/go";

107
src/Pages/Admin/question/Model/Malty/Tags/DynamicTags.tsx
View File

@ -1,107 +0,0 @@
import { useFormikContext } from "formik";
import React from "react";
import { useTranslation } from "react-i18next";
import { FaCirclePlus } from "react-icons/fa6";
import Tag from "./Tag";
import { useObjectToEdit } from "../../../../../../zustand/ObjectToEditState";
import { useGetAllTag } from "../../../../../../api/tags";
const DynamicTags = ({ parent_index }: { parent_index: number }) => {
const formik = useFormikContext<any>();
const [t] = useTranslation();
const { TagsSearch, setTagsSearch, currentTag, currentParentIndex } =
useObjectToEdit();
const { data } = useGetAllTag({
name: TagsSearch,
});
const suggests = data?.data;
const handleAddChoice = () => {
const length = formik?.values?.Questions?.[parent_index]?.tags.length;
const lastElement =
formik?.values?.Questions?.[parent_index]?.tags[length - 1]?.name;
setTagsSearch(null);
if (lastElement !== "") {
formik.setFieldValue(`Questions.[${parent_index}].tags`, [
...((formik?.values as any)?.Questions?.[parent_index]?.tags as any[]),
{
id: length + "_new",
name: "",
key: length,
},
]);
} else {
}
};
// console.log(formik?.values);
// console.log(currentTag);
const handleChoice = (item: any) => {
const length = formik?.values?.Questions?.[parent_index]?.tags?.length;
console.log(currentTag);
formik.setFieldValue(`Questions.[${parent_index}].tags[${currentTag}]`, {
...item,
key: length,
});
setTagsSearch(null);
};
// console.log(formik?.values?.tags?.length);
return (
<div className="DynamicTags">
{formik?.values?.Questions?.[parent_index]?.tags?.length < 1 && (
<p className="add_new_button">
<FaCirclePlus size={23} onClick={handleAddChoice} />{" "}
{t("header.add_tag")}
</p>
)}
<div className="tag_container">
<div className="tags">
{(
((formik?.values as any)?.Questions?.[parent_index]
?.tags as any[]) || []
).map((item: any, index: number) => {
return (
<Tag
key={index}
parent_index={parent_index}
index={index}
data={item}
/>
);
})}
</div>
{formik?.values?.Questions?.[parent_index]?.tags?.length > 0 && (
<p className="add_new_button">
<FaCirclePlus onClick={handleAddChoice} size={20} />
</p>
)}
</div>
{TagsSearch && currentParentIndex === parent_index && (
<div className="suggests">
{suggests?.map((item: any, index: number) => {
console.log(currentParentIndex === parent_index);
return (
<div
className="suggested"
key={index}
onClick={() => handleChoice(item)}
>
{item?.name}
</div>
);
})}
</div>
)}
</div>
);
};
export default DynamicTags;

80
src/Pages/Admin/question/Model/Malty/Tags/Tag.tsx
View File

@ -1,80 +0,0 @@
import { useFormikContext } from "formik";
import React, { useRef, useEffect } from "react";
import { useObjectToEdit } from "../../../../../../zustand/ObjectToEditState";
import { FaTrash } from "react-icons/fa";
const Tag = ({
data,
index,
parent_index,
}: {
data: any;
index: number;
parent_index: number;
}) => {
const inputRef = useRef<HTMLInputElement>(null);
const timeoutRef = useRef<NodeJS.Timeout | null>(null);
const DEBOUNCE_DELAY = 500;
const formik = useFormikContext<any>();
const { setTagsSearch, setCurrentTag, setCurrentParentIndex } =
useObjectToEdit();
console.log(formik?.values?.Questions);
useEffect(() => {
if (inputRef.current) {
inputRef.current.style.width = `${(formik?.values?.Questions?.[parent_index]?.tags[index]?.name?.length + 1) * 8}px`;
}
}, [formik?.values?.Questions?.[parent_index]?.tags[index]?.name]);
const handleEditInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
// console.log(e.target.value);
formik.setFieldValue(`Questions.[${parent_index}].tags[${index}]`, {
key: parent_index,
name: e.target.value,
id: `${parent_index}_key`,
});
setCurrentTag(index);
setCurrentParentIndex(parent_index);
if (timeoutRef.current) {
clearTimeout(timeoutRef.current);
}
timeoutRef.current = setTimeout(() => {
setTagsSearch(e.target.value);
}, DEBOUNCE_DELAY);
};
const handleDeleteChoice = () => {
console.log(data);
// Create a copy of current tags array
const currentTags = [...formik.values.tags];
// Remove the item at the specified index from the array
currentTags.splice(index, 1);
console.log(currentTags); // Log the updated tags array
// Update formik field value with the updated tags array
formik.setFieldValue(`Questions.[${parent_index}].tags`, currentTags);
// Reset search state if needed
setTagsSearch(null);
};
return (
<div className="tag">
<input
ref={inputRef}
className="tagInput"
type="text"
value={formik?.values?.Questions?.[parent_index]?.tags[index]?.name}
onChange={handleEditInputChange}
/>
<FaTrash onClick={handleDeleteChoice} />
</div>
);
};
export default Tag;

2
src/Pages/Admin/question/Model/formUtil.ts → src/Pages/Admin/question/formUtil.ts
View File

@ -1,5 +1,5 @@
import * as Yup from "yup";
import { Question } from "../../../../types/Item";
import { Question } from "../../../types/Item";
import { toast } from "react-toastify";
export const getInitialValues = (objectToEdit: Question): any => {