"use client";

import { z } from "zod";
import { useForm, Controller } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogHeader,
  DialogTitle,
} from "../ui/dialog";
import { Checkbox } from "../ui/checkbox";
import { Button } from "../ui/button";
import { Textarea } from "../ui/textarea";
import { useState } from "react";
import { createTaskTa } from "@/service/task";
import { createSurveyData } from "@/service/survey/survey";

export default function FormSurvey() {
  // const [showSurvey, setShowSurvey] = useState(true);
  // const [isLoading, setIsLoading] = useState(false);
  // const {
  //   control,
  //   handleSubmit,
  //   formState: { errors },
  // } = useForm<SurveySchema>({
  //   resolver: zodResolver(surveySchema),
  //   mode: "all",
  //   defaultValues: {
  //     accessFrequency: "",
  //     uiExperienceDesign: "",
  //     uiExperienceNavigation: "",
  //     uiExperienceSpeed: "",
  //     infoAccuracy: "",
  //     infoCompleteness: "",
  //     usefulness: "",
  //     suggestion: "",
  //   },
  // });
  // const options = {
  //   accessFrequency: [
  //     "Setiap hari",
  //     "Beberapa kali seminggu",
  //     "Beberapa kali dalam sebulan",
  //     "Baru pertama kali",
  //   ],
  //   uiExperienceDesign: ["Sangat baik", "Baik", "Cukup", "Kurang", "Buruk"],
  //   uiExperienceNavigation: [
  //     "Sangat mudah",
  //     "Mudah",
  //     "Cukup",
  //     "Sulit",
  //     "Sangat sulit",
  //   ],
  //   uiExperienceSpeed: [
  //     "Sangat cepat",
  //     "Cepat",
  //     "Cukup",
  //     "Lambat",
  //     "Sangat lambat",
  //   ],
  //   infoAccuracy: ["Sangat puas", "Puas", "Cukup", "Kurang puas", "Tidak puas"],
  //   infoCompleteness: [
  //     "Sangat lengkap",
  //     "Lengkap",
  //     "Cukup",
  //     "Kurang lengkap",
  //     "Tidak lengkap",
  //   ],
  //   usefulness: [
  //     "Sangat membantu",
  //     "Membantu",
  //     "Cukup membantu",
  //     "Kurang membantu",
  //     "Tidak membantu",
  //   ],
  // };
  // const renderControllerGroup = (
  //   name: keyof SurveySchema,
  //   question: string,
  //   choices: string[]
  // ) => (
  //   <div className="space-y-2">
  //     <p className="font-medium">{question}</p>
  //     <div className="grid grid-cols-2 gap-2">
  //       {choices.map((choice, i) => (
  //         <Controller
  //           key={i}
  //           name={name}
  //           control={control}
  //           render={({ field }) => (
  //             <label className="flex items-center space-x-2">
  //               <Checkbox
  //                 checked={field.value === choice}
  //                 onCheckedChange={() => field.onChange(choice)}
  //               />
  //               <span>{choice}</span>
  //             </label>
  //           )}
  //         />
  //       ))}
  //     </div>
  //     {errors[name] && (
  //       <p className="text-red-500 text-sm">
  //         {errors[name]?.message as string}
  //       </p>
  //     )}
  //   </div>
  // );
  // const onSubmit = async (data: SurveySchema) => {
  //   setIsLoading(true);
  //   try {
  //     const response = await createSurveyData(data);
  //     console.log("API Response:", response);
  //     setShowSurvey(false);
  //   } catch (error) {
  //     console.error("Error submitting survey:", error);
  //   } finally {
  //     setIsLoading(false);
  //   }
  // };
  // return (
  //   <Dialog open={showSurvey} onOpenChange={setShowSurvey}>
  //     <DialogContent className="z-50 min-w-max h-[600px] overflow-y-auto">
  //     </DialogContent>
  //   </Dialog>
  // );
}