/**
 * AlertDialog 组件
 * 
 * 提示对话框组件
 * 基于 Modal 组件构建，用于显示提示信息
 * 支持多种变体（default、success、warning、error）
 * 
 * @created 2025-11-22
 * @component
 */

'use client'

import { ReactNode } from 'react'
import Modal from './Modal'
import { useThemeStyles } from '@/lib/ui-styles'

interface AlertDialogProps {
  isOpen: boolean
  onClose: () => void
  title: string
  message: string | ReactNode
  buttonText?: string
  variant?: 'default' | 'success' | 'warning' | 'error'
}

export default function AlertDialog({
  isOpen,
  onClose,
  title,
  message,
  buttonText = '确定',
  variant = 'default',
}: AlertDialogProps) {
  const styles = useThemeStyles()

  const getButtonStyle = () => {
    switch (variant) {
      case 'success':
        return styles.buttonStyles.success
      case 'warning':
        return styles.buttonStyles.secondary
      case 'error':
        return styles.buttonStyles.danger
      default:
        return styles.buttonStyles.primary
    }
  }

  return (
    <Modal
      isOpen={isOpen}
      onClose={onClose}
      title={title}
      size="small"
      footer={
        <button
          type="button"
          onClick={onClose}
          className={`${getButtonStyle()} ${styles.buttonModifiers.compact}`}
        >
          {buttonText}
        </button>
      }
    >
      <div className="py-2">
        {typeof message === 'string' ? (
          <p className="text-slate-700 dark:text-slate-200">{message}</p>
        ) : (
          message
        )}
      </div>
    </Modal>
  )
}