import { CustomDialog } from "@/components/CustomDialog"; // Ajusta la ruta según sea necesario
import { t } from "i18next";
import { ReactNode, SyntheticEvent, useState } from "react";

interface DialogConfig {
  title: ReactNode;
  description: ReactNode;
  cancelLabel: ReactNode;
  confirmLabel: ReactNode;
  onCancel: (event?: SyntheticEvent) => void;
  onConfirm: (event?: SyntheticEvent) => void;
}

export const useCustomDialog = (config?: Partial<DialogConfig>) => {
  const [isOpen, setIsOpen] = useState<boolean>(false);
  const [dialogConfig, setDialogConfig] = useState<DialogConfig | undefined>({
    title: "Título",
    description: "Descripción",
    cancelLabel: t("common.no"),
    confirmLabel: t("common.yes"),
    onCancel: () => {},
    onConfirm: () => {},
    ...config,
  });

  const openDialog = (event?: SyntheticEvent, config?: DialogConfig) => {
    event?.preventDefault();
    if (config) {
      setDialogConfig(config);
    }
    setIsOpen(true);
  };

  const handleCancel = (event?: SyntheticEvent) => {
    event?.preventDefault();
    setIsOpen(false);
    dialogConfig?.onCancel(event);
  };

  const handleConfirm = (event?: SyntheticEvent) => {
    event?.preventDefault();
    setIsOpen(false);
    dialogConfig?.onConfirm(event);
  };

  const DialogComponent = dialogConfig ? (
    <CustomDialog
      isOpen={isOpen}
      onCancel={handleCancel}
      onConfirm={handleConfirm}
      title={dialogConfig.title}
      description={dialogConfig.description}
      cancelLabel={dialogConfig.cancelLabel}
      confirmLabel={dialogConfig.confirmLabel}
    />
  ) : (
    <></>
  );

  return {
    openDialog,
    cancelDialog: handleCancel,
    confirmDialog: handleConfirm,
    DialogComponent,
  };
};
