"use client"

import type { ReactNode } from "react"

import {
  AlertDialog,
  AlertDialogAction,
  AlertDialogCancel,
  AlertDialogContent,
  AlertDialogDescription,
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
} from "@/shared/components/ui/alert-dialog"
import { cn } from "@/shared/lib/utils"

/**
 * 删除确认对话框：统一的 AlertDialog 删除确认结构。
 *
 * 覆盖以下重复模式（5 个文件逐行复制）：
 * - students-table: 移除学生
 * - announcement-detail: 删除公告
 * - message-detail: 删除消息
 * - grade-classes-view: 删除班级
 * - course-plan-detail: 删除课程计划
 *
 * 结构：AlertDialog > Content > Header (Title + Description) > Footer (Cancel + Action)。
 */
interface ConfirmDeleteDialogProps {
  /** 是否打开 */
  open: boolean
  /** 打开状态变更回调 */
  onOpenChange: (open: boolean) => void
  /** 对话框标题（如 "Delete announcement"） */
  title: string
  /** 描述内容（支持 ReactNode，便于嵌入名称等动态内容） */
  description: ReactNode
  /** 确认回调 */
  onConfirm: () => void
  /** 是否正在处理中（禁用按钮） */
  isWorking?: boolean
  /** 确认按钮文案（默认 "Delete"） */
  confirmText?: string
  /** 取消按钮文案（默认 "Cancel"） */
  cancelText?: string
  /** 是否为危险操作样式（默认 true，确认按钮使用 destructive 配色） */
  destructive?: boolean
}

export function ConfirmDeleteDialog({
  open,
  onOpenChange,
  title,
  description,
  onConfirm,
  isWorking = false,
  confirmText = "Delete",
  cancelText = "Cancel",
  destructive = true,
}: ConfirmDeleteDialogProps) {
  return (
    <AlertDialog open={open} onOpenChange={onOpenChange}>
      <AlertDialogContent>
        <AlertDialogHeader>
          <AlertDialogTitle>{title}</AlertDialogTitle>
          <AlertDialogDescription>{description}</AlertDialogDescription>
        </AlertDialogHeader>
        <AlertDialogFooter>
          <AlertDialogCancel disabled={isWorking}>{cancelText}</AlertDialogCancel>
          <AlertDialogAction
            onClick={onConfirm}
            disabled={isWorking}
            className={cn(
              destructive &&
                "bg-destructive text-destructive-foreground hover:bg-destructive/90",
            )}
          >
            {confirmText}
          </AlertDialogAction>
        </AlertDialogFooter>
      </AlertDialogContent>
    </AlertDialog>
  )
}
