import type { ReactNode } from "react";

export function ErrorCard({ title, message, actions }: {
  title: string;
  message: string;
  actions?: ReactNode;
}) {
  return (
    <div className="error-card-wrap">
      <div className="error-card" role="alert">
        <span className="error-card-icon">⚠</span>
        <div className="error-card-body">
          <h2 className="error-card-title">{title}</h2>
          <p className="error-card-message">{message}</p>
        </div>
      </div>
      {actions && <div className="error-card-actions">{actions}</div>}
    </div>
  );
}