import React from "react";

export default function AuthToast({
  type = "info",
  title = "",
  message = "",
  actionLabel = "",
  onAction,
  onClose,
}) {
  if (!message) return null;

  const icon =
    type === "success" ? "fa-solid fa-circle-check" :
    type === "error" ? "fa-solid fa-triangle-exclamation" :
    type === "warn" ? "fa-solid fa-circle-exclamation" :
    "fa-solid fa-circle-info";

  return (
    <div className={"sw-toast sw-toast-" + type} role="status">
      <div className="sw-toast-icon">
        <i className={icon} />
      </div>

      <div className="sw-toast-body">
        {title ? <div className="sw-toast-title">{title}</div> : null}
        <div className="sw-toast-msg">{message}</div>

        {actionLabel && typeof onAction === "function" ? (
          <div className="sw-toast-actions">
            <button className="sw-toast-btn" type="button" onClick={onAction}>
              {actionLabel}
            </button>
          </div>
        ) : null}
      </div>

      <button className="sw-toast-x" type="button" onClick={onClose} aria-label="Close">
        ✕
      </button>
    </div>
  );
}
