import {
  ResponsiveDialog,
  ResponsiveDialogContent,
  ResponsiveDialogHeader,
  ResponsiveDialogTitle,
  ResponsiveDialogDescription,
  ResponsiveDialogFooter,
} from "@/components/ui/responsive-dialog";
import { Button } from "@/components/ui/button";

interface GenerateCurrentMonthDialogProps {
  open: boolean;
  onOpenChange: (open: boolean) => void;
  description: string;
  onConfirm: () => void;
  onSkip: () => void;
}

export function GenerateCurrentMonthDialog({
  open,
  onOpenChange,
  description,
  onConfirm,
  onSkip,
}: GenerateCurrentMonthDialogProps) {
  return (
    <ResponsiveDialog open={open} onOpenChange={onOpenChange}>
      <ResponsiveDialogContent>
        <ResponsiveDialogHeader>
          <ResponsiveDialogTitle>¿Generar gasto para este mes?</ResponsiveDialogTitle>
          <ResponsiveDialogDescription>
            <strong>{description}</strong> aplica al mes actual. ¿Querés generar el gasto ahora?
          </ResponsiveDialogDescription>
        </ResponsiveDialogHeader>
        <ResponsiveDialogFooter>
          <Button variant="outline" onClick={onSkip}>
            No, gracias
          </Button>
          <Button onClick={onConfirm}>
            Sí, generar
          </Button>
        </ResponsiveDialogFooter>
      </ResponsiveDialogContent>
    </ResponsiveDialog>
  );
}