"use client"

import * as React from "react"
import { zodResolver } from "@hookform/resolvers/zod"
import { useForm } from "react-hook-form"
import { toast } from "sonner"
import * as z from "zod"
import { Upload } from "lucide-react"

import { Button } from "@/components/ui/button"
import {
  Sheet,
  SheetContent,
  SheetDescription,
  SheetFooter,
  SheetHeader,
  SheetTitle,
} from "@/components/ui/sheet"
import {
  Form,
  FormField,
  FormItem,
  FormLabel,
  FormMessage,
} from "@/components/ui/form"
import { Input } from "@/components/ui/input"
import { uploadProjectGtcFile } from "../service"
import type { ProjectGtcView } from "@/db/schema"

const updateProjectSchema = z.object({
  gtcFile: z.instanceof(File).optional(),
})

type UpdateProjectFormValues = z.infer<typeof updateProjectSchema>

interface UpdateGtcFileSheetProps {
  project: ProjectGtcView | null
  open: boolean
  onOpenChange: (open: boolean) => void
}

export function UpdateGtcFileSheet({
  project,
  open,
  onOpenChange,
}: UpdateGtcFileSheetProps) {
  const [isLoading, setIsLoading] = React.useState(false)
  const [selectedFile, setSelectedFile] = React.useState<File | null>(null)

  const form = useForm<UpdateProjectFormValues>({
    resolver: zodResolver(updateProjectSchema),
    defaultValues: {
      gtcFile: undefined,
    },
  })

  // 기존 값 세팅 (프로젝트 변경 시)
  React.useEffect(() => {
    if (project) {
      form.reset({
        gtcFile: undefined,
      })
      setSelectedFile(null)
    }
  }, [project, form])

  // 파일 선택 처리
  const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => {
    const file = event.target.files?.[0]
    if (file) {
      // PDF 파일만 허용
      if (file.type !== 'application/pdf') {
        toast.error("PDF 파일만 업로드 가능합니다.")
        return
      }
      setSelectedFile(file)
      form.setValue("gtcFile", file)
    }
  }

  // 폼 제출 핸들러
  async function onSubmit(data: UpdateProjectFormValues) {
    if (!project) {
      toast.error("프로젝트 정보를 찾을 수 없습니다.")
      return
    }
    
    setIsLoading(true)
    try {
      // GTC 파일이 있으면 업로드
      if (data.gtcFile) {
        const fileResult = await uploadProjectGtcFile(project.id, data.gtcFile)
        if (!fileResult.success) {
          toast.error(fileResult.error || "GTC 파일 업로드에 실패했습니다.")
          return
        }
        toast.success("GTC 파일이 성공적으로 업로드되었습니다.")
      } else {
        toast.info("변경사항이 없습니다.")
      }
      
      form.reset()
      setSelectedFile(null)
      onOpenChange(false)
    } catch (error) {
      console.error("GTC 파일 업로드 오류:", error)
      toast.error("GTC 파일 업로드 중 오류가 발생했습니다.")
    } finally {
      setIsLoading(false)
    }
  }

  if (!project) return null

  return (
    <Sheet open={open} onOpenChange={onOpenChange}>
      <SheetContent className="flex flex-col gap-6 sm:max-w-xl">
        <SheetHeader className="text-left">
          <SheetTitle>GTC 파일 수정</SheetTitle>
          <SheetDescription>
            프로젝트 정보는 수정할 수 없으며, GTC 파일만 업로드할 수 있습니다.
          </SheetDescription>
        </SheetHeader>
        <Form {...form}>
          <form onSubmit={form.handleSubmit(onSubmit)} className="flex flex-col gap-4">
            {/* 프로젝트 정보 (읽기 전용) */}
            <div className="space-y-4">
              <div>
                <FormLabel>프로젝트 코드</FormLabel>
                <Input
                  value={project.code}
                  disabled
                  className="bg-muted"
                />
              </div>
              <div>
                <FormLabel>프로젝트명</FormLabel>
                <Input
                  value={project.name}
                  disabled
                  className="bg-muted"
                />
              </div>
              <div>
                <FormLabel>프로젝트 타입</FormLabel>
                <Input
                  value={project.type}
                  disabled
                  className="bg-muted"
                />
              </div>
            </div>

            {/* GTC 파일 업로드 */}
            <FormField
              control={form.control}
              name="gtcFile"
              render={() => (
                <FormItem>
                  <FormLabel>GTC 파일 (PDF만, 선택 시 기존 파일 교체)</FormLabel>
                  <div className="space-y-2">
                    <label
                      htmlFor="gtc-file-input"
                      className="flex flex-col items-center justify-center w-full min-h-[8rem] border-2 border-dashed border-gray-300 rounded-lg cursor-pointer bg-gray-50 hover:bg-gray-100"
                    >
                      <div className="flex flex-col items-center justify-center p-4 text-center">
                        <Upload className="w-8 h-8 mb-2 text-gray-500" />
                        <span className="mb-1 text-base font-semibold text-gray-800">
                          {selectedFile
                            ? selectedFile.name
                            : project.originalFileName
                              ? `현재 파일: ${project.originalFileName}`
                              : "현재 파일 없음"}
                        </span>
                        {selectedFile ? (
                           <span className="text-xs text-gray-500">
                             ({(selectedFile.size / 1024 / 1024).toFixed(2)} MB)
                           </span>
                        ) : (
                          <>
                            <p className="mb-2 text-sm text-gray-500">
                              또는 클릭하여 파일을 선택하세요
                            </p>
                            <p className="text-xs text-gray-500">
                              PDF 파일만
                            </p>
                          </>
                        )}
                      </div>
                      <input
                        id="gtc-file-input"
                        type="file"
                        className="hidden"
                        accept=".pdf"
                        onChange={handleFileSelect}
                        disabled={isLoading}
                      />
                    </label>
                  </div>
                  <FormMessage />
                </FormItem>
              )}
            />
            <SheetFooter className="gap-2 pt-2 sm:space-x-0">
              <Button
                type="button"
                variant="outline"
                onClick={() => onOpenChange(false)}
                disabled={isLoading}
              >
                취소
              </Button>
              <Button type="submit" disabled={isLoading || !selectedFile}>
                {isLoading ? "업로드 중..." : "GTC 파일 업로드"}
              </Button>
            </SheetFooter>
          </form>
        </Form>
      </SheetContent>
    </Sheet>
  )
}