import { LoadingIndicator } from "../LoadingIndicator";
import styles from "./LoadingOverlay.module.css";

export type LoadingOverlayProps = {
  title?: string;
  subtitle?: string;
};

export const LoadingOverlay = ({
  title = "Cargando",
  subtitle = "Esto puede tardar unos segundos. Por favor, no cierre esta página.",
  ...props
}: LoadingOverlayProps) => {
  return (
    <div className={styles.LoadingOverlay} {...props}>
      <LoadingIndicator look='light' title={title} subtitle={subtitle} />
    </div>
  );
};

LoadingOverlay.displayName = "LoadingOverlay";