import { ErrorDisplay } from '@/components/ui/ErrorDisplay';

interface AuthErrorMessageProps {
  message: string;
  className?: string;
  id?: string;
}

/**
 * AuthErrorMessage - Displays authentication errors using ErrorDisplay component
 *
 * This component wraps ErrorDisplay to maintain backward compatibility
 * with existing AuthErrorMessage usage while using the standardized
 * ErrorDisplay component internally.
 *
 * @deprecated Consider using ErrorDisplay directly for new code
 */
export function AuthErrorMessage({
  message,
  className,
  id,
}: AuthErrorMessageProps) {
  if (!message) {
    return null;
  }

  return (
    <div id={id}>
      <ErrorDisplay
        error={message}
        variant="inline"
        severity="error"
        className={className}
        context={{ action: 'authenticating', resource: 'auth' }}
        dismissible={false}
      />
    </div>
  );
}