Function AdminAddMCQ

apps/web/components/admin/AdminAddMCQ.tsx:11–145

({ problem }: { problem: AdminAddMCQProps })

}

const AdminAddMCQ = ({ problem }: { problem: AdminAddMCQProps }) => {
  const [mcqs, setMcqs] = useState<Omit<MCQQuestion, "id">[]>([]);
  const [ExistingMCQs, setExistingMCQs] = useState<MCQQuestion[]>(problem.mcqQuestions);
  const [question, setQuestion] = useState<string>("");
  const [options, setOptions] = useState<string[]>([]);
  const [option, setoption] = useState<string>("");
  const [correctOption, setCorrectOption] = useState<string>("");
  const [isUpdate, setIsUpdate] = useState<boolean>(false);

  useEffect(() => {
    async function fetchMCQs() {
      const mcqs = await getAllMCQQuestion(problem.id);
      setExistingMCQs(mcqs);
    }
    fetchMCQs();
  }, [mcqs, isUpdate]);

  function handleAddOption() {
    setOptions([...options, ...option.split(",")]);
    setoption("");
  }
  function handleRemoveOption(option: string) {
    setOptions(options.filter((o) => o !== option));
  }
  function handleAddMCQ() {
    const data = {
      question: question,
      options: options,
      correctOption: correctOption,
      problemId: problem.id,
    };
    setMcqs([...mcqs, data]);
    setQuestion("");
    setOptions([]);
    setoption("");
    setCorrectOption("");
  }
  function handleRemoveMCQ(question: string) {
    setMcqs(mcqs.filter((mcq) => mcq.question !== question));
  }

  function handleSubmit() {
    mcqs.map(async (mcq) => {
      await createMCQ(mcq);
    });
    setMcqs([]);
  }

  function handleRemoveExistingMCQs(id: string) {
    deleteMCQ(id);
    setExistingMCQs(ExistingMCQs.filter((mcq) => mcq.id !== id));
  }

  return (
    <Sheet>
      <SheetTrigger>
        <Button variant={"outline"}> Add MCQ </Button>
      </SheetTrigger>