import { jsxs, jsx } from "react/jsx-runtime";
import { I as InputError } from "./input-error-D1JIzedA.js";
import { L as LoadingButton } from "./loading-button-CCIxhJrY.js";
import { B as Button } from "./button-CdJZJLGw.js";
import { D as Dialog, a as DialogTrigger, b as DialogContent, c as DialogHeader, d as DialogTitle } from "./dialog-DGP_3dPQ.js";
import { I as Input } from "./input-BsvJqbcd.js";
import { L as Label } from "./label-0rIIfpX0.js";
import { S as Select, a as SelectTrigger, b as SelectValue, c as SelectContent, d as SelectItem } from "./select-BYx0MCUK.js";
import { o as onHandleChange } from "./inertia-BtwbgBI3.js";
import { useForm } from "@inertiajs/react";
import { useState, useEffect } from "react";
import { Editor } from "richtor";
/* empty css                 */
import FillBlankForm from "./fill-blank-form-BcDCvDw3.js";
import ListeningForm from "./listening-form-BiqPdcp5.js";
import MatchingForm from "./matching-form-hmM-nMXg.js";
import MultipleChoiceForm from "./multiple-choice-form-oVIXwxmn.js";
import OrderingForm from "./ordering-form-TxongDlm.js";
import ShortAnswerForm from "./short-answer-form-D3SsHnIm.js";
import "./utils-DLCPGU0v.js";
import "clsx";
import "tailwind-merge";
import "lucide-react";
import "@radix-ui/react-slot";
import "class-variance-authority";
import "@radix-ui/react-dialog";
import "@radix-ui/react-label";
import "@radix-ui/react-select";
import "./chunked-uploader-input-CZfv7yqS.js";
import "axios";
import "sonner";
import "./radio-group-Wf8uu9ZY.js";
import "@radix-ui/react-radio-group";
import "./textarea-Z0d4V-ti.js";
import "./checkbox--3Zj5G-w.js";
import "@radix-ui/react-checkbox";
const questionTypes = [
  { value: "multiple_choice", label: "Multiple Choice" },
  { value: "multiple_select", label: "Multiple Select" },
  { value: "matching", label: "Matching" },
  { value: "fill_blank", label: "Fill in the Blank" },
  { value: "ordering", label: "Ordering" },
  { value: "short_answer", label: "Short Answer" },
  { value: "listening", label: "Listening" }
];
const QuestionDialog = ({ exam, question, handler }) => {
  const [open, setOpen] = useState(false);
  const [isSubmit, setIsSubmit] = useState(false);
  const [isFileSelected, setIsFileSelected] = useState(false);
  const [isFileUploaded, setIsFileUploaded] = useState(false);
  const initialFormData = {
    exam_id: exam.id,
    title: (question == null ? void 0 : question.title) || "",
    description: (question == null ? void 0 : question.description) || "",
    marks: (question == null ? void 0 : question.marks) || 1,
    options: (question == null ? void 0 : question.options) || {},
    question_options: ((question == null ? void 0 : question.question_options) || []).map((opt) => ({
      id: opt.id ? Number(opt.id) : void 0,
      option_text: opt.option_text,
      is_correct: opt.is_correct,
      sort: opt.sort
    })),
    question_type: (question == null ? void 0 : question.question_type) || "multiple_choice",
    exam_question_id: (question == null ? void 0 : question.id) ? Number(question.id) : null
  };
  const { data, setData, post, put, errors, processing, reset, clearErrors } = useForm(initialFormData);
  const handleSubmit = (e) => {
    var _a;
    e.preventDefault();
    if (data.question_type === "listening" && ((_a = data.options) == null ? void 0 : _a.audio_source) === "upload") {
      if (!question || isFileSelected) {
        if (!isFileUploaded) {
          setIsSubmit(true);
          return;
        }
      }
    }
    submitForm();
  };
  const submitForm = () => {
    clearErrors();
    if (question) {
      put(route("exam-questions.update", question.id), {
        preserveScroll: true,
        onSuccess: () => {
          setOpen(false);
          reset();
          setIsSubmit(false);
          setIsFileUploaded(false);
        }
      });
    } else {
      post(route("exam-questions.store"), {
        preserveScroll: true,
        onSuccess: () => {
          setOpen(false);
          reset();
          setIsSubmit(false);
          setIsFileUploaded(false);
        }
      });
    }
  };
  useEffect(() => {
    if (isFileUploaded && isSubmit) {
      submitForm();
    }
  }, [isFileUploaded, isSubmit]);
  useEffect(() => {
    if (!open) {
      setIsSubmit(false);
      setIsFileSelected(false);
      setIsFileUploaded(false);
    }
  }, [open]);
  const renderQuestionTypeForm = () => {
    const props = {
      data,
      setData,
      errors
    };
    switch (data.question_type) {
      case "multiple_choice":
      case "multiple_select":
        return /* @__PURE__ */ jsx(MultipleChoiceForm, { ...props, isMultipleSelect: data.question_type === "multiple_select" });
      case "matching":
        return /* @__PURE__ */ jsx(MatchingForm, { ...props });
      case "fill_blank":
        return /* @__PURE__ */ jsx(FillBlankForm, { ...props });
      case "ordering":
        return /* @__PURE__ */ jsx(OrderingForm, { ...props });
      case "short_answer":
        return /* @__PURE__ */ jsx(ShortAnswerForm, { ...props });
      case "listening":
        return /* @__PURE__ */ jsx(
          ListeningForm,
          {
            ...props,
            isSubmit,
            setIsSubmit,
            setIsFileSelected,
            setIsFileUploaded
          }
        );
      default:
        return null;
    }
  };
  return /* @__PURE__ */ jsxs(Dialog, { open, onOpenChange: setOpen, children: [
    /* @__PURE__ */ jsx(DialogTrigger, { children: handler }),
    /* @__PURE__ */ jsxs(DialogContent, { className: "max-h-[90vh] max-w-4xl overflow-y-auto", children: [
      /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: question ? "Edit Question" : "Create Question" }) }),
      /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", children: [
        /* @__PURE__ */ jsxs("div", { className: "grid gap-6 md:grid-cols-2", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx(Label, { children: "Question Type *" }),
            /* @__PURE__ */ jsxs(
              Select,
              {
                value: data.question_type,
                onValueChange: (value) => setData("question_type", value),
                disabled: question ? true : false,
                children: [
                  /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select question type" }) }),
                  /* @__PURE__ */ jsx(SelectContent, { children: questionTypes.map((type) => /* @__PURE__ */ jsx(SelectItem, { value: type.value, children: type.label }, type.value)) })
                ]
              }
            ),
            /* @__PURE__ */ jsx(InputError, { message: errors.question_type })
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx(Label, { children: "Marks *" }),
            /* @__PURE__ */ jsx(
              Input,
              {
                type: "number",
                step: "0.5",
                min: "0.5",
                name: "marks",
                value: data.marks.toString(),
                onChange: (e) => setData("marks", parseFloat(e.target.value) || 0),
                placeholder: "Enter marks"
              }
            ),
            /* @__PURE__ */ jsx(InputError, { message: errors.marks })
          ] })
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx(Label, { children: "Question Title *" }),
          /* @__PURE__ */ jsx(Input, { name: "title", value: data.title, onChange: (e) => onHandleChange(e, setData), placeholder: "Enter question title" }),
          /* @__PURE__ */ jsx(InputError, { message: errors.title })
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx(Label, { children: "Description (Optional)" }),
          /* @__PURE__ */ jsx(
            Editor,
            {
              ssr: true,
              output: "html",
              placeholder: {
                paragraph: "Add additional context or instructions...",
                imageCaption: "Add additional context or instructions..."
              },
              contentMinHeight: 150,
              contentMaxHeight: 300,
              initialContent: data.description,
              onContentChange: (value) => setData((prev) => ({
                ...prev,
                description: value
              }))
            }
          ),
          /* @__PURE__ */ jsx(InputError, { message: errors.description })
        ] }),
        renderQuestionTypeForm(),
        /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-3 border-t pt-4", children: [
          /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: () => setOpen(false), disabled: processing || isSubmit, children: "Cancel" }),
          /* @__PURE__ */ jsx(LoadingButton, { loading: processing || isSubmit, disabled: processing || isSubmit, children: question ? "Update Question" : "Create Question" })
        ] })
      ] })
    ] })
  ] });
};
export {
  QuestionDialog as default
};
