"use client";

import { useState, useEffect } from "react";
import { Button } from "@/components/ui/button";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from "@/components/ui/dialog";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Label } from "@/components/ui/label";
import { Input } from "@/components/ui/input";
import { Loader2, Copy } from "lucide-react";
import { toast } from "sonner";
import { duplicateMateri } from "../action"; // Ensure this path is correct
import { useAuth } from "@/contexts/auth-context";

interface DuplicateDialogProps {
  item: { id: string; judul: string; rombel: { namaRombel: string } };
  isOpen: boolean;
  onOpenChange: (open: boolean) => void;
  onSuccess?: () => void;
}

export function DuplicateDialog({ item, isOpen, onOpenChange, onSuccess }: DuplicateDialogProps) {
  const { user } = useAuth();
  const [loading, setLoading] = useState(false);
  const [rombels, setRombels] = useState<{ id: string; namaRombel: string }[]>([]);
  const [targetRombelId, setTargetRombelId] = useState("");
  const [targetDate, setTargetDate] = useState(new Date().toISOString().split("T")[0]);

  useEffect(() => {
    if (isOpen) {
      fetchRombels();
    }
  }, [isOpen]);

  const fetchRombels = async () => {
    try {
      const res = await fetch("/api/rombel");
      const json = await res.json();
      if (json.success) setRombels(json.data);
    } catch (error) {
      console.error("Failed to fetch rombels", error);
    }
  };

  const handleDuplicate = async () => {
    if (!targetRombelId) {
      toast.error("Pilih kelas tujuan");
      return;
    }
    if (!user?.id) return;

    try {
      setLoading(true);
      const res = await duplicateMateri(item.id, targetRombelId, new Date(targetDate), user.id);
      if (res.success) {
        toast.success(res.message);
        onOpenChange(false);
        onSuccess?.();
      } else {
        toast.error(res.message);
      }
    } catch (error) {
      toast.error("Terjadi kesalahan");
    } finally {
      setLoading(false);
    }
  };

  return (
    <Dialog open={isOpen} onOpenChange={onOpenChange}>
      <DialogContent className="sm:max-w-md">
        <DialogHeader>
          <DialogTitle>Duplikasi Materi</DialogTitle>
          <DialogDescription>Salin materi "{item.judul}" ke kelas lain.</DialogDescription>
        </DialogHeader>

        <div className="grid gap-4 py-4">
          <div className="space-y-2">
            <Label>Kelas Tujuan</Label>
            <Select value={targetRombelId} onValueChange={setTargetRombelId}>
              <SelectTrigger>
                <SelectValue placeholder="Pilih Kelas" />
              </SelectTrigger>
              <SelectContent>
                {rombels.map((rombel) => (
                  <SelectItem key={rombel.id} value={rombel.id}>
                    {rombel.namaRombel}
                  </SelectItem>
                ))}
              </SelectContent>
            </Select>
          </div>

          <div className="space-y-2">
            <Label>Tanggal Publish</Label>
            <Input type="date" value={targetDate} onChange={(e) => setTargetDate(e.target.value)} />
          </div>
        </div>

        <DialogFooter>
          <Button variant="outline" onClick={() => onOpenChange(false)} disabled={loading}>
            Batal
          </Button>
          <Button onClick={handleDuplicate} disabled={loading}>
            {loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
            Duplikasi
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
}