import { bannerStyles } from "../styles/shared";

interface ErrorDisplayProps {
  /** Error message to display */
  error: string | null | undefined;
  /** Optional custom style */
  style?: React.CSSProperties;
}

/**
 * Standardized error display component.
 * Use this instead of inline error banners for consistency.
 */
export function ErrorDisplay({ error, style }: ErrorDisplayProps) {
  if (!error) return null;

  return <div style={{ ...bannerStyles.errorBanner, ...style }}>{error}</div>;
}