import {
	AlertDialog,
	AlertDialogAction,
	AlertDialogCancel,
	AlertDialogContent,
	AlertDialogDescription,
	AlertDialogFooter,
	AlertDialogHeader,
	AlertDialogTitle,
} from '@/components/ui/alert-dialog';
import { __ } from '@wordpress/i18n';

interface ConfirmDialogProps {
	open: boolean;
	onOpenChange: (open: boolean) => void;
	title: string;
	description: string;
	confirmLabel?: string;
	cancelLabel?: string;
	destructive?: boolean;
	disabled?: boolean;
	onConfirm: () => void;
}

const ConfirmDialog = ({
	open,
	onOpenChange,
	title,
	description,
	confirmLabel = __('Confirm', 'allcoach'),
	cancelLabel = __('Cancel', 'allcoach'),
	destructive = true,
	disabled,
	onConfirm,
}: ConfirmDialogProps) => (
	<AlertDialog open={open} onOpenChange={onOpenChange}>
		<AlertDialogContent>
			<AlertDialogHeader>
				<AlertDialogTitle>{title}</AlertDialogTitle>
				<AlertDialogDescription>{description}</AlertDialogDescription>
			</AlertDialogHeader>
			<AlertDialogFooter>
				<AlertDialogCancel className="cursor-pointer">
					{cancelLabel}
				</AlertDialogCancel>
				<AlertDialogAction
					className={
						destructive
							? 'cursor-pointer bg-red-600 hover:bg-red-700'
							: 'cursor-pointer'
					}
					disabled={disabled}
					onClick={onConfirm}
				>
					{confirmLabel}
				</AlertDialogAction>
			</AlertDialogFooter>
		</AlertDialogContent>
	</AlertDialog>
);

export { ConfirmDialog };